diff --git a/mkdocs/acintro.md b/mkdocs/acintro.md index 544489b..d1efccc 100644 --- a/mkdocs/acintro.md +++ b/mkdocs/acintro.md @@ -1,6 +1,6 @@ ## What it is - + AutoConnect can handle custom Web pages prepared by user sketches individually. Custom Web pages are displayed in the [AutoConnect menu](menu.md) and can be used from there. It can also have input-output parameters and handle it with sketches. For example, you can program some sketches that publish messages by entering the URI or unique ID of the MQTT broker on a custom page. You do not need to code the processing to handle the web page, it retrieves the input parameters and passes to the MQTT broker connection API is only. ## How it works @@ -11,26 +11,25 @@ AutoConnectAux is a container for AutoConnectElements. To make a custom Web page -The above figure shows a code sequence that declares AutoConnectElements and put in the AutoConnectAux container and integrates those into AutoConnect. It declares two text elements named '*header*'and '*caption*', adds them to the AutoConnectAux object '*aux*', binds to an AutoConnect object named '*portal*'. It's the basic procedure for configuring the custom Web page. Also, further explanation of AutoConnectElements is the [documentation](acelements.md). +The above figure shows a code sequence that declares AutoConnectElements and put in the AutoConnectAux container and integrates those into AutoConnect. It declares two text elements named *header* and *caption*, adds them to the AutoConnectAux object as *aux*, binds to an AutoConnect object named *portal*. This sequence is the basic procedure for creating custom Web pages with the sketch. Also, further explanation of AutoConnectElements is the [documentation](acelements.md). ## Custom Web pages in AutoConnect menu [^1]:There is no overlay in the actual menu. ## Multiple custom Web pages -You can create multiple custom Web pages and specify which pages you can invoke from the menu.
-In the sketch below, it shows the sequence of codes to integrate three custom Web pages into one and embed them into the menu. +You can create multiple custom Web pages and specify pages that can be called from the menu. The following sketch shows a code sequence for integrating three custom Web pages into one and embedding them in a menu. [^2]: @@ -77,8 +76,8 @@ So, the basic procedure for handling of the custom Web pages is as follows: ## Write the custom Web page with JSON -You can write the custom Web page in JSON without using sketch codes.[^3] It is possible to describe the entire page in JSON and can be described for each element also. The JSON description can be saved in SPIFFS or SD and read using AutoConnect's [**load**](api.md#load) function. If you take this approach, you can further reduce the steps of the above but this way consumes a lot of memory. -The following JSON code and sketch will execute the custom Web page as the example in the above figure. That is, the sketch of this code and footnote[^2] is equivalent. +You can write the custom Web page in JSON without using sketch codes.[^3] It is possible to describe the entire page in JSON and can be described for each element also. The JSON document can be saved in SPIFFS or SD and read using AutoConnect's [**load**](api.md#load) function. you can reduce the steps of the basic procedure with this approach, but this way consumes a lot of memory. +The following JSON code and sketch will execute the custom Web page as an example in the above figure. That is, the sketch of this code and footnote[^2] is equivalent. **custom_page.json** ```json @@ -163,7 +162,7 @@ void loop() { ## Passing parameters with sketches and custom Web pages -A sketch can access variables of [AutoConnectElements](acelements.md) in the custom Web page. The value entered into the AutoConnectElements on the page is stored to the [member variables](acelements.md#form-and-autoconnectelements) of the element by AutoConnect whenever GET / POST transmission occurs. Your sketches can get these values with the GET / POST request handler. If you assign a value to an element before a request to the page occurs, its value will appear as the initial value when the page is displayed. Details are explained in the [Parameter handling](achandling.md#parameter-handling). +A sketch can access variables of [AutoConnectElements](acelements.md) on the custom Web page. The value entered into the AutoConnectElements is stored to the [member variables](acelements.md#form-and-autoconnectelements) of the element by AutoConnect whenever GET / POST transmission occurs. Your sketches can get these values with the request handler which will be registered by [AutoConnect::on](api.md#on) function. And if you assign a value to an element before a request to the page occurs, its value will appear as the initial value when the page is displayed. The details are explained in the [Custom field data handling](achandling.md#custom-field-data-handling) section.