use ddb files as source

This commit is contained in:
Tei Yuan Wei 2024-09-23 16:24:39 +08:00
parent 6c3d916a4d
commit d1d23b1c92
9 changed files with 161 additions and 313 deletions

17
server/README.md Normal file
View File

@ -0,0 +1,17 @@
# DrawDB Node.js Wrapper
This is a Node.js application that serves static files for the DrawDB frontend and provides an API to handle file operations for `.ddb` files.
## Environment variables:
- `DRAWDB_FILE_DIR`: Directory where `.ddb` files will be stored (default: `/usercode`).
- `DRAWDB_HOME`: Path to the DrawDB frontend static files (default: `../dist`).
- `DRAWDB_PORT`: Port number for the app (default: `8080`).
## Run dev
```bash
export DRAWDB_FILE_DIR=/some-dir-to-write-ddb-files
cd server
npm run dev
```
The server will be running at `http://localhost:8080` (or the port specified by `DRAWDB_PORT`).

View File

@ -14,14 +14,14 @@ app.use(express.json())
// Serve the static files from the DrawDB app
app.use(express.static(DRAWDB_HOME));
// Endpoints
app.post('/api/usercode-files/', (req, res) => {
const { filename, content } = req.body;
if (!filename || !content) {
return res.status(400).send('Filename and content are required');
}
const filePath = path.join(DRAWDB_FILE_DIR, filename);
const filePath = path.join(DRAWDB_FILE_DIR, filename);
fs.writeFile(filePath, JSON.stringify(content), 'utf8', (err) => {
if (err) {
return res.status(500).send('Error writing ddb file');
@ -32,15 +32,13 @@ app.post('/api/usercode-files/', (req, res) => {
app.get('/api/usercode-files/:filename', (req, res) => {
const filename = req.params.filename;
const filePath = path.join(DRAWDB_FILE_DIR, filename); // Adjust the path based on your directory structure
const filePath = path.join(DRAWDB_FILE_DIR, filename);
fs.readFile(filePath, 'utf8', (err, data) => {
if (err) {
if (err.code === 'ENOENT') {
// File not found
return res.status(404).send('File not found');
}
// Some other error
return res.status(500).send('Error reading file');
}
res.send(data);
@ -49,13 +47,11 @@ app.get('/api/usercode-files/:filename', (req, res) => {
app.delete('/api/usercode-files/:filename', (req, res) => {
const filename = req.params.filename;
if (!filename) {
return res.status(400).send('Filename is required');
}
const filePath = path.join(DRAWDB_FILE_DIR, filename);
fs.access(filePath, fs.constants.F_OK, (err) => {
if (err) {
return res.send('File does not exists.');
@ -69,12 +65,26 @@ app.delete('/api/usercode-files/:filename', (req, res) => {
});
})
// Handles any requests that don't match the ones above
app.get('/api/diagrams', (_req, res) => {
const dirPath = DRAWDB_FILE_DIR;
fs.readdir(dirPath, (err, files) => {
if (err) {
return res.status(500).send('Unable to scan directory');
}
const ddbFiles = files.filter(file => path.extname(file) === '.ddb');
const fileContents = ddbFiles.map(file => {
const filePath = path.join(dirPath, file);
const fileContent = fs.readFileSync(filePath, 'utf-8');
return JSON.parse(fileContent);
});
res.json(fileContents);
});
});
app.get('*', (req, res) => {
res.sendFile(path.join(DRAWDB_HOME, 'index.html'));
});
app.listen(DRAWDB_PORT, () => {
console.log(`DrawDB is running on port ${DRAWDB_PORT}`);
});

View File

@ -6,6 +6,7 @@
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"start": "node index.js",
"start:prod": "node server.js",
"build": "webpack"
},
"keywords": [],

File diff suppressed because one or more lines are too long

View File

@ -1,256 +0,0 @@
/*
object-assign
(c) Sindre Sorhus
@license MIT
*/
/*!
* accepts
* Copyright(c) 2014 Jonathan Ong
* Copyright(c) 2015 Douglas Christopher Wilson
* MIT Licensed
*/
/*!
* body-parser
* Copyright(c) 2014 Jonathan Ong
* Copyright(c) 2014-2015 Douglas Christopher Wilson
* MIT Licensed
*/
/*!
* body-parser
* Copyright(c) 2014-2015 Douglas Christopher Wilson
* MIT Licensed
*/
/*!
* bytes
* Copyright(c) 2012-2014 TJ Holowaychuk
* Copyright(c) 2015 Jed Watson
* MIT Licensed
*/
/*!
* content-disposition
* Copyright(c) 2014-2017 Douglas Christopher Wilson
* MIT Licensed
*/
/*!
* content-type
* Copyright(c) 2015 Douglas Christopher Wilson
* MIT Licensed
*/
/*!
* cookie
* Copyright(c) 2012-2014 Roman Shtylman
* Copyright(c) 2015 Douglas Christopher Wilson
* MIT Licensed
*/
/*!
* depd
* Copyright(c) 2014-2018 Douglas Christopher Wilson
* MIT Licensed
*/
/*!
* destroy
* Copyright(c) 2014 Jonathan Ong
* Copyright(c) 2015-2022 Douglas Christopher Wilson
* MIT Licensed
*/
/*!
* ee-first
* Copyright(c) 2014 Jonathan Ong
* MIT Licensed
*/
/*!
* encodeurl
* Copyright(c) 2016 Douglas Christopher Wilson
* MIT Licensed
*/
/*!
* escape-html
* Copyright(c) 2012-2013 TJ Holowaychuk
* Copyright(c) 2015 Andreas Lubbe
* Copyright(c) 2015 Tiancheng "Timothy" Gu
* MIT Licensed
*/
/*!
* etag
* Copyright(c) 2014-2016 Douglas Christopher Wilson
* MIT Licensed
*/
/*!
* express
* Copyright(c) 2009-2013 TJ Holowaychuk
* Copyright(c) 2013 Roman Shtylman
* Copyright(c) 2014-2015 Douglas Christopher Wilson
* MIT Licensed
*/
/*!
* express
* Copyright(c) 2009-2013 TJ Holowaychuk
* Copyright(c) 2014-2015 Douglas Christopher Wilson
* MIT Licensed
*/
/*!
* finalhandler
* Copyright(c) 2014-2022 Douglas Christopher Wilson
* MIT Licensed
*/
/*!
* forwarded
* Copyright(c) 2014-2017 Douglas Christopher Wilson
* MIT Licensed
*/
/*!
* fresh
* Copyright(c) 2012 TJ Holowaychuk
* Copyright(c) 2016-2017 Douglas Christopher Wilson
* MIT Licensed
*/
/*!
* http-errors
* Copyright(c) 2014 Jonathan Ong
* Copyright(c) 2016 Douglas Christopher Wilson
* MIT Licensed
*/
/*!
* media-typer
* Copyright(c) 2014 Douglas Christopher Wilson
* MIT Licensed
*/
/*!
* merge-descriptors
* Copyright(c) 2014 Jonathan Ong
* Copyright(c) 2015 Douglas Christopher Wilson
* MIT Licensed
*/
/*!
* methods
* Copyright(c) 2013-2014 TJ Holowaychuk
* Copyright(c) 2015-2016 Douglas Christopher Wilson
* MIT Licensed
*/
/*!
* mime-db
* Copyright(c) 2014 Jonathan Ong
* Copyright(c) 2015-2022 Douglas Christopher Wilson
* MIT Licensed
*/
/*!
* mime-types
* Copyright(c) 2014 Jonathan Ong
* Copyright(c) 2015 Douglas Christopher Wilson
* MIT Licensed
*/
/*!
* negotiator
* Copyright(c) 2012 Federico Romero
* Copyright(c) 2012-2014 Isaac Z. Schlueter
* Copyright(c) 2015 Douglas Christopher Wilson
* MIT Licensed
*/
/*!
* on-finished
* Copyright(c) 2013 Jonathan Ong
* Copyright(c) 2014 Douglas Christopher Wilson
* MIT Licensed
*/
/*!
* parseurl
* Copyright(c) 2014 Jonathan Ong
* Copyright(c) 2014-2017 Douglas Christopher Wilson
* MIT Licensed
*/
/*!
* proxy-addr
* Copyright(c) 2014-2016 Douglas Christopher Wilson
* MIT Licensed
*/
/*!
* range-parser
* Copyright(c) 2012-2014 TJ Holowaychuk
* Copyright(c) 2015-2016 Douglas Christopher Wilson
* MIT Licensed
*/
/*!
* raw-body
* Copyright(c) 2013-2014 Jonathan Ong
* Copyright(c) 2014-2022 Douglas Christopher Wilson
* MIT Licensed
*/
/*!
* send
* Copyright(c) 2012 TJ Holowaychuk
* Copyright(c) 2014-2022 Douglas Christopher Wilson
* MIT Licensed
*/
/*!
* serve-static
* Copyright(c) 2010 Sencha Inc.
* Copyright(c) 2011 TJ Holowaychuk
* Copyright(c) 2014-2016 Douglas Christopher Wilson
* MIT Licensed
*/
/*!
* statuses
* Copyright(c) 2014 Jonathan Ong
* Copyright(c) 2016 Douglas Christopher Wilson
* MIT Licensed
*/
/*!
* toidentifier
* Copyright(c) 2016 Douglas Christopher Wilson
* MIT Licensed
*/
/*!
* type-is
* Copyright(c) 2014 Jonathan Ong
* Copyright(c) 2014-2015 Douglas Christopher Wilson
* MIT Licensed
*/
/*!
* unpipe
* Copyright(c) 2015 Douglas Christopher Wilson
* MIT Licensed
*/
/*!
* vary
* Copyright(c) 2014-2017 Douglas Christopher Wilson
* MIT Licensed
*/
/*! safe-buffer. MIT License. Feross Aboukhadijeh <https://feross.org/opensource> */

View File

@ -1 +0,0 @@
{"author":"Unnamed","title":"Untitled Diagram","date":"2024-09-20T09:27:33.343Z","tables":[{"id":0,"name":"table_0","x":0,"y":0,"fields":[{"name":"id","type":"INTEGER","default":"","check":"","primary":true,"unique":true,"notNull":true,"increment":true,"comment":"","id":0}],"comment":"","indices":[],"color":"#175e7a","key":1726824435540}],"relationships":[],"notes":[],"subjectAreas":[],"database":"mysql"}

View File

@ -1,7 +1,8 @@
import Dexie from "dexie";
import 'dexie-observable';
import { templateSeeds } from "./seeds";
import { diagramToDrawDbFile } from "../utils/parser"
import { diagramToDdbFile, ddbFileToDiagram, writeDdbFiles, deleteDdbFiles } from "./usercode"
import { ddbDiagramIsValid } from "../utils/validateSchema";
export const db = new Dexie("drawDB");
@ -14,10 +15,27 @@ db.on("populate", (transaction) => {
transaction.templates.bulkAdd(templateSeeds).catch((e) => console.log(e));
});
db.on("ready", async (db) => {
// Use ddb files as source for diagrams
const diagramsRes = await fetch('/api/diagrams', {
method: 'GET',
headers: {
'Accept': 'application/json',
'Content-Type': 'application/json'
},
})
const ddbFiles = await diagramsRes.json();
const validDdbFiles = ddbFiles.filter(ddbFile => ddbDiagramIsValid(ddbFile));
const diagrams = validDdbFiles.map(f => ddbFileToDiagram(f))
return db.transaction('rw', db.diagrams, async () => {
await db.diagrams.clear();
await db.diagrams.bulkAdd(diagrams);
})
})
const debounce = (func, delay) => {
let timer;
return function(...args) {
return function (...args) {
clearTimeout(timer);
timer = setTimeout(() => {
func.apply(this, args);
@ -30,24 +48,30 @@ const debouncedChangesHandler = debounce(async (changes) => {
}, 1500);
const handleDiagramChanges = (diagramChanges) => {
console.log("diagramChanges", diagramChanges);
diagramChanges.forEach(({ type, obj, oldObj }) => {
const ddbFile = diagramToDdbFile(obj);
// Handle create / update / delete separately
switch (type) {
case 1:
writeDdbFiles([ddbFile]);
break;
// Parse changes to ddb file format
const ddbFiles = diagramChanges.map(d => diagramToDrawDbFile(d.obj));
// Write files to usercode
ddbFiles.forEach(ddbFile => {
fetch('/api/usercode-files', {
method: 'POST',
headers: {
'Accept': 'application/json',
'Content-Type': 'application/json'
},
body: JSON.stringify({ filename: `${ddbFile.title}.ddb`, content: ddbFile })
});
});
case 2:
if (obj.id === oldObj.id && obj.name !== oldObj.name) {
const oldDdbFile = diagramToDdbFile(oldObj);
deleteDdbFiles([oldDdbFile]);
}
writeDdbFiles([ddbFile]);
break;
case 3:
deleteDdbFiles([ddbFile]);
break;
default:
break;
}
})
}
db.on('changes', debouncedChangesHandler)

81
src/data/usercode.js Normal file
View File

@ -0,0 +1,81 @@
import { databases } from "./databases";
import { DB } from "./constants";
export function diagramToDdbFile(diagram) {
const {
name,
lastModified,
tables,
references,
notes,
areas,
database,
types,
enums
} = diagram;
let date = lastModified ?? new Date();
if (typeof lastModified === "number" || typeof lastModified === "string") {
date = new Date(lastModified)
}
return {
author: "Unnamed",
title: name,
date: date.toISOString(),
tables: tables,
relationships: references,
notes: notes,
subjectAreas: areas,
database: database,
...(databases[database].hasTypes && { types: types }),
...(databases[database].hasEnums && { enums: enums }),
}
}
export function ddbFileToDiagram(ddb) {
const {
database = DB.GENERIC,
title = "Untitled Diagram",
tables,
date,
relationships,
subjectAreas,
notes,
enums,
types
} = ddb;
return {
database: database,
name: title,
lastModified: date ? new Date(date) : new Date(),
tables: tables,
references: relationships,
notes: notes,
areas: subjectAreas,
...(databases[database].hasEnums && { enums: enums }),
...(databases[database].hasTypes && { types: types }),
};
}
export function writeDdbFiles(ddbFiles) {
const writePromises = ddbFiles.map(ddbFile => {
return fetch('/api/usercode-files', {
method: 'POST',
headers: {
'Accept': 'application/json',
'Content-Type': 'application/json'
},
body: JSON.stringify({ filename: `${ddbFile.title}.ddb`, content: ddbFile })
});
})
return Promise.all(writePromises);
}
export function deleteDdbFiles(ddbFiles) {
const deletePromises = ddbFiles.map(ddbFile => {
return fetch(`/api/usercode-files/${ddbFile.title}.ddb`, { method: 'DELETE' });
});
return Promise.all(deletePromises);
}

View File

@ -1,28 +0,0 @@
import { databases } from "../data/databases";
export function diagramToDrawDbFile(diagram) {
const {
name,
lastModified,
tables,
references,
notes,
areas,
database,
types,
enums
} = diagram;
return {
author: "Unnamed",
title: name,
date: lastModified.toISOString(),
tables: tables,
relationships: references,
notes: notes,
subjectAreas: areas,
database: database,
...(databases[database].hasTypes && { types: types }),
...(databases[database].hasEnums && { enums: enums }),
}
}