บันทึกและโหลด

การจัดรูปแบบเป็นอนุกรมคือบันทึกสถานะของพื้นที่ทํางานเพื่อให้โหลดกลับเข้าไปในพื้นที่ทํางานในภายหลังได้ ซึ่งรวมถึงการแปลงสถานะของบล็อก ตัวแปร หรือปลั๊กอินที่ต้องการบันทึกเป็นรูปแบบอนุกรม คุณสามารถแปลงข้อมูลทั้งหมดที่ต้องการบันทึกเป็นรูปแบบข้อความเพื่อให้จัดเก็บได้ง่าย จากนั้นโหลดข้อมูลดังกล่าวกลับไปยังเวิร์กスペースที่ใช้งานได้อย่างเต็มรูปแบบในภายหลัง

Blockly มีข้อมูลนี้ 2 รูปแบบ ได้แก่ JSON และ XML เราขอแนะนำให้ใช้ระบบ JSON สำหรับโปรเจ็กต์ใหม่ และแนะนำให้โปรเจ็กต์เก่าที่ใช้ XML อัปเกรด ระบบ XML เป็นรูปแบบการบันทึกเดิม แต่จะไม่มีการนําออก แต่จะไม่ได้รับฟีเจอร์ใหม่

ระบบ JSON

ระบบการจัดรูปแบบ JSON ประกอบด้วยเครื่องมือจัดรูปแบบหลายรายการ มีตัวจัดรูปแบบในตัวสำหรับบล็อกและตัวแปร และคุณยังลงทะเบียนตัวจัดรูปแบบเพิ่มเติมได้ด้วย โดยแต่ละตัวจัดรูปแบบจะมีหน้าที่จัดรูปแบบและจัดรูปแบบสถานะของปลั๊กอินหรือระบบหนึ่งๆ

การบันทึกและการโหลด

พื้นที่ทำงาน

คุณสามารถจัดรูปแบบหรือแยกรูปแบบสถานะของทั้งพื้นที่ทํางานได้โดยเรียกใช้เมธอด save และ load ในเนมสเปซ workspaces

const state = Blockly.serialization.workspaces.save(myWorkspace);
Blockly.serialization.workspaces.load(state, myWorkspace);

การเรียกเหล่านี้จะจัดรูปแบบหรือถอดรูปแบบระบบแต่ละระบบทั้งหมด (แสดงโดยตัวจัดรูปแบบ) ที่ลงทะเบียนกับ Workspace

บล็อกเดี่ยว

คุณสามารถจัดเรียงหรือแยกวิเคราะห์แต่ละบล็อกได้โดยเรียกใช้เมธอด save และ append ในเนมสเปซ blocks

const blockJson = Blockly.serialization.blocks.save(myBlock);
const duplicateBlock =
    Blockly.serialization.blocks.append(blockJson, myWorkspace);

ระบบแต่ละระบบ

คุณสามารถจัดเรียงหรือจัดเรียงข้อมูลระบบแต่ละระบบ (เช่น บล็อก ตัวแปร ปลั๊กอิน ฯลฯ) ได้โดยสร้างเครื่องมือจัดเรียงข้อมูลที่เกี่ยวข้อง และเรียกใช้เมธอด save และ load ของเครื่องมือดังกล่าว

// Saves only the variables information for the workspace.
const serializer = new Blockly.serialization.variables.VariableSerializer();
const state = serializer.save(myWorkspace);
serializer.load(state, myWorkspace);

ลำดับการแปลงข้อมูล

ระบบ JSON มีลําดับการแปลงเป็นอนุกรมที่ชัดเจน ซึ่งทําให้ป้องกันสถานะที่ซ้ำกันภายในการบันทึกได้ง่ายขึ้น

เมื่อเรียก Blockly.serialization.workspaces.load ระบบจะกำหนดสถานะให้กับเครื่องมือจัดรูปแบบเพื่อแปลงข้อมูลตามลำดับความสำคัญ โปรดดูคำอธิบายเพิ่มเติมในส่วนSerializer โดยมีวัตถุประสงค์เพื่อให้ Serializer ขึ้นอยู่กับสถานะจากระบบอื่นๆ

ลำดับการแปลงข้อมูลแบบย้อนกลับของโปรแกรมจัดรูปแบบในตัวมีดังนี้

  1. โมเดลตัวแปรจะได้รับการแปลงกลับ
  2. โมเดลขั้นตอนจะได้รับการแปลงกลับ
  3. บล็อกได้รับการแปลงข้อมูลอีกครั้ง ระบบจะแปลงค่าบล็อกระดับบนสุดแต่ละรายการเป็นรูปแบบเดิมในลําดับที่กําหนดเอง
    1. ประเภทได้รับการแปลงกลับ ซึ่งจะสร้างบล็อก ทริกเกอร์เมธอด init และรวมส่วนขยาย
    2. แอตทริบิวต์ได้รับการแปลงกลับ ซึ่งรวมถึงพร็อพเพอร์ตี้ที่ใช้กับบล็อกใดก็ได้ เช่น x, y, ยุบ, ปิดใช้ และข้อมูล
  4. สถานะเพิ่มเติมได้รับการแปลงข้อมูลอีกครั้ง ดูข้อมูลเพิ่มเติมได้ในเอกสารประกอบเกี่ยวกับตัวเปลี่ยน
  5. บล็อกเชื่อมต่อกับบล็อกหลัก (หากมี)
    1. ไอคอนจะได้รับการแปลงข้อมูลอีกครั้ง ระบบจะแปลงค่ากลับไอคอนแต่ละรายการในลําดับที่กําหนดเอง
    2. ฟิลด์ได้รับการแปลงกลับ ระบบจะแปลงค่าแต่ละช่องเป็นรูปแบบเดิมในลําดับที่กําหนดเอง
    3. บล็อกอินพุตจะได้รับการแปลงกลับ ซึ่งรวมถึงบล็อกที่เชื่อมต่อกับค่าอินพุตและอินพุตคำสั่ง ระบบจะแปลงค่าอินพุตแต่ละรายการเป็นรูปแบบเดิมในลําดับที่ไม่เจาะจง
    4. บล็อกถัดไปจะได้รับการแปลงกลับ

กรณีที่ควรบันทึกสถานะเพิ่มเติม

สำหรับบล็อก หากคุณมีรายการที่อยู่ต่ำกว่าในลําดับซึ่งขึ้นอยู่กับรายการที่สูงกว่าในลําดับ คุณควรทำซ้ำข้อมูลนั้นและเพิ่มลงในสถานะเพิ่มเติม

เช่น หากคุณมีฟิลด์ที่มีเฉพาะในกรณีที่บล็อกถัดไปเชื่อมต่ออยู่ คุณควรเพิ่มข้อมูลเกี่ยวกับบล็อกถัดไปนั้นลงในสถานะเพิ่มเติม เพื่อให้ระบบเพิ่มฟิลด์ลงในบล็อกได้ก่อนที่จะแปลงสถานะของฟิลด์กลับ

อย่างไรก็ตาม หากคุณมีอินพุตที่มีเฉพาะในกรณีที่ช่องมีค่าหนึ่งๆ คุณไม่จําเป็นต้องเพิ่มข้อมูลเกี่ยวกับช่องนั้นลงในสถานะเพิ่มเติม เนื่องจากระบบจะแปลงสถานะของช่องเป็นรูปแบบเดิมก่อน และเมื่อแปลงแล้ว คุณจะเพิ่มอินพุตลงในบล็อกได้ โดยปกติแล้ว โปรแกรมตรวจสอบจะทริกเกอร์การเพิ่มอินพุต

โปรดทราบว่ากฎเกี่ยวกับการทำซ้ำสถานะควรคำนึงถึงด้วยว่ากองบล็อก ไอคอน ช่อง และบล็อกอินพุตจะได้รับการแปลงข้อมูลอีกครั้งในลำดับที่ไม่เจาะจง เช่น หากคุณมีฟิลด์ B 1 ช่องที่มีอยู่เฉพาะในกรณีที่ฟิลด์อื่น A มีค่าที่เฉพาะเจาะจง คุณควรเพิ่มข้อมูลเกี่ยวกับ A ลงในสถานะเพิ่มเติมในกรณีที่มีการแปลงค่า B ให้เป็นรูปแบบเดิมก่อน A

บล็อกฮุก

ดูข้อมูลเกี่ยวกับวิธีเพิ่มการทำให้เป็นอนุกรมเพิ่มเติมลงในบล็อกได้ที่เอกสารประกอบเกี่ยวกับตัวแปลง

ฮุกในฟิลด์

ดูข้อมูลเกี่ยวกับวิธีจัดรูปแบบฟิลด์ได้ในเอกสารประกอบฟิลด์ที่กำหนดเอง

ฮุกสำหรับเครื่องมือจัดรูปแบบข้อมูล

ระบบ JSON ให้คุณลงทะเบียน Serializer ซึ่งจะจัดรูปแบบและถอดรูปแบบสถานะบางอย่าง ตัวจัดรูปแบบในตัวของ Blockly จะจัดรูปแบบข้อมูลเกี่ยวกับบล็อกและตัวแปร แต่หากต้องการจัดรูปแบบข้อมูลอื่นๆ คุณจะต้องเพิ่มตัวจัดรูปแบบของคุณเอง ตัวอย่างเช่น ระบบ JSON จะไม่จัดรูปแบบความคิดเห็นระดับเวิร์กスペースโดยค่าเริ่มต้น หากต้องการแปลงเป็นอนุกรม คุณจะต้องลงทะเบียนตัวแปลงเป็นอนุกรมเพิ่มเติม

มักใช้ตัวจัดรูปแบบเพิ่มเติมเพื่อจัดรูปแบบและจัดรูปแบบสถานะของปลั๊กอิน

Blockly.serialization.registry.register(
    'workspace-comments',  // Name
    {
      save: saveFn,      // Save function
      load: loadFn,      // Load function
      clear: clearFn,    // Clear function
      priority: 10,      // Priority
    });

เมื่อลงทะเบียนตัวจัดรูปแบบ คุณต้องระบุข้อมูลต่อไปนี้

  • ชื่อสำหรับเครื่องมือจัดรูปแบบ ซึ่งระบบจะบันทึกข้อมูลไว้ด้วย
  • ฟังก์ชันเพื่อsaveสถานะของปลั๊กอิน/ระบบที่เชื่อมโยงกับตัวแปลงไฟล์
  • ฟังก์ชันสำหรับclearสถานะ
  • ฟังก์ชันสำหรับloadสถานะ
  • priority ซึ่งใช้เพื่อกำหนดลําดับการแปลงข้อมูล

    คุณกำหนดลำดับความสำคัญของเครื่องมือจัดรูปแบบตามลำดับความสำคัญในตัวได้

เมื่อเรียก Blockly.serialization.workspaces.save ระบบจะเรียกใช้ฟังก์ชัน save ของโปรแกรมจัดรูปแบบข้อมูลแต่ละรายการ และเพิ่มข้อมูลของโปรแกรมจัดรูปแบบข้อมูลนั้นลงในเอาต์พุต JSON สุดท้าย

{
  "blocks": { ... },
  "workspaceComments": [ // Provided by workspace-comments serializer
    {
      "x": 239,
      "y": 31,
      "text": "Add 2 + 2"
    },
    // etc...
  ]
}

เมื่อเรียก Blockly.serialization.workspaces.load ระบบจะเรียกใช้ Serializer แต่ละรายการตามลําดับความสําคัญ ตัวจัดรูปแบบที่มีค่าลําดับความสําคัญเป็นบวกมากกว่าจะทริกเกอร์ก่อนตัวจัดรูปแบบที่มีค่าลําดับความสําคัญเป็นบวกน้อยกว่า

เมื่อเรียกใช้โปรแกรมจัดรูปแบบข้อมูล 2 สิ่งต่อไปนี้จะเกิดขึ้น

  1. ระบบจะเรียกใช้ฟังก์ชัน clear ที่ระบุ วิธีนี้ช่วยให้มั่นใจว่าสถานะของปลั๊กอิน/ระบบจะสะอาดก่อนที่จะโหลดสถานะเพิ่มเติม ตัวอย่างเช่น โปรแกรมจัดรูปแบบข้อความสำหรับ workspace-comments จะนําความคิดเห็นที่มีอยู่ทั้งหมดออกจาก Workspace
  2. ระบบจะเรียกใช้ฟังก์ชัน load ที่ระบุ

ระบบ XML

ระบบ XML ช่วยให้คุณจัดรูปแบบพื้นที่ทํางานเป็นโหนด XML ได้ ซึ่งเป็นระบบการจัดรูปแบบเดิมของ Blockly ตอนนี้เราจึงหยุดพัฒนาฟีเจอร์นี้ ซึ่งหมายความว่าฟีเจอร์ดังกล่าวจะไม่ได้รับการอัปเดต เราจึงขอแนะนำให้ใช้ระบบ JSON หากเป็นไปได้

API

ดูข้อมูลเกี่ยวกับ API ของระบบ XML ได้ที่เอกสารอ้างอิง

บล็อกฮุก

ดูข้อมูลเกี่ยวกับวิธีเพิ่มการทำให้เป็นอนุกรมเพิ่มเติมลงในบล็อกได้ที่เอกสารประกอบเกี่ยวกับตัวแปลง

ฮุกในฟิลด์

ดูข้อมูลเกี่ยวกับวิธีจัดรูปแบบฟิลด์ได้ในเอกสารประกอบฟิลด์ที่กำหนดเอง

การเลือกระหว่าง JSON กับ XML

เราขอแนะนำให้ใช้โปรแกรมแปลง JSON แทน XML ระบบ JSON ช่วยให้คุณจัดรูปแบบสถานะของพื้นที่ทํางานเป็นออบเจ็กต์ JavaScript ได้ ซึ่งมีข้อดีดังนี้

  1. JSON บีบอัดหรือแปลงเป็นรูปแบบอื่นได้ง่าย
  2. JSON ใช้งานแบบเป็นโปรแกรมได้ง่าย
  3. JSON ขยายและเพิ่มข้อมูลต่อได้ง่าย

นอกจากนี้ ระบบ XML จะไม่ได้รับการอัปเดตอีกต่อไป และยังไม่มีฟีเจอร์เมื่อเทียบกับ JSON Serializer เช่น คุณสามารถลงทะเบียนตัวจัดรูปแบบ JSON ของคุณเองเพื่อบันทึกและโหลดข้อมูลเพิ่มเติมได้ง่ายๆ เช่น ข้อมูลสำหรับปลั๊กอินหรือการปรับแต่งที่คุณเพิ่ม ซึ่งระบบ XML ไม่สามารถทำได้

หากคุณเคยใช้การแปลง XML ให้เป็นรูปแบบอนุกรมมาก่อน โปรดดูข้อมูลเกี่ยวกับวิธีอัปเกรดในคู่มือการย้ายข้อมูล