dazscript-framework 0.3.2 → 1.0.1

package/package.json

@@ -1,17 +1,19 @@
 {
   "name": "dazscript-framework",
-  "version": "0.3.2",
+  "version": "1.0.1",
   "author": "Freddy Diaz",
   "license": "MPL-2.0",
   "description": "",
   "scripts": {
     "prepare": "node ./scripts/install-git-hooks.js",
-    "prebuild": "node ./dist/scripts/cli.js installer --scripts-path ./src/samples --menu-path /DazScriptFramework",
+    "prebuild": "node ./dist/scripts/cli.js installer --scripts-path ./src/examples --menu-path /DazScriptFramework",
     "build": "node ./dist/scripts/cli.js build --out-dir ./out",
     "postbuild": "node ./dist/scripts/cli.js icons --out-dir ./out",
     "watch": "node ./dist/scripts/cli.js watch --out-dir ./out",
     "icons": "node ./dist/scripts/cli.js icons --out-dir ./out",
-    "installer": "node ./dist/scripts/cli.js installer --scripts-path ./src/samples --menu-path /DazScriptFramework"
+    "installer": "node ./dist/scripts/cli.js installer --scripts-path ./src/examples --menu-path /DazScriptFramework",
+    "test": "vitest run",
+    "test:watch": "vitest"
   },
   "bin": {
     "dazscript": "./dist/scripts/cli.js"
@@ -69,6 +71,7 @@
     "@types/node": "^22.10.5",
     "dazscript-types": "^1.0.1",
     "eslint": "^9.17.0",
-    "typescript": "^5.7.3"
+    "typescript": "^5.7.3",
+    "vitest": "^3.0.0"
   }
 }

package/src/Setup.dsa.ts

@@ -4,16 +4,44 @@ import { showSetupCustomActionsDialog as setup } from '@dsf/helpers/custom-actio
 setup([
     {
         "name": null,
-        "text": "Hello World",
-        "filePath": "samples/hello-world.dsa",
-        "menuPath": "/DazScriptFramework/samples",
-        "description": "hello-world"
+        "text": "01 Hello World",
+        "filePath": "examples/01-hello-world.dsa",
+        "menuPath": "/DazScriptFramework/examples",
+        "description": "01-hello-world"
     },
     {
         "name": null,
-        "text": "Sample Dialog",
-        "filePath": "samples/sample-dialog.dsa",
-        "menuPath": "/DazScriptFramework/samples",
-        "description": "sample-dialog"
+        "text": "02 Persistence Dialog",
+        "filePath": "examples/02-persistence-dialog.dsa",
+        "menuPath": "/DazScriptFramework/examples",
+        "description": "02-persistence-dialog"
+    },
+    {
+        "name": null,
+        "text": "03 Simple Dialog",
+        "filePath": "examples/03-simple-dialog.dsa",
+        "menuPath": "/DazScriptFramework/examples",
+        "description": "03-simple-dialog"
+    },
+    {
+        "name": null,
+        "text": "04 Settings Dialog",
+        "filePath": "examples/04-settings-dialog.dsa",
+        "menuPath": "/DazScriptFramework/examples",
+        "description": "04-settings-dialog"
+    },
+    {
+        "name": null,
+        "text": "05 List Dialog",
+        "filePath": "examples/05-list-dialog.dsa",
+        "menuPath": "/DazScriptFramework/examples",
+        "description": "05-list-dialog"
+    },
+    {
+        "name": null,
+        "text": "06 Showcase Dialog",
+        "filePath": "examples/06-showcase-dialog.dsa",
+        "menuPath": "/DazScriptFramework/examples",
+        "description": "06-showcase-dialog"
     }
-], {"settingsPath":"DazScriptFramework/samples/Installer","bundleName":"Samples"});
+], {"settingsPath":"DazScriptFramework/examples/Installer","bundleName":"Examples"});

package/src/dialog/builders/list-view-builder.ts

@@ -193,6 +193,11 @@ class ListViewBindBuilder<TItem, TData> {
         return this
     }
 
+    contextMenu(fn: (listView: DzListView, item: DzListViewItem, pos: Point) => DzPopupMenu): this {
+        this.context.contextMenu = fn
+        return this
+    }
+
     build(then?: (listView: DzListView) => void): DzListView {
         let listView = build(this.context)
         then?.(listView)

package/src/examples/01-hello-world.dsa.ts

@@ -0,0 +1,8 @@
+import { debug } from '@dsf/common/log'
+import { action } from '@dsf/core/action'
+import { info } from '@dsf/helpers/message-box-helper'
+
+action({ text: '01 Hello World' }, () => {
+    debug('Hello World!')
+    info('Hello World!')
+})

package/src/examples/02-persistence-dialog.dsa.ts

@@ -0,0 +1,21 @@
+import { debug } from '@dsf/common/log'
+import { action } from '@dsf/core/action'
+import { PersistenceDialog, PersistenceDialogModel } from './02-persistence-dialog'
+
+action({ text: '02 Persistence Dialog' }, () => {
+    let model = new PersistenceDialogModel()
+    let dialog = new PersistenceDialog(model)
+
+    if (!dialog.run()) {
+        debug('Persistence dialog cancelled')
+        return
+    }
+
+    const lines = [
+        `DzAppSettings checkbox : ${model.registryEnabled$.value}`,
+        `App data JSON checkbox : ${model.fileEnabled$.value}`,
+        `App data JSON file     : ${model.filePath}`,
+    ]
+
+    debug(lines.join('\n'))
+})

package/src/examples/02-persistence-dialog.ts

@@ -0,0 +1,68 @@
+import { BasicDialog } from '@dsf/dialog/basic-dialog'
+import { readFromFile, saveToFile } from '@dsf/helpers/file-helper'
+import { AppSettings } from '@dsf/lib/settings'
+import { Observable } from '@dsf/lib/observable'
+import { config } from './config'
+
+type FilePersistenceState = {
+    enabled: boolean
+}
+
+export class PersistenceSettings extends AppSettings {
+    constructor() {
+        super(`${config.author}/02-PersistenceDialog`)
+    }
+
+    registryEnabled$ = this.bindBoolean('registryEnabled$', false)
+}
+
+export class PersistenceDialogModel {
+    readonly settings = new PersistenceSettings()
+    readonly registryEnabled$ = this.settings.registryEnabled$
+    readonly filePath = `${this.settings.appDataPath}/persistence-dialog.json`
+    readonly fileEnabled$ = new Observable(this.readFileState().enabled, () => this.writeFileState())
+
+    private readFileState(): FilePersistenceState {
+        return readFromFile<FilePersistenceState>(this.filePath) ?? { enabled: false }
+    }
+
+    private writeFileState(): void {
+        saveToFile(this.filePath, JSON.stringify({ enabled: this.fileEnabled$.value }, null, 2))
+    }
+}
+
+export class PersistenceDialog extends BasicDialog {
+    constructor(private readonly model: PersistenceDialogModel) {
+        super('02 Persistence Dialog')
+    }
+
+    protected build(): void {
+        let add = this.add
+        let model = this.model
+
+        this.builder.options({ resizable: true, width: 620, height: 360 })
+        this.dialog.setAcceptButtonText('Close')
+
+        add.label([
+            'Toggle either checkbox, close this dialog, then run the example again.',
+            'The checkbox values should reopen with the last saved state.',
+        ].join('\n')).wordWrap().build()
+
+        add.group('DzAppSettings').build(() => {
+            add.label([
+                'Persists through DAZ Studio DzAppSettings.',
+                'On Windows this uses the registry-backed application settings store.',
+                'On macOS this uses the platform preferences store.',
+            ].join('\n')).wordWrap().build()
+            add.checkbox('Stored in DzAppSettings').value(model.registryEnabled$)
+        })
+
+        add.group('App Data JSON File').build(() => {
+            add.label([
+                'Persists to a JSON file under DAZ Studio app data.',
+                `File: ${model.filePath}`,
+            ].join('\n')).wordWrap().build()
+            add.checkbox('Stored in app data JSON').value(model.fileEnabled$)
+        })
+    }
+}

package/src/examples/03-simple-dialog.dsa.ts

@@ -0,0 +1,23 @@
+import { debug } from '@dsf/common/log'
+import { action } from '@dsf/core/action'
+import { info } from '@dsf/helpers/message-box-helper'
+import { SimpleDialog, SimpleDialogModel } from './03-simple-dialog'
+
+action({ text: '03 Simple Dialog' }, () => {
+    let model  = new SimpleDialogModel()
+    let dialog = new SimpleDialog(model)
+
+    if (!dialog.run()) {
+        debug('Dialog cancelled')
+        return
+    }
+
+    const lines = [
+        `Name    : ${model.name$.value}`,
+        `Enabled : ${model.enabled$.value}`,
+        `Notes   : ${model.notes$.value || '(none)'}`,
+    ]
+
+    debug(lines.join('\n'))
+    info(lines.join('\n'))
+})

package/src/examples/03-simple-dialog.ts

@@ -0,0 +1,47 @@
+import { BasicDialog } from '@dsf/dialog/basic-dialog'
+import { Observable } from '@dsf/lib/observable'
+
+// Model
+
+export class SimpleDialogModel {
+    name$    = new Observable('My Object')
+    enabled$ = new Observable(true)
+    notes$   = new Observable('')
+}
+
+// Dialog
+
+export class SimpleDialog extends BasicDialog {
+    constructor(private readonly model: SimpleDialogModel) {
+        super('03 Simple Dialog')
+    }
+
+    protected build(): void {
+        let add   = this.add
+        let model = this.model
+
+        this.builder.options({ resizable: true, width: 420, height: 240 })
+
+        add.group('Object').build(() => {
+            add.horizontal((layout) => {
+                layout.spacing = 5
+                add.label('Name:').minWidth(45)
+                add.edit().value(model.name$).placeholder('Enter a name...')
+            })
+
+            add.horizontal((layout) => {
+                layout.spacing = 5
+                add.label('Notes:').minWidth(45)
+                add.edit().value(model.notes$).placeholder('Optional notes...')
+            })
+
+            add.checkbox('Enabled').value(model.enabled$)
+        })
+
+        add.button('Reset').clicked(() => {
+            model.name$.value    = 'My Object'
+            model.enabled$.value = true
+            model.notes$.value   = ''
+        })
+    }
+}

package/src/examples/04-settings-dialog.dsa.ts

@@ -0,0 +1,29 @@
+import { debug } from '@dsf/common/log'
+import { action } from '@dsf/core/action'
+import { info } from '@dsf/helpers/message-box-helper'
+import { RenderSettings, SettingsDialog } from './04-settings-dialog'
+
+action({ text: '04 Settings Dialog' }, () => {
+    // Settings are loaded from DzAppSettings on construction and
+    // auto-saved on every change - values persist between script runs.
+    let settings = new RenderSettings()
+    let dialog   = new SettingsDialog(settings)
+
+    if (!dialog.run()) {
+        debug('Settings cancelled')
+        return
+    }
+
+    const lines = [
+        `Quality    : ${settings.quality$.value}`,
+        `Samples    : ${settings.samples$.value}`,
+        `Scale      : ${settings.scale$.value}`,
+        `Output     : ${settings.outputPath$.value || '(default)'}`,
+        `Format     : ${settings.format$.value}`,
+        `Use GPU    : ${settings.useGpu$.value}`,
+        `Verbose    : ${settings.verbose$.value}`,
+    ]
+
+    debug(lines.join('\n'))
+    info(lines.join('\n'))
+})

package/src/examples/04-settings-dialog.ts

@@ -0,0 +1,83 @@
+import { BasicDialog } from '@dsf/dialog/basic-dialog'
+import { AppSettings } from '@dsf/lib/settings'
+import { config } from './config'
+
+// Settings (persisted across runs via DzAppSettings)
+
+export class RenderSettings extends AppSettings {
+    constructor() {
+        super(`${config.author}/04-SettingsDialog`)
+    }
+
+    quality$       = this.bindString('quality$', 'Medium')
+    samples$       = this.bindInt('samples$', 64)
+    scale$         = this.bindFloat('scale$', 1.0)
+    outputPath$    = this.bindString('outputPath$', '')
+    useGpu$        = this.bindBoolean('useGpu$', true)
+    verbose$       = this.bindBoolean('verbose$', false)
+    format$        = this.bindString('format$', 'PNG')
+}
+
+// Dialog
+
+export class SettingsDialog extends BasicDialog {
+    constructor(private readonly settings: RenderSettings) {
+        super('04 Settings Dialog')
+    }
+
+    protected build(): void {
+        let add      = this.add
+        let settings = this.settings
+
+        this.builder.options({ resizable: true, width: 520, height: 420 })
+
+        add.group('Render').build(() => {
+            add.horizontal((layout) => {
+                layout.spacing = 5
+                add.label('Quality:').minWidth(60)
+                add.combo()
+                    .items(['Low', 'Medium', 'High', 'Ultra'])
+                    .selected(settings.quality$)
+            })
+
+            add.horizontal((layout) => {
+                layout.spacing = 5
+                add.label('Samples:').minWidth(60)
+                add.slider('integer').value(settings.samples$).min(1).max(512).build()
+            })
+
+            add.horizontal((layout) => {
+                layout.spacing = 5
+                add.label('Scale:').minWidth(60)
+                add.slider('float').value(settings.scale$).min(0.1).max(10.0).build()
+            })
+        })
+
+        add.group('Output').build(() => {
+            add.horizontal((layout) => {
+                layout.spacing = 5
+                add.label('Path:').minWidth(60)
+                add.edit()
+                    .value(settings.outputPath$)
+                    .placeholder('Leave empty for default output path...')
+            })
+
+            add.group('Format').horizontal().style({ flat: true }).build(() => {
+                add.radio('PNG')
+                    .value(settings.format$.value === 'PNG')
+                    .toggled(v => { if (v) settings.format$.value = 'PNG' })
+                add.radio('JPEG')
+                    .value(settings.format$.value === 'JPEG')
+                    .toggled(v => { if (v) settings.format$.value = 'JPEG' })
+                add.radio('EXR')
+                    .value(settings.format$.value === 'EXR')
+                    .toggled(v => { if (v) settings.format$.value = 'EXR' })
+            })
+        })
+
+        add.group('Options').horizontal().build(() => {
+            add.checkbox('Use GPU').value(settings.useGpu$)
+            add.checkbox('Verbose').value(settings.verbose$)
+        })
+    }
+}

package/src/examples/05-list-dialog.dsa.ts

@@ -0,0 +1,53 @@
+import { debug } from '@dsf/common/log'
+import { action } from '@dsf/core/action'
+import { info } from '@dsf/helpers/message-box-helper'
+import { TreeNode } from '@dsf/lib/tree-node'
+import { FileItem, ListDialog, ListDialogModel } from './05-list-dialog'
+
+// Sample data
+
+function buildFileTree(): TreeNode<FileItem>[] {
+    const folder = (name: string, children: TreeNode<FileItem>[] = []) =>
+        new TreeNode<FileItem>(name, name, { name, type: 'folder', size: 0 }, children)
+
+    const file = (name: string, size: number) =>
+        new TreeNode<FileItem>(name, name, { name, type: 'file', size })
+
+    return [
+        folder('Characters', [
+            file('Victoria.duf',  1_200_000),
+            file('Michael.duf',   980_000),
+        ]),
+        folder('Props', [
+            file('Chair.obj',     45_000),
+            file('Table.obj',     62_000),
+            folder('Lights', [
+                file('Studio.duf', 12_000),
+            ]),
+        ]),
+        file('Scene.duf', 3_400_000),
+    ]
+}
+
+// Action
+
+action({ text: '05 List Dialog' }, () => {
+    let model  = new ListDialogModel()
+    model.files$.value       = buildFileTree()
+    model.recentFiles$.value = ['Victoria.duf', 'Chair.obj', 'Scene.duf']
+
+    let dialog = new ListDialog(model)
+
+    if (!dialog.run()) {
+        debug('List dialog cancelled')
+        return
+    }
+
+    let sel = model.selected$.value
+    const lines = sel
+        ? [`Selected : ${sel.name}`, `Type     : ${sel.type}`, `Size     : ${sel.size} bytes`]
+        : ['No item selected']
+
+    debug(lines.join('\n'))
+    info(lines.join('\n'))
+})

package/src/examples/05-list-dialog.ts

@@ -0,0 +1,88 @@
+import { BasicDialog } from '@dsf/dialog/basic-dialog'
+import { PopupMenuItem } from '@dsf/dialog/builders/popup-menu-builder'
+import { getDataItem } from '@dsf/helpers/list-view-helper'
+import { Observable } from '@dsf/lib/observable'
+import { TreeNode } from '@dsf/lib/tree-node'
+
+// Types
+
+export interface FileItem {
+    name: string
+    type: 'folder' | 'file'
+    size: number
+}
+
+// Model
+
+export class ListDialogModel {
+    keywords$     = new Observable('')
+    files$        = new Observable<TreeNode<FileItem>[]>([])
+    selected$     = new Observable<FileItem>()
+    recentFiles$  = new Observable<string[]>([])
+    selectedRecent$ = new Observable<string[]>([])
+}
+
+// Dialog
+
+export class ListDialog extends BasicDialog {
+    constructor(private readonly model: ListDialogModel) {
+        super('05 List View')
+    }
+
+    protected build(): void {
+        let add   = this.add
+        let model = this.model
+
+        this.builder.options({ resizable: true, width: 640, height: 520 })
+
+        // Search bar
+        add.horizontal((layout) => {
+            layout.spacing = 5
+            add.label('Search:').minWidth(50)
+            add.edit()
+                .value(model.keywords$)
+                .placeholder('Filter files...')
+                .focus()
+        })
+
+        // Tree list with context menu and keyword filter
+        add.list.view<FileItem>()
+            .expanded(true)
+            .items(model.files$)
+            .columns(['Name', 'Type', 'Size (KB)'])
+            .text(item => [
+                item.name,
+                item.value?.type ?? '',
+                item.value ? String(Math.round(item.value.size / 1024)) : '',
+            ])
+            .data(item => item.value)
+            .selected(model.selected$)
+            .filter({
+                keywords: model.keywords$,
+                field: li => li.text(0),
+                selectOnFilter: true,
+            })
+            .contextMenu((_, li) => {
+                let file  = getDataItem<FileItem>(li)
+                let label = file?.name ?? 'item'
+                let items: PopupMenuItem[] = [
+                    { text: `Open "${label}"`,  activated: () => { /* open */ } },
+                    { text: `Rename "${label}"`, activated: () => { /* rename */ } },
+                    { text: '' },
+                    { text: 'Copy Path', activated: () => { /* copy to clipboard */ } },
+                    { text: 'Delete',    activated: () => { /* delete */ } },
+                ]
+                return add.contextMenu().items(...items).build()
+            })
+            .build()
+
+        // Simple list box for recently opened files
+        add.group('Recent Files').build(() => {
+            add.list.box()
+                .items(model.recentFiles$)
+                .mode('extended')
+                .selected(model.selectedRecent$)
+                .build()
+        })
+    }
+}

package/src/examples/06-showcase-dialog.dsa.ts

@@ -0,0 +1,87 @@
+import { debug } from '@dsf/common/log'
+import { action } from '@dsf/core/action'
+import { info } from '@dsf/helpers/message-box-helper'
+import { TreeNode } from '@dsf/lib/tree-node'
+import { SceneObject, ShowcaseDialog, ShowcaseDialogModel } from './06-showcase-dialog'
+
+// Sample data
+
+function buildSceneTree(): TreeNode<SceneObject>[] {
+    let id = 0
+    const next = () => ++id
+
+    const group = (name: string, children: TreeNode<SceneObject>[] = []) =>
+        new TreeNode<SceneObject>(
+            name, name,
+            { id: next(), name, type: 'Group', visible: true, locked: false },
+            children,
+        )
+
+    const obj = (name: string, type: SceneObject['type'], visible = true, locked = false) =>
+        new TreeNode<SceneObject>(name, name, { id: next(), name, type, visible, locked })
+
+    return [
+        group('Characters', [
+            obj('Victoria 9',   'Figure'),
+            obj('Michael 9',    'Figure', true, true),
+            obj('Genesis 9',    'Figure', false),
+        ]),
+        group('Environment', [
+            obj('Studio Floor', 'Prop'),
+            obj('Background',   'Prop', false),
+            group('Lights', [
+                obj('Key Light',  'Light'),
+                obj('Fill Light', 'Light', false),
+                obj('Rim Light',  'Light'),
+            ]),
+        ]),
+        obj('Camera 1', 'Camera'),
+        obj('Camera 2', 'Camera', false),
+    ]
+}
+
+// Action
+
+action({ text: '06 Showcase Dialog' }, () => {
+    let model  = new ShowcaseDialogModel()
+    let dialog = new ShowcaseDialog(model)
+
+    model.objects$.value = buildSceneTree()
+
+    model.logEntries$.value = [
+        '[Info]  Script started',
+        '[Info]  Scene loaded - 4 root nodes',
+        '[Debug] Settings restored from DzAppSettings',
+    ]
+
+    // Keep the detail panel in sync with the selected object.
+    model.selectedObject$.connect(obj => {
+        model.detailName$.value    = obj?.name    ?? ''
+        model.detailType$.value    = obj?.type    ?? ''
+        model.detailVisible$.value = obj?.visible ?? false
+        model.detailLocked$.value  = obj?.locked  ?? false
+    })
+
+    if (!dialog.run()) {
+        debug('Showcase dialog cancelled')
+        return
+    }
+
+    let sel      = model.selectedObject$.value
+    let settings = model.settings
+    const lines  = sel
+        ? [
+            `Selected : ${sel.name}`,
+            `Type     : ${sel.type}`,
+            `Visible  : ${sel.visible}`,
+            `Locked   : ${sel.locked}`,
+            ``,
+            `Quality  : ${settings.quality$.value}`,
+            `Samples  : ${settings.samples$.value}`,
+            `Format   : ${settings.exportFormat$.value}`,
+        ]
+        : ['No object selected']
+
+    debug(lines.join('\n'))
+    info(lines.join('\n'))
+})