From 6d23fa0d7903804a7f3fbbe8e9139d14bbc5b9ee Mon Sep 17 00:00:00 2001 From: DigitalBox98 Date: Tue, 6 Jun 2023 00:27:17 +0200 Subject: [PATCH] Attempt to create a custom widget under DSM --- spk/simpleextjswidget/Makefile | 35 +++++ spk/simpleextjswidget/PLIST | 1 + .../WIZARD_UIFILES/install_uifile | 10 ++ spk/simpleextjswidget/src/app/config | 13 ++ .../src/app/simpleextjswidget.js | 133 ++++++++++++++++++ .../src/app/texts/enu/strings | 5 + .../src/app/texts/fre/strings | 5 + spk/simpleextjswidget/src/conf/resource | 2 + .../src/simpleextjswidget.png | Bin 0 -> 3157 bytes 9 files changed, 204 insertions(+) create mode 100644 spk/simpleextjswidget/Makefile create mode 100644 spk/simpleextjswidget/PLIST create mode 100644 spk/simpleextjswidget/WIZARD_UIFILES/install_uifile create mode 100644 spk/simpleextjswidget/src/app/config create mode 100644 spk/simpleextjswidget/src/app/simpleextjswidget.js create mode 100644 spk/simpleextjswidget/src/app/texts/enu/strings create mode 100644 spk/simpleextjswidget/src/app/texts/fre/strings create mode 100644 spk/simpleextjswidget/src/conf/resource create mode 100644 spk/simpleextjswidget/src/simpleextjswidget.png diff --git a/spk/simpleextjswidget/Makefile b/spk/simpleextjswidget/Makefile new file mode 100644 index 00000000000..308e7974003 --- /dev/null +++ b/spk/simpleextjswidget/Makefile @@ -0,0 +1,35 @@ +SPK_NAME = simpleextjswidget +SPK_VERS = 0.1 +SPK_REV = 1 +SPK_ICON = src/simpleextjswidget.png +WIZARDS_DIR = WIZARD_UIFILES +DSM_UI_DIR = app + +DEPENDS = +WHEELS = flask + +override ARCH= + +MAINTAINER = DigitalBox98 + +DESCRIPTION = SimpleExtJS Widget demo to illustrate the usage of Syno ExtJS framework for DSM. This package is for experienced users. +STARTABLE = no +DISPLAY_NAME = SimpleExtJSWidget + +HOMEPAGE = https://github.com/DigitalBox98/SimpleExtJSApp + +POST_STRIP_TARGET = simpleextjswidget_install + +include ../../mk/spksrc.spk.mk + +.PHONY: simpleextjswidget_install +simpleextjswidget_install: + install -m 755 -d $(STAGING_DIR)/var/ + install -m 755 -d $(STAGING_DIR)/app/ + install -m 644 src/app/config $(STAGING_DIR)/app/config + install -m 644 src/app/simpleextjswidget.js $(STAGING_DIR)/app/simpleextjswidget.js + install -m 755 -d $(STAGING_DIR)/app/texts + for language in enu fre; do \ + install -m 755 -d $(STAGING_DIR)/app/texts/$${language}; \ + install -m 644 src/app/texts/$${language}/strings $(STAGING_DIR)/app/texts/$${language}/strings; \ + done diff --git a/spk/simpleextjswidget/PLIST b/spk/simpleextjswidget/PLIST new file mode 100644 index 00000000000..54ecd09729a --- /dev/null +++ b/spk/simpleextjswidget/PLIST @@ -0,0 +1 @@ +rsc:README diff --git a/spk/simpleextjswidget/WIZARD_UIFILES/install_uifile b/spk/simpleextjswidget/WIZARD_UIFILES/install_uifile new file mode 100644 index 00000000000..cc3a6b355ec --- /dev/null +++ b/spk/simpleextjswidget/WIZARD_UIFILES/install_uifile @@ -0,0 +1,10 @@ +[ + { + "step_title": "Information", + "items": [ + { + "desc": "SimpleExtJSWidget is a demo DSM widget aimed to document Synology's GUI framework based on ExtJS.

For more information, you can visit the SimpleExtJSApp Github page." + } + ] + } +] diff --git a/spk/simpleextjswidget/src/app/config b/spk/simpleextjswidget/src/app/config new file mode 100644 index 00000000000..2c3acc998c2 --- /dev/null +++ b/spk/simpleextjswidget/src/app/config @@ -0,0 +1,13 @@ +{ + "simpleextjswidget.js": { + "SYNOCOMMUNITY.SimpleExtJSApp.WidgetCustom": { + "type": "widget", + "title": "Customized", + "icon": "images\/{1}\/wdgt_icn_title_system_info.png", + "appInstance": "SYNO.SDS.AdminCenter.Application", + "launchParam": "{\"fn\":\"SYNO.SDS.AdminCenter.InfoCenter.Main\"}", + "depend": ["SYNO.SDS._Widget.GridPanel"], + "texts": "texts" + } + } +} diff --git a/spk/simpleextjswidget/src/app/simpleextjswidget.js b/spk/simpleextjswidget/src/app/simpleextjswidget.js new file mode 100644 index 00000000000..c3b4cd7f627 --- /dev/null +++ b/spk/simpleextjswidget/src/app/simpleextjswidget.js @@ -0,0 +1,133 @@ +// Namespace definition +Ext.ns("SYNOCOMMUNITY.SimpleExtJSApp"); + +// Translator +_V = function (category, element) { + return _TT("SYNOCOMMUNITY.SimpleExtJSApp.WidgetCustom", category, element) +} + +Ext.ns("SYNO.SDS.SystemInfoApp"); + +Ext.define("SYNOCOMMUNITY.SimpleExtJSApp.WidgetCustom", { + extend: "Ext.Panel", + minimizable: true, + taskButton: undefined, + constructor: function constructor(a) { + this.initializeSouthTable(); + var b = Ext.apply(this.getConfig(), a); + SYNOCOMMUNITY.SimpleExtJSApp.WidgetCustom.superclass.constructor.call(this, b); + this.westIcon = this.getIconComponent(); + this.centerContent = this.getContentComponent(); + this.isActive = false; + this.timestamp = null; + this.uptime = null; + this.appSetting = SYNO.SDS.SystemInfoApp.SystemHealthDefaultApp + }, + getConfig: function getConfig() { + return { + layout: "fit", + border: false, + defaults: { + border: false + }, + items: [this.getViewConfig()] + } + }, + getViewConfig: function getViewConfig() { + return { + itemId: "layoutPanel", + layout: "vbox", + height: "100%", + border: false, + padding: "4px 12px 5px 12px", + cls: "syno-sysinfo-system-health", + defaults: { + border: false + }, + items: [{ + xtype: "container", + itemId: "northPanel", + height: 20, + width: 296, + cls: "syno-sysinfo-system-health-status", + items: [{ + xtype: "box", + itemId: "westIcon" + }, { + xtype: "box", + itemId: "centerContent", + region: "center" + }] + }, { + region: "south", + height: 84, + width: 296, + items: this.southTable + }] + } + }, + doCollapse: function doCollapse() { + this.getEl().setHeight(84); + this.doLayout() + }, + doExpand: function doExpand() { + this.getEl().setHeight(172); + this.doLayout() + }, + setApp: function setApp(a) { + this.appSetting = a + }, + + getIconComponent: function getIconComponent() { + return this.getComponent("layoutPanel").getComponent("northPanel").getComponent("westIcon") + }, + getContentComponent: function getContentComponent() { + return this.getComponent("layoutPanel").getComponent("northPanel").getComponent("centerContent") + }, + onClickTitle: function onClickTitle() { + SYNO.SDS.AppLaunch(this.appSetting.appInstance, this.appSetting.launchParam) + }, + onActivate: function onActivate() { + this.isActive = true; + }, + onDeactivate: function onDeactivate() { + this.isActive = false; + this.unmask() + }, + mask: Ext.emptyFn, + unmask: Ext.emptyFn, + initializeSouthTable: function initializeSouthTable() { + var b = Ext.util.Format.htmlEncode(_V("app", "message")); + var c = Ext.util.Format.htmlEncode(_S("hostname")); + this.southTable = new Ext.Panel({ + layout: "table", + itemId: "southTable", + cls: "sys-info-south-table", + margins: 0, + height: 84, + layoutConfig: { + columns: 2, + cellCls: "sys-info-row" + }, + items: [{ + xtype: "box", + html: String.format('

{0}

', b, Ext.util.Format.htmlEncode(b)) + }, { + xtype: "box", + html: String.format('

{0}

', c, Ext.util.Format.htmlEncode(c)) + }] + }) + }, + + destroy: function destroy() { + var a = this; + a.onDeactivate(); + if (a.taskButton) { + Ext.destroy(a.taskButton) + } + if (a.southGrid && a.southGrid.getStore()) { + a.southGrid.getStore().destroy() + } + SYNOCOMMUNITY.SimpleExtJSApp.WidgetCustom.superclass.destroy.call(this) + } +}); diff --git a/spk/simpleextjswidget/src/app/texts/enu/strings b/spk/simpleextjswidget/src/app/texts/enu/strings new file mode 100644 index 00000000000..03e270f4db2 --- /dev/null +++ b/spk/simpleextjswidget/src/app/texts/enu/strings @@ -0,0 +1,5 @@ +[app] +app_name = "SimpleExtJSWidget" +description = "ExtJS Demo Widget" +index_title = "Help documentation" +message = "Simple widget !" diff --git a/spk/simpleextjswidget/src/app/texts/fre/strings b/spk/simpleextjswidget/src/app/texts/fre/strings new file mode 100644 index 00000000000..4067fc2189f --- /dev/null +++ b/spk/simpleextjswidget/src/app/texts/fre/strings @@ -0,0 +1,5 @@ +[app] +app_name = "SimpleExtJSWidget" +description = "Widget ExtJS de démonstration" +index_title = "Aide" +message = "Widget simple !" diff --git a/spk/simpleextjswidget/src/conf/resource b/spk/simpleextjswidget/src/conf/resource new file mode 100644 index 00000000000..2c63c085104 --- /dev/null +++ b/spk/simpleextjswidget/src/conf/resource @@ -0,0 +1,2 @@ +{ +} diff --git a/spk/simpleextjswidget/src/simpleextjswidget.png b/spk/simpleextjswidget/src/simpleextjswidget.png new file mode 100644 index 0000000000000000000000000000000000000000..f5b1d74004c17e2e407d71e70a3e2d0b6aa192a0 GIT binary patch literal 3157 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 literal 0 HcmV?d00001