พัฒนาเลย์เอาต์ของส่วนที่กำหนดเองด้วย API

คุณสามารถพัฒนาเลย์เอาต์ของส่วนที่กำหนดเองใน Oracle Content Management ด้วย API เลย์เอาต์ของส่วน ซึ่งมี API การแสดงผล และ API การแก้ไข

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

API การแสดงผล

API การแสดงผลที่โหลดจากโมดูล render.js มีการใช้ในตัวสร้างไซต์และในรันไทม์

API การแสดงผล คำอธิบาย พารามิเตอร์อินพุต ผลลัพธ์การส่งคืน
(ตัวสร้าง) เริ่มต้นโมดูลการแสดงผลเลย์เอาต์ของส่วน

ออบเจกต์ JavaScript ที่ประกอบด้วยคุณสมบัติต่อไปนี้

  • sectionlayoutData (ออบเจกต์) : ข้อมูลเลย์เอาต์ของส่วนที่พบในโมเดลของเพจ

  • componentId (สตริง): ค่า componentId สำหรับเลย์เอาต์ของส่วน โดยปกติจะเป็น GUID

  • renderMode (สตริง, เลือกระบุได้): โหมดการแสดงผลสำหรับการแสดงผลข้อมูล

  • customSettingsData (ออบเจกต์): สำเนาของ customSettingsData ที่พบใน sectionLayoutData

API การแสดงผลเลย์เอาต์ของส่วนมีการเริ่มต้นแล้ว
render

ส่งอีลิเมนต์ DOM ที่เหมาะสำหรับเลย์เอาต์ของส่วนไปยังเพจ รวมถึง DIV ของคอนเทนเนอร์สำหรับองค์ประกอบระดับล่าง

container (อีลิเมนต์) : อีลิเมนต์ DOM ซึ่งควรมีการแสดงผลมาร์คอัปสำหรับเลย์เอาต์ของส่วน

หลังจากส่งคืนเมทธอดนี้ ระบบจะแสดงองค์ประกอบระดับล่าง

คุณสามารถดูว่าเป็นองค์ประกอบระดับล่างได้โดยมองหาอีลิเมนต์ div[id] ระดับล่าง

addComponent

ใช้กับองค์ประกอบลิสต์ของเนื้อหา เพื่อเพิ่มองค์ประกอบระดับล่างให้กับเลย์เอาต์ของส่วนแบบไดนามิค

ฟังก์ชันนี้เป็นแบบเลือกระบุได้

container (อีลิเมนต์) : อีลิเมนต์ DOM ซึ่งควรมีการแสดงผลองค์ประกอบใหม่

componentId (สตริง): ID ขององค์ประกอบใหม่ที่จะเพิ่มในเลย์เอาต์ของส่วน

หลังจากส่งคืนเมทธอดนี้ ระบบจะแสดงอีลิเมนต์ที่มี ID ตรงกับอินพุต componentId

API การแก้ไข

ระบบจะโหลดโมดูล edit.js ถ้า คุณสมบัติ hasEditHandlers มีการตั้งค่าเป็น true ในไฟล์ appinfo.json ที่เชื่อมโยงกับเลย์เอาต์ของส่วน

API การแก้ไขนี้มีการใช้ในตัวสร้างไซต์

ฟังก์ชันทั้งหมดในโมดูลนี้ ยกเว้น "ตัวสร้าง" เป็นแบบเลือกระบุได้

API การแก้ไข คำอธิบาย พารามิเตอร์อินพุต ผลลัพธ์การส่งคืน
(ตัวสร้าง) เริ่มต้นโมดูลการแก้ไขเลย์เอาต์ของส่วน

ออบเจกต์ JavaScript ที่ประกอบด้วยคุณสมบัติต่อไปนี้

  • componentId (สตริง): ค่า componentId สำหรับเลย์เอาต์ของส่วน โดยปกติจะเป็น GUID

API การแก้ไขเลย์เอาต์ของส่วนมีการเริ่มต้นแล้ว

getCapabilities

แสดงผลออบเจกต์ที่อธิบายความสามารถในการแก้ไขสำหรับเลย์เอาต์ของส่วน

ออบเจกต์ JavaScript ที่อธิบายความสามารถในการแก้ไขสำหรับเลย์เอาต์ของส่วน

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

ออบเจกต์ความสามารถมีความสามารถได้ดังต่อไปนี้

  • title (สตริง): ชื่อสำหรับเลย์เอาต์ของส่วนที่จะแสดงให้กับผู้ใช้

  • settingsTitle (สตริง): ชื่อที่จะแสดงในไดอะล็อกแผงข้อมูลการตั้งค่า

  • hasSettings (บูลีน): ระบุว่าเลย์เอาต์ของส่วนรองรับแผงข้อมูลการตั้งค่าหรือไม่

  • allowMove (บูลีน): ระบุว่าเลย์เอาต์ของส่วนอนุญาตให้ย้ายรายการระดับล่างหรือไม่

  • allowDelete (บูลีน): ระบุว่าเลย์เอาต์ของส่วนอนุญาตให้ลบรายการระดับล่างหรือไม่

  • isHidden (บูลีน): ระบุว่าเลย์เอาต์ของส่วนมีสถานะซ่อนตามการเลือกของผู้ใช้หรือไม่

  • dropTarget (บูลีน): ระบุว่าเลย์เอาต์ของส่วนเป็นเป้าหมายสำหรับการลากและวางข้อมูลหรือไม่

  • customMenuOptions (อาเรย์): ตัวเลือกเมนูที่กำหนดเองที่จะเพิ่มในเมนูคอนเท็กซ์สำหรับเลย์เอาต์ของส่วน ออบเจกต์ตัวเลือกเมนูแต่ละรายการมีคุณสมบัติดังต่อไปนี้

    • label (สตริง) : ข้อความที่ปรากฏของรายการเมนู

    • action (ฟังก์ชัน): ฟังก์ชันที่จะเรียกใช้เมื่อมีการคลิกรายการเมนู

    • disabled (บูลีน): ระบุว่ารายการเมนูควรมีสถานะเลิกใช้งาน

    • icon (สตริง): URL ที่จะแสดงผลพร้อมกับป้ายกำกับในรายการเมนู (คุณสมบัตินี้สงวนไว้สำหรับการใช้งานในอนาคต)

    • checkmark (บูลีน): ระบุว่าเครื่องหมายถูกควรปรากฏพร้อมกับป้ายกำกับในรายการเมนู

    • subMenuItems (อาเรย์): ตัวเลือกเมนูที่จะแสดงในเมนูย่อย

(ออบเจกต์): ความสามารถสำหรับเลย์เอาต์ของส่วน

getCaptionContent

แสดงผลชื่อที่ปรากฏสำหรับเลย์เอาต์ของส่วน ซึ่งจะปรากฏในอีลิเมนต์ UI

ไม่มี

(สตริง): ชื่อที่ปรากฏสำหรับเลย์เอาต์ของส่วน

filterCapabilities

อนุญาตให้เลย์เอาต์ของส่วนสามารถแก้ไขออบเจกต์ความสามารถ ก่อนที่จะแสดงเมนูแก่ผู้ใช้

คุณสามารถใช้ API นี้เพื่อปรับหรือลบตัวเลือกเมนูออก (โปรดดูข้อมูลเพิ่มเติมที่ getCapabilities)

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

(ออบเจกต์) ความสามารถสำหรับเลย์เอาต์ของส่วน
onDragOver เรียกใช้ระหว่างการลากและวาง เพื่อระบุว่ารายการที่ลากนั้นสามารถวางในเลย์เอาต์ของส่วน

eventObject (ออบเจกต์ของอีเวนต์): ออบเจกต์ของอีเวนต์ที่เก็บข้อมูลเกี่ยวกับอีเวนต์การลาก

dataTransfer (ออบเจกต์ DataTransfer): ออบเจกต์ DataTransfer ที่เก็บข้อมูลเกี่ยวกับรายการที่จะลากไปยังเลย์เอาต์ของส่วน

(บูลีน) ค่าที่ระบุว่าเลย์เอาต์ของส่วนสามารถรับรายการที่ลากได้หรือไม่

แสดงผลเป็น จริง ถ้าเลย์เอาต์ของส่วนสามารถรับรายการที่ลากได้ มิฉะนั้นจะแสดงผลเป็น เท็จ

onDrop เรียกใช้ในส่วนของการวางในการลากและวาง เพื่อระบุว่าควรวางรายการที่ลากไว้ภายในเลย์เอาต์ของส่วน

eventObject (ออบเจกต์ของอีเวนต์): ออบเจกต์ของอีเวนต์ที่เก็บข้อมูลเกี่ยวกับอีเวนต์การวาง

dataTransfer (ออบเจกต์ DataTransfer) ออบเจกต์ DataTransfer ที่เก็บข้อมูลเกี่ยวกับรายการที่จะวางในเลย์เอาต์ของส่วน

(บูลีน) ค่าที่ระบุว่าเลย์เอาต์ของส่วนสามารถจัดการการวางได้หรือไม่

การแสดงผลเป็น จริง จะข้ามตรรกะดีฟอลต์

onAddComponent แจ้งเลย์เอาต์ของส่วนว่าการลากและวางได้เพิ่มรายการในเลย์เอาต์ของส่วน

eventObject (ออบเจกต์ของอีเวนต์): ออบเจกต์ของอีเวนต์ที่เก็บข้อมูลเกี่ยวกับอีเวนต์การลาก

dataTransfer (ออบเจกต์ DataTransfer): ออบเจกต์ DataTransfer ที่เก็บข้อมูลเกี่ยวกับรายการที่จะวางในเลย์เอาต์ของส่วน

componentId (สตริง): ค่า componentId ของรายการที่เพิ่มใหม่

การแจ้งเตือนสำหรับเลย์เอาต์ของส่วน
onMoveComponent

แจ้งเลย์เอาต์ของส่วนว่าการลากและวางได้ย้ายรายการในเลย์เอาต์ของส่วน

eventObject (ออบเจกต์ของอีเวนต์): ออบเจกต์ของอีเวนต์ที่เก็บข้อมูลเกี่ยวกับอีเวนต์การลาก

dataTransfer (ออบเจกต์ DataTransfer): ออบเจกต์ DataTransfer ที่เก็บข้อมูลเกี่ยวกับรายการที่จะวางในเลย์เอาต์ของส่วน

componentId (สตริง): ค่า componentId ของรายการที่ย้าย

การแจ้งเตือนสำหรับเลย์เอาต์ของส่วน
getSettingsData

อนุญาตให้เลย์เอาต์ของส่วนสามารถแก้ไขข้อมูลการตั้งค่าได้ ก่อนที่จะแสดงแผงข้อมูลการตั้งค่า

settingsData (ออบเจกต์): ข้อมูลการตั้งค่าดีฟอลต์ที่ประมวลผลสำหรับเลย์เอาต์ของส่วน

(ออบเจกต์) ข้อมูลการตั้งค่าสำหรับเลย์เอาต์ของส่วน
updateSettings

อนุญาตให้เลย์เอาต์ของส่วนสามารถแก้ไขการตั้งค่าได้หลังจากที่ปิดแผงข้อมูลการตั้งค่าแล้ว

ระบบจะเรียก API นี้ก่อนที่จะเก็บการตั้งค่าในโมเดลของเพจ

parameters (ออบเจกต์): ออบเจกต์พารามิเตอร์แบบ raw ที่แสดงผลจากแผงข้อมูลการตั้งค่า

sectionLayoutData (ออบเจกต์) : ข้อมูลเลย์เอาต์ของส่วนที่จะเก็บไว้ ระบบจะสร้างข้อมูลดีฟอลต์จาก parameters (ออบเจกต์) และส่งไปยังฟังก์ชันในพารามิเตอร์นี้

(ออบเจกต์) ข้อมูลเลย์เอาต์ของส่วนที่จะเก็บในโมเดลของเพจ
dispose

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

ระบบจะเรียก API นี้เมื่อจำเป็นต้องแสดงผลเลย์เอาต์ของส่วนใหม่ทั้งหมด เช่นในกรณีของการยกเลิก/ทำซ้ำ

ไม่มี การแสดงผลเลย์เอาต์ของส่วนมีการใช้งานอยู่