สำหรับนักพัฒนาที่ต้องสร้างระบบแปลงเอกสารจาก Microsoft Word (.docx) ไปเป็น HTML ที่มีมาตรฐานสูง ความท้าทายที่ใหญ่ที่สุดคือการจัดการกับ Built-in Table Style ID ซึ่งเป็นรหัสเฉพาะของมาตรฐาน OpenXML (ECMA-376) การแปลงรหัสเหล่านี้ให้กลายเป็นคลาส CSS ที่มีความยืดหยุ่นและรองรับระบบ Theme Colors ของเว็บแอปพลิเคชันจึงเป็นงานที่ซับซ้อนมาก
บทความนี้จะนำเสนอแนวทางสถาปัตยกรรมที่สมบูรณ์ โดยใช้ PostgreSQL เป็นแกนหลักในการจัดการข้อมูล (Data Mapping) และการสร้างสเปก CSS Framework โดยเฉพาะอย่างยิ่งการจำลองระบบ Theme Colors และการคำนวณค่าสีแบบ Tint/Shade ที่ Word ใช้
หลักการทำงาน: การใช้ PostgreSQL ในการแมปสไตล์
แทนที่จะ Hardcode สไตล์ทั้งหมด เราจะใช้ PostgreSQL ในการสร้างตารางข้อมูล (Schema) เพื่อเก็บการแมป (Mapping) ระหว่าง Built-in Style ID ของ Word กับชุดตัวแปร CSS (CSS Variables) ที่จำเป็น ซึ่งทำให้ระบบมีความยืดหยุ่นสูง สามารถอัปเดต Theme Colors ได้โดยไม่ต้องแก้ไขโค้ดหลัก
เราจะสร้างตารางที่เก็บข้อมูลสไตล์ตารางมาตรฐาน (Plain, Grid, List) และผูกค่าสีหลัก (เช่น `–ms-dark1`, `–ms-border-neutral`) เข้ากับรหัสสไตล์ เพื่อให้ระบบสามารถ Query และสร้าง CSS Output ได้อย่างแม่นยำ
ตัวอย่างการสร้าง Schema Mapping ใน PostgreSQL
เราใช้ PostgreSQL เพื่อกำหนดโครงสร้างข้อมูลที่เชื่อมโยง Style ID กับค่าตัวแปรสีและคลาส CSS:
SQL
-- 1. สร้างตารางสำหรับเก็บการแมปสไตล์ตาราง (Table Style Mapping) -- CREATE TABLE word_style_mapping ( style_id TEXT PRIMARY KEY, style_name TEXT NOT NULL, css_class TEXT NOT NULL, border_color_var TEXT, header_bg_var TEXT ); -- 2. ใส่ข้อมูลสไตล์มาตรฐาน (Plain Table) -- INSERT INTO word_style_mapping ( style_id, style_name, css_class, border_color_var, header_bg_var ) VALUES ('TableGrid', 'Grid Table', 'table-style-grid', '--ms-border-neutral', '--ms-light2'); -- 3. ใส่ข้อมูลสไตล์มาตรฐาน (List Table) -- INSERT INTO word_style_mapping ( style_id, style_name, css_class, border_color_var, header_bg_var ) VALUES ('TableList', 'List Table', 'table-style-list', '--ms-border-neutral', NULL); -- 4. การ Query เพื่อดึงข้อมูลสำหรับสร้าง CSS -- SELECT style_id, css_class, border_color_var, header_bg_var FROM word_style_mapping WHERE style_name = 'Grid Table';
การสร้าง CSS Variables จากข้อมูล PostgreSQL
เมื่อระบบทำการ Query ข้อมูลจากตาราง word_style_mapping แล้ว ข้อมูลที่ได้จะถูกนำไปใช้ในการสร้างไฟล์ CSS Variables โดยอัตโนมัติ ตัวอย่างเช่น หาก Query ได้ค่า `css_class` เป็น table-style-grid และ `border_color_var` เป็น --ms-border-neutral ระบบจะสร้างโค้ด CSS ดังนี้:
CSS
.table-style-grid { border: 1px solid var(--ms-border-neutral); } th { background-color: var(--ms-light2); }
บทสรุป: ความยืดหยุ่นระดับสถาปัตยกรรม
การใช้ PostgreSQL ในการจัดการ Built-in Table Style ID ไม่เพียงแต่ช่วยให้การแปลงสไตล์มีความแม่นยำสูงเท่านั้น แต่ยังยกระดับระบบทั้งหมดให้เป็นสถาปัตยกรรมที่ยืดหยุ่น (Decoupled Architecture) อย่างแท้จริง การเปลี่ยนแปลง Theme Colors หรือการเพิ่มสไตล์ตารางใหม่ๆ สามารถทำได้เพียงแค่การ INSERT หรือ UPDATE ข้อมูลในฐานข้อมูล โดยไม่จำเป็นต้องแก้ไขโค้ด Backend หรือ Frontend เลย ทำให้ระบบมีความทนทานและพร้อมขยายตัวในระดับองค์กร (Enterprise-Grade) อย่างสมบูรณ์