الصفحة الرئيسية>المتعلقة بالبرمجة>شفرة المصدر الأخرى
تنزيل
phanpy

فانبي

عميل ويب Mastodon ذو رأي بسيط.

لقطة شاشة خيالية

⁉️ النطق : /fænpi/ ( FAN-pee ) ? يستمع

هذا عميل ويب بديل لـ Mastodon.

  • ؟ الإنتاج : https://phanpy.social
    • فرع production
    • كسر في كثير من الأحيان
    • إصلاحات أبطأ ما لم تكن حرجة
  • ️ التطوير : https://dev.phanpy.social
    • الفرع main
    • قد نرى أشياء رائعة جديدة قريبًا
    • قد ينكسر في كثير من الأحيان
    • قد يتم إصلاحها بشكل أسرع أيضًا

؟ تابع @phanpy على Mastodon للحصول على التحديثات ✨

تم تصميم كل شيء وهندسته وفقًا لذوقي ورؤيتي. هذا مشروع جانبي شخصي بالنسبة لي للتعرف على Mastodon وتجربة أفكار جديدة لواجهة المستخدم/UX.

سمات

  • ؟ حسابات متعددة
  • ؟ إنشاء نافذة منبثقة/داخلة
  • ؟ موضوع فاتح/داكن/تلقائي
  • ؟ الإخطارات المجمعة
  • ؟ موضوع التعليقات المتداخلة
  • ؟ مسودة الاسترداد غير المرسلة
  • ؟ يعزز Carousel™️
  • ⚡ الاختصارات™️ مع أوضاع العرض مثل الأعمدة المتعددة أو شريط علامات التبويب
  • #️⃣ مخطط زمني متعدد الهاشتاج

قرارات التصميم

  • يتم إخفاء إجراءات الحالة (الرد، والتعزيز، والمفضلة، والإشارة المرجعية، وما إلى ذلك) بشكل افتراضي .
    تظهر فقط في صفحة الحالة الفردية. وذلك لتقليل الفوضى والتشتت. قد يؤدي ذلك إلى تفاعل أقل، لكننا لا نطارد الأرقام هنا.
  • يتم تمثيل Boost برمز الصاروخ .
    رمز السهم المزدوج الأخضر (إعادة التغريد لـ Twitter) لا يبدو مناسبًا للمصطلح "boost". الصاروخ الأخضر يبدو غريبًا، لذا أستخدم اللون الأرجواني.
  • يتم عرض أسماء المستخدمين القصيرة ( @username ) في المخططات الزمنية، بدلاً من اسم مستخدم الحساب الكامل ( @username@instance ) .
    على الرغم من أن المبدأ التوجيهي ذكر أن "اللامركزية يجب أن تكون شفافة للمستخدم"، إلا أنني لا أعتقد أننا يجب أن ندفعها وجهًا لوجه في كل مرة. هناك أيضًا بعض المخاوف المتعلقة بإمكانية الوصول إلى قارئ الشاشة مع اسم المستخدم الكامل، على الرغم من أنه للأسف لا يمكن الوصول إلى تطبيق الويب هذا بعد.
  • لا يوجد تشغيل تلقائي للفيديو/GIF/أي شيء في المخطط الزمني .
    يعد الجدول الزمني بالفعل فوضى كبيرة حيث يحاول الكثير من الأشخاص والعلامات التجارية والأخبار ووسائل الإعلام جذب انتباهك. دعونا لا نجعل الأمر أسوأ. (الاستثناء الحالي الآن هو الرموز التعبيرية المتحركة.)
  • عناوين URL المستندة إلى التجزئة .
    ليس المقصود من تطبيق الويب هذا أن يكون بديلاً كاملاً للواجهة الأمامية الحالية لـ Mastodon. لا يوجد مُحسّنات محرّكات بحث (SEO) أو قاعدة بيانات أو بدون خادم أو أي خوادم طويلة الأمد. يمكن أن أكون مخطئا في يوم من الأيام.

تطبيقات واجهة المستخدم الدقيقة

عرض اسم المستخدم

عرض اسم المستخدم

  • على المخطط الزمني، يتم عرض اسم المستخدم كـ [NAME] @[username] .
  • بالنسبة إلى @[username] ، استبعد دائمًا اسم المجال المثيل.
  • إذا كان [NAME] يبدو مثل @[username] ، فسيتم استبعاد @[username] أيضًا.

يعزز دائري

يعزز دائري

  • من المشاركات التي تم جلبها (على سبيل المثال، 20 مشاركة لكل عملية جلب)، إذا كان عدد التعزيزات أكثر من ربع إجمالي المشاركات أو أكثر من 3 تعزيزات متتالية، فسيتم تشغيل واجهة المستخدم الدائرية للتعزيزات.
  • إذا كان عدد التعزيزات أكثر من 3 أرباع إجمالي المنشورات، فسيتم إدراج واجهة مستخدم التعزيزات الدائرية في نهاية إجمالي المنشورات التي تم جلبها (لكل "صفحة").
  • بخلاف ذلك، سيتم وضع واجهة المستخدم المعززة للعرض الدائري بين المنشورات.

شارة رقم الموضوع (على سبيل المثال، الموضوع 1/X)

شارة رقم الموضوع

  • تحقق من كل منشور بحثًا عن inReplyToId من ذاكرة التخزين المؤقت أو طلبات واجهة برمجة التطبيقات الإضافية، حتى يتم العثور على المنشور الجذر.
  • إذا تم العثور على المنشور الجذر، فسوف تظهر الشارة رقم فهرس المنشور في الموضوع.
  • حدد ما يصل إلى 3 طلبات لواجهة برمجة التطبيقات (API) نظرًا لأن المنشور الجذر قد يكون قديمًا جدًا أو أن سلسلة الرسائل طويلة جدًا.
  • إذا تعذر العثور على رقم الفهرس، فستعود الشارة لعرض Thread بدون الرقم.

حشو الهاشتاج ينهار

حشو الهاشتاج ينهار

  • سيتم طي الفقرة الأولى من محتوى المنشور الذي يحتوي على أكثر من 3 علامات تصنيف إلى 3 أسطر كحد أقصى.
  • سيتم طي الفقرات اللاحقة بعد الفقرة الأولى التي تحتوي على أكثر من 3 علامات تصنيف في سطر واحد.
  • سيتم طي الفقرات المتجاورة التي تحتوي على أكثر من علامة تصنيف واحدة بعد الفقرات المطوية إلى سطر واحد.
  • إذا كان هناك نص حول علامات التصنيف أو بينها، فلن يتم طيها.
  • سيتم إلحاق علامات التصنيف المطوية بـ ... في النهاية.
  • كما أنها باهتة قليلاً لتقليل الضوضاء البصرية.
  • سيؤدي فتح عرض المنشور إلى إظهار علامات التصنيف غير مطوية.

المشاركات التي تمت تصفيتها

  • "إخفاء تمامًا" - سيتم إخفاء المشاركات التي تمت تصفيتها، بدون واجهة مستخدم للكشف عنها.
  • "إخفاء مع تحذير" - سيتم إخفاء المشاركات التي تمت تصفيتها جزئيًا، مع إظهار اسم الفلتر واسم المؤلف.
    • يمكن الكشف عن المحتوى جزئيًا من خلال التمرير فوق المنشور، مع إظهار تلميح الأداة لنص المنشور.
    • سيؤدي النقر عليه إلى فتح صفحة النشر.
    • يؤدي الضغط عليه لفترة طويلة أو النقر بزر الماوس الأيمن إلى "إلقاء نظرة خاطفة" على المنشور باستخدام واجهة مستخدم الورقة السفلية.
    • في دائرة التعزيزات، يتم فرزها حتى نهاية الرف الدائري.

تطوير

المتطلبات الأساسية: Node.js 18+

  • npm install - تثبيت التبعيات
  • npm run dev - بدء خادم التطوير messages:extract ( clean + ``مشاهدة`) بالتوازي
  • npm run build - إنشاء للإنتاج
  • npm run preview - معاينة بناء الإنتاج
  • npm run fetch-instances - جلب قائمة المثيلات من joinmastodon.org/servers، وحفظها في src/data/instances.json
  • npm run sourcemap - قم بتشغيل source-map-explorer في بنية الإنتاج
  • npm run messages:extract - استخراج الرسائل من الملفات المصدر وتحديث كتالوجات الرسائل المحلية

كومة التكنولوجيا

  • Vite - أداة البناء
  • Preact - مكتبة واجهة المستخدم
  • فالتيو - إدارة الدولة
  • رد فعل جهاز التوجيه - التوجيه
  • Masto.js - عميل Mastodon API
  • Iconify - مكتبة الأيقونات
    • أيقونات مينغ اللطيفة
  • اللغة - التدويل
  • Vanilla CSS - نعم، أنا من المدرسة القديمة.

بعض هذه قد تتغير في المستقبل. عالم الواجهة الأمامية يتغير باستمرار.

تدويل

جميع الترجمات متاحة كملفات gettext .po في مجلد src/locales . اللغة الافتراضية هي الإنجليزية ( en ). تُستخدم قواعد الجمع CLDR للجمع. يتم أيضًا دعم اللغات RTL (من اليمين إلى اليسار) مع اتجاه النص المناسب وعرض الأيقونات والتخطيط.

عند تحميل الصفحة، يتم اكتشاف اللغة الافتراضية عبر هذه الطرق بالترتيب (يتم استخدام المطابقة الأولى):

  1. لغة معلمة URL، على سبيل المثال /? lang /?lang=zh-Hant
  2. lang مفتاح localStorage
  3. navigator.language المتصفح

يمكن للمستخدمين تغيير اللغة في الإعدادات، مما يؤدي إلى تعيين lang مفتاح localStorage .

دليل للمترجمين

*مستوحاة من دليل ترجمة WordPress:

  • لا تترجم حرفيًا، بل ترجم عضويًا.
  • حاول الحفاظ على نفس المستوى من الشكليات (أو الطابع غير الرسمي)
  • لا تستخدم المصطلحات العامية أو الخاصة بالجمهور
  • انتبه إلى العناصر النائبة للمتغيرات. تحتوي العديد من السلاسل على عناصر نائبة، على سبيل المثال {account} (متغير)، <0>{name} (علامة ذات متغير) و # (عنصر نائب للرقم).
  • علامة الحذف (...) مقصودة. لا تقم بإزالته.
    • Nielsen Norman Group: "تضمين علامات الحذف في نص الأمر للإشارة إلى وقت الحاجة إلى مزيد من المعلومات"
    • إرشادات الواجهة البشرية لـ Apple: "أضف علامة حذف إلى تسمية عنصر القائمة عندما يتطلب الإجراء مزيدًا من المعلومات قبل أن يكتمل. يشير حرف القطع (...) إلى أن الأشخاص بحاجة إلى إدخال معلومات أو اتخاذ خيارات إضافية، عادةً ضمن عرض آخر."
    • تطوير تطبيقات Windows: "علامات الحذف تعني عدم الاكتمال".
  • تتم معالجة الطوابع الزمنية للتاريخ ونطاقات التاريخ والأرقام وأسماء اللغات وتجزئة النص بواسطة واجهة برمجة تطبيقات ECMAScript Internationalization API.
    • Intl.DateTimeFormat - على سبيل المثال "8 أغسطس"، "08/08/2024"
    • Intl.RelativeTimeFormat - على سبيل المثال "منذ يومين"، "خلال يومين"
    • Intl.NumberFormat - على سبيل المثال "1000"، "10 كيلو"
    • Intl.DisplayNames - على سبيل المثال، "الإنجليزية" ( en ) بالصينية التقليدية ( zh-Hant ) هي "英文"
    • Intl.Locale (مع polyfill للمتصفحات الأقدم)
    • Intl.Segmenter (مع polyfill للمتصفحات القديمة)

ملاحظات فنية

  • يتم إنشاء معرفات السلاسل تلقائيًا بدلاً من تعريفها بشكل صريح. تتمثل بعض الفوائد في تجنب مشكلة "تسمية الأشياء" وتجنب التكرارات.
    • قد يتم تقديم المعرفات الصريحة في المستقبل عندما تتغير المتطلبات والأولويات. المكتبة (Lingui) تسمح بكليهما.
    • يرجى الإبلاغ عن المشكلات إذا تمت ترجمة سلاسل معينة بشكل مختلف بناءً على السياق أو الثقافة أو المنطقة.
  • لا توجد شروط لدفع الإخطارات. يتم تعيين اللغة على خادم المثيل.
  • منتقي التاريخ الأصلي بتنسيق HTML، على سبيل المثال سيتبع دائمًا لغة النظام وليس اللغة التي حددها المستخدم.
  • لم تتم ترجمة "ALT" في شارة ALT. إنه بمثابة معيار يمكن التعرف عليه عبر اللغات.
  • لم تتم ترجمة أسماء الرموز التعبيرية المخصصة، وبالتالي لا تعمل عمليات البحث مع اللغات غير الإنجليزية.
  • تدعم GIPHY API قائمة اللغات لعمليات البحث.
  • قد يلزم استخدام علامة Unicode من اليمين إلى اليسار (RLM) ( U+200F , ‏ ) لنص RTL/LTR المختلط، خاصة لعنصر </code> ( <code>document.title</code> ).</li><li style=";text-align:right;direction:rtl"> في التطوير، هناك لغة محلية <code>pseudo-LOCALE</code> إضافية، تستخدم للتعريب الزائف. إنه للاختبار ولن يظهر في الإنتاج.</li><li style=";text-align:right;direction:rtl"> عند الإنشاء بغرض الإنتاج، لا يتم تجميع رسائل الكتالوج باللغة الإنجليزية ( <code>en</code> ) بشكل منفصل. يتم تجميع اللغات الأخرى كملفات منفصلة وتحميلها عند الطلب. وهذا يضمن أن <code>en</code> متاح دائمًا كبديل.</li></ul><div class="markdown-heading" style=";text-align:right;direction:rtl"><h3 style=";text-align:right;direction:rtl"> الترجمات التطوعية</h3></div><p style=";text-align:right;direction:rtl"> تتم إدارة الترجمات على Crowdin. يمكنك المساعدة من خلال التطوع في الترجمة.</p><p style=";text-align:right;direction:rtl"> اقرأ وثائق المقدمة للبدء.</p><div class="markdown-heading" style=";text-align:right;direction:rtl"><h2 tabindex="-1" class="heading-element" style=";text-align:right;direction:rtl"> استضافة ذاتية</h2></div><p style=";text-align:right;direction:rtl"> هذا هو <strong>تطبيق ويب ثابت خالص</strong> . يمكنك استضافتها في أي مكان تريد.</p><p style=";text-align:right;direction:rtl"> طريقتان (اختر واحدة):</p><div class="markdown-heading" style=";text-align:right;direction:rtl"><h3 style=";text-align:right;direction:rtl"> طريقة سهلة</h3></div><p style=";text-align:right;direction:rtl"> انتقل إلى الإصدارات وقم بتنزيل أحدث إصدار <code>phanpy-dist.zip</code> أو <code>phanpy-dist.tar.gz</code> . إنه مُصمم مسبقًا لذا لا تحتاج إلى تشغيل أي أوامر تثبيت/إنشاء. استخرجه. خدمة مجلد الملفات المستخرجة.</p><div class="markdown-heading" style=";text-align:right;direction:rtl"><h3 style=";text-align:right;direction:rtl"> طريقة بناء مخصصة</h3></div><p style=";text-align:right;direction:rtl"> يتطلب Node.js.</p><p style=";text-align:right;direction:rtl"> قم بتنزيل أو <code>git clone</code> هذا المستودع. استخدم فرع <code>production</code> للإصدارات <em>المستقرة</em> ، <code>main</code> <em>للأحدث</em> . قم بإنشائه عن طريق تشغيل <code>npm run build</code> (بعد <code>npm install</code> ). خدمة المجلد <code>dist</code> .</p><p style=";text-align:right;direction:rtl"> يمكن إجراء التخصيص عن طريق تمرير متغيرات البيئة إلى أمر الإنشاء. أمثلة: </p><div class="highlight highlight-source-shell notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="PHANPY_CLIENT_NAME="Phanpy Dev" PHANPY_WEBSITE="https://dev.phanpy.social" npm run build" style=";text-align:right;direction:rtl"><pre style=";text-align:right;direction:rtl">PHANPY_CLIENT_NAME= <span class="pl-s"><span class="pl-pds">"</span> Phanpy Dev <span class="pl-pds">"</span></span> PHANPY_WEBSITE= <span class="pl-s"><span class="pl-pds">"</span> https://dev.phanpy.social <span class="pl-pds">"</span></span> npm run build</pre></div><div class="highlight highlight-source-shell notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="PHANPY_DEFAULT_INSTANCE=hachyderm.io PHANPY_DEFAULT_INSTANCE_REGISTRATION_URL=https://hachyderm.io/auth/sign_up PHANPY_PRIVACY_POLICY_URL=https://hachyderm.io/privacy-policy npm run build" style=";text-align:right;direction:rtl"><pre style=";text-align:right;direction:rtl">PHANPY_DEFAULT_INSTANCE=hachyderm.io PHANPY_DEFAULT_INSTANCE_REGISTRATION_URL=https://hachyderm.io/auth/sign_up PHANPY_PRIVACY_POLICY_URL=https://hachyderm.io/privacy-policy npm run build</pre></div><p style=";text-align:right;direction:rtl"> من الممكن أيضًا تعيينها في ملف <code>.env</code> .</p><p style=";text-align:right;direction:rtl"> المتغيرات المتاحة:</p><ul style=";text-align:right;direction:rtl"><li style=";text-align:right;direction:rtl"> يؤثر <code>PHANPY_CLIENT_NAME</code> (اختياري، الافتراضي: <code>Phanpy</code> ) على:<ul style=";text-align:right;direction:rtl"><li style=";text-align:right;direction:rtl"> عنوان صفحة الويب، يظهر في نافذة المتصفح أو عنوان علامة التبويب</li><li style=";text-align:right;direction:rtl"> عنوان التطبيق، عند تثبيته كـ PWA، يظهر في الشاشة الرئيسية، وقاعدة تثبيت macOS، وشريط مهام Windows، وما إلى ذلك</li><li style=";text-align:right;direction:rtl"> عنوان بطاقة OpenGraph، عند مشاركتها على الشبكات الاجتماعية</li><li style=";text-align:right;direction:rtl"> اسم العميل، عند تسجيل التطبيق للمصادقة ويظهر كعميل مستخدم في المنشورات في بعض التطبيقات/العملاء</li></ul></li><li style=";text-align:right;direction:rtl"> <code>PHANPY_WEBSITE</code> (اختياري لكن موصى به، الافتراضي: <code>https://phanpy.social</code> ) يؤثر على:<ul style=";text-align:right;direction:rtl"><li style=";text-align:right;direction:rtl"> عنوان URL الأساسي للموقع</li><li style=";text-align:right;direction:rtl"> عنوان URL لبطاقة OpenGraph، عند مشاركتها على الشبكات الاجتماعية</li><li style=";text-align:right;direction:rtl"> المسار الجذري لصورة بطاقة OpenGraph</li><li style=";text-align:right;direction:rtl"> عنوان URL للعميل، عند تسجيل التطبيق للمصادقة ويظهر كعميل مستخدم في المنشورات في بعض التطبيقات/العملاء</li></ul></li><li style=";text-align:right;direction:rtl"> <code>PHANPY_DEFAULT_INSTANCE</code> (اختياري، لا توجد إعدادات افتراضية):<ul style=";text-align:right;direction:rtl"><li style=";text-align:right;direction:rtl"> على سبيل المثال، "mastodon.social"، بدون <code>https://</code></li><li style=";text-align:right;direction:rtl"> المثيل الافتراضي لتسجيل الدخول</li><li style=";text-align:right;direction:rtl"> عند تسجيل الدخول، ستتم إعادة توجيه المستخدم على الفور إلى صفحة مصادقة المثيل بدلاً من الاضطرار إلى كتابة عنوان URL للمثيل يدويًا وإرساله</li></ul></li><li style=";text-align:right;direction:rtl"> <code>PHANPY_DEFAULT_INSTANCE_REGISTRATION_URL</code> (اختياري، لا توجد إعدادات افتراضية):<ul style=";text-align:right;direction:rtl"><li style=";text-align:right;direction:rtl"> عنوان URL لصفحة تسجيل المثيل</li><li style=";text-align:right;direction:rtl"> على سبيل المثال <code>https://mastodon.social/auth/sign_up</code></li></ul></li><li style=";text-align:right;direction:rtl"> <code>PHANPY_PRIVACY_POLICY_URL</code> (اختياري، افتراضي لسياسة خصوصية المثيل الرسمي):<ul style=";text-align:right;direction:rtl"><li style=";text-align:right;direction:rtl"> عنوان URL لصفحة سياسة الخصوصية</li><li style=";text-align:right;direction:rtl"> قد يحدد سياسة الخصوصية الخاصة بالمثيل</li></ul></li><li style=";text-align:right;direction:rtl"> <code>PHANPY_DEFAULT_LANG</code> (اختياري):<ul style=";text-align:right;direction:rtl"><li style=";text-align:right;direction:rtl"> اللغة الافتراضية هي الإنجليزية ( <code>en</code> ) إذا لم يتم تحديدها.</li><li style=";text-align:right;direction:rtl"> اللغة الاحتياطية بعد طرق الكشف المتعددة (معلمة الاستعلام <code>lang</code> ، ومفتاح <code>lang</code> في <code>localStorage</code> و <code>navigator.language</code> )</li></ul></li><li style=";text-align:right;direction:rtl"> <code>PHANPY_LINGVA_INSTANCES</code> (اختيارية، قائمة مفصولة بمسافات، الافتراضي: <code>lingva.phanpy.social [...hard-coded list of fallback instances]</code> ):<ul style=";text-align:right;direction:rtl"><li style=";text-align:right;direction:rtl"> حدد قائمة من المثيلات مفصولة بمسافات. سيتم استخدام الخيار الأول كافتراضي قبل الرجوع إلى الحالات اللاحقة. إذا كان هناك مثيل واحد فقط، فهذا يعني عدم وجود بديل.</li><li style=";text-align:right;direction:rtl"> قد يحدد مثيل Lingva مستضاف ذاتيًا، مدعومًا إما بـ lingva-translate أو lingva-api</li><li style=";text-align:right;direction:rtl"> قائمة المثيلات الاحتياطية التي تم ترميزها بشكل ثابت في <code>/.env</code></li><li style=";text-align:right;direction:rtl"><g-emoji class="g-emoji" alias="arrow_upper_right"> ↗️</g-emoji> قائمة مثيلات lingva-translate</li></ul></li><li style=";text-align:right;direction:rtl"> <code>PHANPY_IMG_ALT_API_URL</code> (اختياري، لا توجد إعدادات افتراضية):<ul style=";text-align:right;direction:rtl"><li style=";text-align:right;direction:rtl"> نقطة نهاية API لمثيل img-alt-api المستضاف ذاتيًا.</li><li style=";text-align:right;direction:rtl"> إذا تم توفيره، فسيظهر إعداد للمستخدمين لتمكين منشئ وصف الصورة في المؤلف. معطل افتراضيا.</li></ul></li><li style=";text-align:right;direction:rtl"> <code>PHANPY_GIPHY_API_KEY</code> (اختياري، لا توجد إعدادات افتراضية):<ul style=";text-align:right;direction:rtl"><li style=";text-align:right;direction:rtl"> مفتاح API لـ GIPHY. راجع مستندات API.</li><li style=";text-align:right;direction:rtl"> إذا تم توفيره، فسيظهر إعداد للمستخدمين لتمكين منتقي GIF في المؤلف. معطل افتراضيا.</li><li style=";text-align:right;direction:rtl"> هذه ليست مستضافة ذاتيا.</li></ul></li></ul><div class="markdown-heading" style=";text-align:right;direction:rtl"><h3 style=";text-align:right;direction:rtl"> استضافة موقع ثابت</h3></div><p style=";text-align:right;direction:rtl"> حاول البحث عبر الإنترنت عن "كيفية استضافة المواقع الثابتة ذاتيًا" نظرًا لوجود العديد من الطرق للقيام بذلك.</p><div class="markdown-heading" style=";text-align:right;direction:rtl"><h4 tabindex="-1" class="heading-element" style=";text-align:right;direction:rtl"> استضافة Lingva-translate أو lingva-api</h4></div><p style=";text-align:right;direction:rtl"> راجع وثائق lingva-translate أو lingva-api.</p><div class="markdown-heading" style=";text-align:right;direction:rtl"><h2 tabindex="-1" class="heading-element" style=";text-align:right;direction:rtl"> عمليات النشر المجتمعية</h2></div><p style=";text-align:right;direction:rtl"> يتم استضافتها ذاتيًا بواسطة أشخاص رائعين آخرين.</p><ul style=";text-align:right;direction:rtl"><li style=";text-align:right;direction:rtl"> Ferengi.one بواسطة @david@weaknotes.com</li><li style=";text-align:right;direction:rtl"> halo.mookiesplace.com بواسطة @mookie@mookiesplace.com</li><li style=";text-align:right;direction:rtl"> phanpy.bauxite.tech بواسطة @b4ux1t3@hachyderm.io</li><li style=";text-align:right;direction:rtl"> phanpy.blaede.family بواسطة @cassidy@blaede.family</li><li style=";text-align:right;direction:rtl"> phanpy.crmbl.uk بواسطة @snail@crmbl.uk</li><li style=";text-align:right;direction:rtl"> phanpy.cz بواسطة @zdendys@mamutovo.cz</li><li style=";text-align:right;direction:rtl"> phanpy.fulda.social بواسطة @ Ganneff@fulda.social</li><li style=";text-align:right;direction:rtl"> phanpy.gotosocial.social بواسطة @admin@gotosocial.social</li><li style=";text-align:right;direction:rtl"> phanpy.hear-me.social بواسطة @admin@hear-me.social</li><li style=";text-align:right;direction:rtl"> phanpy.mastodon.world بواسطة @ruud@mastodon.world</li><li style=";text-align:right;direction:rtl"> phanpy.mstdn.mx بواسطة @maop@mstdn.mx</li><li style=";text-align:right;direction:rtl"> phanpy.social.tchncs.de بواسطة @milan@social.tchncs.de</li><li style=";text-align:right;direction:rtl"> phanpy.tilde.zone بواسطة @ben@tilde.zone</li><li style=";text-align:right;direction:rtl"> phanpy.vmst.io بواسطة @vmstan@vmst.io</li><li style=";text-align:right;direction:rtl"> social.qrk.one بواسطة @kev@fosstodon.org</li></ul><blockquote style=";text-align:right;direction:rtl"><p style=";text-align:right;direction:rtl"> ملاحظة: أضف طلبك عن طريق إنشاء طلب سحب. </p></blockquote><div class="markdown-heading" style=";text-align:right;direction:rtl"><h2 tabindex="-1" class="heading-element" style=";text-align:right;direction:rtl"> التكاليف</h2></div><p style=";text-align:right;direction:rtl"> التكاليف المتضمنة في تشغيل تطبيق الويب هذا وتطويره:</p><ul style=";text-align:right;direction:rtl"><li style=";text-align:right;direction:rtl"> اسم النطاق (.social): <strong>23.18 دولارًا أمريكيًا في السنة</strong> (6.87 دولارًا أمريكيًا في السنة الأولى)</li><li style=";text-align:right;direction:rtl"> الاستضافة: مجانية</li><li style=";text-align:right;direction:rtl"> التطوير والتصميم والصيانة: "مجانًا" (وقتي الثمين) </li></ul><div class="markdown-heading" style=";text-align:right;direction:rtl"><h2 tabindex="-1" class="heading-element" style=";text-align:right;direction:rtl"> جالب الحظ</h2></div><p style=";text-align:right;direction:rtl"> Phanpy هو بوكيمون من النوع الأرضي.</p><div class="markdown-heading" style=";text-align:right;direction:rtl"><h2 tabindex="-1" class="heading-element" style=";text-align:right;direction:rtl"> المشرفين + المساهمين</h2></div><ul style=";text-align:right;direction:rtl"><li style=";text-align:right;direction:rtl"> تشي عون (المستودون) (تويتر)</li></ul><div class="markdown-heading" style=";text-align:right;direction:rtl"><h3 style=";text-align:right;direction:rtl"> متطوعو الترجمة</h3></div><ul style=";text-align:right;direction:rtl"><li style=";text-align:right;direction:rtl"> aidsds11 (عربي)</li><li style=";text-align:right;direction:rtl"> البديل (الكورية)</li><li style=";text-align:right;direction:rtl"> BoFFire (العربية، الفرنسية، القبايلية)</li><li style=";text-align:right;direction:rtl"> براوارو (الروسية)</li><li style=";text-align:right;direction:rtl"> كباسجي (الهولندية)</li><li style=";text-align:right;direction:rtl"> cbo92 (الفرنسية)</li><li style=";text-align:right;direction:rtl"> CDN (الصينية المبسطة)</li><li style=";text-align:right;direction:rtl"> دانيبسنل (الصينية التقليدية)</li><li style=";text-align:right;direction:rtl"> داتابيو (الكاتالونية)</li><li style=";text-align:right;direction:rtl"> ديزرو (الإيطالية)</li><li style=";text-align:right;direction:rtl"> Drift6944 (التشيكية)</li><li style=";text-align:right;direction:rtl"> درايدن وو (الصينية التقليدية)</li><li style=";text-align:right;direction:rtl"> إليسارك (الفرنسية)</li><li style=";text-align:right;direction:rtl"> البامبلينا (الاسبانية)</li><li style=";text-align:right;direction:rtl"> فيتيك (الاسبرانتو، العبرية)</li><li style=";text-align:right;direction:rtl"> فريزيا (اليابانية)</li><li style=";text-align:right;direction:rtl"> غوس (الجاليكية)</li><li style=";text-align:right;direction:rtl"> هونغمينهي (الكورية)</li><li style=";text-align:right;direction:rtl"> هوجوغليف (الاسبرانتو، الإسبانية)</li><li style=";text-align:right;direction:rtl"> إيزار (الكاتالونية)</li><li style=";text-align:right;direction:rtl"> كاليوو (بولندية)</li><li style=";text-align:right;direction:rtl"> كارلافيج (التشيك)</li><li style=";text-align:right;direction:rtl"> كاتولو 11 (الإيطالية)</li><li style=";text-align:right;direction:rtl"> كيتا (الألمانية)</li><li style=";text-align:right;direction:rtl"> لون (التايلاندية)</li><li style=";text-align:right;direction:rtl"> lucasofchirst (الأوكسيتانية، البرتغالية، البرتغالية، البرازيلية)</li><li style=";text-align:right;direction:rtl"> لوك هونغ (الصينية التقليدية)</li><li style=";text-align:right;direction:rtl"> مارسين كوزينسكي (بولندي)</li><li style=";text-align:right;direction:rtl"> mkljczkk (البولندية)</li><li style=";text-align:right;direction:rtl"> موجوسون (الكورية)</li><li style=";text-align:right;direction:rtl"> مورال (الكورية)</li><li style=";text-align:right;direction:rtl"> MrWillCom (الصينية المبسطة)</li><li style=";text-align:right;direction:rtl"> نكلم (الفرنسية)</li><li style=";text-align:right;direction:rtl"> بازيبي (الإيطالية)</li><li style=";text-align:right;direction:rtl"> punkrockgirl (لغة الباسك)</li><li style=";text-align:right;direction:rtl"> راديكو (الفرنسية)</li><li style=";text-align:right;direction:rtl"> رازم (التشيكي)</li><li style=";text-align:right;direction:rtl"> كود البكسل الحقيقي (الألمانية)</li><li style=";text-align:right;direction:rtl"> رضا حسين زاده (فارسي)</li><li style=";text-align:right;direction:rtl"> rwmpelstilzchen (الاسبرانتو، العبرية)</li><li style=";text-align:right;direction:rtl"> سادم إل (الروسية)</li><li style=";text-align:right;direction:rtl"> SadmL_AI (الروسية)</li><li style=";text-align:right;direction:rtl"> شووجي 3 (اليابانية)</li><li style=";text-align:right;direction:rtl"> Sky_NiniKo (الفرنسية)</li><li style=";text-align:right;direction:rtl"> ستيفو99 (الإيطالية)</li><li style=";text-align:right;direction:rtl"> Su5hicz (التشيكية)</li><li style=";text-align:right;direction:rtl"> تفيريرمو (الإسبانية)</li><li style=";text-align:right;direction:rtl"> tkbremnes (البوكمال النرويجية)</li><li style=";text-align:right;direction:rtl"> Tux93 (الألمانية)</li><li style=";text-align:right;direction:rtl"> فاك31. (الليتوانية)</li><li style=";text-align:right;direction:rtl"> فالتالي (الفنلندية)</li><li style=";text-align:right;direction:rtl"> فاسيريري (بولندي)</li><li style=";text-align:right;direction:rtl"> رحلة (الصينية التقليدية)</li><li style=";text-align:right;direction:rtl"> xabi_itzultzaile (لغة الباسك)</li><li style=";text-align:right;direction:rtl"> xen4n (الأوكرانية)</li><li style=";text-align:right;direction:rtl"> إكسكيرالت (الكاتالونية)</li><li style=";text-align:right;direction:rtl"> زيريسوت (القبايل)</li><li style=";text-align:right;direction:rtl"> زكريمل (التشيكية) </li></ul><div class="markdown-heading" style=";text-align:right;direction:rtl"><h2 tabindex="-1" class="heading-element" style=";text-align:right;direction:rtl"> قصة درامية</h2></div><p style=";text-align:right;direction:rtl"> أنا من أوائل مستخدمي تويتر. تم إطلاق تويتر في 15 يوليو 2006. انضممت إليه في ديسمبر 2006 وتم نشر أول تغريدة لي في 18 ديسمبر 2006.</p><p style=";text-align:right;direction:rtl"> أعرف كيف يبدو تويتر المبكر. لقد كان ممتعا.</p><p style=";text-align:right;direction:rtl"> في ذلك الوقت، قمت بعمل نسخة من تويتر تسمى "Twig" مكتوبة بلغة Python وGoogle App Engine. لقد قمت تقريبًا بإنشاء عميل Twitter لسطح المكتب الخاص بي مكتوبًا بلغة Appcelerator Titanium. لقد ألقيت واحدة من أفضل محادثاتي حول عميل تويتر في مؤتمر صغير. لقد قمت ببناء هذا الشيء المسمى "أعمدة تويتر"، وهو تطبيق ويب يعرض قائمة متابعيك، ومتابعيك، ومتابعيك، ومتابعيك، وما إلى ذلك. في عام 2009، كتبت تدوينة بعنوان "كيف بدأت مع تويتر". لقد قمت بإنشاء موضوعين لـ DestroyTwitter (عميل سطح مكتب تم إنشاؤه باستخدام Adobe Air بواسطة Jonnie Hallman) وأحدهما يسمى "Vimeo". في عام 2013، قمت بإنشاء موقع النسخ الاحتياطي للتغريدات الخاص بي مع واجهة أمامية لعرض تغريداتي وواجهة خلفية CouchDB لتخزينها.</p><p style=";text-align:right;direction:rtl"> لقد كان <strong>أكثر من 15 عاما</strong> .</p><p style=";text-align:right;direction:rtl"> وأنا هنا. بناء عميل الويب Mastodon.</p><div class="markdown-heading" style=";text-align:right;direction:rtl"><h2 tabindex="-1" class="heading-element" style=";text-align:right;direction:rtl"> عملاء الويب البديلة</h2></div><ul style=";text-align:right;direction:rtl"><li style=";text-align:right;direction:rtl"> شوكات فانبي ↓<ul style=";text-align:right;direction:rtl"><li style=";text-align:right;direction:rtl"> أغورا</li></ul></li><li style=";text-align:right;direction:rtl"> بينافور (متقاعد) - شوك ↓<ul style=";text-align:right;direction:rtl"><li style=";text-align:right;direction:rtl"> إشارة</li><li style=";text-align:right;direction:rtl"> إنافور</li></ul></li><li style=";text-align:right;direction:rtl"> الوقواق+</li><li style=";text-align:right;direction:rtl"> سينجي</li><li style=";text-align:right;direction:rtl"> المنبر</li><li style=";text-align:right;direction:rtl"> إلك - شوك ↓<ul style=";text-align:right;direction:rtl"><li style=";text-align:right;direction:rtl"> elk.fedified.com</li></ul></li><li style=";text-align:right;direction:rtl"> ماستوديك</li><li style=";text-align:right;direction:rtl"> جذوع</li><li style=";text-align:right;direction:rtl"> توتي</li><li style=";text-align:right;direction:rtl"> صندوق الفضلات</li><li style=";text-align:right;direction:rtl"> ستاتوزر</li><li style=";text-align:right;direction:rtl"> أنياب</li><li style=";text-align:right;direction:rtl"> إصدار Mastodon Glitch (الواجهة الأمامية المستقلة)</li><li style=";text-align:right;direction:rtl"> المنغنيز</li><li style=";text-align:right;direction:rtl"> TheDesk</li><li style=";text-align:right;direction:rtl"> أكثر... </li></ul><div class="markdown-heading" style=";text-align:right;direction:rtl"><h2 tabindex="-1" class="heading-element" style=";text-align:right;direction:rtl"> ‍♂️ إشعار لجميع مطوري عملاء الوسائط الاجتماعية الآخرين</h2></div><p style=";text-align:right;direction:rtl"> من فضلك، يرجى نسخ أفكار وتجارب واجهة المستخدم من هذا التطبيق. أعتقد أن بعضها جيد جدًا وسيكون من الرائع أن تحتوي عليها المزيد من التطبيقات.</p><p style=";text-align:right;direction:rtl"> إذا لم تكن مطورًا، فيرجى إخبار مطوري برامج الوسائط الاجتماعية المفضلين لديك عن هذا التطبيق واطلب منهم نسخ أفكار وتجارب واجهة المستخدم.</p><div class="markdown-heading" style=";text-align:right;direction:rtl"><h2 tabindex="-1" class="heading-element" style=";text-align:right;direction:rtl"> رخصة</h2></div><p style=";text-align:right;direction:rtl"> معهد ماساتشوستس للتكنولوجيا.</p> </div> <div class="zd_btn more_version_btn" data-more="يوسع" data-less="طي">يوسع</div> </div> </section> <section class="section_box py_30 border_bottom"> <div class="w12_box"> <div class="title_template"> <span class="title">معلومات إضافية</span> </div> <ul class="more_info grid gap_y6 gap_x6 grid_c3"> <li> <span class="title">الإصدار</span> <span class="text"></span> </li> <li> <span class="title">النوع</span> <a class="text" href="/ar/category/list_228_1.html">شفرة المصدر الأخرى</a> </li> <li> <span class="title">وقت التحديث</span> <span class="text">2024-11-09</span> </li> <li> <span class="title">الحجم</span> <span class="text"></span> </li> <li> <span class="title">اللغة</span> <span class="text">الصينية المبسطة</span> </li> </ul> </div> </section> <section class="section_box py_30 border_bottom"> <div class="w12_box"> <div class="title_template arrow_link"> <span class="title">تطبيقات ذات صلة</span> </div> <ul class="version_list grid gap_x6 gap_y6 grid_c2"> </ul> </div> </section> <section class="section_box py_30 border_bottom"> <div class="w12_box"> <div class="title_template arrow_link"> <span class="title">نوصي لك</span> </div> <ul class="column3_box lr_img_text_template grid gap_x6 gap_y6 grid_c3"> <li> <a class="img_item" href="/ar/app/44151.html"><img src="https://images.downcodes.com/uploads/20230315/logo_641169e22e95f1.png" onerror="this.src='https://images.downcodes.com/newdown/images/default.png'" alt="Bidi Film and Television bdys نسخة أندرويد"></a> <div class="content"> <h3><a href="/ar/app/44151.html">Bidi Film and Television bdys نسخة أندرويد</a></h3> <div class="cate"> <a href="/ar/category/list_297_1.html">تشغيل الفيديو</a> </div> <div class="other"> <span>V2.1.7</span> </div> </div> </li> <li> <a class="img_item" href="/ar/app/39387.html"><img src="https://images.downcodes.com/uploads/20230216/logo_63edd21d622421.png" onerror="this.src='https://images.downcodes.com/newdown/images/default.png'" alt="تحميل لعبة Assault Lily"></a> <div class="content"> <h3><a href="/ar/app/39387.html">تحميل لعبة Assault Lily</a></h3> <div class="cate"> <a href="/ar/category/list_301_1.html">لعب الأدوار</a> </div> <div class="other"> <span>v1.0.5</span> </div> </div> </li> <li> <a class="img_item" href="/ar/download/28990.html"><img src="https://images.downcodes.com/uploads/20220919/logo_63281248401771.jpg" onerror="this.src='https://images.downcodes.com/newdown/images/default.png'" alt="كود مصدر نظام دفع المعرفة 丨 المحتوى التعليمي عبر الإنترنت تحقيق المعرفة المدفوعة 丨 فيديو أسئلة وأجوبة دورة رسومية مدفوعة الأجر تخصيص برنامج صغير H5"></a> <div class="content"> <h3><a href="/ar/download/28990.html">كود مصدر نظام دفع المعرفة 丨 المحتوى التعليمي عبر الإنترنت تحقيق المعرفة المدفوعة 丨 فيديو أسئلة وأجوبة دورة رسومية مدفوعة الأجر تخصيص برنامج صغير H5</a></h3> <div class="cate"> <a href="/ar/category/list_55_1.html">فئات أخرى</a> </div> <div class="other"> <span></span> </div> </div> </li> <li> <a class="img_item" href="/ar/app/45483.html"><img src="https://images.downcodes.com/uploads/20230317/logo_6413c6576e3f21.png" onerror="this.src='https://images.downcodes.com/newdown/images/default.png'" alt="إصدار رحلة النباتات ضد الزومبي غربًا"></a> <div class="content"> <h3><a href="/ar/app/45483.html">إصدار رحلة النباتات ضد الزومبي غربًا</a></h3> <div class="cate"> <a href="/ar/category/list_299_1.html">لغز عارضة</a> </div> <div class="other"> <span></span> </div> </div> </li> <li> <a class="img_item" href="/ar/app/179136.html"><img src="https://images.downcodes.com/uploads/20240818/logo_66c1c8413413d1.png" onerror="this.src='https://images.downcodes.com/newdown/images/default.png'" alt="الإصدار الهجين PVZ 2.3.5 إصدار القائمة المضمنة"></a> <div class="content"> <h3><a href="/ar/app/179136.html">الإصدار الهجين PVZ 2.3.5 إصدار القائمة المضمنة</a></h3> <div class="cate"> <a href="/ar/category/list_299_1.html">لغز عارضة</a> </div> <div class="other"> <span>2.3</span> </div> </div> </li> <li> <a class="img_item" href="/ar/app/176855.html"><img src="https://images.downcodes.com/uploads/20240628/logo_667e0d8fe35261.jpg" onerror="this.src='https://images.downcodes.com/newdown/images/default.png'" alt="بيتزا برج الضوضاء DLC وزارة الدفاع"></a> <div class="content"> <h3><a href="/ar/app/176855.html">بيتزا برج الضوضاء DLC وزارة الدفاع</a></h3> <div class="cate"> <a href="/ar/category/list_299_1.html">لغز عارضة</a> </div> <div class="other"> <span>1.0</span> </div> </div> </li> <li> <a class="img_item" href="/ar/app/176584.html"><img src="https://images.downcodes.com/uploads/20240624/logo_6678eedab44bc1.jpg" onerror="this.src='https://images.downcodes.com/newdown/images/default.png'" alt="Happy Block House Family Simulator موبايل"></a> <div class="content"> <h3><a href="/ar/app/176584.html">Happy Block House Family Simulator موبايل</a></h3> <div class="cate"> <a href="/ar/category/list_307_1.html">الأعمال المحاكية</a> </div> <div class="other"> <span>1.0.41</span> </div> </div> </li> <li> <a class="img_item" href="/ar/app/176463.html"><img src="https://images.downcodes.com/uploads/20240622/logo_66764c7e969a71.jpg" onerror="this.src='https://images.downcodes.com/newdown/images/default.png'" alt="إصلاح تركيب الهروب من مترو الأنفاق"></a> <div class="content"> <h3><a href="/ar/app/176463.html">إصلاح تركيب الهروب من مترو الأنفاق</a></h3> <div class="cate"> <a href="/ar/category/list_309_1.html">اطلاق النار الطيران</a> </div> <div class="other"> <span>1.25.20</span> </div> </div> </li> <li> <a class="img_item" href="/ar/app/178338.html"><img src="https://images.downcodes.com/uploads/20240731/logo_66a9c40e360431.png" onerror="this.src='https://images.downcodes.com/newdown/images/default.png'" alt="لعبة BodyCam للجوال"></a> <div class="content"> <h3><a href="/ar/app/178338.html">لعبة BodyCam للجوال</a></h3> <div class="cate"> <a href="/ar/category/list_309_1.html">اطلاق النار الطيران</a> </div> <div class="other"> <span>1.0</span> </div> </div> </li> </ul> </div> </section> <section class="section_box py_30 border_bottom"> <div class="w12_box"> <div class="title_template arrow_link"> <span class="title">أخبار ذات صلة</span> <a href="/category/list_336_1.html">الكل</a> </div> <ul class="cate_list_template"> <li> <a href="/ar/wz/212997.html"> <div class="text">عنوان الموقع الرسمي لشركة Bidi Film and Television</div> <span class="time">2024-11-24</span> </a> </li> <li> <a href="/ar/wz/212996.html"> <div class="text">كيفية إعادة شحن خادم Assault Lily الدولي</div> <span class="time">2024-11-24</span> </a> </li> <li> <a href="/ar/wz/212995.html"> <div class="text">كيفية إصلاح التأتأة في Stalker 2: قلب تشيرنوبيل</div> <span class="time">2024-11-23</span> </a> </li> <li> <a href="/ar/wz/212994.html"> <div class="text">أين يوجد Juice WRLD في Fortnite؟</div> <span class="time">2024-11-23</span> </a> </li> <li> <a href="/ar/wz/212993.html"> <div class="text">كيفية بدء توسيع Wild Card في Star Wars Outlaws</div> <span class="time">2024-11-23</span> </a> </li> <li> <a href="/ar/wz/212992.html"> <div class="text">تضيف بكين مؤسسة جديدة للبحث والتطوير لتحسين أمن الذكاء الاصطناعي وتخطيط الحوكمة</div> <span class="time">2024-11-22</span> </a> </li> </ul> </div> </section> <section class="section_box py_30 border_bottom"> <div class="w12_box"> <div class="title_template arrow_link"> <span class="title">تعليقات المستخدمين</span> </div> </div> </section> <footer class="footer_template"> <div class="w12_box"> <div class="clearfix"> <div class="l_item"> <img src="https://images.downcodes.com/newdown/images/down-logo-foot.png" alt=""> <div class="f_icon"> <a href="https://www.facebook.com/" title="facebook"></a> <a href="https://telegram.org/" title="telegram"></a> <a href="https://www.tiktok.com/" title="tiktok"></a> <a href="https://www.youtube.com/" title="youtube"></a> </div> </div> <div class="r_item"> <dl> <dt>Products & Services</dt> <dd><a href="javascript:;">Install APK</a></dd> <dd><a href="javascript:;">APK signature verification</a></dd> <dd><a href="javascript:;">APK Download Service</a></dd> </dl> <dl> <dt>Company</dt> <dd><a href="javascript:;">Developer Console</a></dd> <dd><a href="javascript:;">Submit APK</a></dd> <dd><a href="javascript:;">Monetization of traffic through downcodes</a></dd> </dl> <dl> <dt>Legal</dt> <dd><a href="javascript:;">About us</a></dd> <dd><a href="javascript:;">Contact Us</a></dd> <dd><a href="javascript:;">Cooperation</a></dd> </dl> </div> </div> <p>© 2006-2024Copyright All rights reserves</p> </div> </footer> <!-- Matomo --> <script> var _paq = window._paq = window._paq || []; /* tracker methods like "setCustomDimension" should be called before "trackPageView" */ _paq.push(['trackPageView']); _paq.push(['enableLinkTracking']); (function() { var u="//tongji.zhangwan.net/"; _paq.push(['setTrackerUrl', u+'matomo.php']); _paq.push(['setSiteId', '3']); var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0]; g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s); })(); </script> <!-- End Matomo Code --> <!-- Google tag (gtag.js) --> <script async src="https://www.googletagmanager.com/gtag/js?id=G-5D64MDP2H8"></script> <script> window.dataLayer = window.dataLayer || []; function gtag(){dataLayer.push(arguments);} gtag('js', new Date()); gtag('config', 'G-5D64MDP2H8'); </script> </body> <script src="/newdown/js/jquery.js" type="text/javascript" charset="utf-8"></script> <script src="/newdown/js/lazy.js" type="text/javascript" charset="utf-8"></script> <script src="/newdown/js/swiper.min.js" type="text/javascript" charset="utf-8"></script> <script src="/newdown/js/viewer.js" type="text/javascript" charset="utf-8"></script> <script src="/newdown/js/index.js" type="text/javascript" charset="utf-8"></script> <script> commonMethod.appdetail(); function phpLoadPage(){ this.kid = ''; this.lang = 'ar'; this.pageIndex = 1; this.resultLen = 10; this. requestUrl = "/show_comment_list"; } phpLoadPage.prototype.init = function() { var _this = this; var moreComment = 'انقر لرؤية المزيد'; $(".loadmore_item").click(function(){ if(_this.resultLen >= 10){ _this.pageIndex = _this.pageIndex + 1 $(".loadmore_item").html("loading...") $.ajax({ async: true, url: _this.requestUrl, type: 'GET', data : { page : _this.pageIndex,kid:_this.kid,lang:_this.lang }, dataType: 'json', timeout: 30000, success: function(result){ _this.resultLen = result.newArray.length if(_this.resultLen < 10){ $(".loadmore_item").html("Reached the end...") }else{ $(".loadmore_item").html(`${moreComment}`) } $(".comment_template").append(_this.mergeHtml(result.newArray)); }, error: function(xhr, status){ console.log('An error occurred...'); }, complete: function(xhr, status){ console.log('Ajax request has ended...'); } }) } }) } phpLoadPage.prototype.mergeHtml = function(data){ var textHtml = ""; var lang = 'ar'; let fromto = 'من'; for(var i=0;i<data.length;i++) { var item= data[i]; var lsHtml = item.mark == 1 && item.status == 1 ? `<span class="tip">${fromto}</span><a href="/${lang}/ask/${item.aid}.html">${item.title}</a>` : ''; textHtml += `<dd> <span class="img_item"> <img src="${item.headlogo}" alt="${item.adduser}"> </span> <div class="main"> <div class="title"> <span>${item.adduser}</span> ${lsHtml} <span>${item.showtime}</span> </div> <div>${item.content}</div> </div> </dd>`; } return textHtml; } new phpLoadPage().init() </script> </html>