diff --git a/tutorials/device-dashboard/minimal/ai.md b/tutorials/device-dashboard/minimal/ai.md deleted file mode 100644 index f36167f8..00000000 --- a/tutorials/device-dashboard/minimal/ai.md +++ /dev/null @@ -1,49 +0,0 @@ -# Device dashboard - -This is the AI specification file for the Web device dashboard. - -## General rules - -Follow these sections of the guide: - - For editing HTML, https://mongoose.ws/docs/guides/web-dashboard-guide/#step-2-develop-dashboardhtml - - For editing C, https://mongoose.ws/docs/guides/web-dashboard-guide/#step-3-develop-dashboardc - -Never call Dashboard.call / Dashboard.on functions - -For editing HTML file, only Mongoose `data-bind` and `${...}` template syntax, - -No vanilla JS event listeners, no fetch calls, no custom reactive logic. - - -## dashboard.html - -Start with this empty skeleton file: - -```html - - -
- - - - - - - - -``` - -Add a visually appealing toggle button - use an -for it, stylised as a toggle button. - -Add "data-bind" and "data-autosave" attributes to the toggle control -in order to bind it to the device: - -## dashboard.c - -Don't touch it diff --git a/tutorials/device-dashboard/minimal/ai.spec.md b/tutorials/device-dashboard/minimal/ai.spec.md new file mode 100644 index 00000000..d5cc0e70 --- /dev/null +++ b/tutorials/device-dashboard/minimal/ai.spec.md @@ -0,0 +1,68 @@ +# Device dashboard + +This is the AI specification file for the Web device dashboard. + +## General rules + +Your goal is to produce a dashboard.c and dashboard.html files + +Fetch the initial implementation of these two files from: + +https://github.com/cesanta/mongoose/blob/master/tutorials/device-dashboard/minimal/dashboard.c +https://github.com/cesanta/mongoose/blob/master/tutorials/device-dashboard/minimal/dashboard.html + +The C API for dashboard.c is described at https://mongoose.ws/docs/api/dash/ + +The C API header file is at https://github.com/cesanta/mongoose/blob/master/src/dash.h + +The minimal reference project is at https://github.com/cesanta/mongoose/blob/master/tutorials/device-dashboard/minimal/ + +The full reference project is at https://github.com/cesanta/mongoose/blob/master/tutorials/device-dashboard/full/ + +For editing dashboard.html, use only Mongoose `data-bind` and `${...}` template syntax + +No vanilla JS event listeners, no fetch calls, no custom reactive logic. + +## Functionality + +### LED controls + +On a page, create single control panel titled "LED control" + +On that control, add 3 LED toggles: LED1, LED2, LED3 + +Update Dashboard.init call accordingly. Update dashboard.c accordingly - have 3 LEDs in the "leds" data set. + + +## dashboard.html + +Start with this empty skeleton file: + +```html + + + + + + + + + + + +``` + +Add a visually appealing toggle button - use an +for it, stylised as a toggle button. + +Add "data-bind" and "data-autosave" attributes to the toggle control +in order to bind it to the device: + +## dashboard.c + +Don't touch it