From 3791ba4f9ad7c7395268877ce91ec264d50d8828 Mon Sep 17 00:00:00 2001 From: Hieromon Ikasamo Date: Sat, 16 Feb 2019 01:56:29 +0900 Subject: [PATCH] Under the work of v0.9.7 documentation --- docs/images/fsbrowser_ba.svg | 745 +++++++++++++++++++++++++-------- docs/menuize.html | 18 +- docs/search/search_index.json | 2 +- docs/sitemap.xml | 38 +- docs/sitemap.xml.gz | Bin 353 -> 353 bytes mkdocs/images/fsbrowser_ba.svg | 745 +++++++++++++++++++++++++-------- mkdocs/menuize.md | 19 +- 7 files changed, 1163 insertions(+), 404 deletions(-) diff --git a/docs/images/fsbrowser_ba.svg b/docs/images/fsbrowser_ba.svg index 506cc14..00fc0d4 100644 --- a/docs/images/fsbrowser_ba.svg +++ b/docs/images/fsbrowser_ba.svg @@ -14,10 +14,328 @@ viewBox="0 0 337.27964 235.71254" version="1.1" id="svg8" - inkscape:version="0.92.2 (5c3e80d, 2017-08-06)" + inkscape:version="0.92.1 r15371" sodipodi:docname="fsbrowser_ba.svg"> + id="defs2"> + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + - - - Original FSbrowser.ino (part of code) - Modified FSbrowser.ino (part of code) - Insert for attaching the menu - { - - - - Insert for attaching the menu - { - Replace for AutoConnect - Replace for AutoConnect - - - + transform="translate(-3.0458242,-83.924968)"> server.on("/list", HTTP_GET, handleFileList);on("/list", HTTP_GET, handleFileList);server.on("server.on("/edit", server.on("server.on("/edit", portal.portal.onNotFound([](){portal.join({ FSBedit, FSBlist });portal.portal.begin(); + + + Original FSbrowser.ino (part of code) + Modified FSbrowser.ino (part of code) + Insert for attaching the menu + { + + + + Insert for attaching the menu + { + Replace for AutoConnect + Replace for AutoConnect + + + + + + + + + diff --git a/docs/menuize.html b/docs/menuize.html index 8846990..a253863 100644 --- a/docs/menuize.html +++ b/docs/menuize.html @@ -752,14 +752,14 @@

Basic mechanism of menu generation

The sketch can display the AutoConnect menu by following three patterns depending on AutoConnect-API usage.

-
Basic menu
-
It is the most basic menu only for WiFi connection. Sketch can automatically display this menu with only the basic call sequence of the AutoConnect API which invokes AutoConnect::begin and AutoConnect::handleClient.
-
Extra menu with custom Web pages which is consisted by AutoConnectElements
+
Basic menu
+
It is the most basic menu for only connecting WiFi. Sketch can automatically display this menu with the basic call sequence of the AutoConnect API which invokes AutoConnect::begin and AutoConnect::handleClient.
+
Extra menu with custom Web pages which is consisted by AutoConnectElements
It is an extended menu that appears when the sketch consists of the custom Web pages with AutoConnectAux and AutoConnectElements. Refer to Custom Web pages section.
-
Extra menu which contains legacy pages
+
Extra menu which contains legacy pages
It is for the legacy sketches using the on handler of ESP8266WebServer/WebServer(for ESP32) class natively and looks the same as the extra menu as above.
-

The mechanism to generate the AutoConnect menu is simple. It will insert the item generated from the title member variable of the AutoConnectAux object to AutoConnect's built-in HTML menu list which is implemented as the HTML <li> tag. Therefore, the legacy sketches can invoke the web pages from the AutoConnect menu with just declaration the title and URI to AutoConnectAux.

+

The mechanism to generate the AutoConnect menu is simple. It will insert the item as <li> tag generated from the title and uri member variable of the AutoConnectAux object to the menu list of AutoConnect's built-in HTML. Therefore, the legacy sketches can invoke the web pages from the AutoConnect menu with just declaration the title and URI to AutoConnectAux.

Place the item for the legacy sketches on the menu

To implement this with your sketch, use only the AutoConnectAux constructed with the title and URI of that page. AutoConnectElements is not required.

The AutoConnect library package contains an example sketch for ESP8266WebServer known as FSBrowser. Its example is a sample implementation that supports AutoConnect without changing the structure of the original FSBrowser and has the menu item for Edit and List.

@@ -768,11 +768,13 @@

The changes I made to adapt the FSBrowser to the AutoConnect menu are slight as follows.

  1. Add AutoConnect declaration.
  2. -
  3. Add the AutoConnectAux named "Edit" and "List" as each page.
  4. +
  5. Add the menu item named "Edit" and "List" of AutoConnectAux as each page.
  6. Replace the instance of ESP8266WebServer to AutoConnect.
  7. -
  8. Change menu title to FSBrowser using AutoConnectConfig::title.
  9. -
  10. Join the legacy pages declared at step #2 to AutoConnect using AutoConnect::join.
  11. +
  12. Change the menu title to FSBrowser using AutoConnectConfig::title.
  13. +
  14. Join the legacy pages to AutoConnect declared at step #1 using AutoConnect::join.
    Joining multiple at one time with std::vector's' list initialization.
  15. +
  16. According to the basic procedure of AutoConnect.
    Establish a connection with AutoConnect::begin and perform AutoConnect::handleClient in loop().
+

Modification for FSBrowser (part of sketch code)

)\" ; ACInput(Text1, \"Text1\" ); ACInput(Text2, \"Text2\" ); ACButton(Button, \"COPY\" , \"CopyText()\" ); ACElement(TextCopy, scCopyText); AutoConnectCheckbox \u00b6 AutoConnectCheckbox generates an HTML < input type = \"checkbox\" > tag and a < label > tag. It places horizontally on a custom Web page by default. Sample AutoConnectCheckbox checkbox(\"checkbox\", \"uniqueapid\", \"Use APID unique\", false); On the page: Constructor \u00b6 AutoConnectCheckbox( const char * name, const char * value, const char * label, const bool checked) name \u00b6 It is the name of the AutoConnectCheckbox element and matches the name attribute of the input tag. It also becomes the parameter name of the query string when submitted. value \u00b6 It becomes a value of the value attribute of an HTML < input type = \"checkbox\" > tag. label \u00b6 A label is an optional string. A label is always arranged on the right side of the checkbox. Specification of a label will generate an HTML