إنشاء الشفرة

إنشاء التعليمات البرمجية هو عملية تحويل الكتل على مساحة العمل إلى سلسلة من التعليمات البرمجية يمكن تنفيذها.

إنّ إنشاء الرموز البرمجية هو أمر مهم للغاية، لأنّه يسمح للقوالب بتنفيذ مهام، مثل تقييم التعبيرات الحسابية أو نقل شخصية من خلال متاهة أو تهيئة متجر على الإنترنت.

لا يمكنك "تشغيل" عمليات الحظر مباشرةً. بدلاً من ذلك، يمكنك إنشاء سلاسل التعليمات البرمجية، ثم تنفيذها.

أدوات إنشاء الرموز

لإنشاء التعليمات البرمجية، عليك اختيار اللغة التي تعتمد على النص التي تريد إنشاءها.

أداة إنشاء الرموز هي فئة تعالج قواعد إنشاء الرموز البرمجية الخاصة بلغة معيّنة، وليست خاصة بمجموعة واحدة. على سبيل المثال، فهي تتعامل مع أشياء مثل تنسيق التعليقات، ووضع مسافة بادئة للعبارات، واقتباس السلاسل.

// javascriptGenerator is a code generator that makes javascript strings.
import {javascriptGenerator} from 'blockly/javascript';

const code = javascriptGenerator.workspaceToCode(myWorkspace);

يوفّر تطبيق Bluely 5 أدوات مدمَجة لإنشاء الرموز:

• JavaScript ES5
• بايثون 3
• Lua 5.1
• سهم 2
• 7 بيزو فلبيني

يمكنك استيراد أدوات الإنشاء واستخدامها باستخدام إحدى الطرق التالية.

الوحدات

import {javascriptGenerator} from 'blockly/javascript';
import {pythonGenerator} from 'blockly/python';
import {phpGenerator} from 'blockly/php';
import {luaGenerator} from 'blockly/lua';
import {dartGenerator} from 'blockly/dart';

const jsCode = javascriptGenerator.workspaceToCode(workspace);
const pythonCode = pythonGenerator.workspaceToCode(workspace);
const phpCode = phpGenerator.workspaceToCode(workspace);
const luaCode = luaGenerator.workspaceToCode(workspace);
const dartCode = dartGenerator.workspaceToCode(workspace);

Unpkg

يجب تضمين منشئ المنشئ بعد تضمين Blockly.

<script src="https://unpkg.com/blockly"></script>
<script src="https://unpkg.com/blockly/javascript_compressed"></script>
<script src="https://unpkg.com/blockly/python_compressed"></script>
<script src="https://unpkg.com/blockly/php_compressed"></script>
<script src="https://unpkg.com/blockly/lua_compressed"></script>
<script src="https://unpkg.com/blockly/dart_compressed"></script>

const jsCode = javascript.javascriptGenerator.workspaceToCode(workspace);
const pythonCode = python.pythonGenerator.workspaceToCode(workspace);
const phpCode = php.phpGenerator.workspaceToCode(workspace);
const luaCode = lua.luaGenerator.workspaceToCode(workspace);
const dartCode = dart.dartGenerator.workspaceToCode(workspace);

النصوص البرمجية المحلية

يجب تضمين منشئ المنشئ بعد تضمين Blockly.

<script src="blockly_compressed.js"></script>
<script src="javascript_compressed.js"></script>
<script src="python_compressed.js"></script>
<script src="php_compressed.js"></script>
<script src="lua_compressed.js"></script>
<script src="dart_compressed.js"></script>

const jsCode = javascript.javascriptGenerator.workspaceToCode(workspace);
const pythonCode = python.pythonGenerator.workspaceToCode(workspace);
const phpCode = php.phpGenerator.workspaceToCode(workspace);
const luaCode = lua.luaGenerator.workspaceToCode(workspace);
const dartCode = dart.dartGenerator.workspaceToCode(workspace);

إذا لم تكن هذه القائمة تتضمّن اللغة التي تريد إنشاء رمز لها، يمكنك أيضًا إنشاء أداة إنشاء رموز مخصّصة.

أدوات إنشاء رموز الكتل

يتمثل الجزء الثاني من عملية إنشاء الرمز في تحديد الرمز الذي تنشئه الكتل الفردية. يجب إجراء ذلك لكل كتلة، ولكل لغة على حدة تريد إنشاءها.

javascriptGenerator.forBlock['my_custom_block'] = function(block, generator) { /* ... */ }

تختلف آلية عمل أدوات إنشاء الرموز باختلاف أنواع الوحدات:

• عمليات الحظر التي تتضمّن مخرجات
• عمليات حظر بدون مخرجات

لكنها تتطلب جميعها جمع القيم من الحقول وجمع رموز الكتل الداخلية، ثم ربط تلك السلاسل.

الإنشاء

يمكن الإنشاء عندما يطلبه المستخدم (على سبيل المثال، عندما ينقر على زر)، أو يمكن تنفيذه باستمرار.

تتيح لك التحديثات المستمرة عرض التعليمة البرمجية أو تشغيلها كلما أجرى المستخدم تغييرًا. عملية إنشاء التعليمات البرمجية عملية سريعة، لذلك ليس هناك تأثير بسيط على الأداء للقيام بذلك. ويتم ذلك باستخدام أداة معالجة الحدث.

const supportedEvents = new Set([
  Blockly.Events.BLOCK_CHANGE,
  Blockly.Events.BLOCK_CREATE,
  Blockly.Events.BLOCK_DELETE,
  Blockly.Events.BLOCK_MOVE,
]);

function updateCode(event) {
  if (workspace.isDragging()) return; // Don't update while changes are happening.
  if (!supportedEvents.has(event.type)) return;

  const code = javascriptGenerator.workspaceToCode(workspace);
  document.getElementById('textarea').value = code;
}

workspace.addChangeListener(updateCode);

رمز المقدمة أو رمز Postscript

بعد إنشاء التعليمة البرمجية، يمكنك تضمين (اختياري) شفرة المقدمة أو المقدمة في بداية أو نهاية التعليمة البرمجية التي تم إنشاؤها.

let code = javascriptGenerator.workspaceToCode(workspace);
// Add a preamble and a postscript to the code.
code = `const def = 'some value';\n${code}\nkickOffSomeFunction();\n`;

عادة ما يتم استخدام تعليمة برمجية تمهيدية لتضمين التعريفات الخارجية في بداية التعليمة البرمجية. تُستخدم عادةً التعليمة البرمجية Postscript لاستدعاء الدوال لبدء السلوك في نهاية التعليمة البرمجية.

إذا كان من الممكن تشغيل التعليمة البرمجية التي تم إنشاؤها كما هي، فلا داعي لتضمين مقدمة أو لاحقة.

التنفيذ

بعد إنشاء التعليمة البرمجية، يتعين عليك معرفة كيفية تنفيذها. إنّ تحديد كيفية تنفيذه هو أمر خاص بالتطبيق وخارج نطاق Blockly.

بالنسبة إلى رمز JavaScript، ينصح فريق Blockly باستخدام الأداة JSInterpreter. وتتطلّب اللغات الأخرى أدوات أخرى.