--- /dev/null
+# See /LICENSE for more information.
+# This is free software, licensed under the GNU General Public License v2.
+
+include $(TOPDIR)/rules.mk
+
+LUCI_TITLE:=LuCI example app for js based luci
+LUCI_DEPENDS:=+luci-base
+
+include ../../luci.mk
+
+# call BuildPackage - OpenWrt buildroot signature
--- /dev/null
+# Example app for js based Luci
+
+This app is meant to be a kind of template, example or starting point for developing new luci apps.
+
+It provides two pages in the admin backend. One is based on a view with a form and makes use of internal models. The other one uses the `E()`-method to create more flexibel pages.
+
+The view based page is used to modify the example configuration.
+
+The html view page just shows the configured values.
+
+The configuration is stored in `/etc/config/example`.
--- /dev/null
+'use strict';
+'require view';
+'require form';
+
+return view.extend({
+ render: function() {
+ var m, s, o;
+
+ m = new form.Map('example', _('Example Form'),
+ _('Example Form Configuration.'));
+
+ s = m.section(form.TypedSection, 'first', _('first section'));
+ s.anonymous = true;
+
+ s.option(form.Value, 'first_option', _('First Option'),
+ _('Input for the first option'));
+
+ s = m.section(form.TypedSection, 'second', _('second section'));
+ s.anonymous = true;
+
+ o = s.option(form.Flag, 'flag', _('Flag Option'),
+ _('A boolean option'));
+ o.default = '1';
+ o.rmempty = false;
+
+ o = s.option(form.ListValue, 'select', _('Select Option'),
+ _('A select option'));
+ o.placeholder = 'placeholder';
+ o.value('key1', 'value1');
+ o.value('key2', 'value2');
+ o.rmempty = false;
+ o.editable = true;
+
+ return m.render();
+ },
+});
--- /dev/null
+'use strict';
+'require uci';
+'require view';
+
+return view.extend({
+ handleSaveApply: null,
+ handleSave: null,
+ handleReset: null,
+ load: function() {
+ return Promise.all([
+ uci.load('example')
+ ]);
+ },
+ render: function(data) {
+ var body = E([
+ E('h2', _('Example HTML Page'))
+ ]);
+ var sections = uci.sections('example');
+ var listContainer = E('div');
+ var list = E('ul');
+ list.appendChild(E('li', { 'class': 'css-class' }, ['First Option in first section: ', E('em', {}, [sections[0].first_option])]));
+ list.appendChild(E('li', { 'class': 'css-class' }, ['Flag in second section: ', E('em', {}, [sections[1].flag])]));
+ list.appendChild(E('li', { 'class': 'css-class' }, ['Select in second section: ', E('em', {}, [sections[1].select])]));
+ listContainer.appendChild(list);
+ body.appendChild(listContainer);
+ console.log(sections);
+ return body;
+ }
+ });
+
--- /dev/null
+#
+# Translators:
+# Andi Bräu <freifunk@andi95.de>, 2021
+#
+msgid ""
+msgstr ""
+"Last-Translator: Andi Bräu <freifunk@andi95.de>, 2021\n"
+"Language-Team: German (https://www.transifex.com/forderverein-freie-netzwerke-ev/teams/126043/de/)\n"
+"Content-Type: text/plain; charset=UTF-8\n"
+"Language: de\n"
+"Plural-Forms: nplurals=2; plural=(n != 1);\n"
+
+#: utils/luci-app-example/htdocs/luci-static/resources/view/example/form.js:22
+msgid "A boolean option"
+msgstr "Eine boolsche Option"
+
+#: utils/luci-app-example/htdocs/luci-static/resources/view/example/form.js:27
+msgid "A select option"
+msgstr "Eine Auswahloption"
+
+#: utils/luci-app-example/root/usr/share/luci/menu.d/luci-app-example.json:3
+msgid "Example"
+msgstr "Beispiel"
+
+#: utils/luci-app-example/htdocs/luci-static/resources/view/example/form.js:9
+msgid "Example Form"
+msgstr "Beispielformular"
+
+#: utils/luci-app-example/htdocs/luci-static/resources/view/example/form.js:10
+msgid "Example Form Configuration."
+msgstr "Beispielformularkonfiguration"
+
+#: utils/luci-app-example/htdocs/luci-static/resources/view/example/htmlview.js:16
+msgid "Example HTML Page"
+msgstr "Beispiel-HTML-Seite"
+
+#: utils/luci-app-example/htdocs/luci-static/resources/view/example/form.js:15
+msgid "First Option"
+msgstr "Erste Option"
+
+#: utils/luci-app-example/htdocs/luci-static/resources/view/example/form.js:21
+msgid "Flag Option"
+msgstr "Kennzeichenoption"
+
+#: utils/luci-app-example/root/usr/share/luci/menu.d/luci-app-example.json:14
+msgid "Form View"
+msgstr "Formularansicht"
+
+#: utils/luci-app-example/root/usr/share/rpcd/acl.d/luci-app-example.json:3
+msgid "Grant UCI access to LuCI app ecample"
+msgstr "UCI-Zugriff für LuCI Beispielanwendung gewähren"
+
+#: utils/luci-app-example/root/usr/share/luci/menu.d/luci-app-example.json:23
+msgid "HTML Page"
+msgstr "HTML Seite"
+
+#: utils/luci-app-example/htdocs/luci-static/resources/view/example/form.js:16
+msgid "Input for the first option"
+msgstr "Eingabe für die erste Option"
+
+#: utils/luci-app-example/htdocs/luci-static/resources/view/example/form.js:26
+msgid "Select Option"
+msgstr "Auswahloption"
+
+#: utils/luci-app-example/htdocs/luci-static/resources/view/example/form.js:12
+msgid "first section"
+msgstr "Erste Sektion"
+
+#: utils/luci-app-example/htdocs/luci-static/resources/view/example/form.js:18
+msgid "second section"
+msgstr "Zweite Sektion"
--- /dev/null
+msgid ""
+msgstr "Content-Type: text/plain; charset=UTF-8"
+
+#: utils/luci-app-example/htdocs/luci-static/resources/view/example/form.js:22
+msgid "A boolean option"
+msgstr ""
+
+#: utils/luci-app-example/htdocs/luci-static/resources/view/example/form.js:27
+msgid "A select option"
+msgstr ""
+
+#: utils/luci-app-example/root/usr/share/luci/menu.d/luci-app-example.json:3
+msgid "Example"
+msgstr ""
+
+#: utils/luci-app-example/htdocs/luci-static/resources/view/example/form.js:9
+msgid "Example Form"
+msgstr ""
+
+#: utils/luci-app-example/htdocs/luci-static/resources/view/example/form.js:10
+msgid "Example Form Configuration."
+msgstr ""
+
+#: utils/luci-app-example/htdocs/luci-static/resources/view/example/htmlview.js:16
+msgid "Example HTML Page"
+msgstr ""
+
+#: utils/luci-app-example/htdocs/luci-static/resources/view/example/form.js:15
+msgid "First Option"
+msgstr ""
+
+#: utils/luci-app-example/htdocs/luci-static/resources/view/example/form.js:21
+msgid "Flag Option"
+msgstr ""
+
+#: utils/luci-app-example/root/usr/share/luci/menu.d/luci-app-example.json:14
+msgid "Form View"
+msgstr ""
+
+#: utils/luci-app-example/root/usr/share/rpcd/acl.d/luci-app-example.json:3
+msgid "Grant UCI access to LuCI app ecample"
+msgstr ""
+
+#: utils/luci-app-example/root/usr/share/luci/menu.d/luci-app-example.json:23
+msgid "HTML Page"
+msgstr ""
+
+#: utils/luci-app-example/htdocs/luci-static/resources/view/example/form.js:16
+msgid "Input for the first option"
+msgstr ""
+
+#: utils/luci-app-example/htdocs/luci-static/resources/view/example/form.js:26
+msgid "Select Option"
+msgstr ""
+
+#: utils/luci-app-example/htdocs/luci-static/resources/view/example/form.js:12
+msgid "first section"
+msgstr ""
+
+#: utils/luci-app-example/htdocs/luci-static/resources/view/example/form.js:18
+msgid "second section"
+msgstr ""
--- /dev/null
+msgid ""
+msgstr "Content-Type: text/plain; charset=UTF-8"
+
+#: utils/luci-app-example/htdocs/luci-static/resources/view/example/form.js:22
+msgid "A boolean option"
+msgstr ""
+
+#: utils/luci-app-example/htdocs/luci-static/resources/view/example/form.js:27
+msgid "A select option"
+msgstr ""
+
+#: utils/luci-app-example/root/usr/share/luci/menu.d/luci-app-example.json:3
+msgid "Example"
+msgstr ""
+
+#: utils/luci-app-example/htdocs/luci-static/resources/view/example/form.js:9
+msgid "Example Form"
+msgstr ""
+
+#: utils/luci-app-example/htdocs/luci-static/resources/view/example/form.js:10
+msgid "Example Form Configuration."
+msgstr ""
+
+#: utils/luci-app-example/htdocs/luci-static/resources/view/example/htmlview.js:16
+msgid "Example HTML Page"
+msgstr ""
+
+#: utils/luci-app-example/htdocs/luci-static/resources/view/example/form.js:15
+msgid "First Option"
+msgstr ""
+
+#: utils/luci-app-example/htdocs/luci-static/resources/view/example/form.js:21
+msgid "Flag Option"
+msgstr ""
+
+#: utils/luci-app-example/root/usr/share/luci/menu.d/luci-app-example.json:14
+msgid "Form View"
+msgstr ""
+
+#: utils/luci-app-example/root/usr/share/rpcd/acl.d/luci-app-example.json:3
+msgid "Grant UCI access to LuCI app ecample"
+msgstr ""
+
+#: utils/luci-app-example/root/usr/share/luci/menu.d/luci-app-example.json:23
+msgid "HTML Page"
+msgstr ""
+
+#: utils/luci-app-example/htdocs/luci-static/resources/view/example/form.js:16
+msgid "Input for the first option"
+msgstr ""
+
+#: utils/luci-app-example/htdocs/luci-static/resources/view/example/form.js:26
+msgid "Select Option"
+msgstr ""
+
+#: utils/luci-app-example/htdocs/luci-static/resources/view/example/form.js:12
+msgid "first section"
+msgstr ""
+
+#: utils/luci-app-example/htdocs/luci-static/resources/view/example/form.js:18
+msgid "second section"
+msgstr ""
--- /dev/null
+#!/bin/sh
+
+touch /etc/config/example
+uci set example.first=first
+uci set example.second=second
+uci commit
+
+return 0
--- /dev/null
+{
+ "admin/example/": {
+ "title": "Example",
+ "order": 60,
+ "action": {
+ "type": "firstchild"
+ },
+ "depends": {
+ "acl": [ "luci-app-example" ]
+ }
+ },
+
+ "admin/example/form": {
+ "title": "Form View",
+ "order": 1,
+ "action": {
+ "type": "view",
+ "path": "example/form"
+ }
+ },
+
+ "admin/example/html": {
+ "title": "HTML Page",
+ "order": 2,
+ "action": {
+ "type": "view",
+ "path": "example/htmlview"
+ }
+ }
+}
--- /dev/null
+{
+ "luci-app-example": {
+ "description": "Grant UCI access to LuCI app ecample",
+ "read": {
+ "ubus": {
+ "uci": [
+ "get"
+ ]
+ },
+ "uci": [
+ "example"
+ ]
+ },
+ "write": {
+ "ubus": {
+ "uci": [
+ "set", "commit"
+ ]
+ },
+ "uci": [
+ "example"
+ ]
+ }
+ }
+}