gathering a building
1.0.0
تم تطوير هذا المشروع في إطار مرحلة سابقة من مختبر العلوم الإنسانية الرقمية بجامعة ييل. أصبح المختبر الآن جزءًا من قسم الأساليب والبيانات الحسابية بمكتبة ييل، ولم يعد يتضمن هذا المشروع في نطاق عمله. وعلى هذا النحو، فإنه لن يتلقى أي تحديثات أخرى. يوجد موقع ويب مباشر يستخدم هذا الرمز. عندما يتعطل موقع الويب هذا، ستتم إزالته من الويب.
يحتوي هذا المستودع على الكود المصدري لتطبيق ويب يعرض تفاصيل جوانب الهندسة المعمارية لجامعة ييل. تم بناء التطبيق على الواجهة الأمامية Angular 1 التي تقدم بيانات رسم الخرائط من خادم CartoDB وأصول الوسائط المتعددة من الواجهة الخلفية لـ Wordpress API.
يمكن للمستخدمين الإداريين تحديث البيانات المعروضة على الموقع من خلال زيارة واجهة إدارة الموقع. بعد تسجيل الدخول، يمكن للمستخدمين إنشاء البيانات التي سيتم عرضها على الموقع عن طريق إنشاء وتحرير المشاركات باستخدام حقول البيانات الوصفية التالية:
الحقل الافتراضي
يتم تحديد عنوان كل منشور بواسطة حقل عنوان منشور Wordpress التقليدي (حقل عنوان مثال)
الحقل الافتراضي
يتم تحديد محتوى النص لكل منشور من خلال حقل محتوى نص Wordpress التقليدي (حقل الفقرات على سبيل المثال).
حقل مخصص
Accepted values:
* home
* historical-geography
* architecture-and-urbanism
* material-journeys
* people-and-places
* about-the-author
* downloads
* links
يتحكم حقل وحدة التحكم داخل المنشور في المكان الذي سيتم فيه عرض هذا المنشور في التنقل بالموقع: أي ما إذا كان المنشور سيظهر ضمن www.mydomain.com/routes/historical-geography أو www.mydomain.com/routes/people-and-places أو أي طريق آخر على الموقع (حقل وحدة التحكم على سبيل المثال).
حقل مخصص
Accepted values:
* An integer value between 0 and the number of posts for the given controller -1
يتحكم حقل الطلب داخل المنشور في المكان الذي سيتم فيه عرض المنشور ضمن المسار، أي الترتيب الذي ستظهر به الأقسام داخل عمود النص أثناء قيام المستخدم بالتمرير عبر المحتوى لمسار معين.
نظرًا لجميع المنشورات التي تشترك في وحدة تحكم، يمكن للمرء تعيين الترتيب الذي ستظهر به من خلال إعطاء المنشور الذي يجب أن يظهر أولاً قيمة ترتيب 0، والمنشور التالي الذي يجب أن يظهر بقيمة ترتيب 1، وهكذا. يرجى ملاحظة أنه لا يتم قبول قيم الطلب المكررة (مثال على حقل الطلب).
حقل مخصص
Accepted values:
* table-of-contents
* text
يشير الحقل "نوع القسم" داخل المنشور إلى ما إذا كان المنشور المحدد يمثل قسم جدول المحتويات لوحدة تحكم معينة أو قسمًا يستند إلى النص لوحدة التحكم هذه.
table-of-contents
إذا تم تعيين قيمة sectionType لمنشور ما على جدول المحتويات (مثال لحقل جدول المحتويات)، فسيتم تمثيل عمود النص لهذا القسم كسلسلة من الروابط متبوعة بمقدمة فقرة واحدة للقسم (مثال للعرض) . لإنشاء جدول محتويات، يجب تحديد جميع المنشورات لوحدة تحكم معينة، ثم إنشاء فقرة واحدة في مربع نص Wordpress الرئيسي لكل قسم داخل وحدة التحكم التي تتبع جدول المحتويات (على سبيل المثال محتوى فقرات جدول المحتويات ).
text
إذا تم تعيين قيمة sectionType لمنشور ما على نص (مثال لحقل نص)، فسيتم تمثيل عمود النص لهذا القسم كسلسلة من الفقرات التقليدية (مثال للعرض). لإنشاء منشور نصي، يجب على المرء ببساطة إدخال الفقرات في حقل نص Wordpress التقليدي، مثل محتوى الفقرات النصية).
حقل مخصص
Accepted values:
* one-div-container
* three-div-container
* four-div-container
يشير حقل القالب داخل المنشور إلى نوع المحتوى الذي سيتم عرضه خلف عمود النص. هناك ثلاثة خيارات:
one-div-container
إذا تم تعيين قيمة قالب المنشور على حاوية ذات قسم واحد، فستكون خلفيته صورة خلفية صفحة كاملة (عرض مثال). يتم تحديد صورة الخلفية من خلال الصورة المميزة للمنشور المحدد (على سبيل المثال، حقل حاوية مكون من قسم واحد).
three-div-container
إذا تم تعيين قيمة قالب المنشور على حاوية ثلاثية الأقسام، فستتكون خلفيته من ثلاثة عناصر ممثلة على الجانب الأيمن من الشاشة (عرض مثال). يتم تعيين المحتوى الموجود داخل هذه العناصر بواسطة الحقول المخصصة التالية: topImage ، bottomImage ، topCaption ، bottomCaption . يعد كل من الحقلين topImage وbottomImage عبارة عن مسارات كاملة لملفات الصور، في حين أن الحقلين topCaption وbottomCaption هما حقلان للتسمية التوضيحية للنص العادي. (مثال لحقل حاوية ثلاثي الأقسام)
four-div-container
إذا تم تعيين قيمة قالب المنشور على حاوية مكونة من أربعة أقسام، فستتكون خلفيتها من أربع صور كاملة الارتفاع ترتبط بالأقسام الموجودة داخل وحدة التحكم المحددة (مثال العرض). يتم تحديد صور الخلفية لقالب الخلفية هذا بواسطة حقل introImage داخل المنشورات الخاصة بوحدة التحكم هذه. على سبيل المثال، يعرض نموذج العرض المرتبط مسبقًا في هذه الفقرة صفحة تحتوي على أربع صور خلفية: الخرسانة والحجر والطوب والزجاج. يتم تحديد أول هذه الصور (الملموسة) من خلال قيمة introImage داخل المنشور الذي له قيمة ترتيب 1 (حيث أن هذا هو المنشور الأول الذي يظهر بعد جدول المحتويات). ضمن المنشور بقيمة ترتيب 1، يتم تحديد الصورة التي سيتم تمثيلها في حاوية أربعة div في الحقل المخصص introImage (مثال لحقل حاوية أربعة div)
حقل مخصص
Accepted values:
* light
* dark
light
يؤدي تعيين قيمة BrandIcon إلى اللون الفاتح إلى ظهور رمز العلامة التجارية للموقع (على سبيل المثال DHLab) باللون الأبيض، وهو أمر يوصى به للصفحات ذات الخلفيات الداكنة (على سبيل المثال، حقل BrandIcon الفاتح).
dark
يؤدي تعيين قيمة BrandIcon إلى اللون الداكن إلى ظهور رمز العلامة التجارية للموقع (مثل DHLab) باللون الرمادي الداكن، وهو أمر يوصى به للصفحات ذات الخلفيات الفاتحة.
حقل مخصص
Accepted values:
* light
* dark
light
يؤدي تعيين قيمة navigationButton إلى اللون الفاتح إلى ظهور زر قائمة التنقل بالموقع (أي رمز "hamburger") باللون الأبيض، وهو أمر يوصى به للصفحات ذات الخلفيات الداكنة (على سبيل المثال، حقل زر التنقل الفاتح).
dark
يؤدي تعيين قيمة navigationButton إلى اللون الداكن إلى ظهور زر قائمة التنقل بالموقع (أي رمز "hamburger") باللون الرمادي الداكن، وهو أمر يوصى به للصفحات ذات الخلفيات الفاتحة.
حقل مخصص
Accepted values:
* A fully-qualified url to an iframe
قد تستخدم المنشورات التي تحتوي على قيمة تحكم لرحلات المواد إطارات iframe لملء تمثيل صفحة كاملة لمجال iframe خلف عمود النص (مثال للعرض). للقيام بذلك، ما عليك سوى تعيين قيمة iframe على الصفحة التي ترغب في عرضها (حقل iframe على سبيل المثال).
تتكون الصفحة الرئيسية للموقع من سلسلة من الأيقونات التي تعلو صورة مركزية (على سبيل المثال، أيقونة الصفحة الرئيسية). يتم تحديد المحتوى الموجود داخل هذه الرموز وموضع هذه الرموز من خلال المنشورات التي تحتوي على حقول البيانات الوصفية التالية:
الحقل الافتراضي
يتم تحديد عنوان كل أيقونة على الصفحة الرئيسية بواسطة حقل عنوان منشور Wordpress التقليدي (حقل عنوان مثال). بعد العنوان بـ » ينتج عرضًا مرئيًا لطيفًا.
الحقل الافتراضي
يتم تحديد محتوى النص لأيقونة الصفحة الرئيسية بواسطة حقل محتوى نص Wordpress التقليدي (حقل نص مثال).
حقل مخصص
Accepted values:
* home
يجب أن يكون لكل رمز في الصفحة الرئيسية قيمة وحدة التحكم الخاصة به مضبوطة على الصفحة الرئيسية (مثال على حقل وحدة التحكم).
حقل مخصص
Accepted values:
* historical-geography
* architecture-and-urbanism
* material-journeys
* people-and-places
تتحكم كل قيمة لوحدة تحكم الوجهة في المسار الذي يجب توجيه المستخدمين إليه عند النقر فوق الارتباط الموجود داخل رمز الصفحة الرئيسية المحدد. على سبيل المثال، سيؤدي تعيين وحدة تحكم الوجهة لرمز الصفحة الرئيسية على رحلات المواد إلى ضمان إرسال المستخدمين إلى مسار رحلات المواد بعد النقر فوق رابط رمز الصفحة الرئيسية (حقل وحدة تحكم الوجهة على سبيل المثال).
حقل مخصص
Accepted values:
* An value between 0 and the number of posts for the given destinationController -1
يشير معرف الوجهة إلى المنشور الموجود داخل وحدة التحكم الوجهة والذي يجب توجيه المستخدمين إليه بعد النقر فوق الارتباط الموجود داخل رمز الصفحة الرئيسية المحدد. على سبيل المثال، سيؤدي تعيين وحدة التحكم الوجهة لأيقونة الصفحة الرئيسية إلى رحلات المواد ومعرف الوجهة إلى 3 إلى ضمان إرسال المستخدمين الذين ينقرون على رابط أيقونة الصفحة الرئيسية إلى المنشور الذي تم تعيين قيمة وحدة تحكم لرحلات المواد لهم وقيمة طلب تبلغ 3 (حقل معرف الوجهة على سبيل المثال) .
حقل مخصص
Accepted values:
* A decimal value between 0 and 1
تشير قيمة xOffset الخاصة بأيقونة الصفحة الرئيسية إلى المكان الذي يجب وضع الأيقونة فيه فوق الصورة الرئيسية على المحور السيني. سيؤدي تعيين هذه القيمة إلى 0 إلى التأكد من وضع الأيقونة على أقصى حافة يسار الصورة، وسيضمن تعيين القيمة على 1 وضع الأيقونة على طول حافة أقصى يمين الصورة، وتعيين القيمة إلى علامة عشرية بين سيضع 0 و1 الأيقونة داخل الطيف الذي يحده هاتان النقطتان (على سبيل المثال، حقل xOffset).
حقل مخصص
Accepted values:
* A decimal value between 0 and 1
تشير قيمة yOffset الخاصة بأيقونة الصفحة الرئيسية إلى المكان الذي يجب وضع الرمز فيه فوق الصورة الرئيسية على المحور y. سيؤدي تعيين هذه القيمة إلى 0 إلى التأكد من وضع الأيقونة على طول الحافة العلوية للصورة، وسيضمن تعيين القيمة إلى 1 وضع الأيقونة على طول الحافة السفلية للصورة، وتعيين القيمة إلى علامة عشرية بين سيضع 0 و1 الرمز داخل الطيف الذي يحده هاتين النقطتين (على سبيل المثال، حقل yOffset).
يمكن العثور على مثيل تطوير لهذا المستودع هنا.
تم بناء هذا التطبيق على وقت تشغيل Node.js، لذلك يحتاج المرء إلى تثبيته لاستخدام كود المصدر هذا. للتحقق من تثبيت Node.js على جهازك، يمكنك تشغيل:
which node
إذا حصلت على استجابة تشير إلى أن العقدة ليست أمرًا معروفًا، فستحتاج إلى تثبيت Node.
بمجرد تثبيت Node، يمكنك استنساخ الكود المصدري وتثبيت التبعيات وبدء تشغيل خادم ويب محلي باستخدام الأوامر التالية:
git clone https://github.com/YaleDHLab/gathering-a-building
cd gathering-a-building
npm install --no-optional
npm start
إذا قمت بعد ذلك بفتح المتصفح وانتقلت إلى localhost:8000، فمن المفترض أن تشاهد التطبيق. يمكنك إنهاء هذا الخادم المحلي في أي وقت بالضغط على CTRL+C في النافذة الطرفية التي يعمل فيها الخادم.
بعد إجراء تغييرات على قاعدة بيانات Wordpress الخاصة بك، يمكنك معاينة التغييرات عن طريق سحب json من خادم Wordpress إلى جهازك المحلي باستخدام الأمر التالي:
npm run build-content {{username}} {{password}}
هنا يشير {{username}} و {{password}} إلى سلاسل اسم المستخدم وكلمة المرور التي ستدخلها للوصول إلى عنوان URL للموقع المحمي بكلمة مرور.
إذا تم تعيين الحقول الموجودة في قاعدة بيانات Wordpress وفقًا للدليل أعلاه، فمن المفترض أن ترى رسائل تأكيد بأنه تمت كتابة json لكل وحدة تحكم. إذا تلقيت رسالة خطأ في التحقق من الصحة، فيرجى مراجعة حقول البيانات التعريفية المتأثرة وتشغيل الأمر npm run build-content مرة أخرى.
بعد كتابة ملف json الجديد على جهازك المحلي، يمكنك معاينة التغييرات عن طريق تحديث المتصفح. إذا انتقلت إلى المسارات/المشاركات التي قمت بتغييرها في قاعدة بيانات Wordpress، فيجب أن ترى القيم أو المحتوى الجديد معروضًا.
إذا قام أعضاء الفريق الآخرون بإجراء تغييرات على رمز التطبيق وقاموا بتحميل هذه التغييرات إلى GitHub، فيمكنك سحب هذه التغييرات ودمجها مع التغييرات الخاصة بك باستخدام الأوامر التالية.
أولاً، يمكنك إضافة وتنفيذ أي تغييرات قد تكون أجريتها على مستودعك المحلي باستخدام الأمر التالي:
git add .
git commit -m "type a message indicating the changes you made here"
بعد ذلك، لسحب آخر التغييرات على الفرع الرئيسي على GitHub، يمكنك تشغيل:
git pull origin master
سيؤدي هذا إلى فتح محرر نصوص سطر الأوامر vim، ويطلب منك كتابة "رسالة التزام" على الشاشة. يمكنك القيام بذلك عن طريق الضغط على i (الذي ينقل محرر النصوص vim إلى وضع الإدراج)، متبوعًا بالسهم لأسفل (الذي يحرك المؤشر لأسفل صفًا واحدًا في المستند النصي)، متبوعًا برسالة إلى زملائك أعضاء الفريق (على سبيل المثال " دمج السيد البعيد في السيد المحلي")، متبوعًا بـ ESCAPE :wq ENTER .
لدمج فرع على GitHub لم يتم دمجه في الفرع الرئيسي على Github، يمكنك تشغيل:
git pull origin {{branch-name}}
بمجرد أن تصبح راضيًا عن الطريقة التي يظهر بها المحتوى، يمكنك دفع تغييراتك إلى الخادم المنشور عن طريق تشغيل:
chmod 600 PEM_FILE_NAME.pem
npm run deploy
سيؤدي هذا إلى استبدال الملفات الموجودة على الخادم البعيد بنسخك المحلية من هذه الملفات.
