أنا أقوم بتطوير إضافة لـ Discourse لعرض snapblocks. تمكنت من إضافة علامات bbcode التي يتم استبدالها بالكتل، وللأسف إذا اخترت اقتباس الكتل، تحصل على النص الموجود في الكتلة في كتلة رمز بدلاً من علامة bbcode الأصلية.
لقد حاولت البحث في الكود المصدري لإضافة spoiler، لكنني لا أستطيع فهم ما تفعله للسماح باقتباس الـ spoilers.
هل هناك طريقة لإصلاح هذا وإضافة نص كود الكتلة الأصلي داخل علامات bbcode المخصصة؟
هذا هو الكود المصدري للإضافة التي أقوم بتطويرها.
شيء يزعجني حقًا هو عدم وجود توثيق قياسي يسهل المرور عليه، مما جعل تطوير إضافتي أكثر صعوبة.
لقد اختبرت ذلك، وبالفعل سمح لي بإضافة [sb] حول النص، للأسف كان ذلك مجرد النص الموجود في العنصر. أود أن يقتبس النص الأصلي بدلاً من ذلك، لأنه يحتوي على كل شيء لإعادة إنشاء الكتلة.
أحاول حاليًا معرفة ما إذا كان بإمكاني جعل الـ SVG الفعلي غير قابل للتحديد، وجعل عنصر قابل للتحديد مخفي مع المصدر الأصلي أسفل الـ SVG.
أحقق ذلك عن طريق إنشاء حاوية تحتوي على عنصرين، الـ SVG والمصدر. أحاول جعل الـ SVG يحتوي على position: relative حتى يكون خارج التدفق وفوق نص المصدر، بالإضافة إلى جعل الحاوية بنفس حجم الـ SVG لجعلها تبدو وكأن الـ SVG لا يزال داخل النص. أيضًا، سيكون نص المصدر opacity: 0 وحجمًا صغيرًا جدًا بحيث يكون غير مرئي في حالة تجاوز الـ SVG.
أتساءل عما إذا كانت هناك طريقة أسهل للقيام بذلك، لأن الطريقة التي أحاول بها القيام بذلك ستتطلب إعادة خبز جميع المشاركات، وتشعر أيضًا بأنها حل مخادع لشيء أعتقد أنه لا ينبغي أن يتطلب القيام بذلك.
تعديل: بعد النظر إلى الكود الخاص بالدالة addTagDecorateCallback()، يبدو أنه يمكنني إرجاع نص في الاستدعاء لاستبدال أي نص سيتم استخدامه. هذا سيساعد كثيرًا في الواقع، حيث آمل ألا أضطر إلى التعامل مع نظامي المخادع الذي كنت أعمل عليه والذي يعمل بشكل سيء للغاية.
تمكنت من تشغيله عن طريق الاحتفاظ بالنص المصدر في سمة على عنصر HTML، ثم في دالة الاستدعاء addTagDecorateCallback()، أقوم فقط بإرجاع ذلك للحصول على النص الأصلي.
إليك القليل من التعليمات البرمجية لأي شخص يريد معرفة ما فعلته.
في assets/javascripts/lib/discourse-markdown/snapblocks-discourse.js حيث يقوم بتهيئة علامات bbcode، جعلته يخزن النص الأصلي داخل سمة snapblocks-source حتى أتمكن من استرداده لاحقًا.
في ملف assets\\javascripts\\discourse\\initializers\\snapblocks-discourse.js، أضيف التعليمات البرمجية للتعامل مع الاقتباس.
// assets\\javascripts\\discourse\\initializers\\snapblocks-discourse.js
import {
addBlockDecorateCallback, // علامات bbcode للكتل
addTagDecorateCallback, // علامات bbcode المضمنة
} from "discourse/lib/to-markdown";
function initializeSnapblocks(api, siteSettings) {
addTagDecorateCallback(function () {
// this.element ليس عنصر HTML
// ولكنه يتضمن جميع سمات HTML
const { attributes } = this.element;
// عادةً ما تتحقق مما إذا كانت "الفئة" هي فئتك
// ولكن كل ما أحتاجه هنا هو "snapblocks-source"
if (attributes["snapblocks-source"]) {
let prefix = "[sb";
// إضافة سمات إلى علامة bbcode (والتي يتم تخزينها أيضًا
// على العنصر كسمات).
const attrs = [
"blockstyle",
"wrap",
"wrapsize",
"zebra",
"showspaces",
"santa",
];
for (const attr of attrs) {
if (attributes[attr]) {
prefix += ` ${attr}=${attributes[attr]}`;
}
}
prefix += "]";
this.prefix = prefix;
this.suffix = "[/sb]";
// إذا قمت بإرجاع نص، فسيتم استخدامه بدلاً من النص المحدد
return attributes["snapblocks-source"];
}
});
}
هذا هو نفس الشيء بالنسبة لعلامات bbcode للكتل، ما عليك سوى استخدام addBlockDecorateCallback() بدلاً من ذلك.
للأسف، سأضطر إلى إعادة خبز المشاركات إذا أردت أن تكون مقتطفات snapblocks القديمة قابلة للاقتباس. هذا أيضًا لا يتعامل مع الحالة التي تحدد فيها النص الموجود على SVG، بل يعمل فقط إذا حددت بعض النص قبله و/أو بعده بالإضافة إلى جزء على الأقل من نص SVG.
