الوصول إلى عنصر العلامات الشرطية Conditiona Tags من خلال كائن WidgetManager

عرفنا في هذه التدوينة
الوصول إلى عنصر واجهة مستخدم مخصص بواسطة كائن WidgetManager
طريقة إستدعاء مستند مدير القطعة Widget Manager وطريقة تحليله وطبعه ككائن JSON لنصل بعدها إلى الكائنات المتداخلة والمصفوفات وإستكشاف القيم كالحالة والوصف والبيانات..لتوضيفها مستقبلا في مشاريعنا البرمجية وهاهو الوقت لكي نريكم أول توضيف لتلك العناصر بطريقة إحترافية.

مضمون هذه الوثيقة

لتأخذ فكرة سريعة  عما سنقوم به لنفترض أنك تريد حجز سكريبت في صفحة معينة أقصد تشغيله مثلا في صفحة المواضيع فقط ولكنك لاتريد وضعه داخل علامة شرطية بتنسيق Html بل تريد العلامة الشرطية داخل كود الجافاسكريبت نفسه.
إذن بواسطة تشغيل كائن WidgetManager يمكننا الوصول إلى عناصر العلامات الشرطية Conditiona Tags لتوضيفها في ملفات الجافاسكريبت

مراجع لهذه الوثيقة

في البداية أتمنى أن تراجع تدوينة
العلامات الشرطية الجديدة على منصة البلوجر [2017]
لكي تتضح لك الصورة أكثر لما سنشرحه لك في هذا الموضوع الفرق الوحيد هو بدل أن نستخدم أكواد Html سنستخدم فقط أكواد java  ...لنتابع

لاتنسى أخذ نسخة إحتياطية من القالب

الخطوة الأولى - واجهة المستخدم

• قم بتسجيل حسابك ثم إذهب إلى منصة البلوجر dashboard
• إنتقل للمدونة >> ثم إلى قالب >> ثم إضغط على تحرير  Edit HTML  
• إضغط في وسط محرر الأكواد  ثم   F + Ctrl لإضهار مربع البحث
• بإستعمال  الزر  C +Ctrl  للنسخ و  V +Ctrl  للصق قم بوضع الأكواد في المكان المناسب

لاتنسى أخذ نسخة إحتياطية من القالب

الخطوة الثانية - إستخدام العلامات الشرطية

• عرفنا في الدرس السابق كيفية إستيراد كامل لمستند WidgetManager بالطريقة الآتية

js
<script type='text/javascript'>
//<![CDATA[
document.addEventListener("DOMContentLoaded", function() {
    if (typeof _WidgetManager === "undefined") return;
    var data = _WidgetManager._GetAllData();
//Do something with `data` here
}, false);
//]]>
</script>

• والآن كمثال سنضع السكريبت الخاص بنا داخل العلامة الشرطية المحددة if (data.view.isSingleItem) { … } بالشكل الآتي..

js
<script type='text/javascript'>
//<![CDATA[
document.addEventListener("DOMContentLoaded", function() {
    if (typeof _WidgetManager === "undefined") return;
    var data = _WidgetManager._GetAllData();
//Do something with `data` here
if (data.view.isSingleItem) { 
       function msg(){  
        alert("Hello Javatpoint");
       }  
}
}, false);
//]]>
</script>

• يمكنك إستعمال علامات شرطية أخرى مباشرة أسفل بعضها في نفس الكود وهي كالآتي

js
<script type='text/javascript'>
//<![CDATA[
document.addEventListener("DOMContentLoaded", function() {
    if (typeof _WidgetManager === "undefined") return;
    var data = _WidgetManager._GetAllData();
//Do something with `data` here
if (data.view.isArchive) { … }        //صفحة الأرشيف
if (data.view.isError) { … }          //صفحة الخطأ
if (data.view.isHomepage) { … }       //الصفحة الرئيسية
if (data.view.isLabelSearch) { … }    //صفحة البحث بحسب التسمية
if (data.view.isMobile) { … }         //العرض المخصص على الهاتف الجوال
if (data.view.isMultipleItems) { … }  //الصفحة الرئيسية ، البحث ، أو الأرشيف
if (data.view.isPage) { … }           //الصفحات الثابتة
if (data.view.isPost) { … }           //صفحات التدوينات
if (data.view.isSingleItem) { … }     //كل من صفحات الثابتة والتدوينات
}, false);
//]]>
</script>

• أما إذا أردنا عدم تشغيل السكريبت في صفحة محددة نكتب رمز ! أمام العلامة الشرطية بالشكل الآتي..

js
if (!data.view.isSingleItem) { … } 

• أو يمكننا تطبيق ذلك بتحديد عوامل المقارنة Logical Operators بالشكل الآتي..

js
if (data.view.isSingleItem == false) { … } 

• وأحيطك علما بأنك تستطيع إستخدام العلامات الشرطية القديمة دون مشكلة مثلا

js
<script type='text/javascript'>
//<![CDATA[
document.addEventListener("DOMContentLoaded", function() {
    if (typeof _WidgetManager === "undefined") return;
    var data = _WidgetManager._GetAllData();
//Do something with `data` here
if (data.blog.pageType == "archive") { … }      //صفحة الأرشيف
if (data.blog.pageType == "error_page") { … }   //صفحة الخطأ
if (data.blog.pageType == "index") { … }        //الصفحة الرئيسية ، البحث ، أو الأرشيف
if (data.blog.pageType == "static_page") { … }  //الصفحات الثابتة
if (data.blog.pageType == "item") { … }         //صفحات التدوينات
}, false);
//]]>
</script>




توضيح مهم

كمراجعة لما قمنا به لاحظ أننا من خلال تشغيل كائن WidgetManager تمكنا من إستخدام عنصر العلامة الشرطية في كود java  تماما بنفس الصيغة التي تستخدم في وسم Html وكانت الفكرة بسيطة وهي من خلال إختبار الإستعلام سنحصل على القيمة المنطقية لكل عنصر معين مثلا إذا كنت متواجد الآن في صفحة التدوينة ستلاحظ في سجل وحدة التحكم أن العلامة الخاصة بها isPost صحيحة true كما في الصورة ..وقس على ذلك.