چگونه ویرایشگر بازی Construct 3 از File System Access API استفاده می کند تا به کاربران اجازه دهد بازی های خود را ذخیره کنند

File System Access API امکان خواندن، نوشتن و مدیریت فایل را فراهم می کند. با نحوه استفاده Construct 3 از این API آشنا شوید.

مقدمه

(این مقاله به صورت ویدئویی نیز موجود است.)

Construct 3 یک ویرایشگر بازی است که توسط برادران توماس و اشلی گولن ساخته شده است. برای سومین نسخه فعلی ویرایشگر بازی خود، این دو کاملاً "[شرط] بر روی سیستم عامل جدید بودن مرورگر" پس از ساختن برای Windows و NW.js قبل از آن. می‌توانید با کاوش در ویترین آن یا کار کردن در تور راهنما ، تصوری از برخی بازی‌های توسعه‌یافته با ویرایشگر دریافت کنید. به لطف ابرقدرت‌های وب، می‌توانید فقط روی هر یک از نمونه‌های «الهام گرفته شوید» کلیک کنید و بلافاصله ویرایش را شروع کنید.

برنامه Construct 3 که کاربر را در حال ویرایش یکی از پروژه های شروع کننده نشان می دهد.

API دسترسی به فایل سیستم در ساختار 3

Construct گزینه ذخیره در فایل‌های محلی با File System Access API و همچنین ذخیره ابری (Google Drive، OneDrive، Dropbox) و دانلود یک کپی از فایل پروژه را فراهم می‌کند. آماری که توسعه‌دهندگان Construct جمع‌آوری کرده‌اند نشان می‌دهد که 65 درصد از ذخیره‌ها با File System Access API انجام می‌شود، که نشان می‌دهد این همان چیزی است که بیشتر مشتریان می‌خواهند از آن استفاده کنند.

برای ذخیره، قطعه زیر کد تولید اصلی را برای به دست آوردن FileSystemFileHandle از متد showSaveFilePicker() نشان می دهد، که سپس برای ذخیره داده های واقعی عمل می کند. Construct از پارامتر گزینه های 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 سریال شده اند.

صفحه شروع Construct 3 با دو پروژه اخیر، tetris.c3p و columns.c3p. در پایین DevTools دو شی FileSystemFileHandle مربوطه را نشان می دهد که به صورت سریال به IndexedDB تبدیل شده اند.

ادغام را بکشید و رها کنید

File System Access API همچنین با Drag and Drop API یکپارچه می شود، بنابراین کاربر می تواند فایل های .c3p را روی برنامه بکشد و رها کند. سپس Construct می‌تواند از طریق متد getAsFileSystemHandle() روی شی DataTransferItem یک FileSystemFileHandle به دست آورد، که به این معنی است که فایل‌هایی که به این روش باز می‌شوند را می‌توان بلافاصله ویرایش و ذخیره کرد، بدون نیاز به رفتن به یک گفتگوی ذخیره فایل جداگانه.

ساخت بازنشسته NW.js

پیش از این، تیم یک ساخت NW.js از Construct داشت که برای دسترسی به فایل‌های محلی نیاز به نگهداری و به‌روزرسانی جداگانه داشت. پس از اینکه Chromium از File System Access API در نسخه 84 پشتیبانی کرد، توسعه‌دهندگان Construct API را در سال 2020 پیاده‌سازی کردند و به عنوان یک محصول جانبی توانستند ساخت NW.js را بازنشسته کنند و از مرورگر به طور انحصاری در همه پلتفرم‌ها استفاده کنند. این امر توسعه را ساده می کند و از نیاز به بسته بندی موتور مرورگر با برنامه جلوگیری می کند.

نتیجه گیری

Construct از سه روش انتخابگر showOpenFilePicker() ، showSaveFilePicker() و showOpenDirectoryPicker() استفاده زیادی می کند تا به نفع کاربرانی باشد که یاد گرفته اند به این روش کار با Construct وابسته باشند. به عنوان یک مزیت اضافی، Construct همچنین از File Handling API استفاده می کند که به Construct 3 اجازه می دهد تا خود را به عنوان یک کنترل کننده فایل (پیش فرض) فایل های .c3p ثبت کند. این بدان معناست که کاربر می تواند فایل های بازی خود را مستقیماً از کاوشگر فایل سیستم عامل خود دابل کلیک یا راست کلیک کرده و با Construct 3 باز کند. Construct که به طور کامل روی وب شرط بندی می کند، از تعداد زیادی API مرورگرهای مدرن دیگر مانند WebGL، Web Audio، Web Workers، WebAssembly، WebRTC برای بازی های چند نفره، دسترسی به فونت محلی، WebCodecs برای محصول جدید انیمیشن خود و حتی بیشتر استفاده می کند. هدف آنها همیشه استفاده کامل از پلتفرم وب و نشان دادن چگونگی ساخت محصولات عالی بر روی آن بوده است، بنابراین حتماً تور راهنمای آنها را امتحان کنید و بازی های خود را بسازید.