retold 4.0.1 → 4.0.3

package/examples/todo-list/server/package.json

@@ -0,0 +1,19 @@
+{
+	"name": "retold-example-todo-server",
+	"version": "1.0.0",
+	"description": "Retold Example: Todo List API Server with SQLite",
+	"main": "server.cjs",
+	"scripts":
+	{
+		"start": "node server.cjs"
+	},
+	"dependencies":
+	{
+		"fable": "^3.1.51",
+		"meadow": "^2.0.18",
+		"meadow-connection-sqlite": "^1.0.11",
+		"meadow-endpoints": "^4.0.7",
+		"orator": "^5.0.2",
+		"orator-serviceserver-restify": "^2.0.5"
+	}
+}

package/examples/todo-list/server/server.cjs

@@ -0,0 +1,138 @@
+/**
+ * Retold Todo List -- API Server
+ *
+ * Demonstrates Fable + Orator + Meadow + MeadowEndpoints + SQLite
+ * working together to serve a full CRUD REST API and static web files.
+ *
+ * The Task table DDL is defined in model/Task.mddl (Stricture MicroDDL),
+ * compiled to model/Task-Compiled.json, and created at startup using the
+ * meadow-connection-sqlite provider's built-in table creation.
+ *
+ * Seed data is loaded from model/data/seeded_todo_events.csv through
+ * the Meadow DAL, so GUIDs, audit stamps and defaults are applied
+ * automatically on first run.
+ *
+ * Run:  node server.cjs
+ * API:  http://localhost:8086/1.0/Task (CRUD endpoints)
+ * Web:  http://localhost:8086/ (static files from ../web-client/dist/)
+ */
+
+const libPath = require('path');
+const libFS = require('fs');
+
+const libFable = require('fable');
+const libOrator = require('orator');
+const libOratorServiceServerRestify = require('orator-serviceserver-restify');
+const libMeadow = require('meadow');
+const libMeadowEndpoints = require('meadow-endpoints');
+const libMeadowConnectionSQLite = require('meadow-connection-sqlite');
+
+const libDatabaseInitializationService = require('./database-initialization-service.cjs');
+
+const _TaskSchema = require('../model/MeadowSchema-Task.json');
+const _CompiledModel = require('../model/Task-Compiled.json');
+
+let tmpDataDir = libPath.resolve(__dirname, 'data');
+let tmpSeedCSV = libPath.resolve(__dirname, '..', 'model', 'data', 'seeded_todo_events.csv');
+
+let _Settings =
+{
+	Product: 'TodoList-Server',
+	ProductVersion: '1.0.0',
+	APIServerPort: 8086,
+	SQLite:
+	{
+		SQLiteFilePath: libPath.resolve(tmpDataDir, 'todo.sqlite')
+	},
+	MeadowEndpointsSessionDataSource: 'None'
+};
+
+let _Fable = new libFable(_Settings);
+
+// Register service types
+_Fable.serviceManager.addServiceType('OratorServiceServer', libOratorServiceServerRestify);
+_Fable.serviceManager.addServiceType('MeadowSQLiteProvider', libMeadowConnectionSQLite);
+_Fable.serviceManager.addServiceType('DatabaseInitializationService', libDatabaseInitializationService);
+
+// Instantiate the SQLite provider and our database initialization service
+_Fable.serviceManager.instantiateServiceProvider('MeadowSQLiteProvider');
+let _DatabaseService = _Fable.serviceManager.instantiateServiceProvider('DatabaseInitializationService', { DataDirectory: tmpDataDir });
+
+_DatabaseService.connectDatabase(
+	(pError) =>
+	{
+		if (pError)
+		{
+			return process.exit(1);
+		}
+
+		// Create tables from the compiled Stricture DDL using the provider's built-in table creation
+		_DatabaseService.createTablesFromModel(_CompiledModel,
+			(pCreateError) =>
+			{
+				if (pCreateError)
+				{
+					_Fable.log.error('Table creation error: ' + pCreateError.message);
+					return process.exit(1);
+				}
+
+				// Create the Meadow DAL for the Task entity
+				let _TaskDAL = libMeadow.new(_Fable, 'Task')
+					.setProvider('SQLite')
+					.setSchema(_TaskSchema.Schema)
+					.setJsonSchema(_TaskSchema.JsonSchema)
+					.setDefaultIdentifier(_TaskSchema.DefaultIdentifier)
+					.setDefault(_TaskSchema.DefaultObject);
+
+				// Seed from CSV through the Meadow DAL (skips if table already has data)
+				_DatabaseService.seedFromCSV(_TaskDAL, tmpSeedCSV,
+					(pSeedError) =>
+					{
+						if (pSeedError)
+						{
+							_Fable.log.error('Seed error: ' + pSeedError.message);
+						}
+
+						_startServer(_TaskDAL);
+					});
+			});
+	});
+
+function _startServer(pTaskDAL)
+{
+	// Create meadow endpoints (auto-generates REST routes)
+	let _TaskEndpoints = libMeadowEndpoints.new(pTaskDAL);
+
+	// Initialize Orator and wire up routes
+	let _Orator = new libOrator(_Fable, {});
+	_Orator.initialize(
+		() =>
+		{
+			// Connect the auto-generated CRUD endpoints
+			_TaskEndpoints.connectRoutes(_Orator.serviceServer);
+
+			// Serve static files from the web client dist folder
+			let tmpDistPath = libPath.resolve(__dirname, '..', 'web-client', 'dist');
+			if (libFS.existsSync(tmpDistPath))
+			{
+				_Orator.addStaticRoute(tmpDistPath + '/', 'index.html');
+			}
+			else
+			{
+				_Fable.log.warn('Web client dist/ not found. Build it with: cd ../web-client && npm run build');
+			}
+
+			// Start the server
+			_Orator.startService(
+				(pStartError) =>
+				{
+					if (pStartError)
+					{
+						_Fable.log.error('Server start error: ' + pStartError.message);
+						return process.exit(1);
+					}
+					_Fable.log.info('Todo List server running on http://localhost:' + _Settings.APIServerPort);
+					_Fable.log.info('API endpoints at /1.0/Task (CRUD)');
+				});
+		});
+}

package/examples/todo-list/web-client/css/todolist-theme.css

@@ -0,0 +1,235 @@
+/*
+ * Todo List — Sagebrush Theme
+ *
+ * Common base styles shared across all views.
+ * Loaded via <link> in index.html so views only need
+ * view-specific CSS in their configuration objects.
+ *
+ * Palette:
+ *   Dark brown   #3D3229   (headers, labels)
+ *   Warm cream   #E8E0D4   (header text)
+ *   Body bg      #F5F0E8   (light cream)
+ *   Body text    #423D37   (dark warm brown)
+ *   Teal         #2E7D74   (primary, success, focus)
+ *   Rust         #9E6B47   (danger, open/pending)
+ *   Warm gray    #8A7F72   (default, muted)
+ *   Taupe border #DDD6CA   (borders, dividers)
+ *   Hover bg     #EAE3D8   (pale tan)
+ *   Today bg     #E0EDEB   (light teal)
+ */
+
+/* ── Reset & Base ─────────────────────────────────────── */
+
+* { box-sizing: border-box; }
+
+body {
+	margin: 0;
+	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
+	background: #F5F0E8;
+	color: #423D37;
+}
+
+#TodoList-Content {
+	max-width: 900px;
+	margin: 2em auto;
+	padding: 0 1em;
+}
+
+/* ── Typography ───────────────────────────────────────── */
+
+.tl-heading {
+	margin: 0 0 1em 0;
+	font-size: 1.5em;
+	font-weight: 600;
+}
+
+.tl-empty {
+	text-align: center;
+	padding: 3em 1em;
+	color: #8A7F72;
+}
+
+/* ── Buttons ──────────────────────────────────────────── */
+
+.tl-btn {
+	display: inline-block;
+	padding: 0.45em 1em;
+	border: none;
+	border-radius: 4px;
+	cursor: pointer;
+	font-size: 0.9em;
+	font-family: inherit;
+	transition: opacity 0.15s;
+}
+.tl-btn:hover { opacity: 0.85; }
+.tl-btn-primary { background: #2E7D74; color: #fff; }
+.tl-btn-danger  { background: #9E6B47; color: #fff; }
+.tl-btn-success { background: #2E7D74; color: #fff; }
+.tl-btn-default { background: #8A7F72; color: #fff; }
+
+/* ── Data Table ───────────────────────────────────────── */
+
+.tl-table {
+	width: 100%;
+	border-collapse: collapse;
+	background: #fff;
+	border-radius: 6px;
+	overflow: hidden;
+	box-shadow: 0 1px 3px rgba(0,0,0,0.08);
+}
+.tl-table th {
+	background: #3D3229;
+	color: #E8E0D4;
+	text-align: left;
+	padding: 0.75em 1em;
+	font-weight: 600;
+	font-size: 0.9em;
+}
+.tl-table td {
+	padding: 0.65em 1em;
+	border-bottom: 1px solid #DDD6CA;
+	font-size: 0.95em;
+}
+.tl-table tr:last-child td { border-bottom: none; }
+.tl-table tr:hover td { background: #EAE3D8; }
+
+/* ── Status Badges ────────────────────────────────────── */
+
+.tl-status {
+	display: inline-block;
+	padding: 0.2em 0.6em;
+	border-radius: 12px;
+	font-size: 0.8em;
+	font-weight: 600;
+}
+.tl-status-pending    { background: #F0ECE4; color: #9E6B47; }
+.tl-status-inprogress { background: #D6EAE7; color: #2E7D74; }
+.tl-status-complete   { background: #E0EDEB; color: #2E7D74; }
+
+/* ── Toolbar (Search / Sort / Record Count) ───────────── */
+
+.tl-toolbar {
+	display: flex;
+	align-items: center;
+	justify-content: space-between;
+	margin-bottom: 1em;
+	padding: 0.75em 1em;
+	background: #fff;
+	border-radius: 6px;
+	box-shadow: 0 1px 3px rgba(0,0,0,0.08);
+}
+.tl-toolbar-group { display: flex; align-items: center; gap: 0.5em; }
+.tl-toolbar-label { font-size: 0.85em; font-weight: 600; color: #8A7F72; }
+.tl-toolbar select {
+	padding: 0.35em 0.6em;
+	border: 1px solid #DDD6CA;
+	border-radius: 4px;
+	font-size: 0.85em;
+	font-family: inherit;
+	background: #fff;
+	cursor: pointer;
+}
+.tl-toolbar select:focus { outline: none; border-color: #2E7D74; }
+.tl-toolbar input[type="text"] {
+	padding: 0.35em 0.6em;
+	border: 1px solid #DDD6CA;
+	border-radius: 4px;
+	font-size: 0.85em;
+	font-family: inherit;
+	width: 14em;
+}
+.tl-toolbar input[type="text"]:focus { outline: none; border-color: #2E7D74; }
+.tl-record-count { font-size: 0.85em; color: #8A7F72; }
+
+/* ── Forms ────────────────────────────────────────────── */
+
+.tl-form {
+	background: #fff;
+	padding: 1.5em;
+	border-radius: 6px;
+	box-shadow: 0 1px 3px rgba(0,0,0,0.08);
+}
+.tl-form-group { margin-bottom: 1.25em; }
+.tl-form-group label {
+	display: block;
+	font-weight: 600;
+	margin-bottom: 0.35em;
+	font-size: 0.9em;
+	color: #3D3229;
+}
+.tl-form-group input,
+.tl-form-group textarea,
+.tl-form-group select {
+	width: 100%;
+	padding: 0.5em 0.75em;
+	border: 1px solid #DDD6CA;
+	border-radius: 4px;
+	font-size: 0.95em;
+	font-family: inherit;
+}
+.tl-form-group textarea { resize: vertical; }
+.tl-form-group input:focus,
+.tl-form-group textarea:focus,
+.tl-form-group select:focus {
+	outline: none;
+	border-color: #2E7D74;
+	box-shadow: 0 0 0 2px rgba(46,125,116,0.15);
+}
+.tl-form-actions { display: flex; gap: 0.75em; margin-top: 1.5em; }
+
+/* ── Calendar Shared ──────────────────────────────────── */
+
+.tl-cal-header {
+	display: flex;
+	align-items: center;
+	justify-content: space-between;
+	margin-bottom: 1em;
+}
+.tl-cal-header h2 { margin: 0; font-size: 1.5em; font-weight: 600; }
+.tl-cal-nav { display: flex; align-items: center; gap: 0.5em; }
+.tl-cal-nav .tl-btn { font-size: 0.85em; padding: 0.35em 0.75em; }
+.tl-cal-label {
+	font-size: 1.1em;
+	font-weight: 600;
+	min-width: 14em;
+	text-align: center;
+}
+
+.tl-cal-table {
+	width: 100%;
+	border-collapse: collapse;
+	background: #fff;
+	border-radius: 6px;
+	overflow: hidden;
+	box-shadow: 0 1px 3px rgba(0,0,0,0.08);
+}
+.tl-cal-table th {
+	background: #3D3229;
+	color: #E8E0D4;
+	text-align: left;
+	padding: 0.75em 1em;
+	font-weight: 600;
+	font-size: 0.9em;
+}
+.tl-cal-table td {
+	padding: 0.65em 1em;
+	border-bottom: 1px solid #DDD6CA;
+	font-size: 0.95em;
+}
+.tl-cal-table tr:last-child td { border-bottom: none; }
+.tl-cal-table tr:hover td { background: #EAE3D8; }
+.tl-cal-today td { background: #E0EDEB; }
+
+.tl-cal-badge {
+	display: inline-block;
+	min-width: 1.6em;
+	text-align: center;
+	padding: 0.15em 0.45em;
+	border-radius: 12px;
+	font-size: 0.85em;
+	font-weight: 600;
+}
+.tl-cal-badge-complete { background: #E0EDEB; color: #2E7D74; }
+.tl-cal-badge-open     { background: #F0ECE4; color: #9E6B47; }
+.tl-cal-badge-zero     { background: #EAE3D8; color: #8A7F72; }
+.tl-cal-total { font-weight: 600; background: #EAE3D8; }

package/examples/todo-list/web-client/generate-build-config.cjs

@@ -0,0 +1,18 @@
+// Generates .gulpfile-quackage-config.json with absolute paths for the current environment
+const libPath = require('path');
+const libFS = require('fs');
+
+const tmpConfig =
+	{
+		EntrypointInputSourceFile: libPath.resolve(__dirname, 'source/TodoList-Application.cjs'),
+		LibraryObjectName: 'TodoListApp',
+		LibraryOutputFolder: libPath.resolve(__dirname, 'dist') + '/',
+		LibraryUniminifiedFileName: 'todo-list-app.compatible.js',
+		LibraryMinifiedFileName: 'todo-list-app.compatible.min.js'
+	};
+
+libFS.writeFileSync(
+	libPath.resolve(__dirname, '.gulpfile-quackage-config.json'),
+	JSON.stringify(tmpConfig, null, '\t'));
+
+console.log('Build config generated.');

package/examples/todo-list/web-client/html/index.html

@@ -0,0 +1,18 @@
+<!doctype html>
+<html lang="en">
+	<head>
+		<meta charset="utf-8">
+		<meta name="viewport" content="width=device-width, initial-scale=1">
+		<title>Retold Todo List</title>
+		<link rel="stylesheet" href="./css/todolist-theme.css">
+		<style id="PICT-CSS"></style>
+		<script src="./js/pict.min.js" type="text/javascript"></script>
+		<script type="text/javascript">
+			Pict.safeOnDocumentReady(function() { Pict.safeLoadPictApplication(RetoldExampleTodoWebClient, 2); });
+		</script>
+	</head>
+	<body>
+		<div id="TodoList-Container"></div>
+		<script src="./retold-example-todo-web-client.compatible.min.js" type="text/javascript"></script>
+	</body>
+</html>