كيفية استخدام محرِّر الألعاب Construct 3 لواجهة برمجة التطبيقات File System Access API للسماح للمستخدمين بحفظ ألعابهم

تتيح واجهة برمجة التطبيقات File System Access API إمكانية القراءة والكتابة وإدارة الملفات. تعرف على كيفية استخدام Construct 3 من واجهة برمجة التطبيقات هذه.

مقدمة

(تتوفر هذه المقالة أيضًا في شكل فيديو).

Construct 3 هو محرِّر ألعاب طوّره الأخوان توماس وآشلي غولين. في الإصدار الثالث الحالي من محرّر الألعاب، يتم من قبل إنشاء الإصدارين الجديدين "[bet] على المتصفح" بعد إصدار نظام التشغيل Windows وNW.js. يمكنك الحصول على انطباع عن بعض الألعاب التي تم تطويرها بمساعدة المحرّر من خلال استكشاف عرضها أو العمل من خلال جولة إرشادية. بفضل القوى الخارقة للويب، يمكنك أيضًا النقر للوصول إلى أيٍّ من أمثلة"الحصول على أفكار ملهمة" وبدء التعديل على الفور.

تطبيق Construct 3 يُظهر المستخدم وهو يعدّل أحد مشاريع البداية.

واجهة برمجة التطبيقات File System Access API في Construct 3

توفر ميزة Construct خيار الحفظ في الملفات المحلية باستخدام File System Access API، بالإضافة إلى الحفظ في السحابة الإلكترونية (Google Drive وOneDrive وDropbox)، وتنزيل نسخة من ملف المشروع. تشير الإحصاءات التي جمعها مطوّرو Construct أنّ 65% من عمليات الحفظ تتم باستخدام واجهة File System Access API التي توضّح أنّ معظم العملاء يريدون استخدام هذا التطبيق.

لأغراض الحفظ، يعرض المقتطف التالي رمز الإنتاج الأصلي للحصول على FileSystemFileHandle من طريقة showSaveFilePicker()، والذي يعمل بعد ذلك على حفظ البيانات الفعلية. تستخدم ميزة "إنشاء" معلَمة خيارات id. يمكن تحديد الحقل id لاقتراح الدليل الذي يتم فيه فتح منتقي الملفات. من خلال تحديد id، يمكن للمتصفّح تذكُّر أدلة مختلفة لمعرّفات مختلفة، ما يؤدي إلى بدء مربّع الحوار بشكل متّسق في الدليل نفسه استنادًا إلى رقم التعريف. على سبيل المثال، يمكن فتح ملفات المستوى في Documents/levels/، في حين يمكن فتح ملفات الزخارف في Images/textures/. المعلَمة types هي مصفوفة من أنواع الملفات المتوافقة مع عنصر description مترجم ومرئي للمستخدم وكائن accept يطلب من نظام التشغيل أن يقبل بشكل مبدئي ملفات .c3p من نوع MIME application/x-construct3-project فقط.

let fileHandle = null;
try {
  fileHandle = await window["showSaveFilePicker"]({
    id: "save-project-file",
    types: [
      {
        description: lang("ui.project-file-picker.c3-single-file-project"),
        accept: {
          "application/x-construct3-project": [".c3p"],
        },
      },
    ],
  });
} catch (err) {
  // Assume user cancelled, or permission otherwise denied.
  return;
}

وجد فريق Construct أن العمل باستخدام الملفات على نظام ملفات المستخدم سهل للغاية. فهو يعمل بشكل مشابه لتطبيقات سطح المكتب التقليدية، ويتكامل بشكل ملائم مع البرامج الأخرى. على سبيل المثال، برامج النسخ الاحتياطي التي يمكنها إنشاء نسخ احتياطية من ملفات المستخدمين أو لإرسال العمل بسهولة إلى أماكن أخرى أو تعديل الملفات باستخدام أدوات خارجية. كما تستخدم واجهة برمجة التطبيقات File System Access API لحالات استخدام أخرى متنوعة، مثل تحديد مجلد احتياطي أو استيراد أصول مثل الرسوم المتحركة.

التعامل مع الملفات والمجلدات الكبيرة

يعمل بعض عملاء Construct في إنشاء مشروعات كبيرة جدًا بمئات الميغابايت. يعد حفظ هذا القدر الكبير من العمل في ملف واحد بطيئًا بشكل مؤلم، ناهيك عن تحميله على خدمة سحابية. تتيح واجهة برمجة التطبيقات File System Access API للمستخدمين المتمرّسين استخدام مجلد محلي يضم جميع أصولهم في ملفات منفصلة. ويتيح ذلك حفظ الملفات بسرعة كبيرة، لأنّه يجب تعديل الملفات التي تم تغييرها فقط.

المتابعة من حيث توقفت

يمكن إنشاء تسلسل لكل من معرِّفات الملفات والأدلة في IndexedDB، ما يسمح لـ Construct بتوفير قائمة مشروعات حديثة تستمر خلال الجلسات، بحيث يمكن للمستخدمين الوصول إلى الملف أو المجلد نفسه مرة أخرى، وهو أمر مفيد للغاية للمستخدم. في الواقع، تم فتح حوالي 30٪ من جميع المشروعات التي تم فتحها في Construct بهذه الطريقة. تعرض لقطة الشاشة التالية مشروعين حديثين، tetris.c3p وcolumns.c3p، وفي نافذة "أدوات مطوري البرامج" (DevTools)، تم عرض كائنات FileSystemFileHandle المقابلة المتسلسلة في جدول IndexedDB.

صفحة البداية "إنشاء 3" مع مشروعين حديثين، tetris.c3p وcolumn.c3p. في أسفل أدوات مطوّري البرامج، تظهر كائنات FileSystemFileHandle ذات الصلة والمتسلسلة إلى IndexedDB.

دمج السحب والإفلات

تتكامل واجهة برمجة التطبيقات File System Access API أيضًا مع واجهة برمجة التطبيقات للسحب والإفلات، بحيث يمكن للمستخدم سحب ملفات .c3p وإفلاتها في التطبيق. عندئذ يمكن للإنشاء باستخدام الإجراء getAsFileSystemHandle() في الكائن DataTransferItem الحصول على FileSystemFileHandle، ما يعني أنّ الملفات التي تم فتحها بهذه الطريقة يمكن تعديلها وحفظها على الفور، بدون الحاجة إلى الانتقال من خلال مربّع حوار منفصل لحفظ الملفات.

إنهاء العمل بإصدار NW.js

في السابق، كان لدى الفريق إصدار NW.js من Construct الذي كان يتطلّب الصيانة والتحديث بشكل منفصل للوصول إلى الملفات المحلية. بعد أن أضاف Chromium الدعم لواجهة برمجة التطبيقات File System Access API في الإصدار 84، أضاف مطوّرو Construct في هذا العام واجهة برمجة التطبيقات في 2020، وكمنتج ثانوي يمكنهم إيقاف إصدار NW.js واستخدام المتصفح حصريًا على جميع الأنظمة الأساسية. وهذا يبسط عملية التطوير وتجنب الحاجة إلى تجميع محرك المتصفح مع التطبيق.

الاستنتاجات

يستخدم Construct بشكل كبير طرق الانتقاء الثلاث showOpenFilePicker() وshowSaveFilePicker() وshowOpenDirectoryPicker() على التوالي لصالح المستخدمين الذين تعلموا الاعتماد على طريقة العمل مع Construct. كميزة إضافية، تستخدم Construct أيضًا واجهة برمجة تطبيقات معالجة الملفات، التي تسمح لـ Construct 3 بتسجيل نفسه كمعالج ملفات (تلقائي) لملفات .c3p. يعني ذلك أنّ المستخدم يمكنه النقر مرّتين أو النقر بزر الماوس الأيمن والفتح من خلال إنشاء 3 ملفات ألعابه مباشرةً من مستكشف الملفات في نظام التشغيل الذي يستخدمه. تستخدم أداة Construct، وهي المراهنات الكاملة على الويب، الكثير من واجهات برمجة التطبيقات الحديثة الأخرى للمتصفح، مثل WebGL وWeb Audio وWeb Workers وWebAssembly و WebRTC للألعاب متعددة اللاعبين وLocal Font Access وWebCodecs لمنتج الرسوم المتحركة الجديد والمزيد. لطالما كان هدفها الاستفادة بشكل كامل من منصة الويب وإظهار كيفية إضافة منتجات رائعة إليها، لذا احرص على تجربة الجولة الإرشادية وإنشاء ألعابك الخاصة.