Merge pull request #41 from Hieromon/enhance/AutoConnectAux

Release for v0.9.7
pull/42/head
Hieromon Ikasamo 6 years ago committed by GitHub
commit 1f22a2acd4
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
  1. 4
      .gitignore
  2. 7
      .travis.yml
  3. 29
      README.md
  4. 431
      docs/404.html
  5. 1911
      docs/acelements.html
  6. 1715
      docs/achandling.html
  7. 1100
      docs/acintro.html
  8. 1502
      docs/acjson.html
  9. 1570
      docs/advancedusage.html
  10. 1049
      docs/advancedusage/index.html
  11. 1419
      docs/api.html
  12. 1586
      docs/api/index.html
  13. 1282
      docs/apiaux.html
  14. 1484
      docs/apiconfig.html
  15. 2673
      docs/apielements.html
  16. 878
      docs/apiextra.html
  17. 4
      docs/assets/fonts/font-awesome.css
  18. 13
      docs/assets/fonts/material-icons.css
  19. BIN
      docs/assets/fonts/specimen/FontAwesome.ttf
  20. BIN
      docs/assets/fonts/specimen/FontAwesome.woff
  21. BIN
      docs/assets/fonts/specimen/FontAwesome.woff2
  22. BIN
      docs/assets/fonts/specimen/MaterialIcons-Regular.ttf
  23. BIN
      docs/assets/fonts/specimen/MaterialIcons-Regular.woff
  24. BIN
      docs/assets/fonts/specimen/MaterialIcons-Regular.woff2
  25. 2
      docs/assets/images/icons/bitbucket.1b09e088.svg
  26. 2
      docs/assets/images/icons/github.f0b8504a.svg
  27. 2
      docs/assets/images/icons/gitlab.6dd19c00.svg
  28. 1
      docs/assets/javascripts/application.8eb9be28.js
  29. 6
      docs/assets/javascripts/application.b806dc00.js
  30. 2
      docs/assets/javascripts/lunr/lunr.da.js
  31. 2
      docs/assets/javascripts/lunr/lunr.de.js
  32. 2
      docs/assets/javascripts/lunr/lunr.du.js
  33. 2
      docs/assets/javascripts/lunr/lunr.es.js
  34. 2
      docs/assets/javascripts/lunr/lunr.fi.js
  35. 2
      docs/assets/javascripts/lunr/lunr.fr.js
  36. 2
      docs/assets/javascripts/lunr/lunr.hu.js
  37. 2
      docs/assets/javascripts/lunr/lunr.it.js
  38. 2
      docs/assets/javascripts/lunr/lunr.jp.js
  39. 2
      docs/assets/javascripts/lunr/lunr.multi.js
  40. 2
      docs/assets/javascripts/lunr/lunr.no.js
  41. 2
      docs/assets/javascripts/lunr/lunr.pt.js
  42. 2
      docs/assets/javascripts/lunr/lunr.ro.js
  43. 2
      docs/assets/javascripts/lunr/lunr.ru.js
  44. 2
      docs/assets/javascripts/lunr/lunr.stemmer.support.js
  45. 2
      docs/assets/javascripts/lunr/lunr.sv.js
  46. 2
      docs/assets/javascripts/lunr/lunr.tr.js
  47. 2
      docs/assets/javascripts/lunr/tinyseg.js
  48. 1
      docs/assets/javascripts/modernizr.1aa3b519.js
  49. 1
      docs/assets/javascripts/modernizr.1f0bcf2b.js
  50. 1
      docs/assets/stylesheets/application-palette.224b79ff.css
  51. 2
      docs/assets/stylesheets/application-palette.6079476c.css
  52. 2
      docs/assets/stylesheets/application.78aab2dc.css
  53. 1
      docs/assets/stylesheets/application.982221ab.css
  54. 509
      docs/basicusage.html
  55. 501
      docs/changelog.html
  56. 9
      docs/css/extra.css
  57. 33
      docs/css/paragraph.css
  58. 1174
      docs/datatips.html
  59. 1528
      docs/faq.html
  60. 1027
      docs/faq/index.html
  61. 523
      docs/gettingstarted.html
  62. 543
      docs/howtoembed.html
  63. BIN
      docs/images/AutoConnectAux.gif
  64. 233
      docs/images/ac_auxjoin_multi.svg
  65. BIN
      docs/images/ac_auxmenu.png
  66. BIN
      docs/images/ac_auxmenu_multi.png
  67. 384
      docs/images/ac_declaration.svg
  68. BIN
      docs/images/ac_json.png
  69. 778
      docs/images/ac_load_save.svg
  70. BIN
      docs/images/ac_mqtt_setting.png
  71. 1401
      docs/images/ac_objects.svg
  72. 971
      docs/images/ac_param_flow.svg
  73. BIN
      docs/images/acbutton.png
  74. BIN
      docs/images/accheckbox.png
  75. BIN
      docs/images/acelement.png
  76. BIN
      docs/images/acinput.png
  77. BIN
      docs/images/acow.png
  78. BIN
      docs/images/acradio.png
  79. BIN
      docs/images/acselect.png
  80. BIN
      docs/images/acsubmit.png
  81. BIN
      docs/images/actext.png
  82. BIN
      docs/images/arrow_down.png
  83. BIN
      docs/images/aux_fsbrowser.gif
  84. BIN
      docs/images/aux_json.png
  85. BIN
      docs/images/aux_menu.gif
  86. BIN
      docs/images/aux_ov.gif
  87. BIN
      docs/images/aux_pattern.gif
  88. BIN
      docs/images/fsbmenu.png
  89. BIN
      docs/images/fsbmenu_expand.png
  90. 1406
      docs/images/fsbrowser_ba.svg
  91. 2
      docs/images/handleClient.svg
  92. 2
      docs/images/handlePortal.svg
  93. 1105
      docs/images/process_begin.svg
  94. BIN
      docs/images/regexp.png
  95. 527
      docs/index.html
  96. 2
      docs/js/gifffer.min.js
  97. 460
      docs/license.html
  98. 867
      docs/lsbegin.html
  99. 533
      docs/menu.html
  100. 922
      docs/menuize.html
  101. Some files were not shown because too many files have changed in this diff Show More

4
.gitignore vendored

@ -2,11 +2,11 @@
.vs/
__vm/
debug/
Release/
img/
*.tmp
*.TMP
*.sln
*.vcxproj
*.vcxproj.filters
.pioenvs
.piolibdeps
*.vcxitems

@ -4,7 +4,7 @@ banches:
language: generic
env:
global:
- IDE_VERSION=1.8.5
- IDE_VERSION=1.8.6
matrix:
- BOARD="esp8266:esp8266:generic:xtal=80,eesz=4M3M,ip=lm2f,exception=disabled,FlashMode=qio,FlashFreq=80"
- BOARD="esp32:esp32:esp32:FlashFreq=80,FlashSize=4M"
@ -23,7 +23,7 @@ before_install:
- if [[ "$BOARD" =~ "esp32:esp32:" ]]; then
arduino --install-boards esp32:esp32;
fi
- arduino --install-library PubSubClient,PageBuilder:1.2.3
- arduino --install-library PubSubClient,ArduinoJson:5.13.4,PageBuilder:1.3.2
- buildExampleSketch() { arduino --verify --board $BOARD $PWD/examples/$1/$1.ino; }
install:
- mkdir -p ~/Arduino/libraries
@ -35,4 +35,7 @@ script:
- buildExampleSketch HandlePortal
- buildExampleSketch HandlePortalEX
- buildExampleSketch Simple
- buildExampleSketch HelloWorld
- buildExampleSketch mqttRSSI
- buildExampleSketch mqttRSSI_FS
- buildExampleSketch mqttRSSI_NA

@ -2,6 +2,7 @@
[![Build Status](https://travis-ci.org/Hieromon/AutoConnect.svg?branch=master)](https://travis-ci.org/Hieromon/AutoConnect)
[![GitHub release](https://img.shields.io/github/release/Hieromon/AutoConnect.svg)](https://github.com/Hieromon/AutoConnect/releases)
[![arduino-library-badge](https://www.ardu-badge.com/badge/AutoConnect.svg)](https://www.ardu-badge.com/AutoConnect)
An Arduino library for ESP8266/ESP32 WLAN configuration at run time with web interface.
@ -32,6 +33,18 @@ AutoConnect can be embedded easily into your sketch, just "**begin**" and "**han
The sketches which provide the web page using ESP8266WebServer/WebServer there is, AutoConnect will not disturb it. AutoConnect can use an already instantiated ESP8266WebServer object(ESP8266) or WebServer object(ESP32), or itself can assign it.
### Easily add user-owned web screen and parameters <sup><sub>ENHANCED w/ v0.9.7</sub></sup>
You can easily add your own web screen that can consist of representative HTML elements as the styled TEXT, INPUT, BUTTON, CHECKBOX, RADIO, SELECT, SUBMIT into the menu. It can be invoked from the AutoConnect menu and parameters can be passed.
### Just loading the JSON description <sup><sub>ENHANCED w/ v0.9.7</sub></sup>
These HTML elements that make up the user-owned screen can be easily loaded from the JSON description stored in PROGMEM, SPIFFS or SD.
<img width="40%" src="mkdocs/images/aux_json.png">&emsp;
<img width="32px" src="mkdocs/images/arrow_right.png" align="top">&emsp;
<img width="30%" height="400px" src="mkdocs/images/AutoConnectAux.gif">
## Supported hardware
Apply the [Arduino core](https://github.com/esp8266/Arduino) of the ESP8266 Community.
@ -76,12 +89,24 @@ Full documentation is available on https://Hieromon.github.io/AutoConnect, some
- [Getting started](https://hieromon.github.io/AutoConnect/gettingstarted/index.html) with the most simple sketch for using AutoConnect.
- The [Basic usage](https://hieromon.github.io/AutoConnect/basicusage/index.html) guides to using the library correctly.
- Details are explained in the [Advanced usage](https://hieromon.github.io/AutoConnect/advancedusage/index.html).
- Details and usage of custom Web pages are explained in the [Custom Web pages](https://hieromon.github.io/AutoConnect/acintro.html).
- The [API reference](https://hieromon.github.io/AutoConnect/api/index.html) describes the AutoConnect functions specification.
- [FAQ](https://hieromon.github.io/AutoConnect/faq/index.html).
## Change log
### [0.9.6] Sep. 27, 2018
### [0.9.7] Feb. 25, 2019
- Fixed crash in some environments. Thank you @ageurtse
- Supports AutoConnect menu extension by user sketch with **AutoConnectAux**.
- Supports loading and saving of user-defined parameters with JSON format.
- Improved the WiFi connection sequence at the first WiFi.begin. Even if **AutoConnectConfig::autoReconnect** is disabled when SSID and PSK are not specified, it will use the information of the last established access point. The autoReconnect option will achieve trying the connect after a previous connection failed.
- Supports the **AutoConnectConfig::immediateStart** option and immediately starts the portal without first trying WiFi.begin. You can start the captive portal at any time in combination with the **AutoConnectConfig::autoRise** option.
- Improved boot uri after reset. **AutoConnectConfig::bootUri** can be specified either /_ac or HOME path as the uri to be accessed after invoking Reset from AutoConnect menu.
- Improved source code placement of predefined macros. Defined common macros have been moved to ```AutoConnectDefs.h```.
- Supports **AutoConnectConfig::hostName**. It activates ```WiFi.hostname()```.
- Supports the captive portal time-out. It can be controlled by **AutoConnectConfig::portalTimeout** and **AutoConnectConfig::retainPortal**.
### [0.9.6] Sept. 27, 2018
- Improvement of RSSI detection for saved SSIDs.
- Fixed disconnection SoftAP completely at the first connection phase of the AutoConnect::begin.
@ -104,4 +129,4 @@ Full documentation is available on https://Hieromon.github.io/AutoConnect, some
## License
License under the [MIT license](LICENSE).
License under the [MIT license](LICENSE).

@ -2,7 +2,7 @@
<!DOCTYPE html>
<!doctype html>
<html lang="en" class="no-js">
<head>
@ -36,7 +36,7 @@
<meta name="lang:search.tokenizer" content="[\s\-]+">
<link rel="shortcut icon" href="/AutoConnect/assets/images/favicon.png">
<meta name="generator" content="mkdocs-0.17.3, mkdocs-material-2.7.0">
<meta name="generator" content="mkdocs-1.0.4, mkdocs-material-4.0.1">
@ -44,25 +44,63 @@
<link rel="stylesheet" href="/AutoConnect/assets/stylesheets/application.78aab2dc.css">
<link rel="stylesheet" href="/AutoConnect/assets/stylesheets/application.982221ab.css">
<link rel="stylesheet" href="/AutoConnect/assets/stylesheets/application-palette.6079476c.css">
<link rel="stylesheet" href="/AutoConnect/assets/stylesheets/application-palette.224b79ff.css">
<meta name="theme-color" content="#3f51b5">
<script src="/AutoConnect/assets/javascripts/modernizr.1aa3b519.js"></script>
<script src="/AutoConnect/assets/javascripts/modernizr.1f0bcf2b.js"></script>
<link href="https://fonts.gstatic.com" rel="preconnect" crossorigin>
<link href="https://fonts.gstatic.com" rel="preconnect" crossorigin>
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,400,400i,700|Roboto+Mono">
<style>body,input{font-family:"Roboto","Helvetica Neue",Helvetica,Arial,sans-serif}code,kbd,pre{font-family:"Roboto Mono","Courier New",Courier,monospace}</style>
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
<link rel="stylesheet" href="/AutoConnect/assets/fonts/material-icons.css">
<link rel="stylesheet" href="/AutoConnect/css/paragraph.css">
<link rel="stylesheet" href="/AutoConnect/css/extra.css">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.6.1/css/all.css">
<script>
window.ga = window.ga || function() {
(ga.q = ga.q || []).push(arguments)
}
ga.l = +new Date
/* Setup integration and send page view */
ga("create", "UA-116150854-1", "auto")
ga("set", "anonymizeIp", true)
ga("send", "pageview")
/* Register handler to log search on blur */
document.addEventListener("DOMContentLoaded", () => {
if (document.forms.search) {
var query = document.forms.search.query
query.addEventListener("blur", function() {
if (this.value) {
var path = document.location.pathname;
ga("send", "pageview", path + "?q=" + this.value)
}
})
}
})
</script>
<script async src="https://www.google-analytics.com/analytics.js"></script>
</head>
@ -75,7 +113,7 @@
<svg xmlns="http://www.w3.org/2000/svg" width="416" height="448"
viewBox="0 0 416 448" id="github">
viewBox="0 0 416 448" id="__github">
<path fill="currentColor" d="M160 304q0 10-3.125 20.5t-10.75 19-18.125
8.5-18.125-8.5-10.75-19-3.125-20.5 3.125-20.5 10.75-19 18.125-8.5
18.125 8.5 10.75 19 3.125 20.5zM320 304q0 10-3.125 20.5t-10.75
@ -95,9 +133,9 @@
</defs>
</svg>
<input class="md-toggle" data-md-toggle="drawer" type="checkbox" id="drawer">
<input class="md-toggle" data-md-toggle="search" type="checkbox" id="search">
<label class="md-overlay" data-md-component="overlay" for="drawer"></label>
<input class="md-toggle" data-md-toggle="drawer" type="checkbox" id="__drawer" autocomplete="off">
<input class="md-toggle" data-md-toggle="search" type="checkbox" id="__search" autocomplete="off">
<label class="md-overlay" data-md-component="overlay" for="__drawer"></label>
<header class="md-header" data-md-component="header">
@ -111,33 +149,30 @@
</a>
</div>
<div class="md-flex__cell md-flex__cell--shrink">
<label class="md-icon md-icon--menu md-header-nav__button" for="drawer"></label>
<label class="md-icon md-icon--menu md-header-nav__button" for="__drawer"></label>
</div>
<div class="md-flex__cell md-flex__cell--stretch">
<div class="md-flex__ellipsis md-header-nav__title" data-md-component="title">
<span class="md-header-nav__topic">
AutoConnect for ESP8266/ESP32
</span>
<span class="md-header-nav__topic">
</span>
<span class="md-header-nav__topic">
AutoConnect for ESP8266/ESP32
</span>
<span class="md-header-nav__topic">
</span>
</div>
</div>
<div class="md-flex__cell md-flex__cell--shrink">
<label class="md-icon md-icon--search md-header-nav__button" for="__search"></label>
<label class="md-icon md-icon--search md-header-nav__button" for="search"></label>
<div class="md-search" data-md-component="search" role="dialog">
<label class="md-search__overlay" for="search"></label>
<label class="md-search__overlay" for="__search"></label>
<div class="md-search__inner" role="search">
<form class="md-search__form" name="search">
<input type="text" class="md-search__input" name="query" placeholder="Search" autocapitalize="off" autocorrect="off" autocomplete="off" spellcheck="false" data-md-component="query" data-md-state="active">
<label class="md-icon md-search__icon" for="search"></label>
<label class="md-icon md-search__icon" for="__search"></label>
<button type="reset" class="md-icon md-search__icon" data-md-component="reset" tabindex="-1">
&#xE5CD;
</button>
@ -154,7 +189,6 @@
</div>
</div>
</div>
</div>
@ -165,20 +199,18 @@
<a href="https://github.com/Hieromon/AutoConnect" title="Go to repository" class="md-source" data-md-source="github">
<div class="md-source__icon">
<svg viewBox="0 0 24 24" width="24" height="24">
<use xlink:href="#github" width="24" height="24"></use>
</svg>
</div>
<div class="md-source__repository">
Hieromon/AutoConnect
<a href="https://github.com/Hieromon/AutoConnect" title="Go to repository" class="md-source" data-md-source="github">
<div class="md-source__icon">
<svg viewBox="0 0 24 24" width="24" height="24">
<use xlink:href="#__github" width="24" height="24"></use>
</svg>
</div>
</a>
<div class="md-source__repository">
Hieromon/AutoConnect
</div>
</a>
</div>
</div>
@ -216,6 +248,43 @@
<li class="md-tabs__item">
<a href="/AutoConnect/acintro.html" title="Custom Web pages" class="md-tabs__link">
Custom Web pages
</a>
</li>
<li class="md-tabs__item">
<a href="/AutoConnect/api.html" title="Library APIs" class="md-tabs__link">
Library APIs
</a>
</li>
<li class="md-tabs__item">
<a href="/AutoConnect/howtoembed.html" title="Examples" class="md-tabs__link">
Examples
</a>
</li>
@ -237,12 +306,12 @@
<div class="md-sidebar__scrollwrap">
<div class="md-sidebar__inner">
<nav class="md-nav md-nav--primary" data-md-level="0">
<label class="md-nav__title md-nav__title--site" for="drawer">
<span class="md-nav__button md-logo">
<label class="md-nav__title md-nav__title--site" for="__drawer">
<a href="https://Hieromon.github.io/AutoConnect/" title="AutoConnect for ESP8266/ESP32" class="md-nav__button md-logo">
<img src="/AutoConnect/images/arduino-logo.svg" width="48" height="48">
</span>
</a>
AutoConnect for ESP8266/ESP32
</label>
@ -252,20 +321,18 @@
<a href="https://github.com/Hieromon/AutoConnect" title="Go to repository" class="md-source" data-md-source="github">
<div class="md-source__icon">
<svg viewBox="0 0 24 24" width="24" height="24">
<use xlink:href="#github" width="24" height="24"></use>
</svg>
</div>
<div class="md-source__repository">
Hieromon/AutoConnect
<a href="https://github.com/Hieromon/AutoConnect" title="Go to repository" class="md-source" data-md-source="github">
<div class="md-source__icon">
<svg viewBox="0 0 24 24" width="24" height="24">
<use xlink:href="#__github" width="24" height="24"></use>
</svg>
</div>
</a>
<div class="md-source__repository">
Hieromon/AutoConnect
</div>
</a>
</div>
<ul class="md-nav__list" data-md-scrollfix>
@ -288,7 +355,7 @@
<li class="md-nav__item">
<a href="/AutoConnect/gettingstarted/index.html" title="Getting started" class="md-nav__link">
<a href="/AutoConnect/gettingstarted.html" title="Getting started" class="md-nav__link">
Getting started
</a>
</li>
@ -300,7 +367,7 @@
<li class="md-nav__item">
<a href="/AutoConnect/menu/index.html" title="AutoConnect menu" class="md-nav__link">
<a href="/AutoConnect/menu.html" title="AutoConnect menu" class="md-nav__link">
AutoConnect menu
</a>
</li>
@ -312,7 +379,7 @@
<li class="md-nav__item">
<a href="/AutoConnect/basicusage/index.html" title="Basic usage" class="md-nav__link">
<a href="/AutoConnect/basicusage.html" title="Basic usage" class="md-nav__link">
Basic usage
</a>
</li>
@ -324,7 +391,7 @@
<li class="md-nav__item">
<a href="/AutoConnect/advancedusage/index.html" title="Advanced usage" class="md-nav__link">
<a href="/AutoConnect/advancedusage.html" title="Advanced usage" class="md-nav__link">
Advanced usage
</a>
</li>
@ -335,21 +402,237 @@
<li class="md-nav__item md-nav__item--nested">
<input class="md-toggle md-nav__toggle" data-md-toggle="nav-6" type="checkbox" id="nav-6">
<label class="md-nav__link" for="nav-6">
Custom Web pages
</label>
<nav class="md-nav" data-md-component="collapsible" data-md-level="1">
<label class="md-nav__title" for="nav-6">
Custom Web pages
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="/AutoConnect/api/index.html" title="Library APIs" class="md-nav__link">
Library APIs
<a href="/AutoConnect/acintro.html" title="Custom Web pages with AutoConnect" class="md-nav__link">
Custom Web pages with AutoConnect
</a>
</li>
<li class="md-nav__item">
<a href="/AutoConnect/acelements.html" title="AutoConnectElements" class="md-nav__link">
AutoConnectElements
</a>
</li>
<li class="md-nav__item">
<a href="/AutoConnect/acjson.html" title="Custom Web pages with JSON" class="md-nav__link">
Custom Web pages with JSON
</a>
</li>
<li class="md-nav__item">
<a href="/AutoConnect/achandling.html" title="Handling the custom Web pages" class="md-nav__link">
Handling the custom Web pages
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item md-nav__item--nested">
<input class="md-toggle md-nav__toggle" data-md-toggle="nav-7" type="checkbox" id="nav-7">
<label class="md-nav__link" for="nav-7">
Library APIs
</label>
<nav class="md-nav" data-md-component="collapsible" data-md-level="1">
<label class="md-nav__title" for="nav-7">
Library APIs
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="/AutoConnect/examples/index.html" title="Examples" class="md-nav__link">
<a href="/AutoConnect/api.html" title="AutoConnect API" class="md-nav__link">
AutoConnect API
</a>
</li>
<li class="md-nav__item">
<a href="/AutoConnect/apiaux.html" title="AutoConnectAux API" class="md-nav__link">
AutoConnectAux API
</a>
</li>
<li class="md-nav__item">
<a href="/AutoConnect/apiconfig.html" title="AutoConnectConfig API" class="md-nav__link">
AutoConnectConfig API
</a>
</li>
<li class="md-nav__item">
<a href="/AutoConnect/apielements.html" title="AutoConnectElements API" class="md-nav__link">
AutoConnectElements API
</a>
</li>
<li class="md-nav__item">
<a href="/AutoConnect/apiextra.html" title="Something extra" class="md-nav__link">
Something extra
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item md-nav__item--nested">
<input class="md-toggle md-nav__toggle" data-md-toggle="nav-8" type="checkbox" id="nav-8">
<label class="md-nav__link" for="nav-8">
Examples
</label>
<nav class="md-nav" data-md-component="collapsible" data-md-level="1">
<label class="md-nav__title" for="nav-8">
Examples
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="/AutoConnect/howtoembed.html" title="How to embed" class="md-nav__link">
How to embed
</a>
</li>
<li class="md-nav__item">
<a href="/AutoConnect/datatips.html" title="Tips for data conversion" class="md-nav__link">
Tips for data conversion
</a>
</li>
<li class="md-nav__item">
<a href="/AutoConnect/menuize.html" title="Attach the menu" class="md-nav__link">
Attach the menu
</a>
</li>
<li class="md-nav__item">
<a href="/AutoConnect/wojson.html" title="Custom Web pages w/o JSON" class="md-nav__link">
Custom Web pages w/o JSON
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item">
<a href="/AutoConnect/lsbegin.html" title="Appendix" class="md-nav__link">
Appendix
</a>
</li>
@ -360,7 +643,7 @@
<li class="md-nav__item">
<a href="/AutoConnect/faq/index.html" title="FAQ" class="md-nav__link">
<a href="/AutoConnect/faq.html" title="FAQ" class="md-nav__link">
FAQ
</a>
</li>
@ -372,7 +655,7 @@
<li class="md-nav__item">
<a href="/AutoConnect/changelog/index.html" title="Change log" class="md-nav__link">
<a href="/AutoConnect/changelog.html" title="Change log" class="md-nav__link">
Change log
</a>
</li>
@ -384,7 +667,7 @@
<li class="md-nav__item">
<a href="/AutoConnect/license/index.html" title="License" class="md-nav__link">
<a href="/AutoConnect/license.html" title="License" class="md-nav__link">
License
</a>
</li>
@ -405,6 +688,8 @@
</article>
</div>
@ -419,20 +704,18 @@
<div class="md-footer-copyright">
<div class="md-footer-copyright__highlight">
Copyright &copy; 2018 Hieromon Ikasamo
Copyright &copy; 2018-2019 Hieromon Ikasamo
</div>
powered by
<a href="http://www.mkdocs.org">MkDocs</a>
<a href="https://www.mkdocs.org">MkDocs</a>
and
<a href="https://squidfunk.github.io/mkdocs-material/">
Material for MkDocs</a>
</div>
<div class="md-footer-social">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<link rel="stylesheet" href="/AutoConnect/assets/fonts/font-awesome.css">
<a href="https://github.com/Hieromon" class="md-footer-social__link fa fa-github"></a>
@ -440,24 +723,18 @@
</div>
</div>
</div>
</footer>
</div>
<script src="/AutoConnect/assets/javascripts/application.8eb9be28.js"></script>
<script src="/AutoConnect/assets/javascripts/application.b806dc00.js"></script>
<script>app.initialize({version:"0.17.3",url:{base:"/AutoConnect"}})</script>
<script>app.initialize({version:"1.0.4",url:{base:"/AutoConnect/"}})</script>
<script src="/AutoConnect/js/gifffer.min.js"></script>
<script>!function(e,a,t,n,o,c,i){e.GoogleAnalyticsObject=o,e.ga=e.ga||function(){(e.ga.q=e.ga.q||[]).push(arguments)},e.ga.l=1*new Date,c=a.createElement(t),i=a.getElementsByTagName(t)[0],c.async=1,c.src="https://www.google-analytics.com/analytics.js",i.parentNode.insertBefore(c,i)}(window,document,"script",0,"ga"),ga("create","UA-116150854-1","auto"),ga("set","anonymizeIp",!0),ga("send","pageview");var links=document.getElementsByTagName("a");if(Array.prototype.map.call(links,function(e){e.host!=document.location.host&&e.addEventListener("click",function(){var a=e.getAttribute("data-md-action")||"follow";ga("send","event","outbound",a,e.href)})}),document.forms.search){var query=document.forms.search.query;query.addEventListener("blur",function(){if(this.value){var e=document.location.pathname;ga("send","pageview",e+"?q="+this.value)}})}</script>
</body>
</html>

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

@ -0,0 +1,878 @@
<!doctype html>
<html lang="en" class="no-js">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
<meta http-equiv="x-ua-compatible" content="ie=edge">
<meta name="description" content="ESP8266/ESP32 WLAN configuration at run time with web interface">
<link rel="canonical" href="https://Hieromon.github.io/AutoConnect/apiextra.html">
<meta name="author" content="Hieromon Ikasamo">
<meta name="lang:clipboard.copy" content="Copy to clipboard">
<meta name="lang:clipboard.copied" content="Copied to clipboard">
<meta name="lang:search.language" content="en">
<meta name="lang:search.pipeline.stopwords" content="True">
<meta name="lang:search.pipeline.trimmer" content="True">
<meta name="lang:search.result.none" content="No matching documents">
<meta name="lang:search.result.one" content="1 matching document">
<meta name="lang:search.result.other" content="# matching documents">
<meta name="lang:search.tokenizer" content="[\s\-]+">
<link rel="shortcut icon" href="assets/images/favicon.png">
<meta name="generator" content="mkdocs-1.0.4, mkdocs-material-4.0.1">
<title>Something extra - AutoConnect for ESP8266/ESP32</title>
<link rel="stylesheet" href="assets/stylesheets/application.982221ab.css">
<link rel="stylesheet" href="assets/stylesheets/application-palette.224b79ff.css">
<meta name="theme-color" content="#3f51b5">
<script src="assets/javascripts/modernizr.1f0bcf2b.js"></script>
<link href="https://fonts.gstatic.com" rel="preconnect" crossorigin>
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,400,400i,700|Roboto+Mono">
<style>body,input{font-family:"Roboto","Helvetica Neue",Helvetica,Arial,sans-serif}code,kbd,pre{font-family:"Roboto Mono","Courier New",Courier,monospace}</style>
<link rel="stylesheet" href="assets/fonts/material-icons.css">
<link rel="stylesheet" href="css/paragraph.css">
<link rel="stylesheet" href="css/extra.css">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.6.1/css/all.css">
<script>
window.ga = window.ga || function() {
(ga.q = ga.q || []).push(arguments)
}
ga.l = +new Date
/* Setup integration and send page view */
ga("create", "UA-116150854-1", "auto")
ga("set", "anonymizeIp", true)
ga("send", "pageview")
/* Register handler to log search on blur */
document.addEventListener("DOMContentLoaded", () => {
if (document.forms.search) {
var query = document.forms.search.query
query.addEventListener("blur", function() {
if (this.value) {
var path = document.location.pathname;
ga("send", "pageview", path + "?q=" + this.value)
}
})
}
})
</script>
<script async src="https://www.google-analytics.com/analytics.js"></script>
</head>
<body dir="ltr" data-md-color-primary="indigo" data-md-color-accent="indigo">
<svg class="md-svg">
<defs>
<svg xmlns="http://www.w3.org/2000/svg" width="416" height="448"
viewBox="0 0 416 448" id="__github">
<path fill="currentColor" d="M160 304q0 10-3.125 20.5t-10.75 19-18.125
8.5-18.125-8.5-10.75-19-3.125-20.5 3.125-20.5 10.75-19 18.125-8.5
18.125 8.5 10.75 19 3.125 20.5zM320 304q0 10-3.125 20.5t-10.75
19-18.125 8.5-18.125-8.5-10.75-19-3.125-20.5 3.125-20.5 10.75-19
18.125-8.5 18.125 8.5 10.75 19 3.125 20.5zM360
304q0-30-17.25-51t-46.75-21q-10.25 0-48.75 5.25-17.75 2.75-39.25
2.75t-39.25-2.75q-38-5.25-48.75-5.25-29.5 0-46.75 21t-17.25 51q0 22 8
38.375t20.25 25.75 30.5 15 35 7.375 37.25 1.75h42q20.5 0
37.25-1.75t35-7.375 30.5-15 20.25-25.75 8-38.375zM416 260q0 51.75-15.25
82.75-9.5 19.25-26.375 33.25t-35.25 21.5-42.5 11.875-42.875 5.5-41.75
1.125q-19.5 0-35.5-0.75t-36.875-3.125-38.125-7.5-34.25-12.875-30.25-20.25-21.5-28.75q-15.5-30.75-15.5-82.75
0-59.25 34-99-6.75-20.5-6.75-42.5 0-29 12.75-54.5 27 0 47.5 9.875t47.25
30.875q36.75-8.75 77.25-8.75 37 0 70 8 26.25-20.5
46.75-30.25t47.25-9.75q12.75 25.5 12.75 54.5 0 21.75-6.75 42 34 40 34
99.5z" />
</svg>
</defs>
</svg>
<input class="md-toggle" data-md-toggle="drawer" type="checkbox" id="__drawer" autocomplete="off">
<input class="md-toggle" data-md-toggle="search" type="checkbox" id="__search" autocomplete="off">
<label class="md-overlay" data-md-component="overlay" for="__drawer"></label>
<a href="#icons" tabindex="1" class="md-skip">
Skip to content
</a>
<header class="md-header" data-md-component="header">
<nav class="md-header-nav md-grid">
<div class="md-flex">
<div class="md-flex__cell md-flex__cell--shrink">
<a href="https://Hieromon.github.io/AutoConnect/" title="AutoConnect for ESP8266/ESP32" class="md-header-nav__button md-logo">
<img src="images/arduino-logo.svg" width="24" height="24">
</a>
</div>
<div class="md-flex__cell md-flex__cell--shrink">
<label class="md-icon md-icon--menu md-header-nav__button" for="__drawer"></label>
</div>
<div class="md-flex__cell md-flex__cell--stretch">
<div class="md-flex__ellipsis md-header-nav__title" data-md-component="title">
<span class="md-header-nav__topic">
AutoConnect for ESP8266/ESP32
</span>
<span class="md-header-nav__topic">
Something extra
</span>
</div>
</div>
<div class="md-flex__cell md-flex__cell--shrink">
<label class="md-icon md-icon--search md-header-nav__button" for="__search"></label>
<div class="md-search" data-md-component="search" role="dialog">
<label class="md-search__overlay" for="__search"></label>
<div class="md-search__inner" role="search">
<form class="md-search__form" name="search">
<input type="text" class="md-search__input" name="query" placeholder="Search" autocapitalize="off" autocorrect="off" autocomplete="off" spellcheck="false" data-md-component="query" data-md-state="active">
<label class="md-icon md-search__icon" for="__search"></label>
<button type="reset" class="md-icon md-search__icon" data-md-component="reset" tabindex="-1">
&#xE5CD;
</button>
</form>
<div class="md-search__output">
<div class="md-search__scrollwrap" data-md-scrollfix>
<div class="md-search-result" data-md-component="result">
<div class="md-search-result__meta">
Type to start searching
</div>
<ol class="md-search-result__list"></ol>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="md-flex__cell md-flex__cell--shrink">
<div class="md-header-nav__source">
<a href="https://github.com/Hieromon/AutoConnect" title="Go to repository" class="md-source" data-md-source="github">
<div class="md-source__icon">
<svg viewBox="0 0 24 24" width="24" height="24">
<use xlink:href="#__github" width="24" height="24"></use>
</svg>
</div>
<div class="md-source__repository">
Hieromon/AutoConnect
</div>
</a>
</div>
</div>
</div>
</nav>
</header>
<div class="md-container">
<nav class="md-tabs md-tabs--active" data-md-component="tabs">
<div class="md-tabs__inner md-grid">
<ul class="md-tabs__list">
<li class="md-tabs__item">
<a href="index.html" title="Overview" class="md-tabs__link">
Overview
</a>
</li>
<li class="md-tabs__item">
<a href="acintro.html" title="Custom Web pages" class="md-tabs__link">
Custom Web pages
</a>
</li>
<li class="md-tabs__item">
<a href="api.html" title="Library APIs" class="md-tabs__link md-tabs__link--active">
Library APIs
</a>
</li>
<li class="md-tabs__item">
<a href="howtoembed.html" title="Examples" class="md-tabs__link">
Examples
</a>
</li>
</ul>
</div>
</nav>
<main class="md-main">
<div class="md-main__inner md-grid" data-md-component="container">
<div class="md-sidebar md-sidebar--primary" data-md-component="navigation">
<div class="md-sidebar__scrollwrap">
<div class="md-sidebar__inner">
<nav class="md-nav md-nav--primary" data-md-level="0">
<label class="md-nav__title md-nav__title--site" for="__drawer">
<a href="https://Hieromon.github.io/AutoConnect/" title="AutoConnect for ESP8266/ESP32" class="md-nav__button md-logo">
<img src="images/arduino-logo.svg" width="48" height="48">
</a>
AutoConnect for ESP8266/ESP32
</label>
<div class="md-nav__source">
<a href="https://github.com/Hieromon/AutoConnect" title="Go to repository" class="md-source" data-md-source="github">
<div class="md-source__icon">
<svg viewBox="0 0 24 24" width="24" height="24">
<use xlink:href="#__github" width="24" height="24"></use>
</svg>
</div>
<div class="md-source__repository">
Hieromon/AutoConnect
</div>
</a>
</div>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="index.html" title="Overview" class="md-nav__link">
Overview
</a>
</li>
<li class="md-nav__item">
<a href="gettingstarted.html" title="Getting started" class="md-nav__link">
Getting started
</a>
</li>
<li class="md-nav__item">
<a href="menu.html" title="AutoConnect menu" class="md-nav__link">
AutoConnect menu
</a>
</li>
<li class="md-nav__item">
<a href="basicusage.html" title="Basic usage" class="md-nav__link">
Basic usage
</a>
</li>
<li class="md-nav__item">
<a href="advancedusage.html" title="Advanced usage" class="md-nav__link">
Advanced usage
</a>
</li>
<li class="md-nav__item md-nav__item--nested">
<input class="md-toggle md-nav__toggle" data-md-toggle="nav-6" type="checkbox" id="nav-6">
<label class="md-nav__link" for="nav-6">
Custom Web pages
</label>
<nav class="md-nav" data-md-component="collapsible" data-md-level="1">
<label class="md-nav__title" for="nav-6">
Custom Web pages
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="acintro.html" title="Custom Web pages with AutoConnect" class="md-nav__link">
Custom Web pages with AutoConnect
</a>
</li>
<li class="md-nav__item">
<a href="acelements.html" title="AutoConnectElements" class="md-nav__link">
AutoConnectElements
</a>
</li>
<li class="md-nav__item">
<a href="acjson.html" title="Custom Web pages with JSON" class="md-nav__link">
Custom Web pages with JSON
</a>
</li>
<li class="md-nav__item">
<a href="achandling.html" title="Handling the custom Web pages" class="md-nav__link">
Handling the custom Web pages
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item md-nav__item--active md-nav__item--nested">
<input class="md-toggle md-nav__toggle" data-md-toggle="nav-7" type="checkbox" id="nav-7" checked>
<label class="md-nav__link" for="nav-7">
Library APIs
</label>
<nav class="md-nav" data-md-component="collapsible" data-md-level="1">
<label class="md-nav__title" for="nav-7">
Library APIs
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="api.html" title="AutoConnect API" class="md-nav__link">
AutoConnect API
</a>
</li>
<li class="md-nav__item">
<a href="apiaux.html" title="AutoConnectAux API" class="md-nav__link">
AutoConnectAux API
</a>
</li>
<li class="md-nav__item">
<a href="apiconfig.html" title="AutoConnectConfig API" class="md-nav__link">
AutoConnectConfig API
</a>
</li>
<li class="md-nav__item">
<a href="apielements.html" title="AutoConnectElements API" class="md-nav__link">
AutoConnectElements API
</a>
</li>
<li class="md-nav__item md-nav__item--active">
<input class="md-toggle md-nav__toggle" data-md-toggle="toc" type="checkbox" id="__toc">
<label class="md-nav__link md-nav__link--active" for="__toc">
Something extra
</label>
<a href="apiextra.html" title="Something extra" class="md-nav__link md-nav__link--active">
Something extra
</a>
<nav class="md-nav md-nav--secondary">
<label class="md-nav__title" for="__toc">Table of contents</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="#icons" title=" Icons" class="md-nav__link">
Icons
</a>
</li>
</ul>
</nav>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item md-nav__item--nested">
<input class="md-toggle md-nav__toggle" data-md-toggle="nav-8" type="checkbox" id="nav-8">
<label class="md-nav__link" for="nav-8">
Examples
</label>
<nav class="md-nav" data-md-component="collapsible" data-md-level="1">
<label class="md-nav__title" for="nav-8">
Examples
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="howtoembed.html" title="How to embed" class="md-nav__link">
How to embed
</a>
</li>
<li class="md-nav__item">
<a href="datatips.html" title="Tips for data conversion" class="md-nav__link">
Tips for data conversion
</a>
</li>
<li class="md-nav__item">
<a href="menuize.html" title="Attach the menu" class="md-nav__link">
Attach the menu
</a>
</li>
<li class="md-nav__item">
<a href="wojson.html" title="Custom Web pages w/o JSON" class="md-nav__link">
Custom Web pages w/o JSON
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item">
<a href="lsbegin.html" title="Appendix" class="md-nav__link">
Appendix
</a>
</li>
<li class="md-nav__item">
<a href="faq.html" title="FAQ" class="md-nav__link">
FAQ
</a>
</li>
<li class="md-nav__item">
<a href="changelog.html" title="Change log" class="md-nav__link">
Change log
</a>
</li>
<li class="md-nav__item">
<a href="license.html" title="License" class="md-nav__link">
License
</a>
</li>
</ul>
</nav>
</div>
</div>
</div>
<div class="md-sidebar md-sidebar--secondary" data-md-component="toc">
<div class="md-sidebar__scrollwrap">
<div class="md-sidebar__inner">
<nav class="md-nav md-nav--secondary">
<label class="md-nav__title" for="__toc">Table of contents</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="#icons" title=" Icons" class="md-nav__link">
Icons
</a>
</li>
</ul>
</nav>
</div>
</div>
</div>
<div class="md-content">
<article class="md-content__inner md-typeset">
<h1>Something extra</h1>
<h2 id="icons"><i class="fa fa-gift"></i> Icons<a class="headerlink" href="#icons" title="Permanent link">&para;</a></h2>
<p>The library presents two PNG icons which can be used to embed a hyperlink to the AutoConnect menu.</p>
<ul>
<li>Bar type <img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAApklEQVRYR2NkGGDAOMD2M4w6YDQEkEMgEJggZwCxGI0T5mug+alAvBFkD7IDXtLBcpjfXgEZ4ugOeAETpHEIgIwHeVYC3QH+0CgAS9AQgCwHRcFmdAfQ0E7cRo9mw0EVAqPlAKhwEKVTVsBZDsyiQ2k4Wg6gxPKgyoZ0Sn+o1iCHQBBQaiYQi9DYJTjbAyAJWluOtz0wWg7QOOqxGz+aDUdDYMBDAACA0x4hs/MPrwAAAABJRU5ErkJggg==" title="AutoConnect menu" alt="AutoConnect menu" /></li>
<li>Cog type <img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAC2klEQVRIS61VvWsUQRSfmU2pon9BUIkQUaKFaCBKgooSb2d3NSSFKbQR/KrEIiIKBiGF2CgRxEpjQNHs7mwOUcghwUQ7g58IsbGxEBWsb2f8zR177s3t3S2cA8ftzPu993vzvoaSnMu2vRKlaqgKp74Q/tE8qjQPyHGcrUrRjwlWShmDbFMURd/a6TcQwNiYUmpFCPElUebcuQ2vz6aNATMVReHEPwzfSSntDcNwNo2rI+DcvQzhpAbA40VKyV0p1Q9snzBG1qYVcYufXV1sREraDcxpyHdXgkfpRBj6Uwm2RsC5dxxmZ9pdOY9cKTISRcHTCmGiUCh4fYyplTwG2mAUbtMTBMHXOgK9QfyXEZr+TkgQ1oUwDA40hEgfIAfj+HuQRaBzAs9eKyUZ5Htx+T3ZODKG8DzOJMANhmGomJVMXPll+hx9UUAlzZrJJ4QNCDG3VEfguu7mcpmcB/gkBOtShhQhchAlu5jlLUgc9ENgyP5gf9+y6LTv+58p5zySkgwzLNOIGc8sEoT1Lc53NMlbCQQuvMxeCME1NNPVVkmH/i3IzzXDtCSA0qQQwZWOCJDY50jsQRjJmkslEOxvTcDRO6zPxOh5xZglKkYLhWM9jMVnkIsTyMT6NBj7IbOCEjm6HxNVVTo2WXqEWJZ1T8rytB6GxizyDkPhWVpBqfiXUtbo/HywYJSpA9kMamNNPZ71R9Hcm+TMHHZNGw3EuraXEUldbfvw25UdOjqOt+JhMwJd7+jSTpZaEiIcaCDwPK83jtWnTkwnunFMtxeL/ge9r4XItt1RNNaj/0GAcV2bR3U5sG3nEh6M61US+Qrfd9Bs31GGulI2GOS/8dgcQZV1w+ApjIxB7TDwF9GcNzJzoA+rD0/8HvPnXQJCt2qFCwbBTfRI7UyXumWVt+HJ9NO4XI++bdsb0YyrqXmlh+AWOLHaLqS5CLQR5EggR3YlcVS9gKeH2hnX8r8Kmi1CAsl36QAAAABJRU5ErkJggg==" title="AutoConnect menu" alt="AutoConnect menu" /></li>
</ul>
<p>To reference the icon, use the <strong>AUTOCONNECT_LINK</strong> macro in the sketch. It expands into the string literal as an HTML <code>&lt;a&gt;&lt;/a&gt;</code> tag with PNG embedded of the AutoConnect menu hyperlinks. Icon type is specified by the parameter of the macro.</p>
<dl class="apidl">
<dd><span class="apidef">BAR_24</span>Bars icon, 24x24.</dd>
<dd><span class="apidef">BAR_32</span>Bars icon, 32x32.</dd>
<dd><span class="apidef">BAR_48</span>Bars icon, 48x48.</dd>
<dd><span class="apidef">COG_24</span>Cog icon, 24x24.</dd>
<dd><span class="apidef">COG_32</span>Cog icon, 32x32.</dd>
</dl>
<div class="admonition note">
<p class="admonition-title">Usage</p>
<div class="codehilite" style="background: #272822"><pre style="line-height: 125%"><span></span><span style="color: #f8f8f2">String</span> <span style="color: #f8f8f2">html</span> <span style="color: #f92672">=</span> <span style="color: #e6db74">&quot;&lt;html&gt;&quot;</span><span style="color: #f8f8f2">;</span>
<span style="color: #f8f8f2">html</span> <span style="color: #f92672">+=</span> <span style="color: #f8f8f2">AUTOCONNECT_LINK(BAR_32);</span>
<span style="color: #f8f8f2">html</span> <span style="color: #f92672">+=</span> <span style="color: #e6db74">&quot;&lt;/html&gt;&quot;</span><span style="color: #f8f8f2">;</span>
<span style="color: #f8f8f2">server.send(</span><span style="color: #ae81ff">200</span><span style="color: #f8f8f2">,</span> <span style="color: #e6db74">&quot;text/html&quot;</span><span style="color: #f8f8f2">,</span> <span style="color: #f8f8f2">html);</span>
</pre></div>
</div>
</article>
</div>
</div>
</main>
<footer class="md-footer">
<div class="md-footer-nav">
<nav class="md-footer-nav__inner md-grid">
<a href="apielements.html" title="AutoConnectElements API" class="md-flex md-footer-nav__link md-footer-nav__link--prev" rel="prev">
<div class="md-flex__cell md-flex__cell--shrink">
<i class="md-icon md-icon--arrow-back md-footer-nav__button"></i>
</div>
<div class="md-flex__cell md-flex__cell--stretch md-footer-nav__title">
<span class="md-flex__ellipsis">
<span class="md-footer-nav__direction">
Previous
</span>
AutoConnectElements API
</span>
</div>
</a>
<a href="howtoembed.html" title="How to embed" class="md-flex md-footer-nav__link md-footer-nav__link--next" rel="next">
<div class="md-flex__cell md-flex__cell--stretch md-footer-nav__title">
<span class="md-flex__ellipsis">
<span class="md-footer-nav__direction">
Next
</span>
How to embed
</span>
</div>
<div class="md-flex__cell md-flex__cell--shrink">
<i class="md-icon md-icon--arrow-forward md-footer-nav__button"></i>
</div>
</a>
</nav>
</div>
<div class="md-footer-meta md-typeset">
<div class="md-footer-meta__inner md-grid">
<div class="md-footer-copyright">
<div class="md-footer-copyright__highlight">
Copyright &copy; 2018-2019 Hieromon Ikasamo
</div>
powered by
<a href="https://www.mkdocs.org">MkDocs</a>
and
<a href="https://squidfunk.github.io/mkdocs-material/">
Material for MkDocs</a>
</div>
<div class="md-footer-social">
<link rel="stylesheet" href="assets/fonts/font-awesome.css">
<a href="https://github.com/Hieromon" class="md-footer-social__link fa fa-github"></a>
<a href="https://twitter.com/hieromon" class="md-footer-social__link fa fa-twitter"></a>
</div>
</div>
</div>
</footer>
</div>
<script src="assets/javascripts/application.b806dc00.js"></script>
<script>app.initialize({version:"1.0.4",url:{base:"."}})</script>
<script src="js/gifffer.min.js"></script>
</body>
</html>

File diff suppressed because one or more lines are too long

@ -0,0 +1,13 @@
/*!
* Licensed under the Apache License, Version 2.0 (the "License"); you may not
* use this file except in compliance with the License. You may obtain a copy
* of the License at:
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* UNLESS REQUIRED BY APPLICABLE LAW OR AGREED TO IN WRITING, SOFTWARE
* DISTRIBUTED UNDER THE LICENSE IS DISTRIBUTED ON AN "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, EITHER EXPRESS OR IMPLIED.
* SEE THE LICENSE FOR THE SPECIFIC LANGUAGE GOVERNING PERMISSIONS AND
* LIMITATIONS UNDER THE LICENSE.
*/@font-face{font-family:"Material Icons";font-style:normal;font-weight:400;src:local("Material Icons"),local("MaterialIcons-Regular"),url("specimen/MaterialIcons-Regular.woff2") format("woff2"),url("specimen/MaterialIcons-Regular.woff") format("woff"),url("specimen/MaterialIcons-Regular.ttf") format("truetype")}

@ -1,5 +1,5 @@
<svg xmlns="http://www.w3.org/2000/svg" width="352" height="448"
viewBox="0 0 352 448" id="bitbucket">
viewBox="0 0 352 448" id="__bitbucket">
<path fill="currentColor" d="M203.75 214.75q2 15.75-12.625 25.25t-27.875
1.5q-9.75-4.25-13.375-14.5t-0.125-20.5 13-14.5q9-4.5 18.125-3t16 8.875
6.875 16.875zM231.5 209.5q-3.5-26.75-28.25-41t-49.25-3.25q-15.75

Before

Width:  |  Height:  |  Size: 1.4 KiB

After

Width:  |  Height:  |  Size: 1.4 KiB

@ -1,5 +1,5 @@
<svg xmlns="http://www.w3.org/2000/svg" width="416" height="448"
viewBox="0 0 416 448" id="github">
viewBox="0 0 416 448" id="__github">
<path fill="currentColor" d="M160 304q0 10-3.125 20.5t-10.75 19-18.125
8.5-18.125-8.5-10.75-19-3.125-20.5 3.125-20.5 10.75-19 18.125-8.5
18.125 8.5 10.75 19 3.125 20.5zM320 304q0 10-3.125 20.5t-10.75

Before

Width:  |  Height:  |  Size: 1.2 KiB

After

Width:  |  Height:  |  Size: 1.2 KiB

@ -1,5 +1,5 @@
<svg xmlns="http://www.w3.org/2000/svg" width="500" height="500"
viewBox="0 0 500 500" id="gitlab">
viewBox="0 0 500 500" id="__gitlab">
<g transform="translate(156.197863, 1.160267)">
<path fill="currentColor"
d="M93.667,473.347L93.667,473.347l90.684-279.097H2.983L93.667,

Before

Width:  |  Height:  |  Size: 1.6 KiB

After

Width:  |  Height:  |  Size: 1.6 KiB

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

@ -1 +1 @@
!function(e,r){"function"==typeof define&&define.amd?define(r):"object"==typeof exports?module.exports=r():r()(e.lunr)}(this,function(){return function(e){if(void 0===e)throw new Error("Lunr is not present. Please include / require Lunr before this script.");if(void 0===e.stemmerSupport)throw new Error("Lunr stemmer support is not present. Please include / require Lunr stemmer support before this script.");var r,i,n;e.da=function(){this.pipeline.reset(),this.pipeline.add(e.da.trimmer,e.da.stopWordFilter,e.da.stemmer),this.searchPipeline&&(this.searchPipeline.reset(),this.searchPipeline.add(e.da.stemmer))},e.da.wordCharacters="A-Za-zªºÀ-ÖØ-öø-ʸˠ-ˤᴀ-ᴥᴬ-ᵜᵢ-ᵥᵫ-ᵷᵹ-ᶾḀ-ỿⁱⁿₐ-ₜKÅℲⅎⅠ-ↈⱠ-ⱿꜢ-ꞇꞋ-ꞭꞰ-ꞷꟷ-ꟿꬰ-ꭚꭜ-ꭤff-stA-Za-z",e.da.trimmer=e.trimmerSupport.generateTrimmer(e.da.wordCharacters),e.Pipeline.registerFunction(e.da.trimmer,"trimmer-da"),e.da.stemmer=(r=e.stemmerSupport.Among,i=e.stemmerSupport.SnowballProgram,n=new function(){var e,n,t,s=[new r("hed",-1,1),new r("ethed",0,1),new r("ered",-1,1),new r("e",-1,1),new r("erede",3,1),new r("ende",3,1),new r("erende",5,1),new r("ene",3,1),new r("erne",3,1),new r("ere",3,1),new r("en",-1,1),new r("heden",10,1),new r("eren",10,1),new r("er",-1,1),new r("heder",13,1),new r("erer",13,1),new r("s",-1,2),new r("heds",16,1),new r("es",16,1),new r("endes",18,1),new r("erendes",19,1),new r("enes",18,1),new r("ernes",18,1),new r("eres",18,1),new r("ens",16,1),new r("hedens",24,1),new r("erens",24,1),new r("ers",16,1),new r("ets",16,1),new r("erets",28,1),new r("et",-1,1),new r("eret",30,1)],o=[new r("gd",-1,-1),new r("dt",-1,-1),new r("gt",-1,-1),new r("kt",-1,-1)],a=[new r("ig",-1,1),new r("lig",0,1),new r("elig",1,1),new r("els",-1,1),new r("løst",-1,2)],d=[17,65,16,1,0,0,0,0,0,0,0,0,0,0,0,0,48,0,128],u=[239,254,42,3,0,0,0,0,0,0,0,0,0,0,0,0,16],c=new i;function l(){var e,r=c.limit-c.cursor;c.cursor>=n&&(e=c.limit_backward,c.limit_backward=n,c.ket=c.cursor,c.find_among_b(o,4)?(c.bra=c.cursor,c.limit_backward=e,c.cursor=c.limit-r,c.cursor>c.limit_backward&&(c.cursor--,c.bra=c.cursor,c.slice_del())):c.limit_backward=e)}this.setCurrent=function(e){c.setCurrent(e)},this.getCurrent=function(){return c.getCurrent()},this.stem=function(){var r,i=c.cursor;return function(){var r,i=c.cursor+3;if(n=c.limit,0<=i&&i<=c.limit){for(e=i;;){if(r=c.cursor,c.in_grouping(d,97,248)){c.cursor=r;break}if(c.cursor=r,r>=c.limit)return;c.cursor++}for(;!c.out_grouping(d,97,248);){if(c.cursor>=c.limit)return;c.cursor++}(n=c.cursor)<e&&(n=e)}}(),c.limit_backward=i,c.cursor=c.limit,function(){var e,r;if(c.cursor>=n&&(r=c.limit_backward,c.limit_backward=n,c.ket=c.cursor,e=c.find_among_b(s,32),c.limit_backward=r,e))switch(c.bra=c.cursor,e){case 1:c.slice_del();break;case 2:c.in_grouping_b(u,97,229)&&c.slice_del()}}(),c.cursor=c.limit,l(),c.cursor=c.limit,function(){var e,r,i,t=c.limit-c.cursor;if(c.ket=c.cursor,c.eq_s_b(2,"st")&&(c.bra=c.cursor,c.eq_s_b(2,"ig")&&c.slice_del()),c.cursor=c.limit-t,c.cursor>=n&&(r=c.limit_backward,c.limit_backward=n,c.ket=c.cursor,e=c.find_among_b(a,5),c.limit_backward=r,e))switch(c.bra=c.cursor,e){case 1:c.slice_del(),i=c.limit-c.cursor,l(),c.cursor=c.limit-i;break;case 2:c.slice_from("løs")}}(),c.cursor=c.limit,c.cursor>=n&&(r=c.limit_backward,c.limit_backward=n,c.ket=c.cursor,c.out_grouping_b(d,97,248)?(c.bra=c.cursor,t=c.slice_to(t),c.limit_backward=r,c.eq_v_b(t)&&c.slice_del()):c.limit_backward=r),!0}},function(e){return"function"==typeof e.update?e.update(function(e){return n.setCurrent(e),n.stem(),n.getCurrent()}):(n.setCurrent(e),n.stem(),n.getCurrent())}),e.Pipeline.registerFunction(e.da.stemmer,"stemmer-da"),e.da.stopWordFilter=e.generateStopWordFilter("ad af alle alt anden at blev blive bliver da de dem den denne der deres det dette dig din disse dog du efter eller en end er et for fra ham han hans har havde have hende hendes her hos hun hvad hvis hvor i ikke ind jeg jer jo kunne man mange med meget men mig min mine mit mod ned noget nogle nu når og også om op os over på selv sig sin sine sit skal skulle som sådan thi til ud under var vi vil ville vor være været".split(" ")),e.Pipeline.registerFunction(e.da.stopWordFilter,"stopWordFilter-da")}});
!function(e,r){"function"==typeof define&&define.amd?define(r):"object"==typeof exports?module.exports=r():r()(e.lunr)}(this,function(){return function(e){if(void 0===e)throw new Error("Lunr is not present. Please include / require Lunr before this script.");if(void 0===e.stemmerSupport)throw new Error("Lunr stemmer support is not present. Please include / require Lunr stemmer support before this script.");var r,m,i;e.da=function(){this.pipeline.reset(),this.pipeline.add(e.da.trimmer,e.da.stopWordFilter,e.da.stemmer),this.searchPipeline&&(this.searchPipeline.reset(),this.searchPipeline.add(e.da.stemmer))},e.da.wordCharacters="A-Za-zªºÀ-ÖØ-öø-ʸˠ-ˤᴀ-ᴥᴬ-ᵜᵢ-ᵥᵫ-ᵷᵹ-ᶾḀ-ỿⁱⁿₐ-ₜKÅℲⅎⅠ-ↈⱠ-ⱿꜢ-ꞇꞋ-ꞭꞰ-ꞷꟷ-ꟿꬰ-ꭚꭜ-ꭤff-stA-Za-z",e.da.trimmer=e.trimmerSupport.generateTrimmer(e.da.wordCharacters),e.Pipeline.registerFunction(e.da.trimmer,"trimmer-da"),e.da.stemmer=(r=e.stemmerSupport.Among,m=e.stemmerSupport.SnowballProgram,i=new function(){var i,t,n,s=[new r("hed",-1,1),new r("ethed",0,1),new r("ered",-1,1),new r("e",-1,1),new r("erede",3,1),new r("ende",3,1),new r("erende",5,1),new r("ene",3,1),new r("erne",3,1),new r("ere",3,1),new r("en",-1,1),new r("heden",10,1),new r("eren",10,1),new r("er",-1,1),new r("heder",13,1),new r("erer",13,1),new r("s",-1,2),new r("heds",16,1),new r("es",16,1),new r("endes",18,1),new r("erendes",19,1),new r("enes",18,1),new r("ernes",18,1),new r("eres",18,1),new r("ens",16,1),new r("hedens",24,1),new r("erens",24,1),new r("ers",16,1),new r("ets",16,1),new r("erets",28,1),new r("et",-1,1),new r("eret",30,1)],o=[new r("gd",-1,-1),new r("dt",-1,-1),new r("gt",-1,-1),new r("kt",-1,-1)],a=[new r("ig",-1,1),new r("lig",0,1),new r("elig",1,1),new r("els",-1,1),new r("løst",-1,2)],d=[17,65,16,1,0,0,0,0,0,0,0,0,0,0,0,0,48,0,128],u=[239,254,42,3,0,0,0,0,0,0,0,0,0,0,0,0,16],c=new m;function l(){var e,r=c.limit-c.cursor;c.cursor>=t&&(e=c.limit_backward,c.limit_backward=t,c.ket=c.cursor,c.find_among_b(o,4)?(c.bra=c.cursor,c.limit_backward=e,c.cursor=c.limit-r,c.cursor>c.limit_backward&&(c.cursor--,c.bra=c.cursor,c.slice_del())):c.limit_backward=e)}this.setCurrent=function(e){c.setCurrent(e)},this.getCurrent=function(){return c.getCurrent()},this.stem=function(){var e,r=c.cursor;return function(){var e,r=c.cursor+3;if(t=c.limit,0<=r&&r<=c.limit){for(i=r;;){if(e=c.cursor,c.in_grouping(d,97,248)){c.cursor=e;break}if((c.cursor=e)>=c.limit)return;c.cursor++}for(;!c.out_grouping(d,97,248);){if(c.cursor>=c.limit)return;c.cursor++}(t=c.cursor)<i&&(t=i)}}(),c.limit_backward=r,c.cursor=c.limit,function(){var e,r;if(c.cursor>=t&&(r=c.limit_backward,c.limit_backward=t,c.ket=c.cursor,e=c.find_among_b(s,32),c.limit_backward=r,e))switch(c.bra=c.cursor,e){case 1:c.slice_del();break;case 2:c.in_grouping_b(u,97,229)&&c.slice_del()}}(),c.cursor=c.limit,l(),c.cursor=c.limit,function(){var e,r,i,n=c.limit-c.cursor;if(c.ket=c.cursor,c.eq_s_b(2,"st")&&(c.bra=c.cursor,c.eq_s_b(2,"ig")&&c.slice_del()),c.cursor=c.limit-n,c.cursor>=t&&(r=c.limit_backward,c.limit_backward=t,c.ket=c.cursor,e=c.find_among_b(a,5),c.limit_backward=r,e))switch(c.bra=c.cursor,e){case 1:c.slice_del(),i=c.limit-c.cursor,l(),c.cursor=c.limit-i;break;case 2:c.slice_from("løs")}}(),c.cursor=c.limit,c.cursor>=t&&(e=c.limit_backward,c.limit_backward=t,c.ket=c.cursor,c.out_grouping_b(d,97,248)?(c.bra=c.cursor,n=c.slice_to(n),c.limit_backward=e,c.eq_v_b(n)&&c.slice_del()):c.limit_backward=e),!0}},function(e){return"function"==typeof e.update?e.update(function(e){return i.setCurrent(e),i.stem(),i.getCurrent()}):(i.setCurrent(e),i.stem(),i.getCurrent())}),e.Pipeline.registerFunction(e.da.stemmer,"stemmer-da"),e.da.stopWordFilter=e.generateStopWordFilter("ad af alle alt anden at blev blive bliver da de dem den denne der deres det dette dig din disse dog du efter eller en end er et for fra ham han hans har havde have hende hendes her hos hun hvad hvis hvor i ikke ind jeg jer jo kunne man mange med meget men mig min mine mit mod ned noget nogle nu når og også om op os over på selv sig sin sine sit skal skulle som sådan thi til ud under var vi vil ville vor være været".split(" ")),e.Pipeline.registerFunction(e.da.stopWordFilter,"stopWordFilter-da")}});

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

@ -1 +1 @@
!function(e,r){"function"==typeof define&&define.amd?define(r):"object"==typeof exports?module.exports=r():r()(e.lunr)}(this,function(){return function(e){if(void 0===e)throw new Error("Lunr is not present. Please include / require Lunr before this script.");if(void 0===e.stemmerSupport)throw new Error("Lunr stemmer support is not present. Please include / require Lunr stemmer support before this script.");var r="2"==e.version[0];e.jp=function(){this.pipeline.reset(),this.pipeline.add(e.jp.stopWordFilter,e.jp.stemmer),r?this.tokenizer=e.jp.tokenizer:(e.tokenizer&&(e.tokenizer=e.jp.tokenizer),this.tokenizerFn&&(this.tokenizerFn=e.jp.tokenizer))};var t=new e.TinySegmenter;e.jp.tokenizer=function(n){if(!arguments.length||null==n||null==n)return[];if(Array.isArray(n))return n.map(function(t){return r?new e.Token(t.toLowerCase()):t.toLowerCase()});for(var i=n.toString().toLowerCase().replace(/^\s+/,""),o=i.length-1;o>=0;o--)if(/\S/.test(i.charAt(o))){i=i.substring(0,o+1);break}return t.segment(i).filter(function(e){return!!e}).map(function(t){return r?new e.Token(t):t})},e.jp.stemmer=function(e){return e},e.Pipeline.registerFunction(e.jp.stemmer,"stemmer-jp"),e.jp.wordCharacters="一二三四五六七八九十百千万億兆一-龠々〆ヵヶぁ-んァ-ヴーア-ン゙a-zA-Za-zA-Z0-90-9",e.jp.stopWordFilter=function(t){if(-1===e.jp.stopWordFilter.stopWords.indexOf(r?t.toString():t))return t},e.jp.stopWordFilter=e.generateStopWordFilter("これ それ あれ この その あの ここ そこ あそこ こちら どこ だれ なに なん 何 私 貴方 貴方方 我々 私達 あの人 あのかた 彼女 彼 です あります おります います は が の に を で え から まで より も どの と し それで しかし".split(" ")),e.Pipeline.registerFunction(e.jp.stopWordFilter,"stopWordFilter-jp")}});
!function(e,r){"function"==typeof define&&define.amd?define(r):"object"==typeof exports?module.exports=r():r()(e.lunr)}(this,function(){return function(n){if(void 0===n)throw new Error("Lunr is not present. Please include / require Lunr before this script.");if(void 0===n.stemmerSupport)throw new Error("Lunr stemmer support is not present. Please include / require Lunr stemmer support before this script.");var i="2"==n.version[0];n.jp=function(){this.pipeline.reset(),this.pipeline.add(n.jp.stopWordFilter,n.jp.stemmer),i?this.tokenizer=n.jp.tokenizer:(n.tokenizer&&(n.tokenizer=n.jp.tokenizer),this.tokenizerFn&&(this.tokenizerFn=n.jp.tokenizer))};var o=new n.TinySegmenter;n.jp.tokenizer=function(e){if(!arguments.length||null==e||null==e)return[];if(Array.isArray(e))return e.map(function(e){return i?new n.Token(e.toLowerCase()):e.toLowerCase()});for(var r=e.toString().toLowerCase().replace(/^\s+/,""),t=r.length-1;0<=t;t--)if(/\S/.test(r.charAt(t))){r=r.substring(0,t+1);break}return o.segment(r).filter(function(e){return!!e}).map(function(e){return i?new n.Token(e):e})},n.jp.stemmer=function(e){return e},n.Pipeline.registerFunction(n.jp.stemmer,"stemmer-jp"),n.jp.wordCharacters="一二三四五六七八九十百千万億兆一-龠々〆ヵヶぁ-んァ-ヴーア-ン゙a-zA-Za-zA-Z0-90-9",n.jp.stopWordFilter=function(e){if(-1===n.jp.stopWordFilter.stopWords.indexOf(i?e.toString():e))return e},n.jp.stopWordFilter=n.generateStopWordFilter("これ それ あれ この その あの ここ そこ あそこ こちら どこ だれ なに なん 何 私 貴方 貴方方 我々 私達 あの人 あのかた 彼女 彼 です あります おります います は が の に を で え から まで より も どの と し それで しかし".split(" ")),n.Pipeline.registerFunction(n.jp.stopWordFilter,"stopWordFilter-jp")}});

@ -1 +1 @@
!function(e,i){"function"==typeof define&&define.amd?define(i):"object"==typeof exports?module.exports=i():i()(e.lunr)}(this,function(){return function(e){e.multiLanguage=function(){for(var i=Array.prototype.slice.call(arguments),t=i.join("-"),r="",n=[],s=[],p=0;p<i.length;++p)"en"==i[p]?(r+="\\w",n.unshift(e.stopWordFilter),n.push(e.stemmer),s.push(e.stemmer)):(r+=e[i[p]].wordCharacters,n.unshift(e[i[p]].stopWordFilter),n.push(e[i[p]].stemmer),s.push(e[i[p]].stemmer));var o=e.trimmerSupport.generateTrimmer(r);return e.Pipeline.registerFunction(o,"lunr-multi-trimmer-"+t),n.unshift(o),function(){this.pipeline.reset(),this.pipeline.add.apply(this.pipeline,n),this.searchPipeline&&(this.searchPipeline.reset(),this.searchPipeline.add.apply(this.searchPipeline,s))}}}});
!function(e,i){"function"==typeof define&&define.amd?define(i):"object"==typeof exports?module.exports=i():i()(e.lunr)}(this,function(){return function(o){o.multiLanguage=function(){for(var e=Array.prototype.slice.call(arguments),i=e.join("-"),t="",r=[],n=[],s=0;s<e.length;++s)"en"==e[s]?(t+="\\w",r.unshift(o.stopWordFilter),r.push(o.stemmer),n.push(o.stemmer)):(t+=o[e[s]].wordCharacters,r.unshift(o[e[s]].stopWordFilter),r.push(o[e[s]].stemmer),n.push(o[e[s]].stemmer));var p=o.trimmerSupport.generateTrimmer(t);return o.Pipeline.registerFunction(p,"lunr-multi-trimmer-"+i),r.unshift(p),function(){this.pipeline.reset(),this.pipeline.add.apply(this.pipeline,r),this.searchPipeline&&(this.searchPipeline.reset(),this.searchPipeline.add.apply(this.searchPipeline,n))}}}});

@ -1 +1 @@
!function(e,r){"function"==typeof define&&define.amd?define(r):"object"==typeof exports?module.exports=r():r()(e.lunr)}(this,function(){return function(e){if(void 0===e)throw new Error("Lunr is not present. Please include / require Lunr before this script.");if(void 0===e.stemmerSupport)throw new Error("Lunr stemmer support is not present. Please include / require Lunr stemmer support before this script.");var r,n,i;e.no=function(){this.pipeline.reset(),this.pipeline.add(e.no.trimmer,e.no.stopWordFilter,e.no.stemmer),this.searchPipeline&&(this.searchPipeline.reset(),this.searchPipeline.add(e.no.stemmer))},e.no.wordCharacters="A-Za-zªºÀ-ÖØ-öø-ʸˠ-ˤᴀ-ᴥᴬ-ᵜᵢ-ᵥᵫ-ᵷᵹ-ᶾḀ-ỿⁱⁿₐ-ₜKÅℲⅎⅠ-ↈⱠ-ⱿꜢ-ꞇꞋ-ꞭꞰ-ꞷꟷ-ꟿꬰ-ꭚꭜ-ꭤff-stA-Za-z",e.no.trimmer=e.trimmerSupport.generateTrimmer(e.no.wordCharacters),e.Pipeline.registerFunction(e.no.trimmer,"trimmer-no"),e.no.stemmer=(r=e.stemmerSupport.Among,n=e.stemmerSupport.SnowballProgram,i=new function(){var e,i,t=[new r("a",-1,1),new r("e",-1,1),new r("ede",1,1),new r("ande",1,1),new r("ende",1,1),new r("ane",1,1),new r("ene",1,1),new r("hetene",6,1),new r("erte",1,3),new r("en",-1,1),new r("heten",9,1),new r("ar",-1,1),new r("er",-1,1),new r("heter",12,1),new r("s",-1,2),new r("as",14,1),new r("es",14,1),new r("edes",16,1),new r("endes",16,1),new r("enes",16,1),new r("hetenes",19,1),new r("ens",14,1),new r("hetens",21,1),new r("ers",14,1),new r("ets",14,1),new r("et",-1,1),new r("het",25,1),new r("ert",-1,3),new r("ast",-1,1)],o=[new r("dt",-1,-1),new r("vt",-1,-1)],s=[new r("leg",-1,1),new r("eleg",0,1),new r("ig",-1,1),new r("eig",2,1),new r("lig",2,1),new r("elig",4,1),new r("els",-1,1),new r("lov",-1,1),new r("elov",7,1),new r("slov",7,1),new r("hetslov",9,1)],a=[17,65,16,1,0,0,0,0,0,0,0,0,0,0,0,0,48,0,128],m=[119,125,149,1],l=new n;this.setCurrent=function(e){l.setCurrent(e)},this.getCurrent=function(){return l.getCurrent()},this.stem=function(){var r,n,u,d,c=l.cursor;return function(){var r,n=l.cursor+3;if(i=l.limit,0<=n||n<=l.limit){for(e=n;;){if(r=l.cursor,l.in_grouping(a,97,248)){l.cursor=r;break}if(r>=l.limit)return;l.cursor=r+1}for(;!l.out_grouping(a,97,248);){if(l.cursor>=l.limit)return;l.cursor++}(i=l.cursor)<e&&(i=e)}}(),l.limit_backward=c,l.cursor=l.limit,function(){var e,r,n;if(l.cursor>=i&&(r=l.limit_backward,l.limit_backward=i,l.ket=l.cursor,e=l.find_among_b(t,29),l.limit_backward=r,e))switch(l.bra=l.cursor,e){case 1:l.slice_del();break;case 2:n=l.limit-l.cursor,l.in_grouping_b(m,98,122)?l.slice_del():(l.cursor=l.limit-n,l.eq_s_b(1,"k")&&l.out_grouping_b(a,97,248)&&l.slice_del());break;case 3:l.slice_from("er")}}(),l.cursor=l.limit,n=l.limit-l.cursor,l.cursor>=i&&(r=l.limit_backward,l.limit_backward=i,l.ket=l.cursor,l.find_among_b(o,2)?(l.bra=l.cursor,l.limit_backward=r,l.cursor=l.limit-n,l.cursor>l.limit_backward&&(l.cursor--,l.bra=l.cursor,l.slice_del())):l.limit_backward=r),l.cursor=l.limit,l.cursor>=i&&(d=l.limit_backward,l.limit_backward=i,l.ket=l.cursor,(u=l.find_among_b(s,11))?(l.bra=l.cursor,l.limit_backward=d,1==u&&l.slice_del()):l.limit_backward=d),!0}},function(e){return"function"==typeof e.update?e.update(function(e){return i.setCurrent(e),i.stem(),i.getCurrent()}):(i.setCurrent(e),i.stem(),i.getCurrent())}),e.Pipeline.registerFunction(e.no.stemmer,"stemmer-no"),e.no.stopWordFilter=e.generateStopWordFilter("alle at av bare begge ble blei bli blir blitt både båe da de deg dei deim deira deires dem den denne der dere deres det dette di din disse ditt du dykk dykkar då eg ein eit eitt eller elles en enn er et ett etter for fordi fra før ha hadde han hans har hennar henne hennes her hjå ho hoe honom hoss hossen hun hva hvem hver hvilke hvilken hvis hvor hvordan hvorfor i ikke ikkje ikkje ingen ingi inkje inn inni ja jeg kan kom korleis korso kun kunne kva kvar kvarhelst kven kvi kvifor man mange me med medan meg meget mellom men mi min mine mitt mot mykje ned no noe noen noka noko nokon nokor nokre nå når og også om opp oss over på samme seg selv si si sia sidan siden sin sine sitt sjøl skal skulle slik so som som somme somt så sånn til um upp ut uten var vart varte ved vere verte vi vil ville vore vors vort vår være være vært å".split(" ")),e.Pipeline.registerFunction(e.no.stopWordFilter,"stopWordFilter-no")}});
!function(e,r){"function"==typeof define&&define.amd?define(r):"object"==typeof exports?module.exports=r():r()(e.lunr)}(this,function(){return function(e){if(void 0===e)throw new Error("Lunr is not present. Please include / require Lunr before this script.");if(void 0===e.stemmerSupport)throw new Error("Lunr stemmer support is not present. Please include / require Lunr stemmer support before this script.");var r,n,i;e.no=function(){this.pipeline.reset(),this.pipeline.add(e.no.trimmer,e.no.stopWordFilter,e.no.stemmer),this.searchPipeline&&(this.searchPipeline.reset(),this.searchPipeline.add(e.no.stemmer))},e.no.wordCharacters="A-Za-zªºÀ-ÖØ-öø-ʸˠ-ˤᴀ-ᴥᴬ-ᵜᵢ-ᵥᵫ-ᵷᵹ-ᶾḀ-ỿⁱⁿₐ-ₜKÅℲⅎⅠ-ↈⱠ-ⱿꜢ-ꞇꞋ-ꞭꞰ-ꞷꟷ-ꟿꬰ-ꭚꭜ-ꭤff-stA-Za-z",e.no.trimmer=e.trimmerSupport.generateTrimmer(e.no.wordCharacters),e.Pipeline.registerFunction(e.no.trimmer,"trimmer-no"),e.no.stemmer=(r=e.stemmerSupport.Among,n=e.stemmerSupport.SnowballProgram,i=new function(){var o,s,a=[new r("a",-1,1),new r("e",-1,1),new r("ede",1,1),new r("ande",1,1),new r("ende",1,1),new r("ane",1,1),new r("ene",1,1),new r("hetene",6,1),new r("erte",1,3),new r("en",-1,1),new r("heten",9,1),new r("ar",-1,1),new r("er",-1,1),new r("heter",12,1),new r("s",-1,2),new r("as",14,1),new r("es",14,1),new r("edes",16,1),new r("endes",16,1),new r("enes",16,1),new r("hetenes",19,1),new r("ens",14,1),new r("hetens",21,1),new r("ers",14,1),new r("ets",14,1),new r("et",-1,1),new r("het",25,1),new r("ert",-1,3),new r("ast",-1,1)],m=[new r("dt",-1,-1),new r("vt",-1,-1)],l=[new r("leg",-1,1),new r("eleg",0,1),new r("ig",-1,1),new r("eig",2,1),new r("lig",2,1),new r("elig",4,1),new r("els",-1,1),new r("lov",-1,1),new r("elov",7,1),new r("slov",7,1),new r("hetslov",9,1)],u=[17,65,16,1,0,0,0,0,0,0,0,0,0,0,0,0,48,0,128],d=[119,125,149,1],c=new n;this.setCurrent=function(e){c.setCurrent(e)},this.getCurrent=function(){return c.getCurrent()},this.stem=function(){var e,r,n,i,t=c.cursor;return function(){var e,r=c.cursor+3;if(s=c.limit,0<=r||r<=c.limit){for(o=r;;){if(e=c.cursor,c.in_grouping(u,97,248)){c.cursor=e;break}if(e>=c.limit)return;c.cursor=e+1}for(;!c.out_grouping(u,97,248);){if(c.cursor>=c.limit)return;c.cursor++}(s=c.cursor)<o&&(s=o)}}(),c.limit_backward=t,c.cursor=c.limit,function(){var e,r,n;if(c.cursor>=s&&(r=c.limit_backward,c.limit_backward=s,c.ket=c.cursor,e=c.find_among_b(a,29),c.limit_backward=r,e))switch(c.bra=c.cursor,e){case 1:c.slice_del();break;case 2:n=c.limit-c.cursor,c.in_grouping_b(d,98,122)?c.slice_del():(c.cursor=c.limit-n,c.eq_s_b(1,"k")&&c.out_grouping_b(u,97,248)&&c.slice_del());break;case 3:c.slice_from("er")}}(),c.cursor=c.limit,r=c.limit-c.cursor,c.cursor>=s&&(e=c.limit_backward,c.limit_backward=s,c.ket=c.cursor,c.find_among_b(m,2)?(c.bra=c.cursor,c.limit_backward=e,c.cursor=c.limit-r,c.cursor>c.limit_backward&&(c.cursor--,c.bra=c.cursor,c.slice_del())):c.limit_backward=e),c.cursor=c.limit,c.cursor>=s&&(i=c.limit_backward,c.limit_backward=s,c.ket=c.cursor,(n=c.find_among_b(l,11))?(c.bra=c.cursor,c.limit_backward=i,1==n&&c.slice_del()):c.limit_backward=i),!0}},function(e){return"function"==typeof e.update?e.update(function(e){return i.setCurrent(e),i.stem(),i.getCurrent()}):(i.setCurrent(e),i.stem(),i.getCurrent())}),e.Pipeline.registerFunction(e.no.stemmer,"stemmer-no"),e.no.stopWordFilter=e.generateStopWordFilter("alle at av bare begge ble blei bli blir blitt både båe da de deg dei deim deira deires dem den denne der dere deres det dette di din disse ditt du dykk dykkar då eg ein eit eitt eller elles en enn er et ett etter for fordi fra før ha hadde han hans har hennar henne hennes her hjå ho hoe honom hoss hossen hun hva hvem hver hvilke hvilken hvis hvor hvordan hvorfor i ikke ikkje ikkje ingen ingi inkje inn inni ja jeg kan kom korleis korso kun kunne kva kvar kvarhelst kven kvi kvifor man mange me med medan meg meget mellom men mi min mine mitt mot mykje ned no noe noen noka noko nokon nokor nokre nå når og også om opp oss over på samme seg selv si si sia sidan siden sin sine sitt sjøl skal skulle slik so som som somme somt så sånn til um upp ut uten var vart varte ved vere verte vi vil ville vore vors vort vår være være vært å".split(" ")),e.Pipeline.registerFunction(e.no.stopWordFilter,"stopWordFilter-no")}});

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

@ -1 +1 @@
!function(r,t){"function"==typeof define&&define.amd?define(t):"object"==typeof exports?module.exports=t():t()(r.lunr)}(this,function(){return function(r){r.stemmerSupport={Among:function(r,t,i,s){if(this.toCharArray=function(r){for(var t=r.length,i=new Array(t),s=0;s<t;s++)i[s]=r.charCodeAt(s);return i},!r&&""!=r||!t&&0!=t||!i)throw"Bad Among initialisation: s:"+r+", substring_i: "+t+", result: "+i;this.s_size=r.length,this.s=this.toCharArray(r),this.substring_i=t,this.result=i,this.method=s},SnowballProgram:function(){var r;return{bra:0,ket:0,limit:0,cursor:0,limit_backward:0,setCurrent:function(t){r=t,this.cursor=0,this.limit=t.length,this.limit_backward=0,this.bra=this.cursor,this.ket=this.limit},getCurrent:function(){var t=r;return r=null,t},in_grouping:function(t,i,s){if(this.cursor<this.limit){var e=r.charCodeAt(this.cursor);if(e<=s&&e>=i&&t[(e-=i)>>3]&1<<(7&e))return this.cursor++,!0}return!1},in_grouping_b:function(t,i,s){if(this.cursor>this.limit_backward){var e=r.charCodeAt(this.cursor-1);if(e<=s&&e>=i&&t[(e-=i)>>3]&1<<(7&e))return this.cursor--,!0}return!1},out_grouping:function(t,i,s){if(this.cursor<this.limit){var e=r.charCodeAt(this.cursor);if(e>s||e<i)return this.cursor++,!0;if(!(t[(e-=i)>>3]&1<<(7&e)))return this.cursor++,!0}return!1},out_grouping_b:function(t,i,s){if(this.cursor>this.limit_backward){var e=r.charCodeAt(this.cursor-1);if(e>s||e<i)return this.cursor--,!0;if(!(t[(e-=i)>>3]&1<<(7&e)))return this.cursor--,!0}return!1},eq_s:function(t,i){if(this.limit-this.cursor<t)return!1;for(var s=0;s<t;s++)if(r.charCodeAt(this.cursor+s)!=i.charCodeAt(s))return!1;return this.cursor+=t,!0},eq_s_b:function(t,i){if(this.cursor-this.limit_backward<t)return!1;for(var s=0;s<t;s++)if(r.charCodeAt(this.cursor-t+s)!=i.charCodeAt(s))return!1;return this.cursor-=t,!0},find_among:function(t,i){for(var s=0,e=i,n=this.cursor,u=this.limit,o=0,h=0,c=!1;;){for(var a=s+(e-s>>1),f=0,l=o<h?o:h,_=t[a],m=l;m<_.s_size;m++){if(n+l==u){f=-1;break}if(f=r.charCodeAt(n+l)-_.s[m])break;l++}if(f<0?(e=a,h=l):(s=a,o=l),e-s<=1){if(s>0||e==s||c)break;c=!0}}for(;;){if(o>=(_=t[s]).s_size){if(this.cursor=n+_.s_size,!_.method)return _.result;var b=_.method();if(this.cursor=n+_.s_size,b)return _.result}if((s=_.substring_i)<0)return 0}},find_among_b:function(t,i){for(var s=0,e=i,n=this.cursor,u=this.limit_backward,o=0,h=0,c=!1;;){for(var a=s+(e-s>>1),f=0,l=o<h?o:h,_=(m=t[a]).s_size-1-l;_>=0;_--){if(n-l==u){f=-1;break}if(f=r.charCodeAt(n-1-l)-m.s[_])break;l++}if(f<0?(e=a,h=l):(s=a,o=l),e-s<=1){if(s>0||e==s||c)break;c=!0}}for(;;){var m;if(o>=(m=t[s]).s_size){if(this.cursor=n-m.s_size,!m.method)return m.result;var b=m.method();if(this.cursor=n-m.s_size,b)return m.result}if((s=m.substring_i)<0)return 0}},replace_s:function(t,i,s){var e=s.length-(i-t),n=r.substring(0,t),u=r.substring(i);return r=n+s+u,this.limit+=e,this.cursor>=i?this.cursor+=e:this.cursor>t&&(this.cursor=t),e},slice_check:function(){if(this.bra<0||this.bra>this.ket||this.ket>this.limit||this.limit>r.length)throw"faulty slice operation"},slice_from:function(r){this.slice_check(),this.replace_s(this.bra,this.ket,r)},slice_del:function(){this.slice_from("")},insert:function(r,t,i){var s=this.replace_s(r,t,i);r<=this.bra&&(this.bra+=s),r<=this.ket&&(this.ket+=s)},slice_to:function(){return this.slice_check(),r.substring(this.bra,this.ket)},eq_v_b:function(r){return this.eq_s_b(r.length,r)}}}},r.trimmerSupport={generateTrimmer:function(r){var t=new RegExp("^[^"+r+"]+"),i=new RegExp("[^"+r+"]+$");return function(r){return"function"==typeof r.update?r.update(function(r){return r.replace(t,"").replace(i,"")}):r.replace(t,"").replace(i,"")}}}}});
!function(r,t){"function"==typeof define&&define.amd?define(t):"object"==typeof exports?module.exports=t():t()(r.lunr)}(this,function(){return function(r){r.stemmerSupport={Among:function(r,t,i,s){if(this.toCharArray=function(r){for(var t=r.length,i=new Array(t),s=0;s<t;s++)i[s]=r.charCodeAt(s);return i},!r&&""!=r||!t&&0!=t||!i)throw"Bad Among initialisation: s:"+r+", substring_i: "+t+", result: "+i;this.s_size=r.length,this.s=this.toCharArray(r),this.substring_i=t,this.result=i,this.method=s},SnowballProgram:function(){var b;return{bra:0,ket:0,limit:0,cursor:0,limit_backward:0,setCurrent:function(r){b=r,this.cursor=0,this.limit=r.length,this.limit_backward=0,this.bra=this.cursor,this.ket=this.limit},getCurrent:function(){var r=b;return b=null,r},in_grouping:function(r,t,i){if(this.cursor<this.limit){var s=b.charCodeAt(this.cursor);if(s<=i&&t<=s&&r[(s-=t)>>3]&1<<(7&s))return this.cursor++,!0}return!1},in_grouping_b:function(r,t,i){if(this.cursor>this.limit_backward){var s=b.charCodeAt(this.cursor-1);if(s<=i&&t<=s&&r[(s-=t)>>3]&1<<(7&s))return this.cursor--,!0}return!1},out_grouping:function(r,t,i){if(this.cursor<this.limit){var s=b.charCodeAt(this.cursor);if(i<s||s<t)return this.cursor++,!0;if(!(r[(s-=t)>>3]&1<<(7&s)))return this.cursor++,!0}return!1},out_grouping_b:function(r,t,i){if(this.cursor>this.limit_backward){var s=b.charCodeAt(this.cursor-1);if(i<s||s<t)return this.cursor--,!0;if(!(r[(s-=t)>>3]&1<<(7&s)))return this.cursor--,!0}return!1},eq_s:function(r,t){if(this.limit-this.cursor<r)return!1;for(var i=0;i<r;i++)if(b.charCodeAt(this.cursor+i)!=t.charCodeAt(i))return!1;return this.cursor+=r,!0},eq_s_b:function(r,t){if(this.cursor-this.limit_backward<r)return!1;for(var i=0;i<r;i++)if(b.charCodeAt(this.cursor-r+i)!=t.charCodeAt(i))return!1;return this.cursor-=r,!0},find_among:function(r,t){for(var i=0,s=t,e=this.cursor,n=this.limit,u=0,o=0,h=!1;;){for(var c=i+(s-i>>1),a=0,f=u<o?u:o,l=r[c],_=f;_<l.s_size;_++){if(e+f==n){a=-1;break}if(a=b.charCodeAt(e+f)-l.s[_])break;f++}if(a<0?(s=c,o=f):(i=c,u=f),s-i<=1){if(0<i||s==i||h)break;h=!0}}for(;;){if(u>=(l=r[i]).s_size){if(this.cursor=e+l.s_size,!l.method)return l.result;var m=l.method();if(this.cursor=e+l.s_size,m)return l.result}if((i=l.substring_i)<0)return 0}},find_among_b:function(r,t){for(var i=0,s=t,e=this.cursor,n=this.limit_backward,u=0,o=0,h=!1;;){for(var c=i+(s-i>>1),a=0,f=u<o?u:o,l=(_=r[c]).s_size-1-f;0<=l;l--){if(e-f==n){a=-1;break}if(a=b.charCodeAt(e-1-f)-_.s[l])break;f++}if(a<0?(s=c,o=f):(i=c,u=f),s-i<=1){if(0<i||s==i||h)break;h=!0}}for(;;){var _;if(u>=(_=r[i]).s_size){if(this.cursor=e-_.s_size,!_.method)return _.result;var m=_.method();if(this.cursor=e-_.s_size,m)return _.result}if((i=_.substring_i)<0)return 0}},replace_s:function(r,t,i){var s=i.length-(t-r);return b=b.substring(0,r)+i+b.substring(t),this.limit+=s,this.cursor>=t?this.cursor+=s:this.cursor>r&&(this.cursor=r),s},slice_check:function(){if(this.bra<0||this.bra>this.ket||this.ket>this.limit||this.limit>b.length)throw"faulty slice operation"},slice_from:function(r){this.slice_check(),this.replace_s(this.bra,this.ket,r)},slice_del:function(){this.slice_from("")},insert:function(r,t,i){var s=this.replace_s(r,t,i);r<=this.bra&&(this.bra+=s),r<=this.ket&&(this.ket+=s)},slice_to:function(){return this.slice_check(),b.substring(this.bra,this.ket)},eq_v_b:function(r){return this.eq_s_b(r.length,r)}}}},r.trimmerSupport={generateTrimmer:function(r){var t=new RegExp("^[^"+r+"]+"),i=new RegExp("[^"+r+"]+$");return function(r){return"function"==typeof r.update?r.update(function(r){return r.replace(t,"").replace(i,"")}):r.replace(t,"").replace(i,"")}}}}});

@ -1 +1 @@
!function(e,r){"function"==typeof define&&define.amd?define(r):"object"==typeof exports?module.exports=r():r()(e.lunr)}(this,function(){return function(e){if(void 0===e)throw new Error("Lunr is not present. Please include / require Lunr before this script.");if(void 0===e.stemmerSupport)throw new Error("Lunr stemmer support is not present. Please include / require Lunr stemmer support before this script.");var r,n,t;e.sv=function(){this.pipeline.reset(),this.pipeline.add(e.sv.trimmer,e.sv.stopWordFilter,e.sv.stemmer),this.searchPipeline&&(this.searchPipeline.reset(),this.searchPipeline.add(e.sv.stemmer))},e.sv.wordCharacters="A-Za-zªºÀ-ÖØ-öø-ʸˠ-ˤᴀ-ᴥᴬ-ᵜᵢ-ᵥᵫ-ᵷᵹ-ᶾḀ-ỿⁱⁿₐ-ₜKÅℲⅎⅠ-ↈⱠ-ⱿꜢ-ꞇꞋ-ꞭꞰ-ꞷꟷ-ꟿꬰ-ꭚꭜ-ꭤff-stA-Za-z",e.sv.trimmer=e.trimmerSupport.generateTrimmer(e.sv.wordCharacters),e.Pipeline.registerFunction(e.sv.trimmer,"trimmer-sv"),e.sv.stemmer=(r=e.stemmerSupport.Among,n=e.stemmerSupport.SnowballProgram,t=new function(){var e,t,i=[new r("a",-1,1),new r("arna",0,1),new r("erna",0,1),new r("heterna",2,1),new r("orna",0,1),new r("ad",-1,1),new r("e",-1,1),new r("ade",6,1),new r("ande",6,1),new r("arne",6,1),new r("are",6,1),new r("aste",6,1),new r("en",-1,1),new r("anden",12,1),new r("aren",12,1),new r("heten",12,1),new r("ern",-1,1),new r("ar",-1,1),new r("er",-1,1),new r("heter",18,1),new r("or",-1,1),new r("s",-1,2),new r("as",21,1),new r("arnas",22,1),new r("ernas",22,1),new r("ornas",22,1),new r("es",21,1),new r("ades",26,1),new r("andes",26,1),new r("ens",21,1),new r("arens",29,1),new r("hetens",29,1),new r("erns",21,1),new r("at",-1,1),new r("andet",-1,1),new r("het",-1,1),new r("ast",-1,1)],s=[new r("dd",-1,-1),new r("gd",-1,-1),new r("nn",-1,-1),new r("dt",-1,-1),new r("gt",-1,-1),new r("kt",-1,-1),new r("tt",-1,-1)],a=[new r("ig",-1,1),new r("lig",0,1),new r("els",-1,1),new r("fullt",-1,3),new r("löst",-1,2)],o=[17,65,16,1,0,0,0,0,0,0,0,0,0,0,0,0,24,0,32],u=[119,127,149],m=new n;this.setCurrent=function(e){m.setCurrent(e)},this.getCurrent=function(){return m.getCurrent()},this.stem=function(){var r,n=m.cursor;return function(){var r,n=m.cursor+3;if(t=m.limit,0<=n||n<=m.limit){for(e=n;;){if(r=m.cursor,m.in_grouping(o,97,246)){m.cursor=r;break}if(m.cursor=r,m.cursor>=m.limit)return;m.cursor++}for(;!m.out_grouping(o,97,246);){if(m.cursor>=m.limit)return;m.cursor++}(t=m.cursor)<e&&(t=e)}}(),m.limit_backward=n,m.cursor=m.limit,function(){var e,r=m.limit_backward;if(m.cursor>=t&&(m.limit_backward=t,m.cursor=m.limit,m.ket=m.cursor,e=m.find_among_b(i,37),m.limit_backward=r,e))switch(m.bra=m.cursor,e){case 1:m.slice_del();break;case 2:m.in_grouping_b(u,98,121)&&m.slice_del()}}(),m.cursor=m.limit,r=m.limit_backward,m.cursor>=t&&(m.limit_backward=t,m.cursor=m.limit,m.find_among_b(s,7)&&(m.cursor=m.limit,m.ket=m.cursor,m.cursor>m.limit_backward&&(m.bra=--m.cursor,m.slice_del())),m.limit_backward=r),m.cursor=m.limit,function(){var e,r;if(m.cursor>=t){if(r=m.limit_backward,m.limit_backward=t,m.cursor=m.limit,m.ket=m.cursor,e=m.find_among_b(a,5))switch(m.bra=m.cursor,e){case 1:m.slice_del();break;case 2:m.slice_from("lös");break;case 3:m.slice_from("full")}m.limit_backward=r}}(),!0}},function(e){return"function"==typeof e.update?e.update(function(e){return t.setCurrent(e),t.stem(),t.getCurrent()}):(t.setCurrent(e),t.stem(),t.getCurrent())}),e.Pipeline.registerFunction(e.sv.stemmer,"stemmer-sv"),e.sv.stopWordFilter=e.generateStopWordFilter("alla allt att av blev bli blir blivit de dem den denna deras dess dessa det detta dig din dina ditt du där då efter ej eller en er era ert ett från för ha hade han hans har henne hennes hon honom hur här i icke ingen inom inte jag ju kan kunde man med mellan men mig min mina mitt mot mycket ni nu när någon något några och om oss på samma sedan sig sin sina sitta själv skulle som så sådan sådana sådant till under upp ut utan vad var vara varför varit varje vars vart vem vi vid vilka vilkas vilken vilket vår våra vårt än är åt över".split(" ")),e.Pipeline.registerFunction(e.sv.stopWordFilter,"stopWordFilter-sv")}});
!function(e,r){"function"==typeof define&&define.amd?define(r):"object"==typeof exports?module.exports=r():r()(e.lunr)}(this,function(){return function(e){if(void 0===e)throw new Error("Lunr is not present. Please include / require Lunr before this script.");if(void 0===e.stemmerSupport)throw new Error("Lunr stemmer support is not present. Please include / require Lunr stemmer support before this script.");var r,l,n;e.sv=function(){this.pipeline.reset(),this.pipeline.add(e.sv.trimmer,e.sv.stopWordFilter,e.sv.stemmer),this.searchPipeline&&(this.searchPipeline.reset(),this.searchPipeline.add(e.sv.stemmer))},e.sv.wordCharacters="A-Za-zªºÀ-ÖØ-öø-ʸˠ-ˤᴀ-ᴥᴬ-ᵜᵢ-ᵥᵫ-ᵷᵹ-ᶾḀ-ỿⁱⁿₐ-ₜKÅℲⅎⅠ-ↈⱠ-ⱿꜢ-ꞇꞋ-ꞭꞰ-ꞷꟷ-ꟿꬰ-ꭚꭜ-ꭤff-stA-Za-z",e.sv.trimmer=e.trimmerSupport.generateTrimmer(e.sv.wordCharacters),e.Pipeline.registerFunction(e.sv.trimmer,"trimmer-sv"),e.sv.stemmer=(r=e.stemmerSupport.Among,l=e.stemmerSupport.SnowballProgram,n=new function(){var n,t,i=[new r("a",-1,1),new r("arna",0,1),new r("erna",0,1),new r("heterna",2,1),new r("orna",0,1),new r("ad",-1,1),new r("e",-1,1),new r("ade",6,1),new r("ande",6,1),new r("arne",6,1),new r("are",6,1),new r("aste",6,1),new r("en",-1,1),new r("anden",12,1),new r("aren",12,1),new r("heten",12,1),new r("ern",-1,1),new r("ar",-1,1),new r("er",-1,1),new r("heter",18,1),new r("or",-1,1),new r("s",-1,2),new r("as",21,1),new r("arnas",22,1),new r("ernas",22,1),new r("ornas",22,1),new r("es",21,1),new r("ades",26,1),new r("andes",26,1),new r("ens",21,1),new r("arens",29,1),new r("hetens",29,1),new r("erns",21,1),new r("at",-1,1),new r("andet",-1,1),new r("het",-1,1),new r("ast",-1,1)],s=[new r("dd",-1,-1),new r("gd",-1,-1),new r("nn",-1,-1),new r("dt",-1,-1),new r("gt",-1,-1),new r("kt",-1,-1),new r("tt",-1,-1)],a=[new r("ig",-1,1),new r("lig",0,1),new r("els",-1,1),new r("fullt",-1,3),new r("löst",-1,2)],o=[17,65,16,1,0,0,0,0,0,0,0,0,0,0,0,0,24,0,32],u=[119,127,149],m=new l;this.setCurrent=function(e){m.setCurrent(e)},this.getCurrent=function(){return m.getCurrent()},this.stem=function(){var e,r=m.cursor;return function(){var e,r=m.cursor+3;if(t=m.limit,0<=r||r<=m.limit){for(n=r;;){if(e=m.cursor,m.in_grouping(o,97,246)){m.cursor=e;break}if(m.cursor=e,m.cursor>=m.limit)return;m.cursor++}for(;!m.out_grouping(o,97,246);){if(m.cursor>=m.limit)return;m.cursor++}(t=m.cursor)<n&&(t=n)}}(),m.limit_backward=r,m.cursor=m.limit,function(){var e,r=m.limit_backward;if(m.cursor>=t&&(m.limit_backward=t,m.cursor=m.limit,m.ket=m.cursor,e=m.find_among_b(i,37),m.limit_backward=r,e))switch(m.bra=m.cursor,e){case 1:m.slice_del();break;case 2:m.in_grouping_b(u,98,121)&&m.slice_del()}}(),m.cursor=m.limit,e=m.limit_backward,m.cursor>=t&&(m.limit_backward=t,m.cursor=m.limit,m.find_among_b(s,7)&&(m.cursor=m.limit,m.ket=m.cursor,m.cursor>m.limit_backward&&(m.bra=--m.cursor,m.slice_del())),m.limit_backward=e),m.cursor=m.limit,function(){var e,r;if(m.cursor>=t){if(r=m.limit_backward,m.limit_backward=t,m.cursor=m.limit,m.ket=m.cursor,e=m.find_among_b(a,5))switch(m.bra=m.cursor,e){case 1:m.slice_del();break;case 2:m.slice_from("lös");break;case 3:m.slice_from("full")}m.limit_backward=r}}(),!0}},function(e){return"function"==typeof e.update?e.update(function(e){return n.setCurrent(e),n.stem(),n.getCurrent()}):(n.setCurrent(e),n.stem(),n.getCurrent())}),e.Pipeline.registerFunction(e.sv.stemmer,"stemmer-sv"),e.sv.stopWordFilter=e.generateStopWordFilter("alla allt att av blev bli blir blivit de dem den denna deras dess dessa det detta dig din dina ditt du där då efter ej eller en er era ert ett från för ha hade han hans har henne hennes hon honom hur här i icke ingen inom inte jag ju kan kunde man med mellan men mig min mina mitt mot mycket ni nu när någon något några och om oss på samma sedan sig sin sina sitta själv skulle som så sådan sådana sådant till under upp ut utan vad var vara varför varit varje vars vart vem vi vid vilka vilkas vilken vilket vår våra vårt än är åt över".split(" ")),e.Pipeline.registerFunction(e.sv.stopWordFilter,"stopWordFilter-sv")}});

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

@ -2,7 +2,7 @@
<!DOCTYPE html>
<!doctype html>
<html lang="en" class="no-js">
<head>
@ -13,7 +13,7 @@
<meta name="description" content="ESP8266/ESP32 WLAN configuration at run time with web interface">
<link rel="canonical" href="https://Hieromon.github.io/AutoConnect/basicusage/index.html">
<link rel="canonical" href="https://Hieromon.github.io/AutoConnect/basicusage.html">
<meta name="author" content="Hieromon Ikasamo">
@ -37,8 +37,8 @@
<meta name="lang:search.tokenizer" content="[\s\-]+">
<link rel="shortcut icon" href="../assets/images/favicon.png">
<meta name="generator" content="mkdocs-0.17.3, mkdocs-material-2.7.0">
<link rel="shortcut icon" href="assets/images/favicon.png">
<meta name="generator" content="mkdocs-1.0.4, mkdocs-material-4.0.1">
@ -46,24 +46,62 @@
<link rel="stylesheet" href="../assets/stylesheets/application.78aab2dc.css">
<link rel="stylesheet" href="assets/stylesheets/application.982221ab.css">
<link rel="stylesheet" href="../assets/stylesheets/application-palette.6079476c.css">
<link rel="stylesheet" href="assets/stylesheets/application-palette.224b79ff.css">
<meta name="theme-color" content="#3f51b5">
<script src="../assets/javascripts/modernizr.1aa3b519.js"></script>
<script src="assets/javascripts/modernizr.1f0bcf2b.js"></script>
<link href="https://fonts.gstatic.com" rel="preconnect" crossorigin>
<link href="https://fonts.gstatic.com" rel="preconnect" crossorigin>
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,400,400i,700|Roboto+Mono">
<style>body,input{font-family:"Roboto","Helvetica Neue",Helvetica,Arial,sans-serif}code,kbd,pre{font-family:"Roboto Mono","Courier New",Courier,monospace}</style>
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
<link rel="stylesheet" href="assets/fonts/material-icons.css">
<link rel="stylesheet" href="../css/paragraph.css">
<link rel="stylesheet" href="css/paragraph.css">
<link rel="stylesheet" href="css/extra.css">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.6.1/css/all.css">
<script>
window.ga = window.ga || function() {
(ga.q = ga.q || []).push(arguments)
}
ga.l = +new Date
/* Setup integration and send page view */
ga("create", "UA-116150854-1", "auto")
ga("set", "anonymizeIp", true)
ga("send", "pageview")
/* Register handler to log search on blur */
document.addEventListener("DOMContentLoaded", () => {
if (document.forms.search) {
var query = document.forms.search.query
query.addEventListener("blur", function() {
if (this.value) {
var path = document.location.pathname;
ga("send", "pageview", path + "?q=" + this.value)
}
})
}
})
</script>
<script async src="https://www.google-analytics.com/analytics.js"></script>
</head>
@ -77,7 +115,7 @@
<svg xmlns="http://www.w3.org/2000/svg" width="416" height="448"
viewBox="0 0 416 448" id="github">
viewBox="0 0 416 448" id="__github">
<path fill="currentColor" d="M160 304q0 10-3.125 20.5t-10.75 19-18.125
8.5-18.125-8.5-10.75-19-3.125-20.5 3.125-20.5 10.75-19 18.125-8.5
18.125 8.5 10.75 19 3.125 20.5zM320 304q0 10-3.125 20.5t-10.75
@ -97,9 +135,9 @@
</defs>
</svg>
<input class="md-toggle" data-md-toggle="drawer" type="checkbox" id="drawer">
<input class="md-toggle" data-md-toggle="search" type="checkbox" id="search">
<label class="md-overlay" data-md-component="overlay" for="drawer"></label>
<input class="md-toggle" data-md-toggle="drawer" type="checkbox" id="__drawer" autocomplete="off">
<input class="md-toggle" data-md-toggle="search" type="checkbox" id="__search" autocomplete="off">
<label class="md-overlay" data-md-component="overlay" for="__drawer"></label>
<a href="#simple-usage" tabindex="1" class="md-skip">
Skip to content
@ -112,38 +150,35 @@
<div class="md-flex__cell md-flex__cell--shrink">
<a href="https://Hieromon.github.io/AutoConnect/" title="AutoConnect for ESP8266/ESP32" class="md-header-nav__button md-logo">
<img src="../images/arduino-logo.svg" width="24" height="24">
<img src="images/arduino-logo.svg" width="24" height="24">
</a>
</div>
<div class="md-flex__cell md-flex__cell--shrink">
<label class="md-icon md-icon--menu md-header-nav__button" for="drawer"></label>
<label class="md-icon md-icon--menu md-header-nav__button" for="__drawer"></label>
</div>
<div class="md-flex__cell md-flex__cell--stretch">
<div class="md-flex__ellipsis md-header-nav__title" data-md-component="title">
<span class="md-header-nav__topic">
AutoConnect for ESP8266/ESP32
</span>
<span class="md-header-nav__topic">
Basic usage
</span>
<span class="md-header-nav__topic">
AutoConnect for ESP8266/ESP32
</span>
<span class="md-header-nav__topic">
Basic usage
</span>
</div>
</div>
<div class="md-flex__cell md-flex__cell--shrink">
<label class="md-icon md-icon--search md-header-nav__button" for="__search"></label>
<label class="md-icon md-icon--search md-header-nav__button" for="search"></label>
<div class="md-search" data-md-component="search" role="dialog">
<label class="md-search__overlay" for="search"></label>
<label class="md-search__overlay" for="__search"></label>
<div class="md-search__inner" role="search">
<form class="md-search__form" name="search">
<input type="text" class="md-search__input" name="query" placeholder="Search" autocapitalize="off" autocorrect="off" autocomplete="off" spellcheck="false" data-md-component="query" data-md-state="active">
<label class="md-icon md-search__icon" for="search"></label>
<label class="md-icon md-search__icon" for="__search"></label>
<button type="reset" class="md-icon md-search__icon" data-md-component="reset" tabindex="-1">
&#xE5CD;
</button>
@ -160,7 +195,6 @@
</div>
</div>
</div>
</div>
@ -171,20 +205,18 @@
<a href="https://github.com/Hieromon/AutoConnect" title="Go to repository" class="md-source" data-md-source="github">
<div class="md-source__icon">
<svg viewBox="0 0 24 24" width="24" height="24">
<use xlink:href="#github" width="24" height="24"></use>
</svg>
</div>
<div class="md-source__repository">
Hieromon/AutoConnect
<a href="https://github.com/Hieromon/AutoConnect" title="Go to repository" class="md-source" data-md-source="github">
<div class="md-source__icon">
<svg viewBox="0 0 24 24" width="24" height="24">
<use xlink:href="#__github" width="24" height="24"></use>
</svg>
</div>
</a>
<div class="md-source__repository">
Hieromon/AutoConnect
</div>
</a>
</div>
</div>
@ -206,7 +238,7 @@
<li class="md-tabs__item">
<a href="../index.html" title="Overview" class="md-tabs__link md-tabs__link--active">
<a href="index.html" title="Overview" class="md-tabs__link md-tabs__link--active">
Overview
</a>
@ -222,6 +254,43 @@
<li class="md-tabs__item">
<a href="acintro.html" title="Custom Web pages" class="md-tabs__link">
Custom Web pages
</a>
</li>
<li class="md-tabs__item">
<a href="api.html" title="Library APIs" class="md-tabs__link">
Library APIs
</a>
</li>
<li class="md-tabs__item">
<a href="howtoembed.html" title="Examples" class="md-tabs__link">
Examples
</a>
</li>
@ -243,12 +312,12 @@
<div class="md-sidebar__scrollwrap">
<div class="md-sidebar__inner">
<nav class="md-nav md-nav--primary" data-md-level="0">
<label class="md-nav__title md-nav__title--site" for="drawer">
<span class="md-nav__button md-logo">
<label class="md-nav__title md-nav__title--site" for="__drawer">
<a href="https://Hieromon.github.io/AutoConnect/" title="AutoConnect for ESP8266/ESP32" class="md-nav__button md-logo">
<img src="../images/arduino-logo.svg" width="48" height="48">
<img src="images/arduino-logo.svg" width="48" height="48">
</span>
</a>
AutoConnect for ESP8266/ESP32
</label>
@ -258,20 +327,18 @@
<a href="https://github.com/Hieromon/AutoConnect" title="Go to repository" class="md-source" data-md-source="github">
<div class="md-source__icon">
<svg viewBox="0 0 24 24" width="24" height="24">
<use xlink:href="#github" width="24" height="24"></use>
</svg>
</div>
<div class="md-source__repository">
Hieromon/AutoConnect
<a href="https://github.com/Hieromon/AutoConnect" title="Go to repository" class="md-source" data-md-source="github">
<div class="md-source__icon">
<svg viewBox="0 0 24 24" width="24" height="24">
<use xlink:href="#__github" width="24" height="24"></use>
</svg>
</div>
</a>
<div class="md-source__repository">
Hieromon/AutoConnect
</div>
</a>
</div>
<ul class="md-nav__list" data-md-scrollfix>
@ -282,7 +349,7 @@
<li class="md-nav__item">
<a href="../index.html" title="Overview" class="md-nav__link">
<a href="index.html" title="Overview" class="md-nav__link">
Overview
</a>
</li>
@ -294,7 +361,7 @@
<li class="md-nav__item">
<a href="../gettingstarted/index.html" title="Getting started" class="md-nav__link">
<a href="gettingstarted.html" title="Getting started" class="md-nav__link">
Getting started
</a>
</li>
@ -306,7 +373,7 @@
<li class="md-nav__item">
<a href="../menu/index.html" title="AutoConnect menu" class="md-nav__link">
<a href="menu.html" title="AutoConnect menu" class="md-nav__link">
AutoConnect menu
</a>
</li>
@ -321,14 +388,14 @@
<li class="md-nav__item md-nav__item--active">
<input class="md-toggle md-nav__toggle" data-md-toggle="toc" type="checkbox" id="toc">
<input class="md-toggle md-nav__toggle" data-md-toggle="toc" type="checkbox" id="__toc">
<label class="md-nav__link md-nav__link--active" for="toc">
<label class="md-nav__link md-nav__link--active" for="__toc">
Basic usage
</label>
<a href="index.html" title="Basic usage" class="md-nav__link md-nav__link--active">
<a href="basicusage.html" title="Basic usage" class="md-nav__link md-nav__link--active">
Basic usage
</a>
@ -337,7 +404,7 @@
<label class="md-nav__title" for="toc">Table of contents</label>
<label class="md-nav__title" for="__toc">Table of contents</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
@ -459,7 +526,7 @@
<li class="md-nav__item">
<a href="../advancedusage/index.html" title="Advanced usage" class="md-nav__link">
<a href="advancedusage.html" title="Advanced usage" class="md-nav__link">
Advanced usage
</a>
</li>
@ -470,24 +537,228 @@
<li class="md-nav__item md-nav__item--nested">
<input class="md-toggle md-nav__toggle" data-md-toggle="nav-6" type="checkbox" id="nav-6">
<label class="md-nav__link" for="nav-6">
Custom Web pages
</label>
<nav class="md-nav" data-md-component="collapsible" data-md-level="1">
<label class="md-nav__title" for="nav-6">
Custom Web pages
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="../api/index.html" title="Library APIs" class="md-nav__link">
Library APIs
<a href="acintro.html" title="Custom Web pages with AutoConnect" class="md-nav__link">
Custom Web pages with AutoConnect
</a>
</li>
<li class="md-nav__item">
<a href="acelements.html" title="AutoConnectElements" class="md-nav__link">
AutoConnectElements
</a>
</li>
<li class="md-nav__item">
<a href="acjson.html" title="Custom Web pages with JSON" class="md-nav__link">
Custom Web pages with JSON
</a>
</li>
<li class="md-nav__item">
<a href="achandling.html" title="Handling the custom Web pages" class="md-nav__link">
Handling the custom Web pages
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item md-nav__item--nested">
<input class="md-toggle md-nav__toggle" data-md-toggle="nav-7" type="checkbox" id="nav-7">
<label class="md-nav__link" for="nav-7">
Library APIs
</label>
<nav class="md-nav" data-md-component="collapsible" data-md-level="1">
<label class="md-nav__title" for="nav-7">
Library APIs
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="../examples/index.html" title="Examples" class="md-nav__link">
<a href="api.html" title="AutoConnect API" class="md-nav__link">
AutoConnect API
</a>
</li>
<li class="md-nav__item">
<a href="apiaux.html" title="AutoConnectAux API" class="md-nav__link">
AutoConnectAux API
</a>
</li>
<li class="md-nav__item">
<a href="apiconfig.html" title="AutoConnectConfig API" class="md-nav__link">
AutoConnectConfig API
</a>
</li>
<li class="md-nav__item">
<a href="apielements.html" title="AutoConnectElements API" class="md-nav__link">
AutoConnectElements API
</a>
</li>
<li class="md-nav__item">
<a href="apiextra.html" title="Something extra" class="md-nav__link">
Something extra
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item md-nav__item--nested">
<input class="md-toggle md-nav__toggle" data-md-toggle="nav-8" type="checkbox" id="nav-8">
<label class="md-nav__link" for="nav-8">
Examples
</label>
<nav class="md-nav" data-md-component="collapsible" data-md-level="1">
<label class="md-nav__title" for="nav-8">
Examples
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="howtoembed.html" title="How to embed" class="md-nav__link">
How to embed
</a>
</li>
<li class="md-nav__item">
<a href="datatips.html" title="Tips for data conversion" class="md-nav__link">
Tips for data conversion
</a>
</li>
<li class="md-nav__item">
<a href="menuize.html" title="Attach the menu" class="md-nav__link">
Attach the menu
</a>
</li>
<li class="md-nav__item">
<a href="wojson.html" title="Custom Web pages w/o JSON" class="md-nav__link">
Custom Web pages w/o JSON
</a>
</li>
</ul>
</nav>
</li>
@ -495,7 +766,19 @@
<li class="md-nav__item">
<a href="../faq/index.html" title="FAQ" class="md-nav__link">
<a href="lsbegin.html" title="Appendix" class="md-nav__link">
Appendix
</a>
</li>
<li class="md-nav__item">
<a href="faq.html" title="FAQ" class="md-nav__link">
FAQ
</a>
</li>
@ -507,7 +790,7 @@
<li class="md-nav__item">
<a href="../changelog/index.html" title="Change log" class="md-nav__link">
<a href="changelog.html" title="Change log" class="md-nav__link">
Change log
</a>
</li>
@ -519,7 +802,7 @@
<li class="md-nav__item">
<a href="../license/index.html" title="License" class="md-nav__link">
<a href="license.html" title="License" class="md-nav__link">
License
</a>
</li>
@ -540,7 +823,7 @@
<label class="md-nav__title" for="toc">Table of contents</label>
<label class="md-nav__title" for="__toc">Table of contents</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
@ -666,8 +949,8 @@
<h2 id="simple-usage">Simple usage<a class="headerlink" href="#simple-usage" title="Permanent link">&para;</a></h2>
<h3 id="embed-to-the-sketches"><i class="fa fa-edit"></i> Embed to the sketches<a class="headerlink" href="#embed-to-the-sketches" title="Permanent link">&para;</a></h3>
<p>How embed the AutoConnect to the sketches you have. Most simple approach to applying AutoConnect for the existing sketches, follow the below steps. The below sketch is for ESP8266. For ESP32, replace <code class="codehilite">ESP8266WebServer</code> with <code class="codehilite">WebServer</code> and <code class="codehilite">ESP8266WiFi.h</code> with <code class="codehilite">WiFi.h</code> respectively.</p>
<p><img src="../images/BeforeAfter.svg" /></p>
<p>How embed the AutoConnect to the sketches you have. Most simple approach to applying AutoConnect for the existing sketches, follow the below steps. The below sketch is for ESP8266. For ESP32, replace <code>ESP8266WebServer</code> with <code>WebServer</code> and <code>ESP8266WiFi.h</code> with <code>WiFi.h</code> respectively.</p>
<p><img src="images/BeforeAfter.svg" /></p>
<ul class="ulsty-edit" style="list-style:none;">
<li>Insert <code class="codehilite"><span class="cp">#include</span> <span class="cpf">&lt;AutoConnect.h&gt;</span></code> to behind of <code class="codehilite"><span class="cp">#include</span> <span class="cpf">&lt;ESP8266WebServer.h&gt;</span></code>.</li>
<li>Insert <code class="codehilite"><span class="na">AutoConnect</span> <em>PORTAL(WEBSERVER);</em></code> to behind of <code class="codehilite"><span class="na">ESP8266WebServer</span> <em>WEBSERVER;</em></code> declaration.<sup id="fnref:1"><a class="footnote-ref" href="#fn:1" rel="footnote">1</a></sup></li>
@ -682,52 +965,52 @@
<h4 id="1-a-typical-logic-sequence">1. A typical logic sequence<a class="headerlink" href="#1-a-typical-logic-sequence" title="Permanent link">&para;</a></h4>
<div class="admonition note">
<ol>
<li><strong>Include headers,</strong> <code class="codehilite">ESP8266WebServer.h</code>/<code class="codehilite">WebServer.h</code> and <code class="codehilite">AutoConnect.h</code> </li>
<li><strong>Include headers,</strong> <code>ESP8266WebServer.h</code>/<code>WebServer.h</code> and <code>AutoConnect.h</code> </li>
<li><strong>Declare an ESP8266WebServer variable for ESP8266 or a WebServer variable for ESP32.</strong> </li>
<li><strong>Declare an AutoConnect variable.</strong> </li>
<li><strong>Implement the URL handlers provided for the </strong><code class="codehilite">on</code><strong> method of ESP8266WebServer/WebServer with the <em>function()</em>.</strong> </li>
<li><strong>Implement the URL handlers provided for the </strong><code>on</code><strong> method of ESP8266WebServer/WebServer with the <em>function()</em>.</strong> </li>
<li><strong>setup()</strong><br />
5.1 <strong>Sets URL handler the <em>function()</em> to ESP8266WebServer/WebServer by</strong><code class="codehilite">ESP8266WebServer::on</code><strong>/</strong><code class="codehilite">WebServer::on</code><strong>.</strong><br />
5.2 <strong>Starts </strong><code class="codehilite">AutoConnect::begin()</code><strong>.</strong><br />
5.1 <strong>Sets URL handler the <em>function()</em> to ESP8266WebServer/WebServer by</strong><code>ESP8266WebServer::on</code><strong>/</strong><code>WebServer::on</code><strong>.</strong><br />
5.2 <strong>Starts </strong><code>AutoConnect::begin()</code><strong>.</strong><br />
5.3 <strong>Check WiFi connection status.</strong> </li>
<li><strong>loop()</strong><br />
6.1 <strong>Do the process for actual sketch.</strong><br />
6.2 <strong>Invokes </strong><code class="codehilite">AutoConnect::handleClient()</code><strong>, or invokes </strong><code class="codehilite">ESP8266WebServer::handleClient()</code><strong>/</strong><code class="codehilite">WebServer::handleClient</code><strong> then </strong><code class="codehilite">AutoConnect::handleRequest()</code><strong>.</strong> </li>
6.2 <strong>Invokes </strong><code>AutoConnect::handleClient()</code><strong>, or invokes </strong><code>ESP8266WebServer::handleClient()</code><strong>/</strong><code>WebServer::handleClient</code><strong> then </strong><code>AutoConnect::handleRequest()</code><strong>.</strong> </li>
</ol>
</div>
<h4 id="2-declare-autoconnect-object">2. Declare AutoConnect object<a class="headerlink" href="#2-declare-autoconnect-object" title="Permanent link">&para;</a></h4>
<p><a href="#esp8266webserver-hosted-or-parasitic">Two options</a> are available for <a href="../api/index.html#constructors">AutoConnect constructor</a>.</p>
<p><div class="codehilite"><pre><span></span><span class="n">AutoConnect</span> <span class="nf">VARIABLE</span><span class="p">(</span><span class="o">&amp;</span><span class="n">ESP8266WebServer</span><span class="p">);</span> <span class="c1">// For ESP8266</span>
<span class="n">AutoConnect</span> <span class="nf">VARIABLE</span><span class="p">(</span><span class="o">&amp;</span><span class="n">WebServer</span><span class="p">);</span> <span class="c1">// For ESP32</span>
<p><a href="#esp8266webserver-hosted-or-parasitic">Two options</a> are available for <a href="api.html#constructors">AutoConnect constructor</a>.</p>
<p><div class="codehilite" style="background: #272822"><pre style="line-height: 125%"><span></span><span style="color: #f8f8f2">AutoConnect</span> <span style="color: #a6e22e">VARIABLE</span><span style="color: #f8f8f2">(</span><span style="color: #f92672">&amp;</span><span style="color: #f8f8f2">ESP8266WebServer);</span> <span style="color: #75715e">// For ESP8266</span>
<span style="color: #f8f8f2">AutoConnect</span> <span style="color: #a6e22e">VARIABLE</span><span style="color: #f8f8f2">(</span><span style="color: #f92672">&amp;</span><span style="color: #f8f8f2">WebServer);</span> <span style="color: #75715e">// For ESP32</span>
</pre></div>
or</p>
<div class="codehilite"><pre><span></span><span class="n">AutoConnect</span> <span class="n">VARIABLE</span><span class="p">;</span>
<div class="codehilite" style="background: #272822"><pre style="line-height: 125%"><span></span><span style="color: #f8f8f2">AutoConnect</span> <span style="color: #f8f8f2">VARIABLE;</span>
</pre></div>
<ul>
<li>
<p><strong>The parameter with an ESP8266WebServer/WebServer variable:</strong> An ESP8266WebServer/WebServer object variable must be declared. AutoConnect uses its variable to handles the <a href="../menu/index.html">AutoConnect menu</a>.</p>
<p><strong>The parameter with an ESP8266WebServer/WebServer variable:</strong> An ESP8266WebServer/WebServer object variable must be declared. AutoConnect uses its variable to handles the <a href="menu.html">AutoConnect menu</a>.</p>
</li>
<li>
<p><strong>With no parameter:</strong> The sketch does not declare ESP8266WebServer/WebServer object. In this case, AutoConnect allocates an instance of the ESP8266WebServer/WebServer internally. The logic sequence of the sketch is somewhat different as the above. To register a URL handler function by <em>ESP8266WebServer::on</em> or <em>WebServer::on</em> should be performed after <a href="../api/index.html#begin"><em>AutoConnect::begin</em></a>.</p>
<p><strong>With no parameter:</strong> The sketch does not declare ESP8266WebServer/WebServer object. In this case, AutoConnect allocates an instance of the ESP8266WebServer/WebServer internally. The logic sequence of the sketch is somewhat different as the above. To register a URL handler function by <em>ESP8266WebServer::on</em> or <em>WebServer::on</em> should be performed after <a href="api.html#begin"><em>AutoConnect::begin</em></a>.</p>
</li>
</ul>
<h4 id="3-no-need-wifibegin">3. No need WiFI.begin(...)<a class="headerlink" href="#3-no-need-wifibegin" title="Permanent link">&para;</a></h4>
<p>AutoConnect internally performs <em>WiFi.begin</em> to establish a WiFi connection. There is no need for a general process to establish a connection using <em>WiFi.begin</em> with a sketch code.</p>
<h4 id="4-alternate-esp8266webserverbegin-and-webserverbegin">4. Alternate ESP8266WebServer::begin() and WebServer::begin()<a class="headerlink" href="#4-alternate-esp8266webserverbegin-and-webserverbegin" title="Permanent link">&para;</a></h4>
<p><a href="../api/index.html#begin"><em>AutoConnect::begin</em></a> executes <em>ESP8266WebServer::begin</em>/<em>WebServer::begin</em> internally too and it starts the DNS server to behave as a Captive portal. So it is not needed to call <em>ESP8266WebServer::begin</em>/<em>WebServer::begin</em> in the sketch.</p>
<p><a href="api.html#begin"><em>AutoConnect::begin</em></a> executes <em>ESP8266WebServer::begin</em>/<em>WebServer::begin</em> internally too and it starts the DNS server to behave as a Captive portal. So it is not needed to call <em>ESP8266WebServer::begin</em>/<em>WebServer::begin</em> in the sketch.</p>
<div class="admonition info">
<p class="admonition-title">Why DNS Server starts</p>
<p>AutoConnect traps the detection of the captive portal and achieves a connection with the WLAN interactively by the AutoConnect menu. It responds SoftAP address to all DNS queries temporarily to trap. Once a WiFi connection establishes, the DNS server contributed by AutoConnect stops.</p>
</div>
<h4 id="5-autoconnectbegin-with-ssid-and-password">5. AutoConnect::begin with SSID and Password<a class="headerlink" href="#5-autoconnectbegin-with-ssid-and-password" title="Permanent link">&para;</a></h4>
<p>SSID and Password can also specify by <a href="../api.me#begin"><em>AutoConnect::begin</em></a>. ESP8266/ESP32 uses provided SSID and Password explicitly. If the connection false with specified SSID with Password then a captive portal is activated. SSID and Password are not present, ESP8266 SDK will attempt to connect using the still effectual SSID and password. Usually, it succeeds.</p>
<p>SSID and Password can also specify by <a href="api.html#begin"><em>AutoConnect::begin</em></a>. ESP8266/ESP32 uses provided SSID and Password explicitly. If the connection false with specified SSID with Password then a captive portal is activated. SSID and Password are not present, ESP8266 SDK will attempt to connect using the still effectual SSID and password. Usually, it succeeds.</p>
<h4 id="6-use-esp8266webserveron-and-webserveron-to-handle-url">6. Use ESP8266WebServer::on and WebServer::on to handle URL<a class="headerlink" href="#6-use-esp8266webserveron-and-webserveron-to-handle-url" title="Permanent link">&para;</a></h4>
<p>AutoConnect is designed to coexist with the process for handling the web pages by user sketches. The page processing function which will send an HTML to the client invoked by the "<em>on::ESP8266WebServer</em>" or the "<em>on::WebServer</em>" function is the same as when using ESP8266WebServer/WebServer natively.</p>
<h4 id="7-use-either-esp8266webserverhandleclientwebserverhandleclient-or-autoconnecthandleclient">7. Use either ESP8266WebServer::handleClient()/WebServer::handleClient() or AutoConnect::handleClient()<a class="headerlink" href="#7-use-either-esp8266webserverhandleclientwebserverhandleclient-or-autoconnecthandleclient" title="Permanent link">&para;</a></h4>
<p>Both classes member function name is the same: <em>handleClient</em>, but the behavior is different. Using the AutoConnect embedded along with ESP8266WebServer::handleClient/WebServer::handleClient has limitations. Refer to the below section for details. </p>
<h3 id="esp8266webserverwebserver-hosted-or-parasitic"><i class="fa fa-caret-right"></i> ESP8266WebServer/WebServer hosted or parasitic<a class="headerlink" href="#esp8266webserverwebserver-hosted-or-parasitic" title="Permanent link">&para;</a></h3>
<p>The interoperable process with an ESP8266WebServer/WebServer depends on the parameters of the <a href="../api/index.html#constructors">AutoConnect constructor</a>.</p>
<p>The interoperable process with an ESP8266WebServer/WebServer depends on the parameters of the <a href="api.html#constructors">AutoConnect constructor</a>.</p>
<table>
<thead>
<tr>
@ -738,35 +1021,35 @@ or</p>
</thead>
<tbody>
<tr>
<td><a href="../api/index.html#constructors">None</a></td>
<td>AutoConnect menu not available.<br>To use AutoConnect menu, need <a href="../api/index.html#handlerequest">AutoConnect::handleRequest()</a>.<br>also to use ESP8266WebServer/WebServer natively, need <a href="../api/index.html#host">AutoConnect::host()</a>.</td>
<td>AutoConnect menu available.<br>To use ESP8266WebServer/WebServer natively, need <a href="../api/index.html#host">AutoConnect::host()</a>.</td>
<td><a href="api.html#constructors">None</a></td>
<td>AutoConnect menu not available.<br>To use AutoConnect menu, need <a href="api.html#handlerequest">AutoConnect::handleRequest()</a>.<br>also to use ESP8266WebServer/WebServer natively, need <a href="api.html#host">AutoConnect::host()</a>.</td>
<td>AutoConnect menu available.<br>To use ESP8266WebServer/WebServer natively, need <a href="api.html#host">AutoConnect::host()</a>.</td>
</tr>
<tr>
<td><a href="../api/index.html#withparameter">Reference to ESP8266WebServer/WebServer</a></td>
<td>AutoConnect menu not available.<br>To use AutoConnect menu, need <a href="../api/index.html#handlerequest">AutoConnect::handleRequest()</a>.</td>
<td><a href="api.html#withparameter">Reference to ESP8266WebServer/WebServer</a></td>
<td>AutoConnect menu not available.<br>To use AutoConnect menu, need <a href="api.html#handlerequest">AutoConnect::handleRequest()</a>.</td>
<td>AutoConnect menu available.</td>
</tr>
</tbody>
</table>
<ul>
<li>
<p><strong>By declaration for the AutoConnect variable with no parameter</strong>: The ESP8266WebServer/WebServer instance is hosted by AutoConnect automatically then the sketches use <a href="../api/index.html#host"><em>AutoConnect::host</em></a> as API to get it after <a href="../api/index.html#begin"><em>AutoConnect::begin</em></a> performed.</p>
<p><strong>By declaration for the AutoConnect variable with no parameter</strong>: The ESP8266WebServer/WebServer instance is hosted by AutoConnect automatically then the sketches use <a href="api.html#host"><em>AutoConnect::host</em></a> as API to get it after <a href="api.html#begin"><em>AutoConnect::begin</em></a> performed.</p>
</li>
<li>
<p><strong>By declaration for the AutoConnect variable with the reference of ESP8266WebServer/WebServer</strong>: AutoConnect will use it. The sketch can use it is too.</p>
</li>
<li>
<p><strong>In use ESP8266WebServer::handleClient()/WebServer::handleClient()</strong>: AutoConnect menu can be dispatched but not works normally. It is necessary to call <a href="../api/index.html#void-handlerequest"><em>AutoConnect::handleRequest</em></a> after <em>ESP8255WebServer::handleClient</em>/<em>WebServer::handleClient</em> invoking.</p>
<p><strong>In use ESP8266WebServer::handleClient()/WebServer::handleClient()</strong>: AutoConnect menu can be dispatched but not works normally. It is necessary to call <a href="api.html#void-handlerequest"><em>AutoConnect::handleRequest</em></a> after <em>ESP8255WebServer::handleClient</em>/<em>WebServer::handleClient</em> invoking.</p>
</li>
<li>
<p><strong>In use <a href="../api/index.html#void-handleclient">AutoConnect::handleClient()</a></strong>: The handleClient() process and the AutoConnect menu is available without calling <em>ESP8266WebServer::handleClient</em>.</p>
<p><strong>In use <a href="api.html#void-handleclient">AutoConnect::handleClient()</a></strong>: The handleClient() process and the AutoConnect menu is available without calling <em>ESP8266WebServer::handleClient</em>.</p>
</li>
</ul>
<div class="admonition info">
<p class="admonition-title">Why AutoConnect::handleRequest is needed when using ESP8266WebServer::handleClient/WebServer::handleClient</p>
<p>The AutoConnect menu function may affect WiFi connection state. It follows that the menu process must execute outside <em>ESP8266WebServer::handleClient</em> and <em>WebServer::handleClient</em>.<br />
<a href="../api/index.html#void-handleclient"><em>AutoConnect::handleClient</em></a> is equivalent <em>ESP8266WebServer::handleClient</em> and <em>WEbServer::handleClient</em> included <a href="../api/index.html#void-handlerequest"><em>AutoConnect::handleRequest</em></a>.</p>
<a href="api.html#void-handleclient"><em>AutoConnect::handleClient</em></a> is equivalent <em>ESP8266WebServer::handleClient</em> and <em>WEbServer::handleClient</em> included <a href="api.html#void-handlerequest"><em>AutoConnect::handleRequest</em></a>.</p>
</div>
<div class="footnote">
<hr />
@ -788,6 +1071,8 @@ or</p>
</article>
</div>
@ -800,7 +1085,7 @@ or</p>
<div class="md-footer-nav">
<nav class="md-footer-nav__inner md-grid">
<a href="../menu/index.html" title="AutoConnect menu" class="md-flex md-footer-nav__link md-footer-nav__link--prev" rel="prev">
<a href="menu.html" title="AutoConnect menu" class="md-flex md-footer-nav__link md-footer-nav__link--prev" rel="prev">
<div class="md-flex__cell md-flex__cell--shrink">
<i class="md-icon md-icon--arrow-back md-footer-nav__button"></i>
</div>
@ -815,7 +1100,7 @@ or</p>
</a>
<a href="../advancedusage/index.html" title="Advanced usage" class="md-flex md-footer-nav__link md-footer-nav__link--next" rel="next">
<a href="advancedusage.html" title="Advanced usage" class="md-flex md-footer-nav__link md-footer-nav__link--next" rel="next">
<div class="md-flex__cell md-flex__cell--stretch md-footer-nav__title">
<span class="md-flex__ellipsis">
<span class="md-footer-nav__direction">
@ -837,20 +1122,18 @@ or</p>
<div class="md-footer-copyright">
<div class="md-footer-copyright__highlight">
Copyright &copy; 2018 Hieromon Ikasamo
Copyright &copy; 2018-2019 Hieromon Ikasamo
</div>
powered by
<a href="http://www.mkdocs.org">MkDocs</a>
<a href="https://www.mkdocs.org">MkDocs</a>
and
<a href="https://squidfunk.github.io/mkdocs-material/">
Material for MkDocs</a>
</div>
<div class="md-footer-social">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<link rel="stylesheet" href="assets/fonts/font-awesome.css">
<a href="https://github.com/Hieromon" class="md-footer-social__link fa fa-github"></a>
@ -858,23 +1141,17 @@ or</p>
</div>
</div>
</div>
</footer>
</div>
<script src="../assets/javascripts/application.8eb9be28.js"></script>
<script>app.initialize({version:"0.17.3",url:{base:".."}})</script>
<script src="assets/javascripts/application.b806dc00.js"></script>
<script src="../js/gifffer.min.js"></script>
<script>app.initialize({version:"1.0.4",url:{base:"."}})</script>
<script>!function(e,a,t,n,o,c,i){e.GoogleAnalyticsObject=o,e.ga=e.ga||function(){(e.ga.q=e.ga.q||[]).push(arguments)},e.ga.l=1*new Date,c=a.createElement(t),i=a.getElementsByTagName(t)[0],c.async=1,c.src="https://www.google-analytics.com/analytics.js",i.parentNode.insertBefore(c,i)}(window,document,"script",0,"ga"),ga("create","UA-116150854-1","auto"),ga("set","anonymizeIp",!0),ga("send","pageview");var links=document.getElementsByTagName("a");if(Array.prototype.map.call(links,function(e){e.host!=document.location.host&&e.addEventListener("click",function(){var a=e.getAttribute("data-md-action")||"follow";ga("send","event","outbound",a,e.href)})}),document.forms.search){var query=document.forms.search.query;query.addEventListener("blur",function(){if(this.value){var e=document.location.pathname;ga("send","pageview",e+"?q="+this.value)}})}</script>
<script src="js/gifffer.min.js"></script>
</body>

@ -2,7 +2,7 @@
<!DOCTYPE html>
<!doctype html>
<html lang="en" class="no-js">
<head>
@ -13,7 +13,7 @@
<meta name="description" content="ESP8266/ESP32 WLAN configuration at run time with web interface">
<link rel="canonical" href="https://Hieromon.github.io/AutoConnect/changelog/index.html">
<link rel="canonical" href="https://Hieromon.github.io/AutoConnect/changelog.html">
<meta name="author" content="Hieromon Ikasamo">
@ -37,8 +37,8 @@
<meta name="lang:search.tokenizer" content="[\s\-]+">
<link rel="shortcut icon" href="../assets/images/favicon.png">
<meta name="generator" content="mkdocs-0.17.3, mkdocs-material-2.7.0">
<link rel="shortcut icon" href="assets/images/favicon.png">
<meta name="generator" content="mkdocs-1.0.4, mkdocs-material-4.0.1">
@ -46,24 +46,62 @@
<link rel="stylesheet" href="../assets/stylesheets/application.78aab2dc.css">
<link rel="stylesheet" href="assets/stylesheets/application.982221ab.css">
<link rel="stylesheet" href="../assets/stylesheets/application-palette.6079476c.css">
<link rel="stylesheet" href="assets/stylesheets/application-palette.224b79ff.css">
<meta name="theme-color" content="#3f51b5">
<script src="../assets/javascripts/modernizr.1aa3b519.js"></script>
<script src="assets/javascripts/modernizr.1f0bcf2b.js"></script>
<link href="https://fonts.gstatic.com" rel="preconnect" crossorigin>
<link href="https://fonts.gstatic.com" rel="preconnect" crossorigin>
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,400,400i,700|Roboto+Mono">
<style>body,input{font-family:"Roboto","Helvetica Neue",Helvetica,Arial,sans-serif}code,kbd,pre{font-family:"Roboto Mono","Courier New",Courier,monospace}</style>
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
<link rel="stylesheet" href="assets/fonts/material-icons.css">
<link rel="stylesheet" href="css/paragraph.css">
<link rel="stylesheet" href="css/extra.css">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.6.1/css/all.css">
<link rel="stylesheet" href="../css/paragraph.css">
<script>
window.ga = window.ga || function() {
(ga.q = ga.q || []).push(arguments)
}
ga.l = +new Date
/* Setup integration and send page view */
ga("create", "UA-116150854-1", "auto")
ga("set", "anonymizeIp", true)
ga("send", "pageview")
/* Register handler to log search on blur */
document.addEventListener("DOMContentLoaded", () => {
if (document.forms.search) {
var query = document.forms.search.query
query.addEventListener("blur", function() {
if (this.value) {
var path = document.location.pathname;
ga("send", "pageview", path + "?q=" + this.value)
}
})
}
})
</script>
<script async src="https://www.google-analytics.com/analytics.js"></script>
</head>
@ -77,7 +115,7 @@
<svg xmlns="http://www.w3.org/2000/svg" width="416" height="448"
viewBox="0 0 416 448" id="github">
viewBox="0 0 416 448" id="__github">
<path fill="currentColor" d="M160 304q0 10-3.125 20.5t-10.75 19-18.125
8.5-18.125-8.5-10.75-19-3.125-20.5 3.125-20.5 10.75-19 18.125-8.5
18.125 8.5 10.75 19 3.125 20.5zM320 304q0 10-3.125 20.5t-10.75
@ -97,11 +135,11 @@
</defs>
</svg>
<input class="md-toggle" data-md-toggle="drawer" type="checkbox" id="drawer">
<input class="md-toggle" data-md-toggle="search" type="checkbox" id="search">
<label class="md-overlay" data-md-component="overlay" for="drawer"></label>
<input class="md-toggle" data-md-toggle="drawer" type="checkbox" id="__drawer" autocomplete="off">
<input class="md-toggle" data-md-toggle="search" type="checkbox" id="__search" autocomplete="off">
<label class="md-overlay" data-md-component="overlay" for="__drawer"></label>
<a href="#096-sep27-2018" tabindex="1" class="md-skip">
<a href="#097-jan-25-2019" tabindex="1" class="md-skip">
Skip to content
</a>
@ -112,38 +150,35 @@
<div class="md-flex__cell md-flex__cell--shrink">
<a href="https://Hieromon.github.io/AutoConnect/" title="AutoConnect for ESP8266/ESP32" class="md-header-nav__button md-logo">
<img src="../images/arduino-logo.svg" width="24" height="24">
<img src="images/arduino-logo.svg" width="24" height="24">
</a>
</div>
<div class="md-flex__cell md-flex__cell--shrink">
<label class="md-icon md-icon--menu md-header-nav__button" for="drawer"></label>
<label class="md-icon md-icon--menu md-header-nav__button" for="__drawer"></label>
</div>
<div class="md-flex__cell md-flex__cell--stretch">
<div class="md-flex__ellipsis md-header-nav__title" data-md-component="title">
<span class="md-header-nav__topic">
AutoConnect for ESP8266/ESP32
</span>
<span class="md-header-nav__topic">
Change log
</span>
<span class="md-header-nav__topic">
AutoConnect for ESP8266/ESP32
</span>
<span class="md-header-nav__topic">
Change log
</span>
</div>
</div>
<div class="md-flex__cell md-flex__cell--shrink">
<label class="md-icon md-icon--search md-header-nav__button" for="__search"></label>
<label class="md-icon md-icon--search md-header-nav__button" for="search"></label>
<div class="md-search" data-md-component="search" role="dialog">
<label class="md-search__overlay" for="search"></label>
<label class="md-search__overlay" for="__search"></label>
<div class="md-search__inner" role="search">
<form class="md-search__form" name="search">
<input type="text" class="md-search__input" name="query" placeholder="Search" autocapitalize="off" autocorrect="off" autocomplete="off" spellcheck="false" data-md-component="query" data-md-state="active">
<label class="md-icon md-search__icon" for="search"></label>
<label class="md-icon md-search__icon" for="__search"></label>
<button type="reset" class="md-icon md-search__icon" data-md-component="reset" tabindex="-1">
&#xE5CD;
</button>
@ -160,7 +195,6 @@
</div>
</div>
</div>
</div>
@ -171,20 +205,18 @@
<a href="https://github.com/Hieromon/AutoConnect" title="Go to repository" class="md-source" data-md-source="github">
<div class="md-source__icon">
<svg viewBox="0 0 24 24" width="24" height="24">
<use xlink:href="#github" width="24" height="24"></use>
</svg>
</div>
<div class="md-source__repository">
Hieromon/AutoConnect
<a href="https://github.com/Hieromon/AutoConnect" title="Go to repository" class="md-source" data-md-source="github">
<div class="md-source__icon">
<svg viewBox="0 0 24 24" width="24" height="24">
<use xlink:href="#__github" width="24" height="24"></use>
</svg>
</div>
</a>
<div class="md-source__repository">
Hieromon/AutoConnect
</div>
</a>
</div>
</div>
@ -206,7 +238,7 @@
<li class="md-tabs__item">
<a href="../index.html" title="Overview" class="md-tabs__link md-tabs__link--active">
<a href="index.html" title="Overview" class="md-tabs__link md-tabs__link--active">
Overview
</a>
@ -222,6 +254,43 @@
<li class="md-tabs__item">
<a href="acintro.html" title="Custom Web pages" class="md-tabs__link">
Custom Web pages
</a>
</li>
<li class="md-tabs__item">
<a href="api.html" title="Library APIs" class="md-tabs__link">
Library APIs
</a>
</li>
<li class="md-tabs__item">
<a href="howtoembed.html" title="Examples" class="md-tabs__link">
Examples
</a>
</li>
@ -243,12 +312,12 @@
<div class="md-sidebar__scrollwrap">
<div class="md-sidebar__inner">
<nav class="md-nav md-nav--primary" data-md-level="0">
<label class="md-nav__title md-nav__title--site" for="drawer">
<span class="md-nav__button md-logo">
<label class="md-nav__title md-nav__title--site" for="__drawer">
<a href="https://Hieromon.github.io/AutoConnect/" title="AutoConnect for ESP8266/ESP32" class="md-nav__button md-logo">
<img src="../images/arduino-logo.svg" width="48" height="48">
<img src="images/arduino-logo.svg" width="48" height="48">
</span>
</a>
AutoConnect for ESP8266/ESP32
</label>
@ -258,20 +327,18 @@
<a href="https://github.com/Hieromon/AutoConnect" title="Go to repository" class="md-source" data-md-source="github">
<div class="md-source__icon">
<svg viewBox="0 0 24 24" width="24" height="24">
<use xlink:href="#github" width="24" height="24"></use>
</svg>
</div>
<div class="md-source__repository">
Hieromon/AutoConnect
<a href="https://github.com/Hieromon/AutoConnect" title="Go to repository" class="md-source" data-md-source="github">
<div class="md-source__icon">
<svg viewBox="0 0 24 24" width="24" height="24">
<use xlink:href="#__github" width="24" height="24"></use>
</svg>
</div>
</a>
<div class="md-source__repository">
Hieromon/AutoConnect
</div>
</a>
</div>
<ul class="md-nav__list" data-md-scrollfix>
@ -282,7 +349,7 @@
<li class="md-nav__item">
<a href="../index.html" title="Overview" class="md-nav__link">
<a href="index.html" title="Overview" class="md-nav__link">
Overview
</a>
</li>
@ -294,7 +361,7 @@
<li class="md-nav__item">
<a href="../gettingstarted/index.html" title="Getting started" class="md-nav__link">
<a href="gettingstarted.html" title="Getting started" class="md-nav__link">
Getting started
</a>
</li>
@ -306,7 +373,7 @@
<li class="md-nav__item">
<a href="../menu/index.html" title="AutoConnect menu" class="md-nav__link">
<a href="menu.html" title="AutoConnect menu" class="md-nav__link">
AutoConnect menu
</a>
</li>
@ -318,7 +385,7 @@
<li class="md-nav__item">
<a href="../basicusage/index.html" title="Basic usage" class="md-nav__link">
<a href="basicusage.html" title="Basic usage" class="md-nav__link">
Basic usage
</a>
</li>
@ -330,7 +397,7 @@
<li class="md-nav__item">
<a href="../advancedusage/index.html" title="Advanced usage" class="md-nav__link">
<a href="advancedusage.html" title="Advanced usage" class="md-nav__link">
Advanced usage
</a>
</li>
@ -341,24 +408,228 @@
<li class="md-nav__item md-nav__item--nested">
<input class="md-toggle md-nav__toggle" data-md-toggle="nav-6" type="checkbox" id="nav-6">
<label class="md-nav__link" for="nav-6">
Custom Web pages
</label>
<nav class="md-nav" data-md-component="collapsible" data-md-level="1">
<label class="md-nav__title" for="nav-6">
Custom Web pages
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="../api/index.html" title="Library APIs" class="md-nav__link">
Library APIs
<a href="acintro.html" title="Custom Web pages with AutoConnect" class="md-nav__link">
Custom Web pages with AutoConnect
</a>
</li>
<li class="md-nav__item">
<a href="acelements.html" title="AutoConnectElements" class="md-nav__link">
AutoConnectElements
</a>
</li>
<li class="md-nav__item">
<a href="acjson.html" title="Custom Web pages with JSON" class="md-nav__link">
Custom Web pages with JSON
</a>
</li>
<li class="md-nav__item">
<a href="achandling.html" title="Handling the custom Web pages" class="md-nav__link">
Handling the custom Web pages
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item md-nav__item--nested">
<input class="md-toggle md-nav__toggle" data-md-toggle="nav-7" type="checkbox" id="nav-7">
<label class="md-nav__link" for="nav-7">
Library APIs
</label>
<nav class="md-nav" data-md-component="collapsible" data-md-level="1">
<label class="md-nav__title" for="nav-7">
Library APIs
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="api.html" title="AutoConnect API" class="md-nav__link">
AutoConnect API
</a>
</li>
<li class="md-nav__item">
<a href="apiaux.html" title="AutoConnectAux API" class="md-nav__link">
AutoConnectAux API
</a>
</li>
<li class="md-nav__item">
<a href="../examples/index.html" title="Examples" class="md-nav__link">
<a href="apiconfig.html" title="AutoConnectConfig API" class="md-nav__link">
AutoConnectConfig API
</a>
</li>
<li class="md-nav__item">
<a href="apielements.html" title="AutoConnectElements API" class="md-nav__link">
AutoConnectElements API
</a>
</li>
<li class="md-nav__item">
<a href="apiextra.html" title="Something extra" class="md-nav__link">
Something extra
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item md-nav__item--nested">
<input class="md-toggle md-nav__toggle" data-md-toggle="nav-8" type="checkbox" id="nav-8">
<label class="md-nav__link" for="nav-8">
Examples
</label>
<nav class="md-nav" data-md-component="collapsible" data-md-level="1">
<label class="md-nav__title" for="nav-8">
Examples
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="howtoembed.html" title="How to embed" class="md-nav__link">
How to embed
</a>
</li>
<li class="md-nav__item">
<a href="datatips.html" title="Tips for data conversion" class="md-nav__link">
Tips for data conversion
</a>
</li>
<li class="md-nav__item">
<a href="menuize.html" title="Attach the menu" class="md-nav__link">
Attach the menu
</a>
</li>
<li class="md-nav__item">
<a href="wojson.html" title="Custom Web pages w/o JSON" class="md-nav__link">
Custom Web pages w/o JSON
</a>
</li>
</ul>
</nav>
</li>
@ -366,7 +637,19 @@
<li class="md-nav__item">
<a href="../faq/index.html" title="FAQ" class="md-nav__link">
<a href="lsbegin.html" title="Appendix" class="md-nav__link">
Appendix
</a>
</li>
<li class="md-nav__item">
<a href="faq.html" title="FAQ" class="md-nav__link">
FAQ
</a>
</li>
@ -381,14 +664,14 @@
<li class="md-nav__item md-nav__item--active">
<input class="md-toggle md-nav__toggle" data-md-toggle="toc" type="checkbox" id="toc">
<input class="md-toggle md-nav__toggle" data-md-toggle="toc" type="checkbox" id="__toc">
<label class="md-nav__link md-nav__link--active" for="toc">
<label class="md-nav__link md-nav__link--active" for="__toc">
Change log
</label>
<a href="index.html" title="Change log" class="md-nav__link md-nav__link--active">
<a href="changelog.html" title="Change log" class="md-nav__link md-nav__link--active">
Change log
</a>
@ -397,12 +680,19 @@
<label class="md-nav__title" for="toc">Table of contents</label>
<label class="md-nav__title" for="__toc">Table of contents</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="#096-sep27-2018" title="[0.9.6] Sep.27, 2018." class="md-nav__link">
[0.9.6] Sep.27, 2018.
<a href="#097-jan-25-2019" title="[0.9.7] Jan. 25, 2019" class="md-nav__link">
[0.9.7] Jan. 25, 2019
</a>
</li>
<li class="md-nav__item">
<a href="#096-sept27-2018" title="[0.9.6] Sept.27, 2018." class="md-nav__link">
[0.9.6] Sept.27, 2018.
</a>
</li>
@ -459,7 +749,7 @@
<li class="md-nav__item">
<a href="../license/index.html" title="License" class="md-nav__link">
<a href="license.html" title="License" class="md-nav__link">
License
</a>
</li>
@ -480,12 +770,19 @@
<label class="md-nav__title" for="toc">Table of contents</label>
<label class="md-nav__title" for="__toc">Table of contents</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="#096-sep27-2018" title="[0.9.6] Sep.27, 2018." class="md-nav__link">
[0.9.6] Sep.27, 2018.
<a href="#097-jan-25-2019" title="[0.9.7] Jan. 25, 2019" class="md-nav__link">
[0.9.7] Jan. 25, 2019
</a>
</li>
<li class="md-nav__item">
<a href="#096-sept27-2018" title="[0.9.6] Sept.27, 2018." class="md-nav__link">
[0.9.6] Sept.27, 2018.
</a>
</li>
@ -544,10 +841,22 @@
<h1>Change log</h1>
<h4 id="096-sep27-2018">[0.9.6] Sep.27, 2018.<a class="headerlink" href="#096-sep27-2018" title="Permanent link">&para;</a></h4>
<h4 id="097-jan-25-2019">[0.9.7] Jan. 25, 2019<a class="headerlink" href="#097-jan-25-2019" title="Permanent link">&para;</a></h4>
<ul>
<li>Fixed crash in some environments. Thank you @ageurtse</li>
<li>Supports AutoConnect menu extention by user sketch with <a href="acintro.html"><strong>AutoConnectAux</strong></a>.</li>
<li>Supports loading and saving of user-defined parameters with JSON format.</li>
<li>Improved the WiFi connection sequence at the first WiFi.begin. Even if <a href="apiconfig.html#autoreconnect"><strong>AutoConnectConfig::autoReconnect</strong></a> is disabled when SSID and PSK are not specified, it will use the information of the last established access point. The autoReconnect option will achieve trying the connect after a previous connection failed.</li>
<li>Supports the <a href="apiconfig.html#immediatestart"><strong>AutoConnectConfig::immediateStart</strong></a> option and immediately starts the portal without first trying WiFi.begin. You can start the captive portal at any time in combination with the <a href="apiconfig.html#autorise"><strong>AutoConnectConfig::autoRise</strong></a> option.</li>
<li>Improved boot uri after reset. <a href="apiconfig.html#booturi"><strong>AutoConnectConfig::bootUri</strong></a> can be specified either /_ac or HOME path as the uri to be accessed after invoking Reset from AutoConnect menu.</li>
<li>Improved source code placement of predefined macros. Defined common macros have been moved to <code>AutoConnectDefs.h</code>.</li>
<li>Supports <a href="apiconfig.html#hostname"><strong>AutoConnectConfig::hostName</strong></a>. It activates <code>WiFi.hostname()</code>/<code>WiFi.setHostName()</code>.</li>
<li>Supports the captive portal time-out. It can be controlled by <a href="apiconfig.html#portaltimeout"><strong>AutoConnectConfig::portalTimeout</strong></a> and <a href="apiconfig.html#retainportal"><strong>AutoConnectConfig::retainPortal</strong></a>.</li>
</ul>
<h4 id="096-sept27-2018">[0.9.6] Sept.27, 2018.<a class="headerlink" href="#096-sept27-2018" title="Permanent link">&para;</a></h4>
<ul>
<li>Improvement of RSSI detection for saved SSIDs.</li>
<li>Fixed disconnection SoftAP completely at the first connection phase of the AutoConnect::begin.</li>
<li>Fixed disconnection SoftAP completely at the first connection phase of the <a href="api.html#begin"><strong>AutoConnect::begin</strong></a>.</li>
</ul>
<h4 id="095-aug27-2018">[0.9.5] Aug.27, 2018.<a class="headerlink" href="#095-aug27-2018" title="Permanent link">&para;</a></h4>
<ul>
@ -557,7 +866,7 @@
<h4 id="094-may-5-2018">[0.9.4] May 5, 2018.<a class="headerlink" href="#094-may-5-2018" title="Permanent link">&para;</a></h4>
<ul>
<li>Automatically focus passphrase after selecting SSID with Configure New AP.</li>
<li>Supports AutoConnectConfig::autoReconnect option, it will scan the WLAN when it can not connect to the default SSID, apply the applicable credentials if it is saved, and try reconnecting.</li>
<li>Supports <a href="apiconfig.html#autoreconnect"><strong>AutoConnectConfig::autoReconnect</strong></a> option, it will scan the WLAN when it can not connect to the default SSID, apply the applicable credentials if it is saved, and try reconnecting.</li>
</ul>
<h4 id="093-march-23-2018">[0.9.3] March 23, 2018.<a class="headerlink" href="#093-march-23-2018" title="Permanent link">&para;</a></h4>
<ul>
@ -577,6 +886,8 @@
</article>
</div>
@ -589,7 +900,7 @@
<div class="md-footer-nav">
<nav class="md-footer-nav__inner md-grid">
<a href="../faq/index.html" title="FAQ" class="md-flex md-footer-nav__link md-footer-nav__link--prev" rel="prev">
<a href="faq.html" title="FAQ" class="md-flex md-footer-nav__link md-footer-nav__link--prev" rel="prev">
<div class="md-flex__cell md-flex__cell--shrink">
<i class="md-icon md-icon--arrow-back md-footer-nav__button"></i>
</div>
@ -604,7 +915,7 @@
</a>
<a href="../license/index.html" title="License" class="md-flex md-footer-nav__link md-footer-nav__link--next" rel="next">
<a href="license.html" title="License" class="md-flex md-footer-nav__link md-footer-nav__link--next" rel="next">
<div class="md-flex__cell md-flex__cell--stretch md-footer-nav__title">
<span class="md-flex__ellipsis">
<span class="md-footer-nav__direction">
@ -626,20 +937,18 @@
<div class="md-footer-copyright">
<div class="md-footer-copyright__highlight">
Copyright &copy; 2018 Hieromon Ikasamo
Copyright &copy; 2018-2019 Hieromon Ikasamo
</div>
powered by
<a href="http://www.mkdocs.org">MkDocs</a>
<a href="https://www.mkdocs.org">MkDocs</a>
and
<a href="https://squidfunk.github.io/mkdocs-material/">
Material for MkDocs</a>
</div>
<div class="md-footer-social">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<link rel="stylesheet" href="assets/fonts/font-awesome.css">
<a href="https://github.com/Hieromon" class="md-footer-social__link fa fa-github"></a>
@ -647,23 +956,17 @@
</div>
</div>
</div>
</footer>
</div>
<script src="../assets/javascripts/application.8eb9be28.js"></script>
<script>app.initialize({version:"0.17.3",url:{base:".."}})</script>
<script src="assets/javascripts/application.b806dc00.js"></script>
<script src="../js/gifffer.min.js"></script>
<script>app.initialize({version:"1.0.4",url:{base:"."}})</script>
<script>!function(e,a,t,n,o,c,i){e.GoogleAnalyticsObject=o,e.ga=e.ga||function(){(e.ga.q=e.ga.q||[]).push(arguments)},e.ga.l=1*new Date,c=a.createElement(t),i=a.getElementsByTagName(t)[0],c.async=1,c.src="https://www.google-analytics.com/analytics.js",i.parentNode.insertBefore(c,i)}(window,document,"script",0,"ga"),ga("create","UA-116150854-1","auto"),ga("set","anonymizeIp",!0),ga("send","pageview");var links=document.getElementsByTagName("a");if(Array.prototype.map.call(links,function(e){e.host!=document.location.host&&e.addEventListener("click",function(){var a=e.getAttribute("data-md-action")||"follow";ga("send","event","outbound",a,e.href)})}),document.forms.search){var query=document.forms.search.query;query.addEventListener("blur",function(){if(this.value){var e=document.location.pathname;ga("send","pageview",e+"?q="+this.value)}})}</script>
<script src="js/gifffer.min.js"></script>
</body>

@ -0,0 +1,9 @@
pre { color: white !important; }
.md-clipboard:before {
color: rgb(100, 100, 100);
}
.codehilite:hover .md-clipboard:before,.md-typeset .highlight:hover .md-clipboard:before,pre:hover .md-clipboard:before {
color: rgba(255, 255, 255, 0.54) !important
}

@ -19,26 +19,49 @@
}
.md-typeset .codehilitetable .linenodiv {
background-color: #364549 !important;
background-color: #222 !important;
}
.md-typeset .codehilitetable .linenodiv pre {
background-color: #364549 !important;
background-color: #222 !important;
color: #aaa;
margin: 0;
}
.apidef {
display: inline-block;
width: 100px;
.md-typeset .codehilitetable .md-clipboard:before {
color: rgba(240,240,240,.8);
}
.md-typeset .codehilitetable .md-clipboard:hover:before {
color: rgba(102,217,224,1);
}
.apidl {
margin-left: 20px;
}
.apidef {
display: block;
float: left;
width: 100px;
}
.apidesc {
display: inline-block;
width: calc(100% - 100px);
}
.ulsty-edit > li:before {
font-family: 'FontAwesome';
content: '\f044';
margin:0 0.8em 0 -1.8em;
}
.horizontal-list {
list-style-type: none;
overflow: hidden;
}
.horizontal-list > li {
float: left;
display: block;
}

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

@ -2,7 +2,7 @@
<!DOCTYPE html>
<!doctype html>
<html lang="en" class="no-js">
<head>
@ -13,7 +13,7 @@
<meta name="description" content="ESP8266/ESP32 WLAN configuration at run time with web interface">
<link rel="canonical" href="https://Hieromon.github.io/AutoConnect/gettingstarted/index.html">
<link rel="canonical" href="https://Hieromon.github.io/AutoConnect/gettingstarted.html">
<meta name="author" content="Hieromon Ikasamo">
@ -37,8 +37,8 @@
<meta name="lang:search.tokenizer" content="[\s\-]+">
<link rel="shortcut icon" href="../assets/images/favicon.png">
<meta name="generator" content="mkdocs-0.17.3, mkdocs-material-2.7.0">
<link rel="shortcut icon" href="assets/images/favicon.png">
<meta name="generator" content="mkdocs-1.0.4, mkdocs-material-4.0.1">
@ -46,24 +46,62 @@
<link rel="stylesheet" href="../assets/stylesheets/application.78aab2dc.css">
<link rel="stylesheet" href="assets/stylesheets/application.982221ab.css">
<link rel="stylesheet" href="../assets/stylesheets/application-palette.6079476c.css">
<link rel="stylesheet" href="assets/stylesheets/application-palette.224b79ff.css">
<meta name="theme-color" content="#3f51b5">
<script src="../assets/javascripts/modernizr.1aa3b519.js"></script>
<script src="assets/javascripts/modernizr.1f0bcf2b.js"></script>
<link href="https://fonts.gstatic.com" rel="preconnect" crossorigin>
<link href="https://fonts.gstatic.com" rel="preconnect" crossorigin>
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,400,400i,700|Roboto+Mono">
<style>body,input{font-family:"Roboto","Helvetica Neue",Helvetica,Arial,sans-serif}code,kbd,pre{font-family:"Roboto Mono","Courier New",Courier,monospace}</style>
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
<link rel="stylesheet" href="assets/fonts/material-icons.css">
<link rel="stylesheet" href="css/paragraph.css">
<link rel="stylesheet" href="css/extra.css">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.6.1/css/all.css">
<link rel="stylesheet" href="../css/paragraph.css">
<script>
window.ga = window.ga || function() {
(ga.q = ga.q || []).push(arguments)
}
ga.l = +new Date
/* Setup integration and send page view */
ga("create", "UA-116150854-1", "auto")
ga("set", "anonymizeIp", true)
ga("send", "pageview")
/* Register handler to log search on blur */
document.addEventListener("DOMContentLoaded", () => {
if (document.forms.search) {
var query = document.forms.search.query
query.addEventListener("blur", function() {
if (this.value) {
var path = document.location.pathname;
ga("send", "pageview", path + "?q=" + this.value)
}
})
}
})
</script>
<script async src="https://www.google-analytics.com/analytics.js"></script>
</head>
@ -77,7 +115,7 @@
<svg xmlns="http://www.w3.org/2000/svg" width="416" height="448"
viewBox="0 0 416 448" id="github">
viewBox="0 0 416 448" id="__github">
<path fill="currentColor" d="M160 304q0 10-3.125 20.5t-10.75 19-18.125
8.5-18.125-8.5-10.75-19-3.125-20.5 3.125-20.5 10.75-19 18.125-8.5
18.125 8.5 10.75 19 3.125 20.5zM320 304q0 10-3.125 20.5t-10.75
@ -97,9 +135,9 @@
</defs>
</svg>
<input class="md-toggle" data-md-toggle="drawer" type="checkbox" id="drawer">
<input class="md-toggle" data-md-toggle="search" type="checkbox" id="search">
<label class="md-overlay" data-md-component="overlay" for="drawer"></label>
<input class="md-toggle" data-md-toggle="drawer" type="checkbox" id="__drawer" autocomplete="off">
<input class="md-toggle" data-md-toggle="search" type="checkbox" id="__search" autocomplete="off">
<label class="md-overlay" data-md-component="overlay" for="__drawer"></label>
<a href="#lets-do-the-most-simple-sketch" tabindex="1" class="md-skip">
Skip to content
@ -112,38 +150,35 @@
<div class="md-flex__cell md-flex__cell--shrink">
<a href="https://Hieromon.github.io/AutoConnect/" title="AutoConnect for ESP8266/ESP32" class="md-header-nav__button md-logo">
<img src="../images/arduino-logo.svg" width="24" height="24">
<img src="images/arduino-logo.svg" width="24" height="24">
</a>
</div>
<div class="md-flex__cell md-flex__cell--shrink">
<label class="md-icon md-icon--menu md-header-nav__button" for="drawer"></label>
<label class="md-icon md-icon--menu md-header-nav__button" for="__drawer"></label>
</div>
<div class="md-flex__cell md-flex__cell--stretch">
<div class="md-flex__ellipsis md-header-nav__title" data-md-component="title">
<span class="md-header-nav__topic">
AutoConnect for ESP8266/ESP32
</span>
<span class="md-header-nav__topic">
Getting started
</span>
<span class="md-header-nav__topic">
AutoConnect for ESP8266/ESP32
</span>
<span class="md-header-nav__topic">
Getting started
</span>
</div>
</div>
<div class="md-flex__cell md-flex__cell--shrink">
<label class="md-icon md-icon--search md-header-nav__button" for="__search"></label>
<label class="md-icon md-icon--search md-header-nav__button" for="search"></label>
<div class="md-search" data-md-component="search" role="dialog">
<label class="md-search__overlay" for="search"></label>
<label class="md-search__overlay" for="__search"></label>
<div class="md-search__inner" role="search">
<form class="md-search__form" name="search">
<input type="text" class="md-search__input" name="query" placeholder="Search" autocapitalize="off" autocorrect="off" autocomplete="off" spellcheck="false" data-md-component="query" data-md-state="active">
<label class="md-icon md-search__icon" for="search"></label>
<label class="md-icon md-search__icon" for="__search"></label>
<button type="reset" class="md-icon md-search__icon" data-md-component="reset" tabindex="-1">
&#xE5CD;
</button>
@ -160,7 +195,6 @@
</div>
</div>
</div>
</div>
@ -171,20 +205,18 @@
<a href="https://github.com/Hieromon/AutoConnect" title="Go to repository" class="md-source" data-md-source="github">
<div class="md-source__icon">
<svg viewBox="0 0 24 24" width="24" height="24">
<use xlink:href="#github" width="24" height="24"></use>
</svg>
</div>
<div class="md-source__repository">
Hieromon/AutoConnect
<a href="https://github.com/Hieromon/AutoConnect" title="Go to repository" class="md-source" data-md-source="github">
<div class="md-source__icon">
<svg viewBox="0 0 24 24" width="24" height="24">
<use xlink:href="#__github" width="24" height="24"></use>
</svg>
</div>
</a>
<div class="md-source__repository">
Hieromon/AutoConnect
</div>
</a>
</div>
</div>
@ -206,7 +238,7 @@
<li class="md-tabs__item">
<a href="../index.html" title="Overview" class="md-tabs__link md-tabs__link--active">
<a href="index.html" title="Overview" class="md-tabs__link md-tabs__link--active">
Overview
</a>
@ -222,6 +254,43 @@
<li class="md-tabs__item">
<a href="acintro.html" title="Custom Web pages" class="md-tabs__link">
Custom Web pages
</a>
</li>
<li class="md-tabs__item">
<a href="api.html" title="Library APIs" class="md-tabs__link">
Library APIs
</a>
</li>
<li class="md-tabs__item">
<a href="howtoembed.html" title="Examples" class="md-tabs__link">
Examples
</a>
</li>
@ -243,12 +312,12 @@
<div class="md-sidebar__scrollwrap">
<div class="md-sidebar__inner">
<nav class="md-nav md-nav--primary" data-md-level="0">
<label class="md-nav__title md-nav__title--site" for="drawer">
<span class="md-nav__button md-logo">
<label class="md-nav__title md-nav__title--site" for="__drawer">
<a href="https://Hieromon.github.io/AutoConnect/" title="AutoConnect for ESP8266/ESP32" class="md-nav__button md-logo">
<img src="../images/arduino-logo.svg" width="48" height="48">
<img src="images/arduino-logo.svg" width="48" height="48">
</span>
</a>
AutoConnect for ESP8266/ESP32
</label>
@ -258,20 +327,18 @@
<a href="https://github.com/Hieromon/AutoConnect" title="Go to repository" class="md-source" data-md-source="github">
<div class="md-source__icon">
<svg viewBox="0 0 24 24" width="24" height="24">
<use xlink:href="#github" width="24" height="24"></use>
</svg>
</div>
<div class="md-source__repository">
Hieromon/AutoConnect
<a href="https://github.com/Hieromon/AutoConnect" title="Go to repository" class="md-source" data-md-source="github">
<div class="md-source__icon">
<svg viewBox="0 0 24 24" width="24" height="24">
<use xlink:href="#__github" width="24" height="24"></use>
</svg>
</div>
</a>
<div class="md-source__repository">
Hieromon/AutoConnect
</div>
</a>
</div>
<ul class="md-nav__list" data-md-scrollfix>
@ -282,7 +349,7 @@
<li class="md-nav__item">
<a href="../index.html" title="Overview" class="md-nav__link">
<a href="index.html" title="Overview" class="md-nav__link">
Overview
</a>
</li>
@ -297,14 +364,14 @@
<li class="md-nav__item md-nav__item--active">
<input class="md-toggle md-nav__toggle" data-md-toggle="toc" type="checkbox" id="toc">
<input class="md-toggle md-nav__toggle" data-md-toggle="toc" type="checkbox" id="__toc">
<label class="md-nav__link md-nav__link--active" for="toc">
<label class="md-nav__link md-nav__link--active" for="__toc">
Getting started
</label>
<a href="index.html" title="Getting started" class="md-nav__link md-nav__link--active">
<a href="gettingstarted.html" title="Getting started" class="md-nav__link md-nav__link--active">
Getting started
</a>
@ -313,7 +380,7 @@
<label class="md-nav__title" for="toc">Table of contents</label>
<label class="md-nav__title" for="__toc">Table of contents</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
@ -374,7 +441,7 @@
<li class="md-nav__item">
<a href="../menu/index.html" title="AutoConnect menu" class="md-nav__link">
<a href="menu.html" title="AutoConnect menu" class="md-nav__link">
AutoConnect menu
</a>
</li>
@ -386,7 +453,7 @@
<li class="md-nav__item">
<a href="../basicusage/index.html" title="Basic usage" class="md-nav__link">
<a href="basicusage.html" title="Basic usage" class="md-nav__link">
Basic usage
</a>
</li>
@ -398,7 +465,7 @@
<li class="md-nav__item">
<a href="../advancedusage/index.html" title="Advanced usage" class="md-nav__link">
<a href="advancedusage.html" title="Advanced usage" class="md-nav__link">
Advanced usage
</a>
</li>
@ -409,21 +476,237 @@
<li class="md-nav__item md-nav__item--nested">
<input class="md-toggle md-nav__toggle" data-md-toggle="nav-6" type="checkbox" id="nav-6">
<label class="md-nav__link" for="nav-6">
Custom Web pages
</label>
<nav class="md-nav" data-md-component="collapsible" data-md-level="1">
<label class="md-nav__title" for="nav-6">
Custom Web pages
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="../api/index.html" title="Library APIs" class="md-nav__link">
Library APIs
<a href="acintro.html" title="Custom Web pages with AutoConnect" class="md-nav__link">
Custom Web pages with AutoConnect
</a>
</li>
<li class="md-nav__item">
<a href="acelements.html" title="AutoConnectElements" class="md-nav__link">
AutoConnectElements
</a>
</li>
<li class="md-nav__item">
<a href="acjson.html" title="Custom Web pages with JSON" class="md-nav__link">
Custom Web pages with JSON
</a>
</li>
<li class="md-nav__item">
<a href="achandling.html" title="Handling the custom Web pages" class="md-nav__link">
Handling the custom Web pages
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item md-nav__item--nested">
<input class="md-toggle md-nav__toggle" data-md-toggle="nav-7" type="checkbox" id="nav-7">
<label class="md-nav__link" for="nav-7">
Library APIs
</label>
<nav class="md-nav" data-md-component="collapsible" data-md-level="1">
<label class="md-nav__title" for="nav-7">
Library APIs
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="api.html" title="AutoConnect API" class="md-nav__link">
AutoConnect API
</a>
</li>
<li class="md-nav__item">
<a href="apiaux.html" title="AutoConnectAux API" class="md-nav__link">
AutoConnectAux API
</a>
</li>
<li class="md-nav__item">
<a href="apiconfig.html" title="AutoConnectConfig API" class="md-nav__link">
AutoConnectConfig API
</a>
</li>
<li class="md-nav__item">
<a href="../examples/index.html" title="Examples" class="md-nav__link">
<a href="apielements.html" title="AutoConnectElements API" class="md-nav__link">
AutoConnectElements API
</a>
</li>
<li class="md-nav__item">
<a href="apiextra.html" title="Something extra" class="md-nav__link">
Something extra
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item md-nav__item--nested">
<input class="md-toggle md-nav__toggle" data-md-toggle="nav-8" type="checkbox" id="nav-8">
<label class="md-nav__link" for="nav-8">
Examples
</label>
<nav class="md-nav" data-md-component="collapsible" data-md-level="1">
<label class="md-nav__title" for="nav-8">
Examples
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="howtoembed.html" title="How to embed" class="md-nav__link">
How to embed
</a>
</li>
<li class="md-nav__item">
<a href="datatips.html" title="Tips for data conversion" class="md-nav__link">
Tips for data conversion
</a>
</li>
<li class="md-nav__item">
<a href="menuize.html" title="Attach the menu" class="md-nav__link">
Attach the menu
</a>
</li>
<li class="md-nav__item">
<a href="wojson.html" title="Custom Web pages w/o JSON" class="md-nav__link">
Custom Web pages w/o JSON
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item">
<a href="lsbegin.html" title="Appendix" class="md-nav__link">
Appendix
</a>
</li>
@ -434,7 +717,7 @@
<li class="md-nav__item">
<a href="../faq/index.html" title="FAQ" class="md-nav__link">
<a href="faq.html" title="FAQ" class="md-nav__link">
FAQ
</a>
</li>
@ -446,7 +729,7 @@
<li class="md-nav__item">
<a href="../changelog/index.html" title="Change log" class="md-nav__link">
<a href="changelog.html" title="Change log" class="md-nav__link">
Change log
</a>
</li>
@ -458,7 +741,7 @@
<li class="md-nav__item">
<a href="../license/index.html" title="License" class="md-nav__link">
<a href="license.html" title="License" class="md-nav__link">
License
</a>
</li>
@ -479,7 +762,7 @@
<label class="md-nav__title" for="toc">Table of contents</label>
<label class="md-nav__title" for="__toc">Table of contents</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
@ -544,56 +827,56 @@
<h2 id="lets-do-the-most-simple-sketch">Let's do the most simple sketch<a class="headerlink" href="#lets-do-the-most-simple-sketch" title="Permanent link">&para;</a></h2>
<p>Open the Arduino IDE, write the following sketch and upload it. The feature of this sketch is that the SSID and Password are not coded.</p>
<div class="codehilite"><pre><span></span><span class="cp">#include</span> <span class="cpf">&lt;ESP8266WiFi.h&gt; // Replace with WiFi.h for ESP32</span><span class="cp"></span>
<span class="cp">#include</span> <span class="cpf">&lt;ESP8266WebServer.h&gt; // Replace with WebServer.h for ESP32</span><span class="cp"></span>
<span class="cp">#include</span> <span class="cpf">&lt;AutoConnect.h&gt;</span><span class="cp"></span>
<span class="n">ESP8266WebServer</span> <span class="nf">Server</span><span class="p">;</span> <span class="c1">// Replace with WebServer for ESP32</span>
<span class="n">AutoConnect</span> <span class="nf">Portal</span><span class="p">(</span><span class="nf">Server</span><span class="p">);</span>
<span class="kr">void</span> <span class="nf">rootPage</span><span class="p">()</span> <span class="p">{</span>
<span class="kr">char</span> <span class="n">content</span><span class="p">[]</span> <span class="o">=</span> <span class="s">&quot;Hello, world&quot;</span><span class="p">;</span>
<span class="nf">Server</span><span class="p">.</span><span class="n">send</span><span class="p">(</span><span class="mi">200</span><span class="p">,</span> <span class="s">&quot;text/plain&quot;</span><span class="p">,</span> <span class="n">content</span><span class="p">);</span>
<span class="p">}</span>
<span class="kr">void</span> <span class="nb">setup</span><span class="p">()</span> <span class="p">{</span>
<span class="nf">delay</span><span class="p">(</span><span class="mi">1000</span><span class="p">);</span>
<span class="nf">Serial</span><span class="p">.</span><span class="nf">begin</span><span class="p">(</span><span class="mi">115200</span><span class="p">);</span>
<span class="nf">Serial</span><span class="p">.</span><span class="nf">println</span><span class="p">();</span>
<span class="nf">Server</span><span class="p">.</span><span class="n">on</span><span class="p">(</span><span class="s">&quot;/&quot;</span><span class="p">,</span> <span class="n">rootPage</span><span class="p">);</span>
<span class="k">if</span> <span class="p">(</span><span class="n">Portal</span><span class="p">.</span><span class="nf">begin</span><span class="p">())</span> <span class="p">{</span>
<span class="nf">Serial</span><span class="p">.</span><span class="nf">println</span><span class="p">(</span><span class="s">&quot;WiFi connected: &quot;</span> <span class="o">+</span> <span class="nf">WiFi</span><span class="p">.</span><span class="nf">localIP</span><span class="p">().</span><span class="n">toString</span><span class="p">());</span>
<span class="p">}</span>
<span class="p">}</span>
<span class="kr">void</span> <span class="nb">loop</span><span class="p">()</span> <span class="p">{</span>
<span class="n">Portal</span><span class="p">.</span><span class="n">handleClient</span><span class="p">();</span>
<span class="p">}</span>
<div class="codehilite" style="background: #272822"><pre style="line-height: 125%"><span></span><span style="color: #75715e">#include</span> <span style="color: #75715e">&lt;ESP8266WiFi.h&gt; // Replace with WiFi.h for ESP32</span>
<span style="color: #75715e">#include</span> <span style="color: #75715e">&lt;ESP8266WebServer.h&gt; // Replace with WebServer.h for ESP32</span>
<span style="color: #75715e">#include</span> <span style="color: #75715e">&lt;AutoConnect.h&gt;</span>
<span style="color: #f8f8f2">ESP8266WebServer</span> <span style="color: #f8f8f2">Server;</span> <span style="color: #75715e">// Replace with WebServer for ESP32</span>
<span style="color: #f8f8f2">AutoConnect</span> <span style="color: #a6e22e">Portal</span><span style="color: #f8f8f2">(Server);</span>
<span style="color: #66d9ef">void</span> <span style="color: #a6e22e">rootPage</span><span style="color: #f8f8f2">()</span> <span style="color: #f8f8f2">{</span>
<span style="color: #66d9ef">char</span> <span style="color: #f8f8f2">content[]</span> <span style="color: #f92672">=</span> <span style="color: #e6db74">&quot;Hello, world&quot;</span><span style="color: #f8f8f2">;</span>
<span style="color: #f8f8f2">Server.send(</span><span style="color: #ae81ff">200</span><span style="color: #f8f8f2">,</span> <span style="color: #e6db74">&quot;text/plain&quot;</span><span style="color: #f8f8f2">,</span> <span style="color: #f8f8f2">content);</span>
<span style="color: #f8f8f2">}</span>
<span style="color: #66d9ef">void</span> <span style="color: #a6e22e">setup</span><span style="color: #f8f8f2">()</span> <span style="color: #f8f8f2">{</span>
<span style="color: #f8f8f2">delay(</span><span style="color: #ae81ff">1000</span><span style="color: #f8f8f2">);</span>
<span style="color: #f8f8f2">Serial.begin(</span><span style="color: #ae81ff">115200</span><span style="color: #f8f8f2">);</span>
<span style="color: #f8f8f2">Serial.println();</span>
<span style="color: #f8f8f2">Server.on(</span><span style="color: #e6db74">&quot;/&quot;</span><span style="color: #f8f8f2">,</span> <span style="color: #f8f8f2">rootPage);</span>
<span style="color: #66d9ef">if</span> <span style="color: #f8f8f2">(Portal.begin())</span> <span style="color: #f8f8f2">{</span>
<span style="color: #f8f8f2">Serial.println(</span><span style="color: #e6db74">&quot;WiFi connected: &quot;</span> <span style="color: #f92672">+</span> <span style="color: #f8f8f2">WiFi.localIP().toString());</span>
<span style="color: #f8f8f2">}</span>
<span style="color: #f8f8f2">}</span>
<span style="color: #66d9ef">void</span> <span style="color: #a6e22e">loop</span><span style="color: #f8f8f2">()</span> <span style="color: #f8f8f2">{</span>
<span style="color: #f8f8f2">Portal.handleClient();</span>
<span style="color: #f8f8f2">}</span>
</pre></div>
<div class="admonition note">
<p>The above code can be applied to ESP8266. To apply to ESP32, replace <code class="codehilite">ESP8266WebServer</code> class with <code class="codehilite">WebServer</code> and include <code class="codehilite">WiFi.h</code> and <code class="codehilite">WebServer.h</code> of arduino-esp32 appropriately.</p>
<p>The above code can be applied to ESP8266. To apply to ESP32, replace <code>ESP8266WebServer</code> class with <code>WebServer</code> and include <code>WiFi.h</code> and <code>WebServer.h</code> of arduino-esp32 appropriately.</p>
</div>
<h3 id="run-at-first"><i class="fa fa-play-circle"></i> Run at first<a class="headerlink" href="#run-at-first" title="Permanent link">&para;</a></h3>
<p>After about 30 seconds, if the ESP8266 cannot connect to nearby Wi-Fi spot, you pull out your smartphone and open <em>Wi-Fi settings</em> from the <em>Settings</em> Apps. You can see the <strong>esp8266ap</strong> <sup id="fnref:1"><a class="footnote-ref" href="#fn:1" rel="footnote">1</a></sup> in the list of <em>"CHOOSE A NETWORK..."</em>. Then tap the esp8266ap and enter password <strong>12345678</strong>, a something screen pops up automatically as shown below.</p>
<p><span style="display:inline-block;width:282px;height:501px;border:1px solid lightgrey;"><img data-gifffer="../images/login_ani.gif" data-gifffer-width="280" style="width:280px;" /></span><img src="../images/arrow_right.svg" style="vertical-align:top;padding-top:120px;width:48px;margin-left:30px;margin-right:30px;" /><img src="../images/stat.png" style="border:1px solid lightgrey;width:280px;" /></span></p>
<p><span style="display:inline-block;width:282px;height:501px;border:1px solid lightgrey;"><img data-gifffer="images/login_ani.gif" data-gifffer-width="280" style="width:280px;" /></span><img src="images/arrow_right.svg" style="vertical-align:top;padding-top:120px;width:48px;margin-left:30px;margin-right:30px;" /><img src="images/stat.png" style="border:1px solid lightgrey;width:280px;" /></span></p>
<p>This is the AutoConnect statistics screen. This screen displays the current status of the established connection, WiFi mode, IP address, free memory size, and etc. Also, the <strong>hamburger icon</strong> is the control menu of AutoConnect seems at the upper right. By tap the hamburger icon, the control menu appears as the below.</p>
<h3 id="join-to-the-new-access-point"><i class="fa fa-cog"></i> Join to the new access point<a class="headerlink" href="#join-to-the-new-access-point" title="Permanent link">&para;</a></h3>
<p>Here, tap <em>"Configure new AP"</em> to connect the new access point then the SSID configuration screen would be shown. Enter the <strong>SSID</strong> and <strong>Passphrase</strong> and tap <strong>apply</strong> to start connecting the access point.</p>
<p><img src="../images/menu_login.png" style="border:1px solid lightgrey;width:280px;" /><img src="../images/arrow_right.svg" style="vertical-align:top;padding-top:120px;width:48px;margin-left:30px;margin-right:30px;" /><img src="../images/config_ssid.png" style="border:1px solid lightgrey;width:280px;" /></p>
<p><img src="images/menu_login.png" style="border:1px solid lightgrey;width:280px;" /><img src="images/arrow_right.svg" style="vertical-align:top;padding-top:120px;width:48px;margin-left:30px;margin-right:30px;" /><img src="images/config_ssid.png" style="border:1px solid lightgrey;width:280px;" /></p>
<h3 id="connection-establishment"><i class="fa fa-rss"></i> Connection establishment<a class="headerlink" href="#connection-establishment" title="Permanent link">&para;</a></h3>
<p>After connection established, the current status screen will appear. It is already connected to WLAN with WiFi mode as WIFI_AP_STA and the IP connection status is displayed there including the SSID. Then at this screen, you have two options for the next step.</p>
<p>For one, continues execution of the sketch while keeping this connection. You can access ESP8266 via browser through the established IP address after cancel to "<strong>Log in</strong>" by upper right on the screen.<br />
Or, "<strong>RESET</strong>" can be selected. The ESP8266 resets and reboots. After that, immediately before the connection will be restored automatically with WIFI_STA mode.</p>
<p><img src="../images/established.png" style="border:1px solid lightgrey;width:280px;" /><img src="../images/arrow_right.svg" style="vertical-align:top;padding-top:120px;width:48px;margin-left:30px;margin-right:30px;" /><img src="../images/reset.png" style="border:1px solid lightgrey;width:280px;" /></p>
<p><img src="images/established.png" style="border:1px solid lightgrey;width:280px;" /><img src="images/arrow_right.svg" style="vertical-align:top;padding-top:120px;width:48px;margin-left:30px;margin-right:30px;" /><img src="images/reset.png" style="border:1px solid lightgrey;width:280px;" /></p>
<h3 id="run-for-usually"><i class="fa fa-play-circle"></i> Run for usually<a class="headerlink" href="#run-for-usually" title="Permanent link">&para;</a></h3>
<p>The IP address of ESP8266 would be displayed on the serial monitor after connection restored. Please access its address from the browser. The "Hello, world" page will respond. It's the page that was handled by in the sketch with "<strong>on</strong>" function of <em>ESP8266WebServer</em>.</p>
<p><img src="../images/serial.png" style="vertical-align:top;" /><img src="../images/arrow_right.svg" style="vertical-align:top;padding-top:60px;width:48px;margin-left:45px;margin-right:30px;" /><img src="../images/hello_world.png" style="border:1px solid lightgrey;width:280px;" /></p>
<p><img src="images/serial.png" style="vertical-align:top;" /><img src="images/arrow_right.svg" style="vertical-align:top;padding-top:60px;width:48px;margin-left:45px;margin-right:30px;" /><img src="images/hello_world.png" style="border:1px solid lightgrey;width:280px;" /></p>
<script>
window.onload = function() {
Gifffer();
}
};
</script>
<div class="footnote">
@ -610,6 +893,8 @@ Or, "<strong>RESET</strong>" can be selected. The ESP8266 resets and reboots. Af
</article>
</div>
@ -622,7 +907,7 @@ Or, "<strong>RESET</strong>" can be selected. The ESP8266 resets and reboots. Af
<div class="md-footer-nav">
<nav class="md-footer-nav__inner md-grid">
<a href="../index.html" title="Overview" class="md-flex md-footer-nav__link md-footer-nav__link--prev" rel="prev">
<a href="index.html" title="Overview" class="md-flex md-footer-nav__link md-footer-nav__link--prev" rel="prev">
<div class="md-flex__cell md-flex__cell--shrink">
<i class="md-icon md-icon--arrow-back md-footer-nav__button"></i>
</div>
@ -637,7 +922,7 @@ Or, "<strong>RESET</strong>" can be selected. The ESP8266 resets and reboots. Af
</a>
<a href="../menu/index.html" title="AutoConnect menu" class="md-flex md-footer-nav__link md-footer-nav__link--next" rel="next">
<a href="menu.html" title="AutoConnect menu" class="md-flex md-footer-nav__link md-footer-nav__link--next" rel="next">
<div class="md-flex__cell md-flex__cell--stretch md-footer-nav__title">
<span class="md-flex__ellipsis">
<span class="md-footer-nav__direction">
@ -659,20 +944,18 @@ Or, "<strong>RESET</strong>" can be selected. The ESP8266 resets and reboots. Af
<div class="md-footer-copyright">
<div class="md-footer-copyright__highlight">
Copyright &copy; 2018 Hieromon Ikasamo
Copyright &copy; 2018-2019 Hieromon Ikasamo
</div>
powered by
<a href="http://www.mkdocs.org">MkDocs</a>
<a href="https://www.mkdocs.org">MkDocs</a>
and
<a href="https://squidfunk.github.io/mkdocs-material/">
Material for MkDocs</a>
</div>
<div class="md-footer-social">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<link rel="stylesheet" href="assets/fonts/font-awesome.css">
<a href="https://github.com/Hieromon" class="md-footer-social__link fa fa-github"></a>
@ -680,23 +963,17 @@ Or, "<strong>RESET</strong>" can be selected. The ESP8266 resets and reboots. Af
</div>
</div>
</div>
</footer>
</div>
<script src="../assets/javascripts/application.8eb9be28.js"></script>
<script>app.initialize({version:"0.17.3",url:{base:".."}})</script>
<script src="assets/javascripts/application.b806dc00.js"></script>
<script src="../js/gifffer.min.js"></script>
<script>app.initialize({version:"1.0.4",url:{base:"."}})</script>
<script>!function(e,a,t,n,o,c,i){e.GoogleAnalyticsObject=o,e.ga=e.ga||function(){(e.ga.q=e.ga.q||[]).push(arguments)},e.ga.l=1*new Date,c=a.createElement(t),i=a.getElementsByTagName(t)[0],c.async=1,c.src="https://www.google-analytics.com/analytics.js",i.parentNode.insertBefore(c,i)}(window,document,"script",0,"ga"),ga("create","UA-116150854-1","auto"),ga("set","anonymizeIp",!0),ga("send","pageview");var links=document.getElementsByTagName("a");if(Array.prototype.map.call(links,function(e){e.host!=document.location.host&&e.addEventListener("click",function(){var a=e.getAttribute("data-md-action")||"follow";ga("send","event","outbound",a,e.href)})}),document.forms.search){var query=document.forms.search.query;query.addEventListener("blur",function(){if(this.value){var e=document.location.pathname;ga("send","pageview",e+"?q="+this.value)}})}</script>
<script src="js/gifffer.min.js"></script>
</body>

@ -2,7 +2,7 @@
<!DOCTYPE html>
<!doctype html>
<html lang="en" class="no-js">
<head>
@ -13,7 +13,7 @@
<meta name="description" content="ESP8266/ESP32 WLAN configuration at run time with web interface">
<link rel="canonical" href="https://Hieromon.github.io/AutoConnect/examples/index.html">
<link rel="canonical" href="https://Hieromon.github.io/AutoConnect/howtoembed.html">
<meta name="author" content="Hieromon Ikasamo">
@ -37,33 +37,71 @@
<meta name="lang:search.tokenizer" content="[\s\-]+">
<link rel="shortcut icon" href="../assets/images/favicon.png">
<meta name="generator" content="mkdocs-0.17.3, mkdocs-material-2.7.0">
<link rel="shortcut icon" href="assets/images/favicon.png">
<meta name="generator" content="mkdocs-1.0.4, mkdocs-material-4.0.1">
<title>Examples - AutoConnect for ESP8266/ESP32</title>
<title>How to embed - AutoConnect for ESP8266/ESP32</title>
<link rel="stylesheet" href="../assets/stylesheets/application.78aab2dc.css">
<link rel="stylesheet" href="assets/stylesheets/application.982221ab.css">
<link rel="stylesheet" href="../assets/stylesheets/application-palette.6079476c.css">
<link rel="stylesheet" href="assets/stylesheets/application-palette.224b79ff.css">
<meta name="theme-color" content="#3f51b5">
<script src="../assets/javascripts/modernizr.1aa3b519.js"></script>
<script src="assets/javascripts/modernizr.1f0bcf2b.js"></script>
<link href="https://fonts.gstatic.com" rel="preconnect" crossorigin>
<link href="https://fonts.gstatic.com" rel="preconnect" crossorigin>
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,400,400i,700|Roboto+Mono">
<style>body,input{font-family:"Roboto","Helvetica Neue",Helvetica,Arial,sans-serif}code,kbd,pre{font-family:"Roboto Mono","Courier New",Courier,monospace}</style>
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
<link rel="stylesheet" href="assets/fonts/material-icons.css">
<link rel="stylesheet" href="css/paragraph.css">
<link rel="stylesheet" href="css/extra.css">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.6.1/css/all.css">
<link rel="stylesheet" href="../css/paragraph.css">
<script>
window.ga = window.ga || function() {
(ga.q = ga.q || []).push(arguments)
}
ga.l = +new Date
/* Setup integration and send page view */
ga("create", "UA-116150854-1", "auto")
ga("set", "anonymizeIp", true)
ga("send", "pageview")
/* Register handler to log search on blur */
document.addEventListener("DOMContentLoaded", () => {
if (document.forms.search) {
var query = document.forms.search.query
query.addEventListener("blur", function() {
if (this.value) {
var path = document.location.pathname;
ga("send", "pageview", path + "?q=" + this.value)
}
})
}
})
</script>
<script async src="https://www.google-analytics.com/analytics.js"></script>
</head>
@ -77,7 +115,7 @@
<svg xmlns="http://www.w3.org/2000/svg" width="416" height="448"
viewBox="0 0 416 448" id="github">
viewBox="0 0 416 448" id="__github">
<path fill="currentColor" d="M160 304q0 10-3.125 20.5t-10.75 19-18.125
8.5-18.125-8.5-10.75-19-3.125-20.5 3.125-20.5 10.75-19 18.125-8.5
18.125 8.5 10.75 19 3.125 20.5zM320 304q0 10-3.125 20.5t-10.75
@ -97,11 +135,11 @@
</defs>
</svg>
<input class="md-toggle" data-md-toggle="drawer" type="checkbox" id="drawer">
<input class="md-toggle" data-md-toggle="search" type="checkbox" id="search">
<label class="md-overlay" data-md-component="overlay" for="drawer"></label>
<input class="md-toggle" data-md-toggle="drawer" type="checkbox" id="__drawer" autocomplete="off">
<input class="md-toggle" data-md-toggle="search" type="checkbox" id="__search" autocomplete="off">
<label class="md-overlay" data-md-component="overlay" for="__drawer"></label>
<a href="#how-to-embed-the-autoconnect" tabindex="1" class="md-skip">
<a href="#embed-the-autoconnect-to-the-sketch" tabindex="1" class="md-skip">
Skip to content
</a>
@ -112,38 +150,35 @@
<div class="md-flex__cell md-flex__cell--shrink">
<a href="https://Hieromon.github.io/AutoConnect/" title="AutoConnect for ESP8266/ESP32" class="md-header-nav__button md-logo">
<img src="../images/arduino-logo.svg" width="24" height="24">
<img src="images/arduino-logo.svg" width="24" height="24">
</a>
</div>
<div class="md-flex__cell md-flex__cell--shrink">
<label class="md-icon md-icon--menu md-header-nav__button" for="drawer"></label>
<label class="md-icon md-icon--menu md-header-nav__button" for="__drawer"></label>
</div>
<div class="md-flex__cell md-flex__cell--stretch">
<div class="md-flex__ellipsis md-header-nav__title" data-md-component="title">
<span class="md-header-nav__topic">
AutoConnect for ESP8266/ESP32
</span>
<span class="md-header-nav__topic">
Examples
</span>
<span class="md-header-nav__topic">
AutoConnect for ESP8266/ESP32
</span>
<span class="md-header-nav__topic">
How to embed
</span>
</div>
</div>
<div class="md-flex__cell md-flex__cell--shrink">
<label class="md-icon md-icon--search md-header-nav__button" for="__search"></label>
<label class="md-icon md-icon--search md-header-nav__button" for="search"></label>
<div class="md-search" data-md-component="search" role="dialog">
<label class="md-search__overlay" for="search"></label>
<label class="md-search__overlay" for="__search"></label>
<div class="md-search__inner" role="search">
<form class="md-search__form" name="search">
<input type="text" class="md-search__input" name="query" placeholder="Search" autocapitalize="off" autocorrect="off" autocomplete="off" spellcheck="false" data-md-component="query" data-md-state="active">
<label class="md-icon md-search__icon" for="search"></label>
<label class="md-icon md-search__icon" for="__search"></label>
<button type="reset" class="md-icon md-search__icon" data-md-component="reset" tabindex="-1">
&#xE5CD;
</button>
@ -160,7 +195,6 @@
</div>
</div>
</div>
</div>
@ -171,20 +205,18 @@
<a href="https://github.com/Hieromon/AutoConnect" title="Go to repository" class="md-source" data-md-source="github">
<div class="md-source__icon">
<svg viewBox="0 0 24 24" width="24" height="24">
<use xlink:href="#github" width="24" height="24"></use>
</svg>
</div>
<div class="md-source__repository">
Hieromon/AutoConnect
<a href="https://github.com/Hieromon/AutoConnect" title="Go to repository" class="md-source" data-md-source="github">
<div class="md-source__icon">
<svg viewBox="0 0 24 24" width="24" height="24">
<use xlink:href="#__github" width="24" height="24"></use>
</svg>
</div>
</a>
<div class="md-source__repository">
Hieromon/AutoConnect
</div>
</a>
</div>
</div>
@ -199,14 +231,16 @@
<nav class="md-tabs" data-md-component="tabs">
<nav class="md-tabs md-tabs--active" data-md-component="tabs">
<div class="md-tabs__inner md-grid">
<ul class="md-tabs__list">
<li class="md-tabs__item">
<a href="../index.html" title="Overview" class="md-tabs__link md-tabs__link--active">
<a href="index.html" title="Overview" class="md-tabs__link">
Overview
</a>
@ -222,6 +256,43 @@
<li class="md-tabs__item">
<a href="acintro.html" title="Custom Web pages" class="md-tabs__link">
Custom Web pages
</a>
</li>
<li class="md-tabs__item">
<a href="api.html" title="Library APIs" class="md-tabs__link">
Library APIs
</a>
</li>
<li class="md-tabs__item">
<a href="howtoembed.html" title="Examples" class="md-tabs__link md-tabs__link--active">
Examples
</a>
</li>
@ -243,12 +314,12 @@
<div class="md-sidebar__scrollwrap">
<div class="md-sidebar__inner">
<nav class="md-nav md-nav--primary" data-md-level="0">
<label class="md-nav__title md-nav__title--site" for="drawer">
<span class="md-nav__button md-logo">
<label class="md-nav__title md-nav__title--site" for="__drawer">
<a href="https://Hieromon.github.io/AutoConnect/" title="AutoConnect for ESP8266/ESP32" class="md-nav__button md-logo">
<img src="../images/arduino-logo.svg" width="48" height="48">
<img src="images/arduino-logo.svg" width="48" height="48">
</span>
</a>
AutoConnect for ESP8266/ESP32
</label>
@ -258,20 +329,18 @@
<a href="https://github.com/Hieromon/AutoConnect" title="Go to repository" class="md-source" data-md-source="github">
<div class="md-source__icon">
<svg viewBox="0 0 24 24" width="24" height="24">
<use xlink:href="#github" width="24" height="24"></use>
</svg>
</div>
<div class="md-source__repository">
Hieromon/AutoConnect
<a href="https://github.com/Hieromon/AutoConnect" title="Go to repository" class="md-source" data-md-source="github">
<div class="md-source__icon">
<svg viewBox="0 0 24 24" width="24" height="24">
<use xlink:href="#__github" width="24" height="24"></use>
</svg>
</div>
</a>
<div class="md-source__repository">
Hieromon/AutoConnect
</div>
</a>
</div>
<ul class="md-nav__list" data-md-scrollfix>
@ -282,7 +351,7 @@
<li class="md-nav__item">
<a href="../index.html" title="Overview" class="md-nav__link">
<a href="index.html" title="Overview" class="md-nav__link">
Overview
</a>
</li>
@ -294,7 +363,7 @@
<li class="md-nav__item">
<a href="../gettingstarted/index.html" title="Getting started" class="md-nav__link">
<a href="gettingstarted.html" title="Getting started" class="md-nav__link">
Getting started
</a>
</li>
@ -306,7 +375,7 @@
<li class="md-nav__item">
<a href="../menu/index.html" title="AutoConnect menu" class="md-nav__link">
<a href="menu.html" title="AutoConnect menu" class="md-nav__link">
AutoConnect menu
</a>
</li>
@ -318,7 +387,7 @@
<li class="md-nav__item">
<a href="../basicusage/index.html" title="Basic usage" class="md-nav__link">
<a href="basicusage.html" title="Basic usage" class="md-nav__link">
Basic usage
</a>
</li>
@ -330,7 +399,7 @@
<li class="md-nav__item">
<a href="../advancedusage/index.html" title="Advanced usage" class="md-nav__link">
<a href="advancedusage.html" title="Advanced usage" class="md-nav__link">
Advanced usage
</a>
</li>
@ -341,12 +410,156 @@
<li class="md-nav__item md-nav__item--nested">
<input class="md-toggle md-nav__toggle" data-md-toggle="nav-6" type="checkbox" id="nav-6">
<label class="md-nav__link" for="nav-6">
Custom Web pages
</label>
<nav class="md-nav" data-md-component="collapsible" data-md-level="1">
<label class="md-nav__title" for="nav-6">
Custom Web pages
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="acintro.html" title="Custom Web pages with AutoConnect" class="md-nav__link">
Custom Web pages with AutoConnect
</a>
</li>
<li class="md-nav__item">
<a href="acelements.html" title="AutoConnectElements" class="md-nav__link">
AutoConnectElements
</a>
</li>
<li class="md-nav__item">
<a href="acjson.html" title="Custom Web pages with JSON" class="md-nav__link">
Custom Web pages with JSON
</a>
</li>
<li class="md-nav__item">
<a href="../api/index.html" title="Library APIs" class="md-nav__link">
<a href="achandling.html" title="Handling the custom Web pages" class="md-nav__link">
Handling the custom Web pages
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item md-nav__item--nested">
<input class="md-toggle md-nav__toggle" data-md-toggle="nav-7" type="checkbox" id="nav-7">
<label class="md-nav__link" for="nav-7">
Library APIs
</label>
<nav class="md-nav" data-md-component="collapsible" data-md-level="1">
<label class="md-nav__title" for="nav-7">
Library APIs
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="api.html" title="AutoConnect API" class="md-nav__link">
AutoConnect API
</a>
</li>
<li class="md-nav__item">
<a href="apiaux.html" title="AutoConnectAux API" class="md-nav__link">
AutoConnectAux API
</a>
</li>
<li class="md-nav__item">
<a href="apiconfig.html" title="AutoConnectConfig API" class="md-nav__link">
AutoConnectConfig API
</a>
</li>
<li class="md-nav__item">
<a href="apielements.html" title="AutoConnectElements API" class="md-nav__link">
AutoConnectElements API
</a>
</li>
<li class="md-nav__item">
<a href="apiextra.html" title="Something extra" class="md-nav__link">
Something extra
</a>
</li>
</ul>
</nav>
</li>
@ -355,17 +568,38 @@
<li class="md-nav__item md-nav__item--active md-nav__item--nested">
<input class="md-toggle md-nav__toggle" data-md-toggle="nav-8" type="checkbox" id="nav-8" checked>
<label class="md-nav__link" for="nav-8">
Examples
</label>
<nav class="md-nav" data-md-component="collapsible" data-md-level="1">
<label class="md-nav__title" for="nav-8">
Examples
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item md-nav__item--active">
<input class="md-toggle md-nav__toggle" data-md-toggle="toc" type="checkbox" id="toc">
<input class="md-toggle md-nav__toggle" data-md-toggle="toc" type="checkbox" id="__toc">
<label class="md-nav__link md-nav__link--active" for="toc">
Examples
<label class="md-nav__link md-nav__link--active" for="__toc">
How to embed
</label>
<a href="index.html" title="Examples" class="md-nav__link md-nav__link--active">
Examples
<a href="howtoembed.html" title="How to embed" class="md-nav__link md-nav__link--active">
How to embed
</a>
@ -373,12 +607,12 @@
<label class="md-nav__title" for="toc">Table of contents</label>
<label class="md-nav__title" for="__toc">Table of contents</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="#how-to-embed-the-autoconnect" title="How to embed the AutoConnect" class="md-nav__link">
How to embed the AutoConnect
<a href="#embed-the-autoconnect-to-the-sketch" title="Embed the AutoConnect to the sketch" class="md-nav__link">
Embed the AutoConnect to the sketch
</a>
</li>
@ -488,6 +722,59 @@
</li>
<li class="md-nav__item">
<a href="datatips.html" title="Tips for data conversion" class="md-nav__link">
Tips for data conversion
</a>
</li>
<li class="md-nav__item">
<a href="menuize.html" title="Attach the menu" class="md-nav__link">
Attach the menu
</a>
</li>
<li class="md-nav__item">
<a href="wojson.html" title="Custom Web pages w/o JSON" class="md-nav__link">
Custom Web pages w/o JSON
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item">
<a href="lsbegin.html" title="Appendix" class="md-nav__link">
Appendix
</a>
</li>
@ -495,7 +782,7 @@
<li class="md-nav__item">
<a href="../faq/index.html" title="FAQ" class="md-nav__link">
<a href="faq.html" title="FAQ" class="md-nav__link">
FAQ
</a>
</li>
@ -507,7 +794,7 @@
<li class="md-nav__item">
<a href="../changelog/index.html" title="Change log" class="md-nav__link">
<a href="changelog.html" title="Change log" class="md-nav__link">
Change log
</a>
</li>
@ -519,7 +806,7 @@
<li class="md-nav__item">
<a href="../license/index.html" title="License" class="md-nav__link">
<a href="license.html" title="License" class="md-nav__link">
License
</a>
</li>
@ -540,12 +827,12 @@
<label class="md-nav__title" for="toc">Table of contents</label>
<label class="md-nav__title" for="__toc">Table of contents</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="#how-to-embed-the-autoconnect" title="How to embed the AutoConnect" class="md-nav__link">
How to embed the AutoConnect
<a href="#embed-the-autoconnect-to-the-sketch" title="Embed the AutoConnect to the sketch" class="md-nav__link">
Embed the AutoConnect to the sketch
</a>
</li>
@ -662,30 +949,30 @@
<h1>Examples</h1>
<h1>How to embed</h1>
<h2 id="how-to-embed-the-autoconnect">How to embed the AutoConnect<a class="headerlink" href="#how-to-embed-the-autoconnect" title="Permanent link">&para;</a></h2>
<p>Here holds two case examples. Both examples perform the same function. Only how to incorporate the <strong>AutoConnect</strong> into the sketch differs. Also included in the sample folder, HandlePortal.ino also shows how to use the <a href="https://github.com/Hieromon/PageBuilder">PageBuilder</a> library for HTML assemblies.</p>
<h2 id="embed-the-autoconnect-to-the-sketch">Embed the AutoConnect to the sketch<a class="headerlink" href="#embed-the-autoconnect-to-the-sketch" title="Permanent link">&para;</a></h2>
<p>Here hold two case examples. Both examples perform the same function. Only how to incorporate the <strong>AutoConnect</strong> into the sketch differs. Also included in the sample folder, HandlePortal.ino also shows how to use the <a href="https://github.com/Hieromon/PageBuilder">PageBuilder</a> library for HTML assemblies.</p>
<h2 id="what-does-this-example-do">What does this example do?<a class="headerlink" href="#what-does-this-example-do" title="Permanent link">&para;</a></h2>
<p>Uses the web interface to light the LED connected to the <strong><a href="https://github.com/nodemcu/nodemcu-devkit-v1.0">NodeMCU</a></strong> module D0 port (which could be referred to as <em>BUILTIN_LED</em>), the following animation is it.</p>
<p>Access to the ESP8266 module connected WiFi from the browser then the page contains the current value of the D0 port would be displayed. The page has the buttons to switch the port value. The LED blinks according to the value of the button that was clicked. This example is a typical sketch of manipulating ESP8266's GPIO via WLAN.</p>
<p><img data-gifffer="../images/ac2.gif" /></p>
<p>Uses the web interface to light the LED connected to the D0 (sometimes called <em>BUILTIN_LED</em>) port of the <strong><a href="https://github.com/nodemcu/nodemcu-devkit-v1.0">NodeMCU</a></strong> module like the following animation.</p>
<p>Access to the ESP8266 module connected WiFi from the browser then the page contains the current value of the D0 port would be displayed. The page has the buttons to switch the port value. The LED will blink according to the value with clicked by the button. This example is a typical sketch of manipulating ESP8266's GPIO via WLAN.</p>
<p><img data-gifffer="images/ac2.gif" /></p>
<p>Embed AutoConnect library into this sketch. There are few places to be changed. And you can use AutoConnect's captive portal function to establish a connection freely to other WiFi spots.</p>
<h2 id="embed-autoconnect">Embed AutoConnect<a class="headerlink" href="#embed-autoconnect" title="Permanent link">&para;</a></h2>
<h3 id="pattern-a"><i class="fa fa-code" aria-hidden="true"></i> Pattern A.<a class="headerlink" href="#pattern-a" title="Permanent link">&para;</a></h3>
<p>Bind to ESP8266WebServer, performs handleClient with handleRequest.</p>
<p><img src="../images/handleClient.svg" /></p>
<p><img src="images/handleClient.svg" /></p>
<div class="admonition hint">
<p class="admonition-title">In what situations should the handleRequest be used.</p>
<p>It is something needs to be done immediately after the handle client. It is better to call only AutoConnect::handleClient whenever possible.</p>
</div>
<h3 id="pattern-b"><i class="fa fa-code" aria-hidden="true"></i> Pattern B.<a class="headerlink" href="#pattern-b" title="Permanent link">&para;</a></h3>
<p>Declare only AutoConnect, performs handleClient.</p>
<p><img src="../images/handlePortal.svg" /></p>
<p><img src="images/handlePortal.svg" /></p>
<h2 id="used-with-mqtt-as-a-client-application">Used with MQTT as a client application<a class="headerlink" href="#used-with-mqtt-as-a-client-application" title="Permanent link">&para;</a></h2>
<p>The effect of AutoConnect is not only for ESP8266/ESP32 as the web server. It has advantages for something WiFi client as well. For example, AutoConnect is also effective for publishing MQTT messages from various measurement points. Even if the SSID is different for each measurement point, it is not necessary to modify the sketch.</p>
<p>The effect of AutoConnect is not only for ESP8266/ESP32 as the web server. It has advantages for something WiFi client as well. For example, AutoConnect is also convenient for publishing MQTT messages from various measurement points. Even if the SSID is different for each measurement point, it is not necessary to modify the sketch.</p>
<p>This example tries to publish the WiFi signal strength of ESP8266 with MQTT. It uses the <a href="https://thingspeak.com/">ThingSpeak</a> for MQTT broker. ESP8266 publishes the RSSI value to the channel created on ThingSpeak as <a href="https://github.com/knolleary/pubsubclient">MQTT client</a>. This example is well suited to demonstrate the usefulness of AutoConnect, as RSSI values are measured at each access point usually. Just adding a few lines of code makes it unnecessary to upload sketches with the different SSIDs rewrite for each access point.</p>
<p><img src="../images/ChannelStatus.png" width="70%"/></p>
<p><img src="images/ChannelStatus.png" width="70%"/></p>
<h3 id="advance-procedures">Advance procedures<a class="headerlink" href="#advance-procedures" title="Permanent link">&para;</a></h3>
<ul>
<li>Arduino Client for MQTT - It's the <a href="https://github.com/knolleary/pubsubclient">PubSubClient</a>, install it to Arduino IDE. If you have the latest version already, this step does not need.</li>
@ -701,23 +988,23 @@
<p>Sign in ThingSpeak. Select <strong>Channels</strong> to show the <strong>My Channels</strong>, then click <strong>New Channel</strong>.</p>
<p>At the <strong>New Channel</strong> screen, enter each field as a below. And click <strong>Save Channel</strong> at the bottom of the screen to save.</p>
<ul>
<li>Name: <code class="codehilite">ESP8266 Signal Strength</code></li>
<li>Description: <code class="codehilite">ESP8266 RSSI publish</code></li>
<li>Field1: <code class="codehilite">RSSI</code></li>
<li>Name: <code>ESP8266 Signal Strength</code></li>
<li>Description: <code>ESP8266 RSSI publish</code></li>
<li>Field1: <code>RSSI</code></li>
</ul>
<p><img src="../images/CreateChannel.png" width="70%"/></p>
<p><img src="images/CreateChannel.png" width="70%"/></p>
<h4 id="get-channel-id-and-api-keys">Get Channel ID and API Keys<a class="headerlink" href="#get-channel-id-and-api-keys" title="Permanent link">&para;</a></h4>
<p>The channel successfully created, you can see the channel status screen as a below. <strong>Channel ID</strong> is displayed there.<sup id="fnref:2"><a class="footnote-ref" href="#fn:2" rel="footnote">2</a></sup></p>
<p><img src="../images/ChannelID.png" width="70%"/></p>
<p><img src="images/ChannelID.png" width="70%"/></p>
<p>Here, switch the channel status tab to <strong>API Keys</strong>. The API key required to publish the message is the <strong>Write API Key</strong>.</p>
<p><img src="../images/APIKeys.png" width="70%"/></p>
<p><img src="images/APIKeys.png" width="70%"/></p>
<p>The last key you need is the <strong>User API Key</strong> and can be confirmed it in the user profile. Pull down <strong>Account</strong> from the top menu, select <strong>My profile</strong>. Then you can see the ThingSpeak settings and the <strong>User API Key</strong> is displayed middle of this screen.</p>
<p><img src="../images/USERKey.png" width="70%"/></p>
<p><img src="images/USERKey.png" width="70%"/></p>
<h3 id="the-sketch-publishes-messages">The sketch, Publishes messages<a class="headerlink" href="#the-sketch-publishes-messages" title="Permanent link">&para;</a></h3>
<p>The complete code of the sketch is <a href="https://github.com/Hieromon/AutoConnect/blob/master/examples/mqttRSSI/mqttRSSI.ino">mqttRSSI.ino</a> in the <a href="https://github.com/Hieromon/AutoConnect">AutoConnect repository</a>. Replace the following #define in a sketch with <strong>User API Key</strong>, <strong>Write API Key</strong> and <strong>Channel ID</strong>. After Keys updated, compile the sketch and upload it.</p>
<div class="codehilite"><pre><span></span><span class="cp">#define MQTT_USER_KEY &quot;****************&quot; </span><span class="c1">// Replace to User API Key.</span>
<span class="cp">#define CHANNEL_ID &quot;******&quot; </span><span class="c1">// Replace to Channel ID.</span>
<span class="cp">#define CHANNEL_API_KEY_WR &quot;****************&quot; </span><span class="c1">// Replace to the write API Key.</span>
<div class="codehilite" style="background: #272822"><pre style="line-height: 125%"><span></span><span style="color: #75715e">#define MQTT_USER_KEY &quot;****************&quot; // Replace to User API Key.</span>
<span style="color: #75715e">#define CHANNEL_ID &quot;******&quot; // Replace to Channel ID.</span>
<span style="color: #75715e">#define CHANNEL_API_KEY_WR &quot;****************&quot; // Replace to the write API Key.</span>
</pre></div>
<h3 id="publish-messages">Publish messages<a class="headerlink" href="#publish-messages" title="Permanent link">&para;</a></h3>
@ -727,29 +1014,29 @@
<ol>
<li>
<p>#include directive<sup id="fnref:3"><a class="footnote-ref" href="#fn:3" rel="footnote">3</a></sup></p>
<p>Include <code class="codehilite">AutoConnect.h</code> header file behind the include of <code class="codehilite">ESP8266WiFi.h</code>.</p>
<p><img src="../images/include.png" width="55%"/></p>
<p>Include <code>AutoConnect.h</code> header file behind the include of <code>ESP8266WiFi.h</code>.</p>
<p><img src="images/include.png" width="55%"/></p>
</li>
<li>
<p>Declare AutoConnect</p>
<p>The declaration of the <a href="../api/index.html#autoconnect"><strong>AutoConnect variable</strong></a> is not accompanied by ESP8266WebServer.</p>
<p><img src="../images/declare.png" width="55%"/></p>
<p>The declaration of the <a href="api.html#autoconnect"><strong>AutoConnect variable</strong></a> is not accompanied by ESP8266WebServer.</p>
<p><img src="images/declare.png" width="55%"/></p>
</li>
<li>
<p>Invokes "begin()"</p>
<p>Call <a href="../api/index.html#begin"><strong>AutoConnect::begin</strong></a>. If you need to assign a static IP address, executes <a href="../api/index.html#autoconnectconfig-api"><strong>AutoConnectConfig</strong></a> before that. </p>
<p><img src="../images/begin.png" width="55%"/></p>
<p>Call <a href="api.html#begin"><strong>AutoConnect::begin</strong></a>. If you need to assign a static IP address, executes <a href="api.html#autoconnectconfig-api"><strong>AutoConnectConfig</strong></a> before that. </p>
<p><img src="images/begin.png" width="55%"/></p>
</li>
<li>
<p>Performs "handleClent()" in "loop()"</p>
<p>Invokes <a href="../api/index.html#handleclient"><strong>AutoConnect::handleClient()</strong></a> at inside <code class="codehilite">loop()</code> to enable the AutoConnect menu.</p>
<p><img src="../images/handleClient.png" width="55%"/></p>
<p>Invokes <a href="api.html#handleclient"><strong>AutoConnect::handleClient()</strong></a> at inside <code>loop()</code> to enable the AutoConnect menu.</p>
<p><img src="images/handleClient.png" width="55%"/></p>
</li>
</ol>
<script>
window.onload = function() {
Gifffer();
}
};
</script>
<div class="footnote">
@ -762,7 +1049,7 @@
<p>'454951' in the example above, but your channel ID should be different.&#160;<a class="footnote-backref" href="#fnref:2" rev="footnote" title="Jump back to footnote 2 in the text">&#8617;</a></p>
</li>
<li id="fn:3">
<p><code class="codehilite"><span class="cp">#include</span> <span class="cpf">&lt;ESP8266WebServer.h&gt;</span><span class="cp"></span></code> does not necessary for uses only client.&#160;<a class="footnote-backref" href="#fnref:3" rev="footnote" title="Jump back to footnote 3 in the text">&#8617;</a></p>
<p><code>#include &lt;ESP8266WebServer.h&gt;</code> does not necessary for uses only client.&#160;<a class="footnote-backref" href="#fnref:3" rev="footnote" title="Jump back to footnote 3 in the text">&#8617;</a></p>
</li>
</ol>
</div>
@ -772,6 +1059,8 @@
</article>
</div>
@ -784,7 +1073,7 @@
<div class="md-footer-nav">
<nav class="md-footer-nav__inner md-grid">
<a href="../api/index.html" title="Library APIs" class="md-flex md-footer-nav__link md-footer-nav__link--prev" rel="prev">
<a href="apiextra.html" title="Something extra" class="md-flex md-footer-nav__link md-footer-nav__link--prev" rel="prev">
<div class="md-flex__cell md-flex__cell--shrink">
<i class="md-icon md-icon--arrow-back md-footer-nav__button"></i>
</div>
@ -793,19 +1082,19 @@
<span class="md-footer-nav__direction">
Previous
</span>
Library APIs
Something extra
</span>
</div>
</a>
<a href="../faq/index.html" title="FAQ" class="md-flex md-footer-nav__link md-footer-nav__link--next" rel="next">
<a href="datatips.html" title="Tips for data conversion" class="md-flex md-footer-nav__link md-footer-nav__link--next" rel="next">
<div class="md-flex__cell md-flex__cell--stretch md-footer-nav__title">
<span class="md-flex__ellipsis">
<span class="md-footer-nav__direction">
Next
</span>
FAQ
Tips for data conversion
</span>
</div>
<div class="md-flex__cell md-flex__cell--shrink">
@ -821,20 +1110,18 @@
<div class="md-footer-copyright">
<div class="md-footer-copyright__highlight">
Copyright &copy; 2018 Hieromon Ikasamo
Copyright &copy; 2018-2019 Hieromon Ikasamo
</div>
powered by
<a href="http://www.mkdocs.org">MkDocs</a>
<a href="https://www.mkdocs.org">MkDocs</a>
and
<a href="https://squidfunk.github.io/mkdocs-material/">
Material for MkDocs</a>
</div>
<div class="md-footer-social">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<link rel="stylesheet" href="assets/fonts/font-awesome.css">
<a href="https://github.com/Hieromon" class="md-footer-social__link fa fa-github"></a>
@ -842,23 +1129,17 @@
</div>
</div>
</div>
</footer>
</div>
<script src="../assets/javascripts/application.8eb9be28.js"></script>
<script>app.initialize({version:"0.17.3",url:{base:".."}})</script>
<script src="assets/javascripts/application.b806dc00.js"></script>
<script src="../js/gifffer.min.js"></script>
<script>app.initialize({version:"1.0.4",url:{base:"."}})</script>
<script>!function(e,a,t,n,o,c,i){e.GoogleAnalyticsObject=o,e.ga=e.ga||function(){(e.ga.q=e.ga.q||[]).push(arguments)},e.ga.l=1*new Date,c=a.createElement(t),i=a.getElementsByTagName(t)[0],c.async=1,c.src="https://www.google-analytics.com/analytics.js",i.parentNode.insertBefore(c,i)}(window,document,"script",0,"ga"),ga("create","UA-116150854-1","auto"),ga("set","anonymizeIp",!0),ga("send","pageview");var links=document.getElementsByTagName("a");if(Array.prototype.map.call(links,function(e){e.host!=document.location.host&&e.addEventListener("click",function(){var a=e.getAttribute("data-md-action")||"follow";ga("send","event","outbound",a,e.href)})}),document.forms.search){var query=document.forms.search.query;query.addEventListener("blur",function(){if(this.value){var e=document.location.pathname;ga("send","pageview",e+"?q="+this.value)}})}</script>
<script src="js/gifffer.min.js"></script>
</body>

Binary file not shown.

After

Width:  |  Height:  |  Size: 218 KiB

@ -0,0 +1,233 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
width="162.49986mm"
height="50.781212mm"
viewBox="0 0 162.49986 50.781212"
version="1.1"
id="svg6816"
inkscape:version="0.92.1 r15371"
sodipodi:docname="ac_auxjoin_multi.svg">
<defs
id="defs6810" />
<sodipodi:namedview
id="base"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:pageopacity="0.0"
inkscape:pageshadow="2"
inkscape:zoom="1.4"
inkscape:cx="292.19207"
inkscape:cy="131.80979"
inkscape:document-units="mm"
inkscape:current-layer="layer5"
showgrid="false"
fit-margin-top="0"
fit-margin-left="0"
fit-margin-right="0"
fit-margin-bottom="0"
inkscape:window-width="1495"
inkscape:window-height="756"
inkscape:window-x="2593"
inkscape:window-y="280"
inkscape:window-maximized="0" />
<metadata
id="metadata6813">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
<dc:title></dc:title>
</cc:Work>
</rdf:RDF>
</metadata>
<g
inkscape:label="grid"
inkscape:groupmode="layer"
id="layer1"
transform="translate(-11.759858,-8.8834486)"
sodipodi:insensitive="true">
<path
d="M 11.75987,8.8834486 V 59.664658 M 14.405703,8.8834486 V 59.664658 M 17.051536,8.8834486 V 59.664658 M 19.697369,8.8834486 V 59.664658 M 22.343203,8.8834486 V 59.664658 M 24.989036,8.8834486 V 59.664658 M 27.634869,8.8834486 V 59.664658 M 30.280702,8.8834486 V 59.664658 M 32.926536,8.8834486 V 59.664658 M 35.572369,8.8834486 V 59.664658 M 38.218202,8.8834486 V 59.664658 M 40.864035,8.8834486 V 59.664658 M 43.509868,8.8834486 V 59.664658 M 46.155702,8.8834486 V 59.664658 M 48.801535,8.8834486 V 59.664658 M 51.447368,8.8834486 V 59.664658 M 54.093201,8.8834486 V 59.664658 M 56.739034,8.8834486 V 59.664658 M 59.384868,8.8834486 V 59.664658 M 62.030701,8.8834486 V 59.664658 M 64.676534,8.8834486 V 59.664658 M 67.322367,8.8834486 V 59.664658 M 69.9682,8.8834486 V 59.664658 M 72.614034,8.8834486 V 59.664658 M 75.259867,8.8834486 V 59.664658 M 77.9057,8.8834486 V 59.664658 M 80.551533,8.8834486 V 59.664658 M 83.197366,8.8834486 V 59.664658 M 85.8432,8.8834486 V 59.664658 M 88.489033,8.8834486 V 59.664658 M 91.134866,8.8834486 V 59.664658 M 93.780699,8.8834486 V 59.664658 M 96.426532,8.8834486 V 59.664658 M 99.072366,8.8834486 V 59.664658 M 101.7182,8.8834486 V 59.664658 M 104.36403,8.8834486 V 59.664658 M 107.00986,8.8834486 V 59.664658 M 109.6557,8.8834486 V 59.664658 M 112.30153,8.8834486 V 59.664658 M 114.94736,8.8834486 V 59.664658 M 117.5932,8.8834486 V 59.664658 M 120.23903,8.8834486 V 59.664658 M 122.88486,8.8834486 V 59.664658 M 125.5307,8.8834486 V 59.664658 M 128.17653,8.8834486 V 59.664658 M 130.82236,8.8834486 V 59.664658 M 133.4682,8.8834486 V 59.664658 M 136.11403,8.8834486 V 59.664658 M 138.75986,8.8834486 V 59.664658 M 141.4057,8.8834486 V 59.664658 M 144.05153,8.8834486 V 59.664658 M 146.69736,8.8834486 V 59.664658 M 149.3432,8.8834486 V 59.664658 M 151.98903,8.8834486 V 59.664658 M 154.63486,8.8834486 V 59.664658 M 157.2807,8.8834486 V 59.664658 M 159.92653,8.8834486 V 59.664658 M 162.57236,8.8834486 V 59.664658 M 165.2182,8.8834486 V 59.664658 M 167.86403,8.8834486 V 59.664658 M 170.50986,8.8834486 V 59.664658 M 173.1557,8.8834486 V 59.664658 M 11.75987,8.8834486 H 174.25972 M 11.75987,11.529282 H 174.25972 M 11.75987,14.175115 H 174.25972 M 11.75987,16.820948 H 174.25972 M 11.75987,19.466782 H 174.25972 M 11.75987,22.112615 H 174.25972 M 11.75987,24.758448 H 174.25972 M 11.75987,27.404281 H 174.25972 M 11.75987,30.050115 H 174.25972 M 11.75987,32.695948 H 174.25972 M 11.75987,35.341781 H 174.25972 M 11.75987,37.987614 H 174.25972 M 11.75987,40.633447 H 174.25972 M 11.75987,43.279281 H 174.25972 M 11.75987,45.925114 H 174.25972 M 11.75987,48.570947 H 174.25972 M 11.75987,51.21678 H 174.25972 M 11.75987,53.862613 H 174.25972 M 11.75987,56.508447 H 174.25972 M 11.75987,59.15428 h 162.49985"
style="fill:none;stroke:#000000;stroke-width:0.0264583px"
id="path7619"
inkscape:connector-curvature="0" />
</g>
<g
inkscape:groupmode="layer"
id="layer4"
inkscape:label="code"
transform="translate(-11.759858,-8.8834486)"
sodipodi:insensitive="true"
style="display:inline">
<text
xml:space="preserve"
style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:4.93888903px;line-height:1.25;font-family:Consolas;-inkscape-font-specification:'Consolas, Normal';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-feature-settings:normal;text-align:start;letter-spacing:0px;word-spacing:0px;writing-mode:lr-tb;text-anchor:start;display:inline;fill:#000000;fill-opacity:1;stroke:none;stroke-width:0.26458338"
x="16.588673"
y="17.167612"
id="text4512"><tspan
sodipodi:role="line"
id="tspan7470"
style="line-height:8.81856251px"
x="16.588673"
y="17.167612"><tspan
style="fill:#ff6600"
id="tspan7488">AutoConnect</tspan> portal;</tspan><tspan
sodipodi:role="line"
id="tspan7472"
style="line-height:8.81856251px"
x="16.588673"
y="25.986176"><tspan
style="fill:#ff6600"
id="tspan7490">AutoConnectAux</tspan> aux1<tspan
style="fill:#ff0000"
id="tspan7637">(</tspan><tspan
style="fill:#216778"
id="tspan7498">&quot;/mqtt_setting&quot;</tspan>, <tspan
style="fill:#216778"
id="tspan7500">&quot;MQTT Setting&quot;</tspan><tspan
style="fill:#ff0000"
id="tspan7643">)</tspan>;</tspan><tspan
sodipodi:role="line"
id="tspan7474"
style="line-height:8.81856251px"
x="16.588673"
y="34.804737"><tspan
style="fill:#ff6600"
id="tspan7492">AutoConnectAux</tspan> aux2<tspan
style="fill:#ff0000"
id="tspan7639">(</tspan><tspan
style="fill:#216778"
id="tspan7506">&quot;/mqtt_save&quot;, &quot;MQTT Setting&quot;</tspan>, <tspan
style="fill:#37abc8"
id="tspan7514">false</tspan><tspan
style="fill:#ff0000"
id="tspan7645">)</tspan>;</tspan><tspan
sodipodi:role="line"
id="tspan7476"
style="line-height:8.81856251px"
x="16.588673"
y="43.623299"><tspan
style="fill:#ff6600"
id="tspan7494">AutoConnectAux</tspan> aux3<tspan
style="fill:#ff0000"
id="tspan7647">(</tspan><tspan
style="fill:#216778"
id="tspan7512">&quot;/mqtt_start&quot;, &quot;MQTT Start&quot;</tspan><tspan
style="fill:#ff0000"
id="tspan7641">)</tspan>;</tspan><tspan
sodipodi:role="line"
id="tspan7478"
style="line-height:8.81856251px"
x="16.588673"
y="52.441864">portal.<tspan
style="fill:#ff6600"
id="tspan7496">join</tspan><tspan
style="fill:#ff0000"
id="tspan7625">(</tspan><tspan
id="tspan7633"
style="fill:#0000ff">{</tspan> aux1, aux2, aux3 <tspan
style="fill:#ff0000"
id="tspan7623"><tspan
style="fill:#0000ff"
id="tspan7635">}</tspan>)</tspan>;</tspan></text>
<flowRoot
xml:space="preserve"
id="flowRoot7480"
style="font-style:normal;font-weight:normal;font-size:40px;line-height:1.25;font-family:sans-serif;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none"
transform="scale(0.26458333)"><flowRegion
id="flowRegion7482"><rect
id="rect7484"
width="222.23357"
height="51.51778"
x="221.2234"
y="103.27576" /></flowRegion><flowPara
id="flowPara7486"></flowPara></flowRoot> </g>
<g
inkscape:groupmode="layer"
id="layer5"
inkscape:label="view"
transform="translate(-11.759858,-8.8834486)"
sodipodi:insensitive="true">
<rect
style="opacity:0.38699999;fill:#37abc8;fill-opacity:1;stroke:none;stroke-width:0.52916664;stroke-miterlimit:4;stroke-dasharray:0.52916666, 0.52916666;stroke-dashoffset:0;stroke-opacity:1"
id="rect7539"
width="16.395168"
height="8.6281242"
x="150.52138"
y="28.977301"
ry="2.1733632" />
<path
style="fill:none;stroke:#ff6600;stroke-width:0.5291667;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
d="M 35.246169,53.951772 H 46.738758"
id="path7543"
inkscape:connector-curvature="0" />
<rect
style="opacity:0.38699999;fill:#ff6600;fill-opacity:1;stroke:none;stroke-width:0.52916664;stroke-miterlimit:4;stroke-dasharray:0.52916667, 0.52916667;stroke-dashoffset:0;stroke-opacity:1"
id="rect7539-7"
width="14.410792"
height="7.2107134"
x="85.975174"
y="47.568375"
ry="1.8163275" />
<rect
style="opacity:0.38699999;fill:#ff6600;fill-opacity:1;stroke:none;stroke-width:0.52916664;stroke-miterlimit:4;stroke-dasharray:0.52916667, 0.52916667;stroke-dashoffset:0;stroke-opacity:1"
id="rect7539-7-6"
width="14.410792"
height="7.2107134"
x="69.485977"
y="47.332142"
ry="1.8163275" />
<rect
style="opacity:0.38699999;fill:#ff6600;fill-opacity:1;stroke:none;stroke-width:0.52916664;stroke-miterlimit:4;stroke-dasharray:0.52916667, 0.52916667;stroke-dashoffset:0;stroke-opacity:1"
id="rect7539-7-4"
width="14.410792"
height="7.2107134"
x="52.958519"
y="47.332138"
ry="1.8163275" />
<rect
style="opacity:0.38699999;fill:#ff6600;fill-opacity:1;stroke:none;stroke-width:0.52916664;stroke-miterlimit:4;stroke-dasharray:0.52916668, 0.52916668;stroke-dashoffset:0;stroke-opacity:1"
id="rect7539-7-4-4"
width="13.229617"
height="7.2107134"
x="55.538654"
y="21.157295"
ry="1.8163275" />
<rect
style="opacity:0.38699999;fill:#ff6600;fill-opacity:1;stroke:none;stroke-width:0.52916664;stroke-miterlimit:4;stroke-dasharray:0.52916667, 0.52916667;stroke-dashoffset:0;stroke-opacity:1"
id="rect7539-7-4-4-5"
width="13.324111"
height="7.2107134"
x="55.538654"
y="29.955509"
ry="1.8163275" />
<rect
style="opacity:0.38699999;fill:#ff6600;fill-opacity:1;stroke:none;stroke-width:0.52916664;stroke-miterlimit:4;stroke-dasharray:0.52916667, 0.52916667;stroke-dashoffset:0;stroke-opacity:1"
id="rect7539-7-4-4-9"
width="13.276864"
height="7.2107134"
x="55.538658"
y="38.753723"
ry="1.8163275" />
<rect
style="opacity:0.38699999;fill:none;fill-opacity:1;stroke:none;stroke-width:0.52916664;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"
id="rect7617"
width="162.49986"
height="50.781212"
x="11.759858"
y="8.8834486"
ry="0" />
</g>
</svg>

After

Width:  |  Height:  |  Size: 11 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 11 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 20 KiB

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 50 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 107 KiB

@ -0,0 +1,778 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
width="134.10013mm"
height="86.830833mm"
viewBox="0 0 134.10013 86.830834"
version="1.1"
id="svg8"
inkscape:version="0.92.2 (5c3e80d, 2017-08-06)"
sodipodi:docname="ac_load_save.svg">
<defs
id="defs2" />
<sodipodi:namedview
id="base"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:pageopacity="0.0"
inkscape:pageshadow="2"
inkscape:zoom="1.4142136"
inkscape:cx="216.27468"
inkscape:cy="174.19509"
inkscape:document-units="mm"
inkscape:current-layer="layer1"
showgrid="false"
inkscape:snap-global="false"
inkscape:window-width="1440"
inkscape:window-height="810"
inkscape:window-x="1362"
inkscape:window-y="70"
inkscape:window-maximized="0"
fit-margin-top="0"
fit-margin-left="0"
fit-margin-right="0"
fit-margin-bottom="0" />
<metadata
id="metadata5">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
<dc:title></dc:title>
</cc:Work>
</rdf:RDF>
</metadata>
<g
inkscape:label="レイヤー 1"
inkscape:groupmode="layer"
id="layer1"
transform="translate(-54.798811,-25.857826)">
<g
id="g888"
transform="matrix(0.05665416,0,0,0.05665416,112.41059,92.490795)"
style="stroke-width:4.67014837">
<g
id="g827"
style="stroke-width:4.67014837">
<g
id="g825"
style="stroke-width:4.67014837">
<g
id="g823"
style="stroke-width:4.67014837">
<path
id="path815"
d="M 236.936,0 H 91.465 C 87.459,0 83.693,1.56 80.86,4.392 80.859,4.393 80.859,4.393 80.859,4.393 L 33.647,51.604 c -2.833,2.833 -4.393,6.6 -4.393,10.606 v 203.98 c 0,8.271 6.728,15 15,15 7.091,0 185.609,0 192.682,0 8.271,0 15,-6.729 15,-15 V 15 c 0,-8.271 -6.729,-15 -15,-15 z m -25,271.19 H 69.254 v -82.595 c 0,-2.757 2.243,-5 5,-5 h 132.682 c 2.757,0 5,2.243 5,5 z m 25,0 h -15 v -82.595 c 0,-8.271 -6.729,-15 -15,-15 H 74.254 c -8.271,0 -15,6.729 -15,15 v 82.595 h -15 c -2.757,0 -5,-2.243 -5,-5 V 62.211 c 0,-1.335 0.52,-2.591 1.464,-3.536 l 47.21,-47.21 C 88.873,10.521 90.13,10 91.465,10 h 145.471 c 2.757,0 5,2.243 5,5 v 251.19 0 c 0,2.757 -2.243,5 -5,5 z"
inkscape:connector-curvature="0"
style="stroke-width:4.67014837" />
<path
id="path817"
d="m 129.96,29.929 h -25.524 c -2.762,0 -5,2.239 -5,5 v 49.333 c 0,2.761 2.238,5 5,5 h 25.524 c 2.762,0 5,-2.239 5,-5 V 34.929 c 0,-2.762 -2.238,-5 -5,-5 z m -5,49.333 H 109.436 V 39.929 h 15.524 z"
inkscape:connector-curvature="0"
style="stroke-width:4.67014837" />
<path
id="path819"
d="m 173.448,29.929 h -25.524 c -2.762,0 -5,2.239 -5,5 v 49.333 c 0,2.761 2.238,5 5,5 h 25.524 c 2.762,0 5,-2.239 5,-5 V 34.929 c 0,-2.762 -2.238,-5 -5,-5 z m -5,49.333 H 152.924 V 39.929 h 15.524 z"
inkscape:connector-curvature="0"
style="stroke-width:4.67014837" />
<path
id="path821"
d="m 216.936,29.929 h -25.525 c -2.762,0 -5,2.239 -5,5 v 49.333 c 0,2.761 2.238,5 5,5 h 25.525 c 2.762,0 5,-2.239 5,-5 V 34.929 c 0,-2.762 -2.238,-5 -5,-5 z m -5,49.333 H 196.411 V 39.929 h 15.525 z"
inkscape:connector-curvature="0"
style="stroke-width:4.67014837" />
</g>
</g>
</g>
<g
id="g829"
style="stroke-width:4.67014837" />
<g
id="g831"
style="stroke-width:4.67014837" />
<g
id="g833"
style="stroke-width:4.67014837" />
<g
id="g835"
style="stroke-width:4.67014837" />
<g
id="g837"
style="stroke-width:4.67014837" />
<g
id="g839"
style="stroke-width:4.67014837" />
<g
id="g841"
style="stroke-width:4.67014837" />
<g
id="g843"
style="stroke-width:4.67014837" />
<g
id="g845"
style="stroke-width:4.67014837" />
<g
id="g847"
style="stroke-width:4.67014837" />
<g
id="g849"
style="stroke-width:4.67014837" />
<g
id="g851"
style="stroke-width:4.67014837" />
<g
id="g853"
style="stroke-width:4.67014837" />
<g
id="g855"
style="stroke-width:4.67014837" />
<g
id="g857"
style="stroke-width:4.67014837" />
</g>
<g
id="g898"
transform="matrix(0.26458333,0,0,0.26458333,31.601706,133.56614)" />
<g
id="g900"
transform="matrix(0.26458333,0,0,0.26458333,31.601706,133.56614)" />
<g
id="g902"
transform="matrix(0.26458333,0,0,0.26458333,31.601706,133.56614)" />
<g
id="g904"
transform="matrix(0.26458333,0,0,0.26458333,31.601706,133.56614)" />
<g
id="g906"
transform="matrix(0.26458333,0,0,0.26458333,31.601706,133.56614)" />
<g
id="g908"
transform="matrix(0.26458333,0,0,0.26458333,31.601706,133.56614)" />
<g
id="g910"
transform="matrix(0.26458333,0,0,0.26458333,31.601706,133.56614)" />
<g
id="g912"
transform="matrix(0.26458333,0,0,0.26458333,31.601706,133.56614)" />
<g
id="g914"
transform="matrix(0.26458333,0,0,0.26458333,31.601706,133.56614)" />
<g
id="g916"
transform="matrix(0.26458333,0,0,0.26458333,31.601706,133.56614)" />
<g
id="g918"
transform="matrix(0.26458333,0,0,0.26458333,31.601706,133.56614)" />
<g
id="g920"
transform="matrix(0.26458333,0,0,0.26458333,31.601706,133.56614)" />
<g
id="g922"
transform="matrix(0.26458333,0,0,0.26458333,31.601706,133.56614)" />
<g
id="g924"
transform="matrix(0.26458333,0,0,0.26458333,31.601706,133.56614)" />
<g
id="g926"
transform="matrix(0.26458333,0,0,0.26458333,31.601706,133.56614)" />
<rect
style="opacity:1;vector-effect:none;fill:#ffffff;fill-opacity:1;stroke:#ffffff;stroke-width:1.32291663;stroke-linecap:butt;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke markers fill"
id="rect1093"
width="3.4230468"
height="5.3022432"
x="118.54869"
y="92.168793"
rx="0.10748195"
ry="1.069078" />
<g
id="g1508">
<rect
ry="1.069078"
rx="0.10748189"
y="85.896545"
x="120.13969"
height="10.434501"
width="0.57877195"
id="rect1046"
style="opacity:1;vector-effect:none;fill:#3366cc;fill-opacity:1;stroke:#3366cc;stroke-width:1.32291663;stroke-linecap:butt;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke markers fill" />
<rect
transform="rotate(-45)"
ry="1.069078"
rx="0.1074819"
y="145.92194"
x="24.34683"
height="4.5920415"
width="0.25470743"
id="rect1046-3"
style="opacity:1;vector-effect:none;fill:#3366cc;fill-opacity:1;stroke:#3366cc;stroke-width:1.32291663;stroke-linecap:butt;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke markers fill" />
<rect
transform="rotate(45)"
ry="1.069078"
rx="0.1074819"
y="-24.417189"
x="145.72107"
height="4.5920415"
width="0.25470743"
id="rect1046-3-6"
style="opacity:1;vector-effect:none;fill:#3366cc;fill-opacity:1;stroke:#3366cc;stroke-width:1.32291663;stroke-linecap:butt;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke markers fill" />
</g>
<g
id="g1153"
transform="matrix(0.06571814,0,0,0.052736,100.33233,54.752494)">
<g
id="g1097">
<path
id="path1095"
d="M 578.766,51.487 V 50.592 H 575.77 35.93 32.934 v 0.895 C 15.272,52.701 2.095,66.753 0,83.808 v 3.002 355.724 c 0,6.898 1.795,12.712 4.791,17.949 6.893,12.137 17.068,18.269 31.14,18.269 h 197.012 v 49.695 h -37.425 c -9.281,0 -16.467,7.218 -16.467,16.48 0,9.262 7.186,16.479 16.467,16.479 h 220.666 c 9.281,0 16.768,-7.218 16.768,-16.479 0,-9.263 -7.486,-16.48 -16.768,-16.48 H 378.759 V 478.752 H 575.77 c 14.078,0 24.343,-6.132 31.14,-18.269 3.085,-5.493 5.091,-11.37 5.091,-17.949 V 86.811 83.809 C 609.905,66.753 595.833,52.701 578.766,51.487 Z m 0,35.324 v 355.724 c 0,2.108 -0.895,3.002 -2.996,3.002 H 35.93 c -2.095,0 -2.996,-0.894 -2.996,-3.002 V 86.811 83.809 h 545.831 v 3.002 z"
inkscape:connector-curvature="0" />
</g>
<g
id="g1099" />
<g
id="g1101" />
<g
id="g1103" />
<g
id="g1105" />
<g
id="g1107" />
<g
id="g1109" />
<g
id="g1111" />
<g
id="g1113" />
<g
id="g1115" />
<g
id="g1117" />
<g
id="g1119" />
<g
id="g1121" />
<g
id="g1123" />
<g
id="g1125" />
<g
id="g1127" />
</g>
<text
xml:space="preserve"
style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:4.93888855px;line-height:1.25;font-family:sans-serif;-inkscape-font-specification:sans-serif;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;stroke-width:0.26458332"
x="111.507"
y="64.232811"
id="text949"><tspan
sodipodi:role="line"
id="tspan947"
x="111.507"
y="64.232811"
style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:3.17499995px;font-family:sans-serif;-inkscape-font-specification:'sans-serif, Normal';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-feature-settings:normal;text-align:start;writing-mode:lr-tb;text-anchor:start;stroke-width:0.26458332">Hello,world</tspan></text>
<g
id="g987"
transform="translate(-11.478634,-67.005729)">
<text
id="text949-6"
y="136.25891"
x="119.62345"
style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:4.93888855px;line-height:1.25;font-family:sans-serif;-inkscape-font-specification:sans-serif;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;stroke-width:0.26458332"
xml:space="preserve"><tspan
style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:3.17499995px;font-family:sans-serif;-inkscape-font-specification:'sans-serif, Normal';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-feature-settings:normal;text-align:start;writing-mode:lr-tb;text-anchor:start;stroke-width:0.26458332"
y="136.25891"
x="119.62345"
id="tspan947-1"
sodipodi:role="line">Input</tspan></text>
<rect
ry="0.67219442"
rx="0.75240988"
y="133.58672"
x="128.76941"
height="3.4395833"
width="15.478125"
id="rect971"
style="opacity:1;vector-effect:none;fill:none;fill-opacity:1;stroke:#000000;stroke-width:0.26458332;stroke-linecap:butt;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke markers fill" />
</g>
<g
id="g982"
transform="translate(-11.221166,-68.130209)">
<rect
ry="0.67219514"
rx="0.75240886"
y="140.03593"
x="128.28984"
height="4.2002602"
width="6.7468748"
id="rect977"
style="opacity:1;vector-effect:none;fill:#000000;fill-opacity:1;stroke:#000000;stroke-width:0;stroke-linecap:butt;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke markers fill" />
<text
id="text975"
y="143.27707"
x="129.01744"
style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:3.17499995px;line-height:1.25;font-family:sans-serif;-inkscape-font-specification:'sans-serif, Normal';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-feature-settings:normal;text-align:start;letter-spacing:0px;word-spacing:0px;writing-mode:lr-tb;text-anchor:start;fill:#000000;fill-opacity:1;stroke:none;stroke-width:0.26458332"
xml:space="preserve"><tspan
style="font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;font-size:3.17499995px;font-family:sans-serif;-inkscape-font-specification:'sans-serif, Bold';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-feature-settings:normal;text-align:start;writing-mode:lr-tb;text-anchor:start;fill:#f4f4f4;fill-opacity:1;stroke-width:0.26458332"
y="143.27707"
x="129.01744"
id="tspan973"
sodipodi:role="line">OK</tspan></text>
</g>
<g
id="g888-9"
transform="matrix(0.05665416,0,0,0.05665416,83.006567,60.646215)"
style="stroke-width:4.67014837">
<g
id="g827-6"
style="stroke-width:4.67014837">
<g
id="g825-6"
style="stroke-width:4.67014837">
<g
id="g823-0"
style="stroke-width:4.67014837">
<path
id="path815-0"
d="M 236.936,0 H 91.465 C 87.459,0 83.693,1.56 80.86,4.392 80.859,4.393 80.859,4.393 80.859,4.393 L 33.647,51.604 c -2.833,2.833 -4.393,6.6 -4.393,10.606 v 203.98 c 0,8.271 6.728,15 15,15 7.091,0 185.609,0 192.682,0 8.271,0 15,-6.729 15,-15 V 15 c 0,-8.271 -6.729,-15 -15,-15 z m -25,271.19 H 69.254 v -82.595 c 0,-2.757 2.243,-5 5,-5 h 132.682 c 2.757,0 5,2.243 5,5 z m 25,0 h -15 v -82.595 c 0,-8.271 -6.729,-15 -15,-15 H 74.254 c -8.271,0 -15,6.729 -15,15 v 82.595 h -15 c -2.757,0 -5,-2.243 -5,-5 V 62.211 c 0,-1.335 0.52,-2.591 1.464,-3.536 l 47.21,-47.21 C 88.873,10.521 90.13,10 91.465,10 h 145.471 c 2.757,0 5,2.243 5,5 v 251.19 0 c 0,2.757 -2.243,5 -5,5 z"
inkscape:connector-curvature="0"
style="stroke-width:4.67014837" />
<path
id="path817-0"
d="m 129.96,29.929 h -25.524 c -2.762,0 -5,2.239 -5,5 v 49.333 c 0,2.761 2.238,5 5,5 h 25.524 c 2.762,0 5,-2.239 5,-5 V 34.929 c 0,-2.762 -2.238,-5 -5,-5 z m -5,49.333 H 109.436 V 39.929 h 15.524 z"
inkscape:connector-curvature="0"
style="stroke-width:4.67014837" />
<path
id="path819-6"
d="m 173.448,29.929 h -25.524 c -2.762,0 -5,2.239 -5,5 v 49.333 c 0,2.761 2.238,5 5,5 h 25.524 c 2.762,0 5,-2.239 5,-5 V 34.929 c 0,-2.762 -2.238,-5 -5,-5 z m -5,49.333 H 152.924 V 39.929 h 15.524 z"
inkscape:connector-curvature="0"
style="stroke-width:4.67014837" />
<path
id="path821-1"
d="m 216.936,29.929 h -25.525 c -2.762,0 -5,2.239 -5,5 v 49.333 c 0,2.761 2.238,5 5,5 h 25.525 c 2.762,0 5,-2.239 5,-5 V 34.929 c 0,-2.762 -2.238,-5 -5,-5 z m -5,49.333 H 196.411 V 39.929 h 15.525 z"
inkscape:connector-curvature="0"
style="stroke-width:4.67014837" />
</g>
</g>
</g>
<g
id="g829-9"
style="stroke-width:4.67014837" />
<g
id="g831-2"
style="stroke-width:4.67014837" />
<g
id="g833-1"
style="stroke-width:4.67014837" />
<g
id="g835-2"
style="stroke-width:4.67014837" />
<g
id="g837-7"
style="stroke-width:4.67014837" />
<g
id="g839-9"
style="stroke-width:4.67014837" />
<g
id="g841-8"
style="stroke-width:4.67014837" />
<g
id="g843-1"
style="stroke-width:4.67014837" />
<g
id="g845-7"
style="stroke-width:4.67014837" />
<g
id="g847-3"
style="stroke-width:4.67014837" />
<g
id="g849-2"
style="stroke-width:4.67014837" />
<g
id="g851-3"
style="stroke-width:4.67014837" />
<g
id="g853-9"
style="stroke-width:4.67014837" />
<g
id="g855-8"
style="stroke-width:4.67014837" />
<g
id="g857-6"
style="stroke-width:4.67014837" />
</g>
<rect
style="opacity:1;vector-effect:none;fill:#ffffff;fill-opacity:1;stroke:#ffffff;stroke-width:1.15541553;stroke-linecap:butt;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke markers fill"
id="rect1093-2"
width="3.4251835"
height="2.7713468"
x="95.852501"
y="66.932808"
rx="0.11300837"
ry="0.7756142" />
<rect
style="opacity:1;vector-effect:none;fill:#ffffff;fill-opacity:1;stroke:#ffffff;stroke-width:1.73894894;stroke-linecap:butt;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke markers fill"
id="rect1093-2-3-3"
width="2.84165"
height="2.3576286"
x="138.0146"
y="67.113701"
rx="0.093755633"
ry="2.117661" />
<g
id="g888-9-4"
transform="matrix(0.05665416,0,0,0.05665416,143.36529,60.633145)"
style="stroke-width:4.67014837">
<g
id="g827-6-4"
style="stroke-width:4.67014837">
<g
id="g825-6-4"
style="stroke-width:4.67014837">
<g
id="g823-0-2"
style="stroke-width:4.67014837">
<path
id="path815-0-2"
d="M 236.936,0 H 91.465 C 87.459,0 83.693,1.56 80.86,4.392 80.859,4.393 80.859,4.393 80.859,4.393 L 33.647,51.604 c -2.833,2.833 -4.393,6.6 -4.393,10.606 v 203.98 c 0,8.271 6.728,15 15,15 7.091,0 185.609,0 192.682,0 8.271,0 15,-6.729 15,-15 V 15 c 0,-8.271 -6.729,-15 -15,-15 z m -25,271.19 H 69.254 v -82.595 c 0,-2.757 2.243,-5 5,-5 h 132.682 c 2.757,0 5,2.243 5,5 z m 25,0 h -15 v -82.595 c 0,-8.271 -6.729,-15 -15,-15 H 74.254 c -8.271,0 -15,6.729 -15,15 v 82.595 h -15 c -2.757,0 -5,-2.243 -5,-5 V 62.211 c 0,-1.335 0.52,-2.591 1.464,-3.536 l 47.21,-47.21 C 88.873,10.521 90.13,10 91.465,10 h 145.471 c 2.757,0 5,2.243 5,5 v 251.19 0 c 0,2.757 -2.243,5 -5,5 z"
inkscape:connector-curvature="0"
style="stroke-width:4.67014837" />
<path
id="path817-0-7"
d="m 129.96,29.929 h -25.524 c -2.762,0 -5,2.239 -5,5 v 49.333 c 0,2.761 2.238,5 5,5 h 25.524 c 2.762,0 5,-2.239 5,-5 V 34.929 c 0,-2.762 -2.238,-5 -5,-5 z m -5,49.333 H 109.436 V 39.929 h 15.524 z"
inkscape:connector-curvature="0"
style="stroke-width:4.67014837" />
<path
id="path819-6-3"
d="m 173.448,29.929 h -25.524 c -2.762,0 -5,2.239 -5,5 v 49.333 c 0,2.761 2.238,5 5,5 h 25.524 c 2.762,0 5,-2.239 5,-5 V 34.929 c 0,-2.762 -2.238,-5 -5,-5 z m -5,49.333 H 152.924 V 39.929 h 15.524 z"
inkscape:connector-curvature="0"
style="stroke-width:4.67014837" />
<path
id="path821-1-2"
d="m 216.936,29.929 h -25.525 c -2.762,0 -5,2.239 -5,5 v 49.333 c 0,2.761 2.238,5 5,5 h 25.525 c 2.762,0 5,-2.239 5,-5 V 34.929 c 0,-2.762 -2.238,-5 -5,-5 z m -5,49.333 H 196.411 V 39.929 h 15.525 z"
inkscape:connector-curvature="0"
style="stroke-width:4.67014837" />
</g>
</g>
</g>
<g
id="g829-9-8"
style="stroke-width:4.67014837" />
<g
id="g831-2-8"
style="stroke-width:4.67014837" />
<g
id="g833-1-1"
style="stroke-width:4.67014837" />
<g
id="g835-2-5"
style="stroke-width:4.67014837" />
<g
id="g837-7-1"
style="stroke-width:4.67014837" />
<g
id="g839-9-3"
style="stroke-width:4.67014837" />
<g
id="g841-8-0"
style="stroke-width:4.67014837" />
<g
id="g843-1-9"
style="stroke-width:4.67014837" />
<g
id="g845-7-8"
style="stroke-width:4.67014837" />
<g
id="g847-3-2"
style="stroke-width:4.67014837" />
<g
id="g849-2-0"
style="stroke-width:4.67014837" />
<g
id="g851-3-8"
style="stroke-width:4.67014837" />
<g
id="g853-9-3"
style="stroke-width:4.67014837" />
<g
id="g855-8-1"
style="stroke-width:4.67014837" />
<g
id="g857-6-4"
style="stroke-width:4.67014837" />
</g>
<rect
style="opacity:1;vector-effect:none;fill:#ffffff;fill-opacity:1;stroke:#ffffff;stroke-width:1.15541553;stroke-linecap:butt;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke markers fill"
id="rect1093-2-1"
width="0.94471467"
height="4.4746022"
x="144.63507"
y="66.088287"
rx="0.11300837"
ry="0.77561432" />
<g
id="g1484">
<rect
transform="rotate(90)"
ry="1.069078"
rx="0.10748189"
y="-144.40062"
x="68.031433"
height="9.8992567"
width="0.57877195"
id="rect1046-9-1"
style="opacity:1;vector-effect:none;fill:#3366cc;fill-opacity:1;stroke:#3366cc;stroke-width:1.32291663;stroke-linecap:butt;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke markers fill" />
<rect
transform="rotate(45)"
ry="1.069078"
rx="0.1074819"
y="-54.572708"
x="151.14955"
height="4.5920415"
width="0.25470743"
id="rect1046-3-5-6"
style="opacity:1;vector-effect:none;fill:#3366cc;fill-opacity:1;stroke:#3366cc;stroke-width:1.32291663;stroke-linecap:butt;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke markers fill" />
<rect
transform="rotate(135)"
ry="1.069078"
rx="0.1074819"
y="-151.21991"
x="-54.773582"
height="4.5920415"
width="0.25470743"
id="rect1046-3-6-2-1"
style="opacity:1;vector-effect:none;fill:#3366cc;fill-opacity:1;stroke:#3366cc;stroke-width:1.32291663;stroke-linecap:butt;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke markers fill" />
</g>
<rect
style="opacity:1;vector-effect:none;fill:#ffffff;fill-opacity:1;stroke:#ffffff;stroke-width:1.73894894;stroke-linecap:butt;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke markers fill"
id="rect1093-2-3-3-2"
width="2.84165"
height="2.3576288"
x="99.981239"
y="67.054848"
rx="0.093755633"
ry="2.117661" />
<g
id="g1503"
transform="translate(0.52916667)">
<rect
transform="rotate(90)"
ry="1.069078"
rx="0.10748189"
y="-106.65598"
x="67.981628"
height="10.434501"
width="0.57877195"
id="rect1046-9"
style="opacity:1;vector-effect:none;fill:#3366cc;fill-opacity:1;stroke:#3366cc;stroke-width:1.32291663;stroke-linecap:butt;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke markers fill" />
<rect
transform="rotate(45)"
ry="1.069078"
rx="0.1074819"
y="-27.114578"
x="123.6207"
height="4.5920415"
width="0.25470743"
id="rect1046-3-5"
style="opacity:1;vector-effect:none;fill:#3366cc;fill-opacity:1;stroke:#3366cc;stroke-width:1.32291663;stroke-linecap:butt;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke markers fill" />
<rect
transform="rotate(135)"
ry="1.069078"
rx="0.1074819"
y="-123.69107"
x="-27.315453"
height="4.5920415"
width="0.25470743"
id="rect1046-3-6-2"
style="opacity:1;vector-effect:none;fill:#3366cc;fill-opacity:1;stroke:#3366cc;stroke-width:1.32291663;stroke-linecap:butt;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke markers fill" />
</g>
<g
id="g888-3"
transform="matrix(0.05665416,0,0,0.05665416,112.41059,25.857826)"
style="stroke-width:4.67014837">
<g
id="g827-2"
style="stroke-width:4.67014837">
<g
id="g825-7"
style="stroke-width:4.67014837">
<g
id="g823-6"
style="stroke-width:4.67014837">
<path
id="path815-3"
d="M 236.936,0 H 91.465 C 87.459,0 83.693,1.56 80.86,4.392 80.859,4.393 80.859,4.393 80.859,4.393 L 33.647,51.604 c -2.833,2.833 -4.393,6.6 -4.393,10.606 v 203.98 c 0,8.271 6.728,15 15,15 7.091,0 185.609,0 192.682,0 8.271,0 15,-6.729 15,-15 V 15 c 0,-8.271 -6.729,-15 -15,-15 z m -25,271.19 H 69.254 v -82.595 c 0,-2.757 2.243,-5 5,-5 h 132.682 c 2.757,0 5,2.243 5,5 z m 25,0 h -15 v -82.595 c 0,-8.271 -6.729,-15 -15,-15 H 74.254 c -8.271,0 -15,6.729 -15,15 v 82.595 h -15 c -2.757,0 -5,-2.243 -5,-5 V 62.211 c 0,-1.335 0.52,-2.591 1.464,-3.536 l 47.21,-47.21 C 88.873,10.521 90.13,10 91.465,10 h 145.471 c 2.757,0 5,2.243 5,5 v 251.19 0 c 0,2.757 -2.243,5 -5,5 z"
inkscape:connector-curvature="0"
style="stroke-width:4.67014837" />
<path
id="path817-6"
d="m 129.96,29.929 h -25.524 c -2.762,0 -5,2.239 -5,5 v 49.333 c 0,2.761 2.238,5 5,5 h 25.524 c 2.762,0 5,-2.239 5,-5 V 34.929 c 0,-2.762 -2.238,-5 -5,-5 z m -5,49.333 H 109.436 V 39.929 h 15.524 z"
inkscape:connector-curvature="0"
style="stroke-width:4.67014837" />
<path
id="path819-1"
d="m 173.448,29.929 h -25.524 c -2.762,0 -5,2.239 -5,5 v 49.333 c 0,2.761 2.238,5 5,5 h 25.524 c 2.762,0 5,-2.239 5,-5 V 34.929 c 0,-2.762 -2.238,-5 -5,-5 z m -5,49.333 H 152.924 V 39.929 h 15.524 z"
inkscape:connector-curvature="0"
style="stroke-width:4.67014837" />
<path
id="path821-5"
d="m 216.936,29.929 h -25.525 c -2.762,0 -5,2.239 -5,5 v 49.333 c 0,2.761 2.238,5 5,5 h 25.525 c 2.762,0 5,-2.239 5,-5 V 34.929 c 0,-2.762 -2.238,-5 -5,-5 z m -5,49.333 H 196.411 V 39.929 h 15.525 z"
inkscape:connector-curvature="0"
style="stroke-width:4.67014837" />
</g>
</g>
</g>
<g
id="g829-2"
style="stroke-width:4.67014837" />
<g
id="g831-4"
style="stroke-width:4.67014837" />
<g
id="g833-3"
style="stroke-width:4.67014837" />
<g
id="g835-7"
style="stroke-width:4.67014837" />
<g
id="g837-9"
style="stroke-width:4.67014837" />
<g
id="g839-4"
style="stroke-width:4.67014837" />
<g
id="g841-7"
style="stroke-width:4.67014837" />
<g
id="g843-7"
style="stroke-width:4.67014837" />
<g
id="g845-2"
style="stroke-width:4.67014837" />
<g
id="g847-7"
style="stroke-width:4.67014837" />
<g
id="g849-0"
style="stroke-width:4.67014837" />
<g
id="g851-6"
style="stroke-width:4.67014837" />
<g
id="g853-3"
style="stroke-width:4.67014837" />
<g
id="g855-6"
style="stroke-width:4.67014837" />
<g
id="g857-1"
style="stroke-width:4.67014837" />
</g>
<g
id="g1498">
<rect
ry="1.069078"
rx="0.10748189"
y="50.580574"
x="120.13969"
height="5.1024733"
width="0.57877195"
id="rect1046-38"
style="opacity:1;vector-effect:none;fill:#3366cc;fill-opacity:1;stroke:#3366cc;stroke-width:1.32291663;stroke-linecap:butt;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke markers fill" />
<rect
transform="rotate(-45)"
ry="1.069078"
rx="0.1074819"
y="119.95757"
x="50.31118"
height="4.5920415"
width="0.25470743"
id="rect1046-3-2"
style="opacity:1;vector-effect:none;fill:#3366cc;fill-opacity:1;stroke:#3366cc;stroke-width:1.32291663;stroke-linecap:butt;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke markers fill" />
<rect
transform="rotate(45)"
ry="1.069078"
rx="0.1074819"
y="-50.381538"
x="119.75671"
height="4.5920415"
width="0.25470743"
id="rect1046-3-6-21"
style="opacity:1;vector-effect:none;fill:#3366cc;fill-opacity:1;stroke:#3366cc;stroke-width:1.32291663;stroke-linecap:butt;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke markers fill" />
</g>
<g
id="g1512"
transform="translate(-17.118613,-2.6192414)">
<rect
transform="rotate(-45)"
ry="1.069078"
rx="0.1074819"
y="128.85464"
x="63.34301"
height="4.5920415"
width="0.25470743"
id="rect1046-3-2-9"
style="opacity:1;vector-effect:none;fill:#800000;fill-opacity:1;stroke:#800000;stroke-width:1.32291663;stroke-linecap:butt;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke markers fill" />
<rect
transform="rotate(45)"
ry="1.069078"
rx="0.1074819"
y="-65.774635"
x="131.01506"
height="4.5920415"
width="0.25470743"
id="rect1046-3-6-21-4"
style="opacity:1;vector-effect:none;fill:#800000;fill-opacity:1;stroke:#800000;stroke-width:1.32291663;stroke-linecap:butt;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke markers fill" />
</g>
<text
xml:space="preserve"
style="font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;font-size:3.17499995px;line-height:1.25;font-family:sans-serif;-inkscape-font-specification:'sans-serif, Bold';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-feature-settings:normal;text-align:start;letter-spacing:0px;word-spacing:0px;writing-mode:lr-tb;text-anchor:start;fill:#002700;fill-opacity:1;stroke:#ffffff;stroke-width:0;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
x="104.19426"
y="112.6344"
id="text1516"><tspan
sodipodi:role="line"
id="tspan1514"
x="104.19426"
y="112.6344"
style="font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;font-size:3.17499995px;font-family:sans-serif;-inkscape-font-specification:'sans-serif, Bold';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-feature-settings:normal;text-align:start;writing-mode:lr-tb;text-anchor:start;fill:#002700;fill-opacity:1;stroke:#ffffff;stroke-width:0;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1">AutoConnect::load</tspan></text>
<text
xml:space="preserve"
style="font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;font-size:3.17499995px;line-height:1.25;font-family:sans-serif;-inkscape-font-specification:'sans-serif, Bold';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-feature-settings:normal;text-align:start;letter-spacing:0px;word-spacing:0px;writing-mode:lr-tb;text-anchor:start;fill:#002700;fill-opacity:1;stroke:#ffffff;stroke-width:0;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
x="54.761604"
y="67.993149"
id="text1516-4"><tspan
sodipodi:role="line"
id="tspan1514-3"
x="54.761604"
y="67.993149"
style="font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;font-size:3.17499995px;font-family:sans-serif;-inkscape-font-specification:'sans-serif, Bold';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-feature-settings:normal;text-align:start;writing-mode:lr-tb;text-anchor:start;fill:#002700;fill-opacity:1;stroke:#ffffff;stroke-width:0;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1">AutoConnectAux</tspan><tspan
sodipodi:role="line"
x="54.761604"
y="71.961899"
style="font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;font-size:3.17499995px;font-family:sans-serif;-inkscape-font-specification:'sans-serif, Bold';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-feature-settings:normal;text-align:start;writing-mode:lr-tb;text-anchor:start;fill:#002700;fill-opacity:1;stroke:#ffffff;stroke-width:0;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
id="tspan1536">::loadElement</tspan></text>
<text
xml:space="preserve"
style="font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;font-size:3.17499995px;line-height:1.25;font-family:sans-serif;-inkscape-font-specification:'sans-serif, Bold';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-feature-settings:normal;text-align:start;letter-spacing:0px;word-spacing:0px;writing-mode:lr-tb;text-anchor:start;fill:#002700;fill-opacity:1;stroke:#ffffff;stroke-width:0;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
x="159.29454"
y="67.999352"
id="text1516-4-4"><tspan
sodipodi:role="line"
id="tspan1514-3-5"
x="159.29454"
y="67.999352"
style="font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;font-size:3.17499995px;font-family:sans-serif;-inkscape-font-specification:'sans-serif, Bold';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-feature-settings:normal;text-align:start;writing-mode:lr-tb;text-anchor:start;fill:#002700;fill-opacity:1;stroke:#ffffff;stroke-width:0;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1">AutoConnectAux</tspan><tspan
sodipodi:role="line"
x="159.29454"
y="71.968102"
style="font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;font-size:3.17499995px;font-family:sans-serif;-inkscape-font-specification:'sans-serif, Bold';font-variant-ligatures:normal;font-variant-caps:normal;font-variant-numeric:normal;font-feature-settings:normal;text-align:start;writing-mode:lr-tb;text-anchor:start;fill:#002700;fill-opacity:1;stroke:#ffffff;stroke-width:0;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
id="tspan1536-1">::saveElement</tspan></text>
</g>
</svg>

After

Width:  |  Height:  |  Size: 36 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 48 KiB

File diff suppressed because it is too large Load Diff

After

Width:  |  Height:  |  Size: 93 KiB

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 122 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 779 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 238 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.0 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.9 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.0 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 941 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 243 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 39 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 80 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 124 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 40 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 25 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 11 KiB

File diff suppressed because it is too large Load Diff

After

Width:  |  Height:  |  Size: 102 KiB

@ -106,7 +106,7 @@
id="tspan4526"
style="font-size:3.17499995px;fill:#003399;stroke-width:0.26458332"
y="-7.9007959"
x="-41.95536">&quot;&lt;/head&gt;&quot;</tspan><tspan
x="-41.95536">&quot;&lt;head&gt;&quot;</tspan><tspan
id="tspan4528"
style="font-size:3.17499995px;fill:#003399;stroke-width:0.26458332"
y="-3.0501018"

Before

Width:  |  Height:  |  Size: 34 KiB

After

Width:  |  Height:  |  Size: 34 KiB

@ -106,7 +106,7 @@
x="-41.95536"
y="-12.751491"
style="font-size:3.17499995px;fill:#003399;stroke-width:0.26458332"
id="tspan4526">&quot;&lt;/head&gt;&quot;</tspan><tspan
id="tspan4526">&quot;&lt;head&gt;&quot;</tspan><tspan
x="-41.95536"
y="-7.9007959"
style="font-size:3.17499995px;fill:#003399;stroke-width:0.26458332"

Before

Width:  |  Height:  |  Size: 36 KiB

After

Width:  |  Height:  |  Size: 36 KiB

File diff suppressed because it is too large Load Diff

After

Width:  |  Height:  |  Size: 56 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 479 B

@ -2,7 +2,7 @@
<!DOCTYPE html>
<!doctype html>
<html lang="en" class="no-js">
<head>
@ -37,8 +37,8 @@
<meta name="lang:search.tokenizer" content="[\s\-]+">
<link rel="shortcut icon" href="./assets/images/favicon.png">
<meta name="generator" content="mkdocs-0.17.3, mkdocs-material-2.7.0">
<link rel="shortcut icon" href="assets/images/favicon.png">
<meta name="generator" content="mkdocs-1.0.4, mkdocs-material-4.0.1">
@ -46,24 +46,62 @@
<link rel="stylesheet" href="./assets/stylesheets/application.78aab2dc.css">
<link rel="stylesheet" href="assets/stylesheets/application.982221ab.css">
<link rel="stylesheet" href="./assets/stylesheets/application-palette.6079476c.css">
<link rel="stylesheet" href="assets/stylesheets/application-palette.224b79ff.css">
<meta name="theme-color" content="#3f51b5">
<script src="./assets/javascripts/modernizr.1aa3b519.js"></script>
<script src="assets/javascripts/modernizr.1f0bcf2b.js"></script>
<link href="https://fonts.gstatic.com" rel="preconnect" crossorigin>
<link href="https://fonts.gstatic.com" rel="preconnect" crossorigin>
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,400,400i,700|Roboto+Mono">
<style>body,input{font-family:"Roboto","Helvetica Neue",Helvetica,Arial,sans-serif}code,kbd,pre{font-family:"Roboto Mono","Courier New",Courier,monospace}</style>
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
<link rel="stylesheet" href="assets/fonts/material-icons.css">
<link rel="stylesheet" href="./css/paragraph.css">
<link rel="stylesheet" href="css/paragraph.css">
<link rel="stylesheet" href="css/extra.css">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.6.1/css/all.css">
<script>
window.ga = window.ga || function() {
(ga.q = ga.q || []).push(arguments)
}
ga.l = +new Date
/* Setup integration and send page view */
ga("create", "UA-116150854-1", "auto")
ga("set", "anonymizeIp", true)
ga("send", "pageview")
/* Register handler to log search on blur */
document.addEventListener("DOMContentLoaded", () => {
if (document.forms.search) {
var query = document.forms.search.query
query.addEventListener("blur", function() {
if (this.value) {
var path = document.location.pathname;
ga("send", "pageview", path + "?q=" + this.value)
}
})
}
})
</script>
<script async src="https://www.google-analytics.com/analytics.js"></script>
</head>
@ -77,7 +115,7 @@
<svg xmlns="http://www.w3.org/2000/svg" width="416" height="448"
viewBox="0 0 416 448" id="github">
viewBox="0 0 416 448" id="__github">
<path fill="currentColor" d="M160 304q0 10-3.125 20.5t-10.75 19-18.125
8.5-18.125-8.5-10.75-19-3.125-20.5 3.125-20.5 10.75-19 18.125-8.5
18.125 8.5 10.75 19 3.125 20.5zM320 304q0 10-3.125 20.5t-10.75
@ -97,9 +135,9 @@
</defs>
</svg>
<input class="md-toggle" data-md-toggle="drawer" type="checkbox" id="drawer">
<input class="md-toggle" data-md-toggle="search" type="checkbox" id="search">
<label class="md-overlay" data-md-component="overlay" for="drawer"></label>
<input class="md-toggle" data-md-toggle="drawer" type="checkbox" id="__drawer" autocomplete="off">
<input class="md-toggle" data-md-toggle="search" type="checkbox" id="__search" autocomplete="off">
<label class="md-overlay" data-md-component="overlay" for="__drawer"></label>
<a href="#autoconnect-for-esp8266esp32" tabindex="1" class="md-skip">
Skip to content
@ -112,38 +150,35 @@
<div class="md-flex__cell md-flex__cell--shrink">
<a href="https://Hieromon.github.io/AutoConnect/" title="AutoConnect for ESP8266/ESP32" class="md-header-nav__button md-logo">
<img src="./images/arduino-logo.svg" width="24" height="24">
<img src="images/arduino-logo.svg" width="24" height="24">
</a>
</div>
<div class="md-flex__cell md-flex__cell--shrink">
<label class="md-icon md-icon--menu md-header-nav__button" for="drawer"></label>
<label class="md-icon md-icon--menu md-header-nav__button" for="__drawer"></label>
</div>
<div class="md-flex__cell md-flex__cell--stretch">
<div class="md-flex__ellipsis md-header-nav__title" data-md-component="title">
<span class="md-header-nav__topic">
AutoConnect for ESP8266/ESP32
</span>
<span class="md-header-nav__topic">
Overview
</span>
<span class="md-header-nav__topic">
AutoConnect for ESP8266/ESP32
</span>
<span class="md-header-nav__topic">
Overview
</span>
</div>
</div>
<div class="md-flex__cell md-flex__cell--shrink">
<label class="md-icon md-icon--search md-header-nav__button" for="__search"></label>
<label class="md-icon md-icon--search md-header-nav__button" for="search"></label>
<div class="md-search" data-md-component="search" role="dialog">
<label class="md-search__overlay" for="search"></label>
<label class="md-search__overlay" for="__search"></label>
<div class="md-search__inner" role="search">
<form class="md-search__form" name="search">
<input type="text" class="md-search__input" name="query" placeholder="Search" autocapitalize="off" autocorrect="off" autocomplete="off" spellcheck="false" data-md-component="query" data-md-state="active">
<label class="md-icon md-search__icon" for="search"></label>
<label class="md-icon md-search__icon" for="__search"></label>
<button type="reset" class="md-icon md-search__icon" data-md-component="reset" tabindex="-1">
&#xE5CD;
</button>
@ -160,7 +195,6 @@
</div>
</div>
</div>
</div>
@ -171,20 +205,18 @@
<a href="https://github.com/Hieromon/AutoConnect" title="Go to repository" class="md-source" data-md-source="github">
<div class="md-source__icon">
<svg viewBox="0 0 24 24" width="24" height="24">
<use xlink:href="#github" width="24" height="24"></use>
</svg>
</div>
<div class="md-source__repository">
Hieromon/AutoConnect
<a href="https://github.com/Hieromon/AutoConnect" title="Go to repository" class="md-source" data-md-source="github">
<div class="md-source__icon">
<svg viewBox="0 0 24 24" width="24" height="24">
<use xlink:href="#__github" width="24" height="24"></use>
</svg>
</div>
</a>
<div class="md-source__repository">
Hieromon/AutoConnect
</div>
</a>
</div>
</div>
@ -222,6 +254,43 @@
<li class="md-tabs__item">
<a href="acintro.html" title="Custom Web pages" class="md-tabs__link">
Custom Web pages
</a>
</li>
<li class="md-tabs__item">
<a href="api.html" title="Library APIs" class="md-tabs__link">
Library APIs
</a>
</li>
<li class="md-tabs__item">
<a href="howtoembed.html" title="Examples" class="md-tabs__link">
Examples
</a>
</li>
@ -243,12 +312,12 @@
<div class="md-sidebar__scrollwrap">
<div class="md-sidebar__inner">
<nav class="md-nav md-nav--primary" data-md-level="0">
<label class="md-nav__title md-nav__title--site" for="drawer">
<span class="md-nav__button md-logo">
<label class="md-nav__title md-nav__title--site" for="__drawer">
<a href="https://Hieromon.github.io/AutoConnect/" title="AutoConnect for ESP8266/ESP32" class="md-nav__button md-logo">
<img src="./images/arduino-logo.svg" width="48" height="48">
<img src="images/arduino-logo.svg" width="48" height="48">
</span>
</a>
AutoConnect for ESP8266/ESP32
</label>
@ -258,20 +327,18 @@
<a href="https://github.com/Hieromon/AutoConnect" title="Go to repository" class="md-source" data-md-source="github">
<div class="md-source__icon">
<svg viewBox="0 0 24 24" width="24" height="24">
<use xlink:href="#github" width="24" height="24"></use>
</svg>
</div>
<div class="md-source__repository">
Hieromon/AutoConnect
<a href="https://github.com/Hieromon/AutoConnect" title="Go to repository" class="md-source" data-md-source="github">
<div class="md-source__icon">
<svg viewBox="0 0 24 24" width="24" height="24">
<use xlink:href="#__github" width="24" height="24"></use>
</svg>
</div>
</a>
<div class="md-source__repository">
Hieromon/AutoConnect
</div>
</a>
</div>
<ul class="md-nav__list" data-md-scrollfix>
@ -285,12 +352,12 @@
<li class="md-nav__item md-nav__item--active">
<input class="md-toggle md-nav__toggle" data-md-toggle="toc" type="checkbox" id="toc">
<input class="md-toggle md-nav__toggle" data-md-toggle="toc" type="checkbox" id="__toc">
<label class="md-nav__link md-nav__link--active" for="toc">
<label class="md-nav__link md-nav__link--active" for="__toc">
Overview
</label>
@ -305,7 +372,7 @@
<label class="md-nav__title" for="toc">Table of contents</label>
<label class="md-nav__title" for="__toc">Table of contents</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
@ -345,8 +412,15 @@
</li>
<li class="md-nav__item">
<a href="#lives-with-the-your-sketches" title=" Lives with the your sketches" class="md-nav__link">
Lives with the your sketches
<a href="#lives-with-your-sketches" title=" Lives with your sketches" class="md-nav__link">
Lives with your sketches
</a>
</li>
<li class="md-nav__item">
<a href="#easy-to-add-the-custom-web-pages-enhanced-wv097" title=" Easy to add the custom Web pages ENHANCED w/v0.9.7" class="md-nav__link">
Easy to add the custom Web pages ENHANCED w/v0.9.7
</a>
</li>
@ -420,7 +494,7 @@
<li class="md-nav__item">
<a href="gettingstarted/index.html" title="Getting started" class="md-nav__link">
<a href="gettingstarted.html" title="Getting started" class="md-nav__link">
Getting started
</a>
</li>
@ -432,7 +506,7 @@
<li class="md-nav__item">
<a href="menu/index.html" title="AutoConnect menu" class="md-nav__link">
<a href="menu.html" title="AutoConnect menu" class="md-nav__link">
AutoConnect menu
</a>
</li>
@ -444,7 +518,7 @@
<li class="md-nav__item">
<a href="basicusage/index.html" title="Basic usage" class="md-nav__link">
<a href="basicusage.html" title="Basic usage" class="md-nav__link">
Basic usage
</a>
</li>
@ -456,7 +530,7 @@
<li class="md-nav__item">
<a href="advancedusage/index.html" title="Advanced usage" class="md-nav__link">
<a href="advancedusage.html" title="Advanced usage" class="md-nav__link">
Advanced usage
</a>
</li>
@ -467,24 +541,228 @@
<li class="md-nav__item md-nav__item--nested">
<input class="md-toggle md-nav__toggle" data-md-toggle="nav-6" type="checkbox" id="nav-6">
<label class="md-nav__link" for="nav-6">
Custom Web pages
</label>
<nav class="md-nav" data-md-component="collapsible" data-md-level="1">
<label class="md-nav__title" for="nav-6">
Custom Web pages
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="api/index.html" title="Library APIs" class="md-nav__link">
Library APIs
<a href="acintro.html" title="Custom Web pages with AutoConnect" class="md-nav__link">
Custom Web pages with AutoConnect
</a>
</li>
<li class="md-nav__item">
<a href="acelements.html" title="AutoConnectElements" class="md-nav__link">
AutoConnectElements
</a>
</li>
<li class="md-nav__item">
<a href="acjson.html" title="Custom Web pages with JSON" class="md-nav__link">
Custom Web pages with JSON
</a>
</li>
<li class="md-nav__item">
<a href="achandling.html" title="Handling the custom Web pages" class="md-nav__link">
Handling the custom Web pages
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item md-nav__item--nested">
<input class="md-toggle md-nav__toggle" data-md-toggle="nav-7" type="checkbox" id="nav-7">
<label class="md-nav__link" for="nav-7">
Library APIs
</label>
<nav class="md-nav" data-md-component="collapsible" data-md-level="1">
<label class="md-nav__title" for="nav-7">
Library APIs
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="api.html" title="AutoConnect API" class="md-nav__link">
AutoConnect API
</a>
</li>
<li class="md-nav__item">
<a href="apiaux.html" title="AutoConnectAux API" class="md-nav__link">
AutoConnectAux API
</a>
</li>
<li class="md-nav__item">
<a href="examples/index.html" title="Examples" class="md-nav__link">
<a href="apiconfig.html" title="AutoConnectConfig API" class="md-nav__link">
AutoConnectConfig API
</a>
</li>
<li class="md-nav__item">
<a href="apielements.html" title="AutoConnectElements API" class="md-nav__link">
AutoConnectElements API
</a>
</li>
<li class="md-nav__item">
<a href="apiextra.html" title="Something extra" class="md-nav__link">
Something extra
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item md-nav__item--nested">
<input class="md-toggle md-nav__toggle" data-md-toggle="nav-8" type="checkbox" id="nav-8">
<label class="md-nav__link" for="nav-8">
Examples
</label>
<nav class="md-nav" data-md-component="collapsible" data-md-level="1">
<label class="md-nav__title" for="nav-8">
Examples
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="howtoembed.html" title="How to embed" class="md-nav__link">
How to embed
</a>
</li>
<li class="md-nav__item">
<a href="datatips.html" title="Tips for data conversion" class="md-nav__link">
Tips for data conversion
</a>
</li>
<li class="md-nav__item">
<a href="menuize.html" title="Attach the menu" class="md-nav__link">
Attach the menu
</a>
</li>
<li class="md-nav__item">
<a href="wojson.html" title="Custom Web pages w/o JSON" class="md-nav__link">
Custom Web pages w/o JSON
</a>
</li>
</ul>
</nav>
</li>
@ -492,7 +770,19 @@
<li class="md-nav__item">
<a href="faq/index.html" title="FAQ" class="md-nav__link">
<a href="lsbegin.html" title="Appendix" class="md-nav__link">
Appendix
</a>
</li>
<li class="md-nav__item">
<a href="faq.html" title="FAQ" class="md-nav__link">
FAQ
</a>
</li>
@ -504,7 +794,7 @@
<li class="md-nav__item">
<a href="changelog/index.html" title="Change log" class="md-nav__link">
<a href="changelog.html" title="Change log" class="md-nav__link">
Change log
</a>
</li>
@ -516,7 +806,7 @@
<li class="md-nav__item">
<a href="license/index.html" title="License" class="md-nav__link">
<a href="license.html" title="License" class="md-nav__link">
License
</a>
</li>
@ -539,7 +829,7 @@
<label class="md-nav__title" for="toc">Table of contents</label>
<label class="md-nav__title" for="__toc">Table of contents</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
@ -579,8 +869,15 @@
</li>
<li class="md-nav__item">
<a href="#lives-with-the-your-sketches" title=" Lives with the your sketches" class="md-nav__link">
Lives with the your sketches
<a href="#lives-with-your-sketches" title=" Lives with your sketches" class="md-nav__link">
Lives with your sketches
</a>
</li>
<li class="md-nav__item">
<a href="#easy-to-add-the-custom-web-pages-enhanced-wv097" title=" Easy to add the custom Web pages ENHANCED w/v0.9.7" class="md-nav__link">
Easy to add the custom Web pages ENHANCED w/v0.9.7
</a>
</li>
@ -659,17 +956,25 @@
<h2 id="overview">Overview<a class="headerlink" href="#overview" title="Permanent link">&para;</a></h2>
<p>To the dynamic configuration for joining to WLAN with SSID and PSK accordingly. It an Arduino library united with <em>ESP8266WebServer</em> class for ESP8266 or <em>WebServer</em> class for ESP32.
Easy implementing the Web interface constituting the WLAN for ESP8266/ESP32 WiFi connection. With this library to make a sketch easily which connects from ESP8266/ESP32 to the access point at runtime by the web interface without hard-coded SSID and password.</p>
<p><img style="display:inline-block;width:460px;margin-right:30px;" src="./images/ov.png" /><span style="display:inline-block;width:182px;height:322px;border:solid 1px lightgrey;"><img data-gifffer="./images/ov.gif" data-gifffer-width="180" style="width:180px;" /></span></p>
<p><img style="display:inline-block;width:460px;margin-right:30px;" src="images/ov.png" /><span style="display:inline-block;width:182px;height:322px;border:solid 1px lightgrey;"><img data-gifffer="images/ov.gif" data-gifffer-width="180" style="width:180px;" /></span></p>
<h3 id="no-need-pre-coded-ssid-password"><i class="fa fa-arrow-circle-right" aria-hidden="true"></i> No need pre-coded SSID &amp; password<a class="headerlink" href="#no-need-pre-coded-ssid-password" title="Permanent link">&para;</a></h3>
<p><span class="lead">It is no needed hard-coding in advance the SSID and Password into the sketch to connect between ESP8266/ESP32 and WLAN. You can input SSID &amp; Password from a smartphone via the web interface at runtime.</span></p>
<h3 id="simple-usage"><i class="fa fa-arrow-circle-right" aria-hidden="true"></i> Simple usage<a class="headerlink" href="#simple-usage" title="Permanent link">&para;</a></h3>
<p><span class="lead">AutoConnect control screen will be displayed automatically for establishing new connections. It aids by the <a href="https://en.wikipedia.org/wiki/Captive_portal">captive portal</a> when vested the connection cannot be detected.<br>By using the <a href="menu/index.html">AutoConnect menu</a>, to manage the connections convenient.</span></p>
<p><span class="lead">AutoConnect control screen will be displayed automatically for establishing new connections. It aids by the <a href="https://en.wikipedia.org/wiki/Captive_portal">captive portal</a> when vested the connection cannot be detected.<br>By using the <a href="menu.html">AutoConnect menu</a>, to manage the connections convenient.</span></p>
<h3 id="store-the-established-connection"><i class="fa fa-arrow-circle-right" aria-hidden="true"></i> Store the established connection<a class="headerlink" href="#store-the-established-connection" title="Permanent link">&para;</a></h3>
<p><span class="lead">The connection authentication data as credentials are saved automatically in EEPROM of ESP8266/ESP32 and You can select the past SSID from the <a href="menu/index.html">AutoConnect menu</a>.</span></p>
<p><span class="lead">The connection authentication data as credentials are saved automatically in EEPROM of ESP8266/ESP32 and You can select the past SSID from the <a href="menu.html">AutoConnect menu</a>.</span></p>
<h3 id="easy-to-embed-in"><i class="fa fa-arrow-circle-right" aria-hidden="true"></i> Easy to embed in<a class="headerlink" href="#easy-to-embed-in" title="Permanent link">&para;</a></h3>
<p><span class="lead">AutoConnect can be placed easily in your sketch. It's "<strong>begin</strong>" and "<strong>handleClient</strong>" only.</span></p>
<h3 id="lives-with-the-your-sketches"><i class="fa fa-arrow-circle-right" aria-hidden="true"></i> Lives with the your sketches<a class="headerlink" href="#lives-with-the-your-sketches" title="Permanent link">&para;</a></h3>
<p><span class="lead">The sketches which provide the web page using ESP8266WebServer there is, AutoConnect will not disturb it. AutoConnect can use an already instantiated ESP8266WebServer object, or itself can assign it.<br>This efficacy can also be applied to ESP32. The corresponding class for ESP32 will be the WebServer.</span></p>
<h3 id="lives-with-your-sketches"><i class="fa fa-arrow-circle-right" aria-hidden="true"></i> Lives with your sketches<a class="headerlink" href="#lives-with-your-sketches" title="Permanent link">&para;</a></h3>
<p><span class="lead">The sketches which provide the web page using ESP8266WebServer there is, AutoConnect will not disturb it. AutoConnect can use an already instantiated ESP8266WebServer object, or itself can assign it. This effect also applies to ESP32. The corresponding class for ESP32 will be the WebServer.</span></p>
<h3 id="easy-to-add-the-custom-web-pages-enhanced-wv097"><i class="fa fa-arrow-circle-right" aria-hidden="true"></i> Easy to add the <a href="acintro.html">custom Web pages</a> <sup><sub>ENHANCED w/v0.9.7</sub></sup><a class="headerlink" href="#easy-to-add-the-custom-web-pages-enhanced-wv097" title="Permanent link">&para;</a></h3>
<p><span class="lead">You can easily add your owned web pages that can consist of representative HTML elements and invoke them from the menu. Further it possible importing the custom Web pages declarations described with JSON which stored in PROGMEM, SPIFFS, or SD.</span></p>
<div style="display:block;height:425px;">
<img style="float:left;width:380px;" src="images/aux_json.png">
<img style="float:left;margin-top:200px;margin-left:10px;margin-right:10px;width:32px;" src="images/arrow_right.png">
<span style="float:left;width:242px;height:425px;border:1px solid lightgrey;"><img data-gifffer="images/aux_ov.gif" data-gifffer-width="240" data-gifffer-height="423" /></span>
</div>
<h2 id="installation">Installation<a class="headerlink" href="#installation" title="Permanent link">&para;</a></h2>
<h3 id="requirements">Requirements<a class="headerlink" href="#requirements" title="Permanent link">&para;</a></h3>
<h4 id="supported-hardware">Supported hardware<a class="headerlink" href="#supported-hardware" title="Permanent link">&para;</a></h4>
@ -699,20 +1004,26 @@ Easy implementing the Web interface constituting the WLAN for ESP8266/ESP32 WiFi
<p><i class="fa fa-download"></i> <strong>Arduino IDE</strong></p>
<p>The current upstream at the 1.8 level or later is needed. Please install from the <a href="https://www.arduino.cc/en/Main/Software">official Arduino IDE download page</a>. This step is not required if you already have a modern version.</p>
<p><i class="fa fa-download"></i> <strong>ESP8266 Arduino core</strong></p>
<p>AutoConnect targets sketches made on the assumption of <a href="https://github.com/esp8266/Arduino">ESP8266 Community's Arduino core</a>. The <a href="https://github.com/esp8266/Arduino/releases/latest">latest release</a> is recommended.<br />
<p>AutoConnect targets sketches made on the assumption of <a href="https://github.com/esp8266/Arduino">ESP8266 Community's Arduino core</a>. Stable 2.4.0 or higher required and the <a href="https://github.com/esp8266/Arduino/releases/latest">latest release</a> is recommended.<br />
Install third-party platform using the <em>Boards Manager</em> of Arduino IDE. Package URL is <a href="http://arduino.esp8266.com/stable/package_esp8266com_index.json">http://arduino.esp8266.com/stable/package_esp8266com_index.json</a></p>
<p><i class="fa fa-download"></i> <strong>ESP32 Arduino core</strong></p>
<p>Also, to apply AutoConnect to ESP32, the <a href="https://github.com/espressif/arduino-esp32">arduino-esp32 core</a> provided by Espressif is needed. The <a href="https://github.com/espressif/arduino-esp32/releases/latest">latest release</a> is recommended.<br />
Install third-party platform using the <em>Boards Manager</em> of Arduino IDE. You can add multiple URLs into <em>Additional Board Manager URLs</em> field, separating them with commas. Package URL is <a href="https://dl.espressif.com/dl/package_esp32_index.json">https://dl.espressif.com/dl/package_esp32_index.json</a></p>
<p><i class="fa fa-download"></i> <strong>Additional necessary library</strong></p>
<p>Also, to apply AutoConnect to ESP32, the <a href="https://github.com/espressif/arduino-esp32">arduino-esp32 core</a> provided by Espressif is needed. Stable 1.0.1 or required and the <a href="https://github.com/espressif/arduino-esp32/releases/latest">latest release</a> is recommended.<br />
Install third-party platform using the <em>Boards Manager</em> of Arduino IDE. You can add multiple URLs into <em>Additional Board Manager URLs</em> field, separating them with commas. Package URL is <a href="https://dl.espressif.com/dl/package_esp32_index.json">https://dl.espressif.com/dl/package_esp32_index.json</a> for ESP32.</p>
<p><i class="fa fa-download"></i> <strong>Additional library (Required)</strong></p>
<p>The <a href="https://github.com/Hieromon/PageBuilder">PageBuilder</a> library to build HTML for ESP8266WebServer is needed.<br />
To install the PageBuilder library into your Arduino IDE, you can use the <em>Library Manager</em>. Select the board of ESP8266 series in the Arduino IDE, open the library manager and search keyword '<strong>PageBuilder</strong>' with the topic '<strong>Communication</strong>', then you can see the <em>PageBuilder</em>. The latest version is required 1.1.0 later for ESP32.</p>
<p><img src="./images/lm.png" width="640"/></p>
To install the PageBuilder library into your Arduino IDE, you can use the <em>Library Manager</em>. Select the board of ESP8266 series in the Arduino IDE, open the library manager and search keyword '<strong>PageBuilder</strong>' with the topic '<strong>Communication</strong>', then you can see the <em>PageBuilder</em>. The latest version is required <strong>1.3.2</strong> <strong>later</strong>.<sup id="fnref:1"><a class="footnote-ref" href="#fn:1" rel="footnote">1</a></sup></p>
<p><img src="images/lm.png" width="640"/></p>
<p><i class="fa fa-download"></i> <strong>Additional library (Optional)</strong></p>
<p>By adding the <a href="https://github.com/bblanchon/ArduinoJson">ArduinoJson</a> library, AutoConnect will be able to handle the <a href="acintro.html"><strong>custom Web pages</strong></a> described with JSON. With AutoConnect v0.9.7 you can insert user-owned web pages that can consist of representative HTML elements as styled TEXT, INPUT, BUTTON, CHECKBOX, SELECT, SUBMIT and invoke them from the AutoConnect menu. These HTML elements can be added by sketches using the AutoConnect API. Further it possible importing the custom Web pages declarations described with JSON which stored in PROGMEM, SPIFFS, or SD. <a href="https://arduinojson.org/v5/doc/">ArduinoJson version 5</a> is required to use this feature.<sup id="fnref:2"><a class="footnote-ref" href="#fn:2" rel="footnote">2</a></sup></p>
<div class="admonition info">
<p class="admonition-title">AutoConnect supports ArduinoJson version 5 only</p>
<p>ArduinoJson version 6 is still in beta, but Arduino Library Manager installs the ArduinoJson version 6 by default. Open the Arduino Library Manager and make sure that ArduinoJson version 5 is installed.</p>
</div>
<h3 id="install-the-autoconnect">Install the AutoConnect<a class="headerlink" href="#install-the-autoconnect" title="Permanent link">&para;</a></h3>
<p>Clone or download from the <a href="https://github.com/Hieromon/AutoConnect">AutoConnect GitHub repository</a>.</p>
<p><img src="./images/gitrepo.png" width="640"/></p>
<p><img src="images/gitrepo.png" width="640"/></p>
<p>When you select Download, you can import it to Arduino IDE immediately. After downloaded, the AutoConnect-master.zip file will be saved in your download folder. Then in the Arduino IDE, navigate to <em>"Sketch &gt; Include Library"</em>. At the top of the drop down list, select the option to <em>"Add .ZIP Library..."</em>. Details for <a href="https://www.arduino.cc/en/Guide/Libraries#toc4">Arduino official page</a>.</p>
<p><img src="./images/ins_lib.png" /></p>
<p><img src="images/ins_lib.png" /></p>
<div class="admonition info">
<p class="admonition-title">Supported by Library manager.</p>
<p>AutoConnect was added to the Arduino IDE library manager. It can be used with the PlatformIO library also.</p>
@ -720,14 +1031,28 @@ To install the PageBuilder library into your Arduino IDE, you can use the <em>Li
<script>
window.onload = function() {
Gifffer();
}
};
</script>
<div class="footnote">
<hr />
<ol>
<li id="fn:1">
<p>Since AutoConnect v0.9.7, PageBuilder v1.3.2 later is required.&#160;<a class="footnote-backref" href="#fnref:1" rev="footnote" title="Jump back to footnote 1 in the text">&#8617;</a></p>
</li>
<li id="fn:2">
<p>Using the AutoConnect API natively allows you to sketch custom Web pages without JSON.&#160;<a class="footnote-backref" href="#fnref:2" rev="footnote" title="Jump back to footnote 2 in the text">&#8617;</a></p>
</li>
</ol>
</div>
</article>
</div>
@ -741,7 +1066,7 @@ To install the PageBuilder library into your Arduino IDE, you can use the <em>Li
<nav class="md-footer-nav__inner md-grid">
<a href="gettingstarted/index.html" title="Getting started" class="md-flex md-footer-nav__link md-footer-nav__link--next" rel="next">
<a href="gettingstarted.html" title="Getting started" class="md-flex md-footer-nav__link md-footer-nav__link--next" rel="next">
<div class="md-flex__cell md-flex__cell--stretch md-footer-nav__title">
<span class="md-flex__ellipsis">
<span class="md-footer-nav__direction">
@ -763,20 +1088,18 @@ To install the PageBuilder library into your Arduino IDE, you can use the <em>Li
<div class="md-footer-copyright">
<div class="md-footer-copyright__highlight">
Copyright &copy; 2018 Hieromon Ikasamo
Copyright &copy; 2018-2019 Hieromon Ikasamo
</div>
powered by
<a href="http://www.mkdocs.org">MkDocs</a>
<a href="https://www.mkdocs.org">MkDocs</a>
and
<a href="https://squidfunk.github.io/mkdocs-material/">
Material for MkDocs</a>
</div>
<div class="md-footer-social">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<link rel="stylesheet" href="assets/fonts/font-awesome.css">
<a href="https://github.com/Hieromon" class="md-footer-social__link fa fa-github"></a>
@ -784,23 +1107,17 @@ To install the PageBuilder library into your Arduino IDE, you can use the <em>Li
</div>
</div>
</div>
</footer>
</div>
<script src="./assets/javascripts/application.8eb9be28.js"></script>
<script src="assets/javascripts/application.b806dc00.js"></script>
<script>app.initialize({version:"0.17.3",url:{base:"."}})</script>
<script src="./js/gifffer.min.js"></script>
<script>app.initialize({version:"1.0.4",url:{base:"."}})</script>
<script>!function(e,a,t,n,o,c,i){e.GoogleAnalyticsObject=o,e.ga=e.ga||function(){(e.ga.q=e.ga.q||[]).push(arguments)},e.ga.l=1*new Date,c=a.createElement(t),i=a.getElementsByTagName(t)[0],c.async=1,c.src="https://www.google-analytics.com/analytics.js",i.parentNode.insertBefore(c,i)}(window,document,"script",0,"ga"),ga("create","UA-116150854-1","auto"),ga("set","anonymizeIp",!0),ga("send","pageview");var links=document.getElementsByTagName("a");if(Array.prototype.map.call(links,function(e){e.host!=document.location.host&&e.addEventListener("click",function(){var a=e.getAttribute("data-md-action")||"follow";ga("send","event","outbound",a,e.href)})}),document.forms.search){var query=document.forms.search.query;query.addEventListener("blur",function(){if(this.value){var e=document.location.pathname;ga("send","pageview",e+"?q="+this.value)}})}</script>
<script src="js/gifffer.min.js"></script>
</body>

@ -1 +1 @@
(function webpackUniversalModuleDefinition(root,factory){if(typeof exports==="object"&&typeof module==="object")module.exports=factory();else if(typeof define==="function"&&define.amd)define("Gifffer",[],factory);else if(typeof exports==="object")exports["Gifffer"]=factory();else root["Gifffer"]=factory()})(this,function(){var d=document;var playSize=60;var Gifffer=function(options){var images,i=0,gifs=[];images=d.querySelectorAll("[data-gifffer]");for(;i<images.length;++i)process(images[i],gifs,options);return gifs};function formatUnit(v){return v+(v.toString().indexOf("%")>0?"":"px")}function parseStyles(styles){var stylesStr="";for(prop in styles)stylesStr+=prop+":"+styles[prop]+";";return stylesStr}function createContainer(w,h,el,altText,opts){var alt;var con=d.createElement("BUTTON");var cls=el.getAttribute("class");var id=el.getAttribute("id");var playButtonStyles=opts&&opts.playButtonStyles?parseStyles(opts.playButtonStyles):["width:"+playSize+"px","height:"+playSize+"px","border-radius:"+playSize/2+"px","background:rgba(0, 0, 0, 0.3)","position:absolute","top:50%","left:50%","margin:-"+playSize/2+"px"].join(";");var playButtonIconStyles=opts&&opts.playButtonIconStyles?parseStyles(opts.playButtonIconStyles):["width: 0","height: 0","border-top: 14px solid transparent","border-bottom: 14px solid transparent","border-left: 14px solid rgba(0, 0, 0, 0.5)","position: absolute","left: 26px","top: 16px"].join(";");cls?con.setAttribute("class",el.getAttribute("class")):null;id?con.setAttribute("id",el.getAttribute("id")):null;con.setAttribute("style","position:relative;cursor:pointer;background:none;border:none;padding:0;");con.setAttribute("aria-hidden","true");var play=d.createElement("DIV");play.setAttribute("class","gifffer-play-button");play.setAttribute("style",playButtonStyles);var trngl=d.createElement("DIV");trngl.setAttribute("style",playButtonIconStyles);play.appendChild(trngl);if(altText){alt=d.createElement("p");alt.setAttribute("class","gifffer-alt");alt.setAttribute("style","border:0;clip:rect(0 0 0 0);height:1px;overflow:hidden;padding:0;position:absolute;width:1px;");alt.innerText=altText+", image"}con.appendChild(play);el.parentNode.replaceChild(con,el);altText?con.parentNode.insertBefore(alt,con.nextSibling):null;return{c:con,p:play}}function calculatePercentageDim(el,w,h,wOrig,hOrig){var parentDimW=el.parentNode.offsetWidth;var parentDimH=el.parentNode.offsetHeight;var ratio=wOrig/hOrig;if(w.toString().indexOf("%")>0){w=parseInt(w.toString().replace("%",""));w=w/100*parentDimW;h=w/ratio}else if(h.toString().indexOf("%")>0){h=parseInt(h.toString().replace("%",""));h=h/100*parentDimW;w=h*ratio}return{w:w,h:h}}function process(el,gifs,options){var url,con,c,w,h,duration,play,gif,playing=false,cc,isC,durationTimeout,dims,altText;url=el.getAttribute("data-gifffer");w=el.getAttribute("data-gifffer-width");h=el.getAttribute("data-gifffer-height");duration=el.getAttribute("data-gifffer-duration");altText=el.getAttribute("data-gifffer-alt");el.style.display="block";c=document.createElement("canvas");isC=!!(c.getContext&&c.getContext("2d"));if(w&&h&&isC)cc=createContainer(w,h,el,altText,options);el.onload=function(){if(!isC)return;w=w||el.width;h=h||el.height;if(!cc)cc=createContainer(w,h,el,altText,options);con=cc.c;play=cc.p;dims=calculatePercentageDim(con,w,h,el.width,el.height);gifs.push(con);con.addEventListener("click",function(){clearTimeout(durationTimeout);if(!playing){playing=true;gif=document.createElement("IMG");gif.setAttribute("style","width:100%;height:100%;");gif.setAttribute("data-uri",Math.floor(Math.random()*1e5)+1);setTimeout(function(){gif.src=url},0);con.removeChild(play);con.removeChild(c);con.appendChild(gif);if(parseInt(duration)>0){durationTimeout=setTimeout(function(){playing=false;con.appendChild(play);con.removeChild(gif);con.appendChild(c);gif=null},duration)}}else{playing=false;con.appendChild(play);con.removeChild(gif);con.appendChild(c);gif=null}});c.width=dims.w;c.height=dims.h;c.getContext("2d").drawImage(el,0,0,dims.w,dims.h);con.appendChild(c);con.setAttribute("style","position:relative;cursor:pointer;width:"+dims.w+"px;height:"+dims.h+"px;background:none;border:none;padding:0;");c.style.width="100%";c.style.height="100%";if(w.toString().indexOf("%")>0&&h.toString().indexOf("%")>0){con.style.width=w;con.style.height=h}else if(w.toString().indexOf("%")>0){con.style.width=w;con.style.height="inherit"}else if(h.toString().indexOf("%")>0){con.style.width="inherit";con.style.height=h}else{con.style.width=dims.w+"px";con.style.height=dims.h+"px"}};el.src=url}return Gifffer});
(function webpackUniversalModuleDefinition(root,factory){if(typeof exports==="object"&&typeof module==="object")module.exports=factory();else if(typeof define==="function"&&define.amd)define("Gifffer",[],factory);else if(typeof exports==="object")exports["Gifffer"]=factory();else root["Gifffer"]=factory()})(this,function(){if(typeof window==="undefined"||typeof document==="undefined"){return}var d=document;var playSize=60;var Gifffer=function(options){var images,i=0,gifs=[];images=d.querySelectorAll("[data-gifffer]");for(;i<images.length;++i)process(images[i],gifs,options);return gifs};function formatUnit(v){return v+(v.toString().indexOf("%")>0?"":"px")}function parseStyles(styles){var stylesStr="";for(prop in styles)stylesStr+=prop+":"+styles[prop]+";";return stylesStr}function createContainer(w,h,el,altText,opts){var alt;var con=d.createElement("BUTTON");var cls=el.getAttribute("class");var id=el.getAttribute("id");var playButtonStyles=opts&&opts.playButtonStyles?parseStyles(opts.playButtonStyles):["width:"+playSize+"px","height:"+playSize+"px","border-radius:"+playSize/2+"px","background:rgba(0, 0, 0, 0.3)","position:absolute","top:50%","left:50%","margin:-"+playSize/2+"px"].join(";");var playButtonIconStyles=opts&&opts.playButtonIconStyles?parseStyles(opts.playButtonIconStyles):["width: 0","height: 0","border-top: 14px solid transparent","border-bottom: 14px solid transparent","border-left: 14px solid rgba(0, 0, 0, 0.5)","position: absolute","left: 26px","top: 16px"].join(";");cls?con.setAttribute("class",el.getAttribute("class")):null;id?con.setAttribute("id",el.getAttribute("id")):null;con.setAttribute("style","position:relative;cursor:pointer;background:none;border:none;padding:0;");con.setAttribute("aria-hidden","true");var play=d.createElement("DIV");play.setAttribute("class","gifffer-play-button");play.setAttribute("style",playButtonStyles);var trngl=d.createElement("DIV");trngl.setAttribute("style",playButtonIconStyles);play.appendChild(trngl);if(altText){alt=d.createElement("p");alt.setAttribute("class","gifffer-alt");alt.setAttribute("style","border:0;clip:rect(0 0 0 0);height:1px;overflow:hidden;padding:0;position:absolute;width:1px;");alt.innerText=altText+", image"}con.appendChild(play);el.parentNode.replaceChild(con,el);altText?con.parentNode.insertBefore(alt,con.nextSibling):null;return{c:con,p:play}}function calculatePercentageDim(el,w,h,wOrig,hOrig){var parentDimW=el.parentNode.offsetWidth;var parentDimH=el.parentNode.offsetHeight;var ratio=wOrig/hOrig;if(w.toString().indexOf("%")>0){w=parseInt(w.toString().replace("%",""));w=w/100*parentDimW;h=w/ratio}else if(h.toString().indexOf("%")>0){h=parseInt(h.toString().replace("%",""));h=h/100*parentDimW;w=h*ratio}return{w:w,h:h}}function process(el,gifs,options){var url,con,c,w,h,duration,play,gif,playing=false,cc,isC,durationTimeout,dims,altText;url=el.getAttribute("data-gifffer");w=el.getAttribute("data-gifffer-width");h=el.getAttribute("data-gifffer-height");duration=el.getAttribute("data-gifffer-duration");altText=el.getAttribute("data-gifffer-alt");el.style.display="block";c=document.createElement("canvas");isC=!!(c.getContext&&c.getContext("2d"));if(w&&h&&isC)cc=createContainer(w,h,el,altText,options);el.onload=function(){if(!isC)return;w=w||el.width;h=h||el.height;if(!cc)cc=createContainer(w,h,el,altText,options);con=cc.c;play=cc.p;dims=calculatePercentageDim(con,w,h,el.width,el.height);gifs.push(con);con.addEventListener("click",function(){clearTimeout(durationTimeout);if(!playing){playing=true;gif=document.createElement("IMG");gif.setAttribute("style","width:100%;height:100%;");gif.setAttribute("data-uri",Math.floor(Math.random()*1e5)+1);setTimeout(function(){gif.src=url},0);con.removeChild(play);con.removeChild(c);con.appendChild(gif);if(parseInt(duration)>0){durationTimeout=setTimeout(function(){playing=false;con.appendChild(play);con.removeChild(gif);con.appendChild(c);gif=null},duration)}}else{playing=false;con.appendChild(play);con.removeChild(gif);con.appendChild(c);gif=null}});c.width=dims.w;c.height=dims.h;c.getContext("2d").drawImage(el,0,0,dims.w,dims.h);con.appendChild(c);con.setAttribute("style","position:relative;cursor:pointer;width:"+dims.w+"px;height:"+dims.h+"px;background:none;border:none;padding:0;");c.style.width="100%";c.style.height="100%";if(w.toString().indexOf("%")>0&&h.toString().indexOf("%")>0){con.style.width=w;con.style.height=h}else if(w.toString().indexOf("%")>0){con.style.width=w;con.style.height="inherit"}else if(h.toString().indexOf("%")>0){con.style.width="inherit";con.style.height=h}else{con.style.width=dims.w+"px";con.style.height=dims.h+"px"}};el.src=url}return Gifffer});

@ -2,7 +2,7 @@
<!DOCTYPE html>
<!doctype html>
<html lang="en" class="no-js">
<head>
@ -13,7 +13,7 @@
<meta name="description" content="ESP8266/ESP32 WLAN configuration at run time with web interface">
<link rel="canonical" href="https://Hieromon.github.io/AutoConnect/license/index.html">
<link rel="canonical" href="https://Hieromon.github.io/AutoConnect/license.html">
<meta name="author" content="Hieromon Ikasamo">
@ -37,8 +37,8 @@
<meta name="lang:search.tokenizer" content="[\s\-]+">
<link rel="shortcut icon" href="../assets/images/favicon.png">
<meta name="generator" content="mkdocs-0.17.3, mkdocs-material-2.7.0">
<link rel="shortcut icon" href="assets/images/favicon.png">
<meta name="generator" content="mkdocs-1.0.4, mkdocs-material-4.0.1">
@ -46,24 +46,62 @@
<link rel="stylesheet" href="../assets/stylesheets/application.78aab2dc.css">
<link rel="stylesheet" href="assets/stylesheets/application.982221ab.css">
<link rel="stylesheet" href="../assets/stylesheets/application-palette.6079476c.css">
<link rel="stylesheet" href="assets/stylesheets/application-palette.224b79ff.css">
<meta name="theme-color" content="#3f51b5">
<script src="../assets/javascripts/modernizr.1aa3b519.js"></script>
<script src="assets/javascripts/modernizr.1f0bcf2b.js"></script>
<link href="https://fonts.gstatic.com" rel="preconnect" crossorigin>
<link href="https://fonts.gstatic.com" rel="preconnect" crossorigin>
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,400,400i,700|Roboto+Mono">
<style>body,input{font-family:"Roboto","Helvetica Neue",Helvetica,Arial,sans-serif}code,kbd,pre{font-family:"Roboto Mono","Courier New",Courier,monospace}</style>
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
<link rel="stylesheet" href="assets/fonts/material-icons.css">
<link rel="stylesheet" href="../css/paragraph.css">
<link rel="stylesheet" href="css/paragraph.css">
<link rel="stylesheet" href="css/extra.css">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.6.1/css/all.css">
<script>
window.ga = window.ga || function() {
(ga.q = ga.q || []).push(arguments)
}
ga.l = +new Date
/* Setup integration and send page view */
ga("create", "UA-116150854-1", "auto")
ga("set", "anonymizeIp", true)
ga("send", "pageview")
/* Register handler to log search on blur */
document.addEventListener("DOMContentLoaded", () => {
if (document.forms.search) {
var query = document.forms.search.query
query.addEventListener("blur", function() {
if (this.value) {
var path = document.location.pathname;
ga("send", "pageview", path + "?q=" + this.value)
}
})
}
})
</script>
<script async src="https://www.google-analytics.com/analytics.js"></script>
</head>
@ -77,7 +115,7 @@
<svg xmlns="http://www.w3.org/2000/svg" width="416" height="448"
viewBox="0 0 416 448" id="github">
viewBox="0 0 416 448" id="__github">
<path fill="currentColor" d="M160 304q0 10-3.125 20.5t-10.75 19-18.125
8.5-18.125-8.5-10.75-19-3.125-20.5 3.125-20.5 10.75-19 18.125-8.5
18.125 8.5 10.75 19 3.125 20.5zM320 304q0 10-3.125 20.5t-10.75
@ -97,9 +135,9 @@
</defs>
</svg>
<input class="md-toggle" data-md-toggle="drawer" type="checkbox" id="drawer">
<input class="md-toggle" data-md-toggle="search" type="checkbox" id="search">
<label class="md-overlay" data-md-component="overlay" for="drawer"></label>
<input class="md-toggle" data-md-toggle="drawer" type="checkbox" id="__drawer" autocomplete="off">
<input class="md-toggle" data-md-toggle="search" type="checkbox" id="__search" autocomplete="off">
<label class="md-overlay" data-md-component="overlay" for="__drawer"></label>
<header class="md-header" data-md-component="header">
@ -108,38 +146,35 @@
<div class="md-flex__cell md-flex__cell--shrink">
<a href="https://Hieromon.github.io/AutoConnect/" title="AutoConnect for ESP8266/ESP32" class="md-header-nav__button md-logo">
<img src="../images/arduino-logo.svg" width="24" height="24">
<img src="images/arduino-logo.svg" width="24" height="24">
</a>
</div>
<div class="md-flex__cell md-flex__cell--shrink">
<label class="md-icon md-icon--menu md-header-nav__button" for="drawer"></label>
<label class="md-icon md-icon--menu md-header-nav__button" for="__drawer"></label>
</div>
<div class="md-flex__cell md-flex__cell--stretch">
<div class="md-flex__ellipsis md-header-nav__title" data-md-component="title">
<span class="md-header-nav__topic">
AutoConnect for ESP8266/ESP32
</span>
<span class="md-header-nav__topic">
License
</span>
<span class="md-header-nav__topic">
AutoConnect for ESP8266/ESP32
</span>
<span class="md-header-nav__topic">
License
</span>
</div>
</div>
<div class="md-flex__cell md-flex__cell--shrink">
<label class="md-icon md-icon--search md-header-nav__button" for="__search"></label>
<label class="md-icon md-icon--search md-header-nav__button" for="search"></label>
<div class="md-search" data-md-component="search" role="dialog">
<label class="md-search__overlay" for="search"></label>
<label class="md-search__overlay" for="__search"></label>
<div class="md-search__inner" role="search">
<form class="md-search__form" name="search">
<input type="text" class="md-search__input" name="query" placeholder="Search" autocapitalize="off" autocorrect="off" autocomplete="off" spellcheck="false" data-md-component="query" data-md-state="active">
<label class="md-icon md-search__icon" for="search"></label>
<label class="md-icon md-search__icon" for="__search"></label>
<button type="reset" class="md-icon md-search__icon" data-md-component="reset" tabindex="-1">
&#xE5CD;
</button>
@ -156,7 +191,6 @@
</div>
</div>
</div>
</div>
@ -167,20 +201,18 @@
<a href="https://github.com/Hieromon/AutoConnect" title="Go to repository" class="md-source" data-md-source="github">
<div class="md-source__icon">
<svg viewBox="0 0 24 24" width="24" height="24">
<use xlink:href="#github" width="24" height="24"></use>
</svg>
</div>
<div class="md-source__repository">
Hieromon/AutoConnect
<a href="https://github.com/Hieromon/AutoConnect" title="Go to repository" class="md-source" data-md-source="github">
<div class="md-source__icon">
<svg viewBox="0 0 24 24" width="24" height="24">
<use xlink:href="#__github" width="24" height="24"></use>
</svg>
</div>
</a>
<div class="md-source__repository">
Hieromon/AutoConnect
</div>
</a>
</div>
</div>
@ -202,7 +234,7 @@
<li class="md-tabs__item">
<a href="../index.html" title="Overview" class="md-tabs__link md-tabs__link--active">
<a href="index.html" title="Overview" class="md-tabs__link md-tabs__link--active">
Overview
</a>
@ -218,6 +250,43 @@
<li class="md-tabs__item">
<a href="acintro.html" title="Custom Web pages" class="md-tabs__link">
Custom Web pages
</a>
</li>
<li class="md-tabs__item">
<a href="api.html" title="Library APIs" class="md-tabs__link">
Library APIs
</a>
</li>
<li class="md-tabs__item">
<a href="howtoembed.html" title="Examples" class="md-tabs__link">
Examples
</a>
</li>
@ -239,12 +308,12 @@
<div class="md-sidebar__scrollwrap">
<div class="md-sidebar__inner">
<nav class="md-nav md-nav--primary" data-md-level="0">
<label class="md-nav__title md-nav__title--site" for="drawer">
<span class="md-nav__button md-logo">
<label class="md-nav__title md-nav__title--site" for="__drawer">
<a href="https://Hieromon.github.io/AutoConnect/" title="AutoConnect for ESP8266/ESP32" class="md-nav__button md-logo">
<img src="../images/arduino-logo.svg" width="48" height="48">
<img src="images/arduino-logo.svg" width="48" height="48">
</span>
</a>
AutoConnect for ESP8266/ESP32
</label>
@ -254,20 +323,18 @@
<a href="https://github.com/Hieromon/AutoConnect" title="Go to repository" class="md-source" data-md-source="github">
<div class="md-source__icon">
<svg viewBox="0 0 24 24" width="24" height="24">
<use xlink:href="#github" width="24" height="24"></use>
</svg>
</div>
<div class="md-source__repository">
Hieromon/AutoConnect
<a href="https://github.com/Hieromon/AutoConnect" title="Go to repository" class="md-source" data-md-source="github">
<div class="md-source__icon">
<svg viewBox="0 0 24 24" width="24" height="24">
<use xlink:href="#__github" width="24" height="24"></use>
</svg>
</div>
</a>
<div class="md-source__repository">
Hieromon/AutoConnect
</div>
</a>
</div>
<ul class="md-nav__list" data-md-scrollfix>
@ -278,7 +345,7 @@
<li class="md-nav__item">
<a href="../index.html" title="Overview" class="md-nav__link">
<a href="index.html" title="Overview" class="md-nav__link">
Overview
</a>
</li>
@ -290,7 +357,7 @@
<li class="md-nav__item">
<a href="../gettingstarted/index.html" title="Getting started" class="md-nav__link">
<a href="gettingstarted.html" title="Getting started" class="md-nav__link">
Getting started
</a>
</li>
@ -302,7 +369,7 @@
<li class="md-nav__item">
<a href="../menu/index.html" title="AutoConnect menu" class="md-nav__link">
<a href="menu.html" title="AutoConnect menu" class="md-nav__link">
AutoConnect menu
</a>
</li>
@ -314,7 +381,7 @@
<li class="md-nav__item">
<a href="../basicusage/index.html" title="Basic usage" class="md-nav__link">
<a href="basicusage.html" title="Basic usage" class="md-nav__link">
Basic usage
</a>
</li>
@ -326,7 +393,7 @@
<li class="md-nav__item">
<a href="../advancedusage/index.html" title="Advanced usage" class="md-nav__link">
<a href="advancedusage.html" title="Advanced usage" class="md-nav__link">
Advanced usage
</a>
</li>
@ -337,21 +404,237 @@
<li class="md-nav__item md-nav__item--nested">
<input class="md-toggle md-nav__toggle" data-md-toggle="nav-6" type="checkbox" id="nav-6">
<label class="md-nav__link" for="nav-6">
Custom Web pages
</label>
<nav class="md-nav" data-md-component="collapsible" data-md-level="1">
<label class="md-nav__title" for="nav-6">
Custom Web pages
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="../api/index.html" title="Library APIs" class="md-nav__link">
Library APIs
<a href="acintro.html" title="Custom Web pages with AutoConnect" class="md-nav__link">
Custom Web pages with AutoConnect
</a>
</li>
<li class="md-nav__item">
<a href="acelements.html" title="AutoConnectElements" class="md-nav__link">
AutoConnectElements
</a>
</li>
<li class="md-nav__item">
<a href="acjson.html" title="Custom Web pages with JSON" class="md-nav__link">
Custom Web pages with JSON
</a>
</li>
<li class="md-nav__item">
<a href="achandling.html" title="Handling the custom Web pages" class="md-nav__link">
Handling the custom Web pages
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item md-nav__item--nested">
<input class="md-toggle md-nav__toggle" data-md-toggle="nav-7" type="checkbox" id="nav-7">
<label class="md-nav__link" for="nav-7">
Library APIs
</label>
<nav class="md-nav" data-md-component="collapsible" data-md-level="1">
<label class="md-nav__title" for="nav-7">
Library APIs
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="../examples/index.html" title="Examples" class="md-nav__link">
<a href="api.html" title="AutoConnect API" class="md-nav__link">
AutoConnect API
</a>
</li>
<li class="md-nav__item">
<a href="apiaux.html" title="AutoConnectAux API" class="md-nav__link">
AutoConnectAux API
</a>
</li>
<li class="md-nav__item">
<a href="apiconfig.html" title="AutoConnectConfig API" class="md-nav__link">
AutoConnectConfig API
</a>
</li>
<li class="md-nav__item">
<a href="apielements.html" title="AutoConnectElements API" class="md-nav__link">
AutoConnectElements API
</a>
</li>
<li class="md-nav__item">
<a href="apiextra.html" title="Something extra" class="md-nav__link">
Something extra
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item md-nav__item--nested">
<input class="md-toggle md-nav__toggle" data-md-toggle="nav-8" type="checkbox" id="nav-8">
<label class="md-nav__link" for="nav-8">
Examples
</label>
<nav class="md-nav" data-md-component="collapsible" data-md-level="1">
<label class="md-nav__title" for="nav-8">
Examples
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="howtoembed.html" title="How to embed" class="md-nav__link">
How to embed
</a>
</li>
<li class="md-nav__item">
<a href="datatips.html" title="Tips for data conversion" class="md-nav__link">
Tips for data conversion
</a>
</li>
<li class="md-nav__item">
<a href="menuize.html" title="Attach the menu" class="md-nav__link">
Attach the menu
</a>
</li>
<li class="md-nav__item">
<a href="wojson.html" title="Custom Web pages w/o JSON" class="md-nav__link">
Custom Web pages w/o JSON
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item">
<a href="lsbegin.html" title="Appendix" class="md-nav__link">
Appendix
</a>
</li>
@ -362,7 +645,7 @@
<li class="md-nav__item">
<a href="../faq/index.html" title="FAQ" class="md-nav__link">
<a href="faq.html" title="FAQ" class="md-nav__link">
FAQ
</a>
</li>
@ -374,7 +657,7 @@
<li class="md-nav__item">
<a href="../changelog/index.html" title="Change log" class="md-nav__link">
<a href="changelog.html" title="Change log" class="md-nav__link">
Change log
</a>
</li>
@ -389,10 +672,10 @@
<li class="md-nav__item md-nav__item--active">
<input class="md-toggle md-nav__toggle" data-md-toggle="toc" type="checkbox" id="toc">
<input class="md-toggle md-nav__toggle" data-md-toggle="toc" type="checkbox" id="__toc">
<a href="index.html" title="License" class="md-nav__link md-nav__link--active">
<a href="license.html" title="License" class="md-nav__link md-nav__link--active">
License
</a>
@ -415,20 +698,25 @@
<h1>License</h1>
<p><strong>MIT License</strong></p>
<p>Copyright &copy; 2018 Hieromon Ikasamo</p>
<p>Copyright &copy; 2018-2019 Hieromon Ikasamo</p>
<p>Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:</p>
<p>The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.</p>
<p>THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NON-INFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS
IN THE SOFTWARE.</p>
<p><strong>Acknowledgments</strong></p>
<p>The <strong>Luxbar</strong> is licensed under the MIT License.<br />
<a href="https://github.com/balzss/luxbar">https://github.com/balzss/luxbar</a></p>
<p>Each of the following libraries used by AutoConnect is under its license:</p>
<ul>
<li>The <strong>Luxbar</strong> is licensed under the MIT License. <a href="https://github.com/balzss/luxbar">https://github.com/balzss/luxbar</a></li>
<li><strong>ArduinoJson</strong> is licensed under the MIT License. <a href="https://arduinojson.org/">https://arduinojson.org/</a></li>
</ul>
</article>
</div>
@ -441,7 +729,7 @@ IN THE SOFTWARE.</p>
<div class="md-footer-nav">
<nav class="md-footer-nav__inner md-grid">
<a href="../changelog/index.html" title="Change log" class="md-flex md-footer-nav__link md-footer-nav__link--prev" rel="prev">
<a href="changelog.html" title="Change log" class="md-flex md-footer-nav__link md-footer-nav__link--prev" rel="prev">
<div class="md-flex__cell md-flex__cell--shrink">
<i class="md-icon md-icon--arrow-back md-footer-nav__button"></i>
</div>
@ -464,20 +752,18 @@ IN THE SOFTWARE.</p>
<div class="md-footer-copyright">
<div class="md-footer-copyright__highlight">
Copyright &copy; 2018 Hieromon Ikasamo
Copyright &copy; 2018-2019 Hieromon Ikasamo
</div>
powered by
<a href="http://www.mkdocs.org">MkDocs</a>
<a href="https://www.mkdocs.org">MkDocs</a>
and
<a href="https://squidfunk.github.io/mkdocs-material/">
Material for MkDocs</a>
</div>
<div class="md-footer-social">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<link rel="stylesheet" href="assets/fonts/font-awesome.css">
<a href="https://github.com/Hieromon" class="md-footer-social__link fa fa-github"></a>
@ -485,23 +771,17 @@ IN THE SOFTWARE.</p>
</div>
</div>
</div>
</footer>
</div>
<script src="../assets/javascripts/application.8eb9be28.js"></script>
<script>app.initialize({version:"0.17.3",url:{base:".."}})</script>
<script src="assets/javascripts/application.b806dc00.js"></script>
<script src="../js/gifffer.min.js"></script>
<script>app.initialize({version:"1.0.4",url:{base:"."}})</script>
<script>!function(e,a,t,n,o,c,i){e.GoogleAnalyticsObject=o,e.ga=e.ga||function(){(e.ga.q=e.ga.q||[]).push(arguments)},e.ga.l=1*new Date,c=a.createElement(t),i=a.getElementsByTagName(t)[0],c.async=1,c.src="https://www.google-analytics.com/analytics.js",i.parentNode.insertBefore(c,i)}(window,document,"script",0,"ga"),ga("create","UA-116150854-1","auto"),ga("set","anonymizeIp",!0),ga("send","pageview");var links=document.getElementsByTagName("a");if(Array.prototype.map.call(links,function(e){e.host!=document.location.host&&e.addEventListener("click",function(){var a=e.getAttribute("data-md-action")||"follow";ga("send","event","outbound",a,e.href)})}),document.forms.search){var query=document.forms.search.query;query.addEventListener("blur",function(){if(this.value){var e=document.location.pathname;ga("send","pageview",e+"?q="+this.value)}})}</script>
<script src="js/gifffer.min.js"></script>
</body>

@ -0,0 +1,867 @@
<!doctype html>
<html lang="en" class="no-js">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
<meta http-equiv="x-ua-compatible" content="ie=edge">
<meta name="description" content="ESP8266/ESP32 WLAN configuration at run time with web interface">
<link rel="canonical" href="https://Hieromon.github.io/AutoConnect/lsbegin.html">
<meta name="author" content="Hieromon Ikasamo">
<meta name="lang:clipboard.copy" content="Copy to clipboard">
<meta name="lang:clipboard.copied" content="Copied to clipboard">
<meta name="lang:search.language" content="en">
<meta name="lang:search.pipeline.stopwords" content="True">
<meta name="lang:search.pipeline.trimmer" content="True">
<meta name="lang:search.result.none" content="No matching documents">
<meta name="lang:search.result.one" content="1 matching document">
<meta name="lang:search.result.other" content="# matching documents">
<meta name="lang:search.tokenizer" content="[\s\-]+">
<link rel="shortcut icon" href="assets/images/favicon.png">
<meta name="generator" content="mkdocs-1.0.4, mkdocs-material-4.0.1">
<title>Appendix - AutoConnect for ESP8266/ESP32</title>
<link rel="stylesheet" href="assets/stylesheets/application.982221ab.css">
<link rel="stylesheet" href="assets/stylesheets/application-palette.224b79ff.css">
<meta name="theme-color" content="#3f51b5">
<script src="assets/javascripts/modernizr.1f0bcf2b.js"></script>
<link href="https://fonts.gstatic.com" rel="preconnect" crossorigin>
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,400,400i,700|Roboto+Mono">
<style>body,input{font-family:"Roboto","Helvetica Neue",Helvetica,Arial,sans-serif}code,kbd,pre{font-family:"Roboto Mono","Courier New",Courier,monospace}</style>
<link rel="stylesheet" href="assets/fonts/material-icons.css">
<link rel="stylesheet" href="css/paragraph.css">
<link rel="stylesheet" href="css/extra.css">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.6.1/css/all.css">
<script>
window.ga = window.ga || function() {
(ga.q = ga.q || []).push(arguments)
}
ga.l = +new Date
/* Setup integration and send page view */
ga("create", "UA-116150854-1", "auto")
ga("set", "anonymizeIp", true)
ga("send", "pageview")
/* Register handler to log search on blur */
document.addEventListener("DOMContentLoaded", () => {
if (document.forms.search) {
var query = document.forms.search.query
query.addEventListener("blur", function() {
if (this.value) {
var path = document.location.pathname;
ga("send", "pageview", path + "?q=" + this.value)
}
})
}
})
</script>
<script async src="https://www.google-analytics.com/analytics.js"></script>
</head>
<body dir="ltr" data-md-color-primary="indigo" data-md-color-accent="indigo">
<svg class="md-svg">
<defs>
<svg xmlns="http://www.w3.org/2000/svg" width="416" height="448"
viewBox="0 0 416 448" id="__github">
<path fill="currentColor" d="M160 304q0 10-3.125 20.5t-10.75 19-18.125
8.5-18.125-8.5-10.75-19-3.125-20.5 3.125-20.5 10.75-19 18.125-8.5
18.125 8.5 10.75 19 3.125 20.5zM320 304q0 10-3.125 20.5t-10.75
19-18.125 8.5-18.125-8.5-10.75-19-3.125-20.5 3.125-20.5 10.75-19
18.125-8.5 18.125 8.5 10.75 19 3.125 20.5zM360
304q0-30-17.25-51t-46.75-21q-10.25 0-48.75 5.25-17.75 2.75-39.25
2.75t-39.25-2.75q-38-5.25-48.75-5.25-29.5 0-46.75 21t-17.25 51q0 22 8
38.375t20.25 25.75 30.5 15 35 7.375 37.25 1.75h42q20.5 0
37.25-1.75t35-7.375 30.5-15 20.25-25.75 8-38.375zM416 260q0 51.75-15.25
82.75-9.5 19.25-26.375 33.25t-35.25 21.5-42.5 11.875-42.875 5.5-41.75
1.125q-19.5 0-35.5-0.75t-36.875-3.125-38.125-7.5-34.25-12.875-30.25-20.25-21.5-28.75q-15.5-30.75-15.5-82.75
0-59.25 34-99-6.75-20.5-6.75-42.5 0-29 12.75-54.5 27 0 47.5 9.875t47.25
30.875q36.75-8.75 77.25-8.75 37 0 70 8 26.25-20.5
46.75-30.25t47.25-9.75q12.75 25.5 12.75 54.5 0 21.75-6.75 42 34 40 34
99.5z" />
</svg>
</defs>
</svg>
<input class="md-toggle" data-md-toggle="drawer" type="checkbox" id="__drawer" autocomplete="off">
<input class="md-toggle" data-md-toggle="search" type="checkbox" id="__search" autocomplete="off">
<label class="md-overlay" data-md-component="overlay" for="__drawer"></label>
<a href="#autoconnectbegin-logic-sequence" tabindex="1" class="md-skip">
Skip to content
</a>
<header class="md-header" data-md-component="header">
<nav class="md-header-nav md-grid">
<div class="md-flex">
<div class="md-flex__cell md-flex__cell--shrink">
<a href="https://Hieromon.github.io/AutoConnect/" title="AutoConnect for ESP8266/ESP32" class="md-header-nav__button md-logo">
<img src="images/arduino-logo.svg" width="24" height="24">
</a>
</div>
<div class="md-flex__cell md-flex__cell--shrink">
<label class="md-icon md-icon--menu md-header-nav__button" for="__drawer"></label>
</div>
<div class="md-flex__cell md-flex__cell--stretch">
<div class="md-flex__ellipsis md-header-nav__title" data-md-component="title">
<span class="md-header-nav__topic">
AutoConnect for ESP8266/ESP32
</span>
<span class="md-header-nav__topic">
Appendix
</span>
</div>
</div>
<div class="md-flex__cell md-flex__cell--shrink">
<label class="md-icon md-icon--search md-header-nav__button" for="__search"></label>
<div class="md-search" data-md-component="search" role="dialog">
<label class="md-search__overlay" for="__search"></label>
<div class="md-search__inner" role="search">
<form class="md-search__form" name="search">
<input type="text" class="md-search__input" name="query" placeholder="Search" autocapitalize="off" autocorrect="off" autocomplete="off" spellcheck="false" data-md-component="query" data-md-state="active">
<label class="md-icon md-search__icon" for="__search"></label>
<button type="reset" class="md-icon md-search__icon" data-md-component="reset" tabindex="-1">
&#xE5CD;
</button>
</form>
<div class="md-search__output">
<div class="md-search__scrollwrap" data-md-scrollfix>
<div class="md-search-result" data-md-component="result">
<div class="md-search-result__meta">
Type to start searching
</div>
<ol class="md-search-result__list"></ol>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="md-flex__cell md-flex__cell--shrink">
<div class="md-header-nav__source">
<a href="https://github.com/Hieromon/AutoConnect" title="Go to repository" class="md-source" data-md-source="github">
<div class="md-source__icon">
<svg viewBox="0 0 24 24" width="24" height="24">
<use xlink:href="#__github" width="24" height="24"></use>
</svg>
</div>
<div class="md-source__repository">
Hieromon/AutoConnect
</div>
</a>
</div>
</div>
</div>
</nav>
</header>
<div class="md-container">
<nav class="md-tabs" data-md-component="tabs">
<div class="md-tabs__inner md-grid">
<ul class="md-tabs__list">
<li class="md-tabs__item">
<a href="index.html" title="Overview" class="md-tabs__link md-tabs__link--active">
Overview
</a>
</li>
<li class="md-tabs__item">
<a href="acintro.html" title="Custom Web pages" class="md-tabs__link">
Custom Web pages
</a>
</li>
<li class="md-tabs__item">
<a href="api.html" title="Library APIs" class="md-tabs__link">
Library APIs
</a>
</li>
<li class="md-tabs__item">
<a href="howtoembed.html" title="Examples" class="md-tabs__link">
Examples
</a>
</li>
</ul>
</div>
</nav>
<main class="md-main">
<div class="md-main__inner md-grid" data-md-component="container">
<div class="md-sidebar md-sidebar--primary" data-md-component="navigation">
<div class="md-sidebar__scrollwrap">
<div class="md-sidebar__inner">
<nav class="md-nav md-nav--primary" data-md-level="0">
<label class="md-nav__title md-nav__title--site" for="__drawer">
<a href="https://Hieromon.github.io/AutoConnect/" title="AutoConnect for ESP8266/ESP32" class="md-nav__button md-logo">
<img src="images/arduino-logo.svg" width="48" height="48">
</a>
AutoConnect for ESP8266/ESP32
</label>
<div class="md-nav__source">
<a href="https://github.com/Hieromon/AutoConnect" title="Go to repository" class="md-source" data-md-source="github">
<div class="md-source__icon">
<svg viewBox="0 0 24 24" width="24" height="24">
<use xlink:href="#__github" width="24" height="24"></use>
</svg>
</div>
<div class="md-source__repository">
Hieromon/AutoConnect
</div>
</a>
</div>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="index.html" title="Overview" class="md-nav__link">
Overview
</a>
</li>
<li class="md-nav__item">
<a href="gettingstarted.html" title="Getting started" class="md-nav__link">
Getting started
</a>
</li>
<li class="md-nav__item">
<a href="menu.html" title="AutoConnect menu" class="md-nav__link">
AutoConnect menu
</a>
</li>
<li class="md-nav__item">
<a href="basicusage.html" title="Basic usage" class="md-nav__link">
Basic usage
</a>
</li>
<li class="md-nav__item">
<a href="advancedusage.html" title="Advanced usage" class="md-nav__link">
Advanced usage
</a>
</li>
<li class="md-nav__item md-nav__item--nested">
<input class="md-toggle md-nav__toggle" data-md-toggle="nav-6" type="checkbox" id="nav-6">
<label class="md-nav__link" for="nav-6">
Custom Web pages
</label>
<nav class="md-nav" data-md-component="collapsible" data-md-level="1">
<label class="md-nav__title" for="nav-6">
Custom Web pages
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="acintro.html" title="Custom Web pages with AutoConnect" class="md-nav__link">
Custom Web pages with AutoConnect
</a>
</li>
<li class="md-nav__item">
<a href="acelements.html" title="AutoConnectElements" class="md-nav__link">
AutoConnectElements
</a>
</li>
<li class="md-nav__item">
<a href="acjson.html" title="Custom Web pages with JSON" class="md-nav__link">
Custom Web pages with JSON
</a>
</li>
<li class="md-nav__item">
<a href="achandling.html" title="Handling the custom Web pages" class="md-nav__link">
Handling the custom Web pages
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item md-nav__item--nested">
<input class="md-toggle md-nav__toggle" data-md-toggle="nav-7" type="checkbox" id="nav-7">
<label class="md-nav__link" for="nav-7">
Library APIs
</label>
<nav class="md-nav" data-md-component="collapsible" data-md-level="1">
<label class="md-nav__title" for="nav-7">
Library APIs
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="api.html" title="AutoConnect API" class="md-nav__link">
AutoConnect API
</a>
</li>
<li class="md-nav__item">
<a href="apiaux.html" title="AutoConnectAux API" class="md-nav__link">
AutoConnectAux API
</a>
</li>
<li class="md-nav__item">
<a href="apiconfig.html" title="AutoConnectConfig API" class="md-nav__link">
AutoConnectConfig API
</a>
</li>
<li class="md-nav__item">
<a href="apielements.html" title="AutoConnectElements API" class="md-nav__link">
AutoConnectElements API
</a>
</li>
<li class="md-nav__item">
<a href="apiextra.html" title="Something extra" class="md-nav__link">
Something extra
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item md-nav__item--nested">
<input class="md-toggle md-nav__toggle" data-md-toggle="nav-8" type="checkbox" id="nav-8">
<label class="md-nav__link" for="nav-8">
Examples
</label>
<nav class="md-nav" data-md-component="collapsible" data-md-level="1">
<label class="md-nav__title" for="nav-8">
Examples
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="howtoembed.html" title="How to embed" class="md-nav__link">
How to embed
</a>
</li>
<li class="md-nav__item">
<a href="datatips.html" title="Tips for data conversion" class="md-nav__link">
Tips for data conversion
</a>
</li>
<li class="md-nav__item">
<a href="menuize.html" title="Attach the menu" class="md-nav__link">
Attach the menu
</a>
</li>
<li class="md-nav__item">
<a href="wojson.html" title="Custom Web pages w/o JSON" class="md-nav__link">
Custom Web pages w/o JSON
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item md-nav__item--active">
<input class="md-toggle md-nav__toggle" data-md-toggle="toc" type="checkbox" id="__toc">
<label class="md-nav__link md-nav__link--active" for="__toc">
Appendix
</label>
<a href="lsbegin.html" title="Appendix" class="md-nav__link md-nav__link--active">
Appendix
</a>
<nav class="md-nav md-nav--secondary">
<label class="md-nav__title" for="__toc">Table of contents</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="#autoconnectbegin-logic-sequence" title="AutoConnect::begin logic sequence" class="md-nav__link">
AutoConnect::begin logic sequence
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item">
<a href="faq.html" title="FAQ" class="md-nav__link">
FAQ
</a>
</li>
<li class="md-nav__item">
<a href="changelog.html" title="Change log" class="md-nav__link">
Change log
</a>
</li>
<li class="md-nav__item">
<a href="license.html" title="License" class="md-nav__link">
License
</a>
</li>
</ul>
</nav>
</div>
</div>
</div>
<div class="md-sidebar md-sidebar--secondary" data-md-component="toc">
<div class="md-sidebar__scrollwrap">
<div class="md-sidebar__inner">
<nav class="md-nav md-nav--secondary">
<label class="md-nav__title" for="__toc">Table of contents</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="#autoconnectbegin-logic-sequence" title="AutoConnect::begin logic sequence" class="md-nav__link">
AutoConnect::begin logic sequence
</a>
</li>
</ul>
</nav>
</div>
</div>
</div>
<div class="md-content">
<article class="md-content__inner md-typeset">
<h1>Appendix</h1>
<h2 id="autoconnectbegin-logic-sequence">AutoConnect::begin logic sequence<a class="headerlink" href="#autoconnectbegin-logic-sequence" title="Permanent link">&para;</a></h2>
<p>Several parameters as follows of <a href="apiconfig.html">AutoConnectConfig</a> affect the behavior of <a href="api.html#begin">AutoConnect::begin</a> function. Each parameter affects the behaves in interacted order with the priority and apply to the logic sequence of AutoConnect::begin.</p>
<ul>
<li><a href="apiconfig.html#immediatestart">immediateStart</a> : The captive portal start immediately, without first WiFi.begin.</li>
<li><a href="apiconfig.html#autoreconnect">autoReconenct</a> : Attempt re-connect with past SSID by saved credential.</li>
<li><a href="apiconfig.html#portaltimeout">portalTimeout</a> : Time out limit for the portal.</li>
<li><a href="apiconfig.html#retainportal">retainPortal</a> : Keep DNS server functioning for the captive portal.</li>
</ul>
<p>You can use these parameters in combination with sketch requirements and need to understand correctly the behavior caused by the parameters. The following chart shows the AutoConnect::begin logic sequence including the effect of these parameters.</p>
<p><img align="center" src="images/process_begin.svg"></p>
<p>For example, AutoConnect::begin will not exits without the <strong>portalTimeout</strong> while the connection not establishes, but WebServer will start to work. So, your sketch may work seemingly, but it will close with inside a loop of the AutoConnect::begin function. Especially when invoking AutoConnect::begin in the <strong>setup()</strong>, execution control does not pass to the <strong>loop()</strong>.</p>
<p>As different scenes, you may use the <strong>immediateStart</strong> effectively. Equipped the external switch to activate the captive portal with the ESP module, combined with the <strong>portalTime</strong> and the <strong>retainPortal</strong> it will become WiFi active connection feature. You can start AutoConnect::begin at any point in the <strong>loop()</strong>, which allows your sketch can behave both the offline mode and the online mode.</p>
<p>Please consider these kinds of influence when you make sketches.</p>
<div class="admonition info">
<p class="admonition-title">The AutoConnect::begin 3<sup>rd</sup> parameter</p>
<p>Another parameter as the <a href="api.html#begin">3<sup>rd</sup> parameter</a> of AutoConnect::begin related to timeout constrains the connection wait time after WiFi.begin. It is the <strong>CONNECTED</strong> judgment of the above chart that it has an effect.</p>
</div>
</article>
</div>
</div>
</main>
<footer class="md-footer">
<div class="md-footer-nav">
<nav class="md-footer-nav__inner md-grid">
<a href="wojson.html" title="Custom Web pages w/o JSON" class="md-flex md-footer-nav__link md-footer-nav__link--prev" rel="prev">
<div class="md-flex__cell md-flex__cell--shrink">
<i class="md-icon md-icon--arrow-back md-footer-nav__button"></i>
</div>
<div class="md-flex__cell md-flex__cell--stretch md-footer-nav__title">
<span class="md-flex__ellipsis">
<span class="md-footer-nav__direction">
Previous
</span>
Custom Web pages w/o JSON
</span>
</div>
</a>
<a href="faq.html" title="FAQ" class="md-flex md-footer-nav__link md-footer-nav__link--next" rel="next">
<div class="md-flex__cell md-flex__cell--stretch md-footer-nav__title">
<span class="md-flex__ellipsis">
<span class="md-footer-nav__direction">
Next
</span>
FAQ
</span>
</div>
<div class="md-flex__cell md-flex__cell--shrink">
<i class="md-icon md-icon--arrow-forward md-footer-nav__button"></i>
</div>
</a>
</nav>
</div>
<div class="md-footer-meta md-typeset">
<div class="md-footer-meta__inner md-grid">
<div class="md-footer-copyright">
<div class="md-footer-copyright__highlight">
Copyright &copy; 2018-2019 Hieromon Ikasamo
</div>
powered by
<a href="https://www.mkdocs.org">MkDocs</a>
and
<a href="https://squidfunk.github.io/mkdocs-material/">
Material for MkDocs</a>
</div>
<div class="md-footer-social">
<link rel="stylesheet" href="assets/fonts/font-awesome.css">
<a href="https://github.com/Hieromon" class="md-footer-social__link fa fa-github"></a>
<a href="https://twitter.com/hieromon" class="md-footer-social__link fa fa-twitter"></a>
</div>
</div>
</div>
</footer>
</div>
<script src="assets/javascripts/application.b806dc00.js"></script>
<script>app.initialize({version:"1.0.4",url:{base:"."}})</script>
<script src="js/gifffer.min.js"></script>
</body>
</html>

@ -2,7 +2,7 @@
<!DOCTYPE html>
<!doctype html>
<html lang="en" class="no-js">
<head>
@ -13,7 +13,7 @@
<meta name="description" content="ESP8266/ESP32 WLAN configuration at run time with web interface">
<link rel="canonical" href="https://Hieromon.github.io/AutoConnect/menu/index.html">
<link rel="canonical" href="https://Hieromon.github.io/AutoConnect/menu.html">
<meta name="author" content="Hieromon Ikasamo">
@ -37,8 +37,8 @@
<meta name="lang:search.tokenizer" content="[\s\-]+">
<link rel="shortcut icon" href="../assets/images/favicon.png">
<meta name="generator" content="mkdocs-0.17.3, mkdocs-material-2.7.0">
<link rel="shortcut icon" href="assets/images/favicon.png">
<meta name="generator" content="mkdocs-1.0.4, mkdocs-material-4.0.1">
@ -46,24 +46,62 @@
<link rel="stylesheet" href="../assets/stylesheets/application.78aab2dc.css">
<link rel="stylesheet" href="assets/stylesheets/application.982221ab.css">
<link rel="stylesheet" href="../assets/stylesheets/application-palette.6079476c.css">
<link rel="stylesheet" href="assets/stylesheets/application-palette.224b79ff.css">
<meta name="theme-color" content="#3f51b5">
<script src="../assets/javascripts/modernizr.1aa3b519.js"></script>
<script src="assets/javascripts/modernizr.1f0bcf2b.js"></script>
<link href="https://fonts.gstatic.com" rel="preconnect" crossorigin>
<link href="https://fonts.gstatic.com" rel="preconnect" crossorigin>
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,400,400i,700|Roboto+Mono">
<style>body,input{font-family:"Roboto","Helvetica Neue",Helvetica,Arial,sans-serif}code,kbd,pre{font-family:"Roboto Mono","Courier New",Courier,monospace}</style>
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
<link rel="stylesheet" href="assets/fonts/material-icons.css">
<link rel="stylesheet" href="../css/paragraph.css">
<link rel="stylesheet" href="css/paragraph.css">
<link rel="stylesheet" href="css/extra.css">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.6.1/css/all.css">
<script>
window.ga = window.ga || function() {
(ga.q = ga.q || []).push(arguments)
}
ga.l = +new Date
/* Setup integration and send page view */
ga("create", "UA-116150854-1", "auto")
ga("set", "anonymizeIp", true)
ga("send", "pageview")
/* Register handler to log search on blur */
document.addEventListener("DOMContentLoaded", () => {
if (document.forms.search) {
var query = document.forms.search.query
query.addEventListener("blur", function() {
if (this.value) {
var path = document.location.pathname;
ga("send", "pageview", path + "?q=" + this.value)
}
})
}
})
</script>
<script async src="https://www.google-analytics.com/analytics.js"></script>
</head>
@ -77,7 +115,7 @@
<svg xmlns="http://www.w3.org/2000/svg" width="416" height="448"
viewBox="0 0 416 448" id="github">
viewBox="0 0 416 448" id="__github">
<path fill="currentColor" d="M160 304q0 10-3.125 20.5t-10.75 19-18.125
8.5-18.125-8.5-10.75-19-3.125-20.5 3.125-20.5 10.75-19 18.125-8.5
18.125 8.5 10.75 19 3.125 20.5zM320 304q0 10-3.125 20.5t-10.75
@ -97,9 +135,9 @@
</defs>
</svg>
<input class="md-toggle" data-md-toggle="drawer" type="checkbox" id="drawer">
<input class="md-toggle" data-md-toggle="search" type="checkbox" id="search">
<label class="md-overlay" data-md-component="overlay" for="drawer"></label>
<input class="md-toggle" data-md-toggle="drawer" type="checkbox" id="__drawer" autocomplete="off">
<input class="md-toggle" data-md-toggle="search" type="checkbox" id="__search" autocomplete="off">
<label class="md-overlay" data-md-component="overlay" for="__drawer"></label>
<a href="#where-the-from" tabindex="1" class="md-skip">
Skip to content
@ -112,38 +150,35 @@
<div class="md-flex__cell md-flex__cell--shrink">
<a href="https://Hieromon.github.io/AutoConnect/" title="AutoConnect for ESP8266/ESP32" class="md-header-nav__button md-logo">
<img src="../images/arduino-logo.svg" width="24" height="24">
<img src="images/arduino-logo.svg" width="24" height="24">
</a>
</div>
<div class="md-flex__cell md-flex__cell--shrink">
<label class="md-icon md-icon--menu md-header-nav__button" for="drawer"></label>
<label class="md-icon md-icon--menu md-header-nav__button" for="__drawer"></label>
</div>
<div class="md-flex__cell md-flex__cell--stretch">
<div class="md-flex__ellipsis md-header-nav__title" data-md-component="title">
<span class="md-header-nav__topic">
AutoConnect for ESP8266/ESP32
</span>
<span class="md-header-nav__topic">
AutoConnect menu
</span>
<span class="md-header-nav__topic">
AutoConnect for ESP8266/ESP32
</span>
<span class="md-header-nav__topic">
AutoConnect menu
</span>
</div>
</div>
<div class="md-flex__cell md-flex__cell--shrink">
<label class="md-icon md-icon--search md-header-nav__button" for="__search"></label>
<label class="md-icon md-icon--search md-header-nav__button" for="search"></label>
<div class="md-search" data-md-component="search" role="dialog">
<label class="md-search__overlay" for="search"></label>
<label class="md-search__overlay" for="__search"></label>
<div class="md-search__inner" role="search">
<form class="md-search__form" name="search">
<input type="text" class="md-search__input" name="query" placeholder="Search" autocapitalize="off" autocorrect="off" autocomplete="off" spellcheck="false" data-md-component="query" data-md-state="active">
<label class="md-icon md-search__icon" for="search"></label>
<label class="md-icon md-search__icon" for="__search"></label>
<button type="reset" class="md-icon md-search__icon" data-md-component="reset" tabindex="-1">
&#xE5CD;
</button>
@ -160,7 +195,6 @@
</div>
</div>
</div>
</div>
@ -171,20 +205,18 @@
<a href="https://github.com/Hieromon/AutoConnect" title="Go to repository" class="md-source" data-md-source="github">
<div class="md-source__icon">
<svg viewBox="0 0 24 24" width="24" height="24">
<use xlink:href="#github" width="24" height="24"></use>
</svg>
</div>
<div class="md-source__repository">
Hieromon/AutoConnect
<a href="https://github.com/Hieromon/AutoConnect" title="Go to repository" class="md-source" data-md-source="github">
<div class="md-source__icon">
<svg viewBox="0 0 24 24" width="24" height="24">
<use xlink:href="#__github" width="24" height="24"></use>
</svg>
</div>
</a>
<div class="md-source__repository">
Hieromon/AutoConnect
</div>
</a>
</div>
</div>
@ -206,7 +238,7 @@
<li class="md-tabs__item">
<a href="../index.html" title="Overview" class="md-tabs__link md-tabs__link--active">
<a href="index.html" title="Overview" class="md-tabs__link md-tabs__link--active">
Overview
</a>
@ -222,6 +254,43 @@
<li class="md-tabs__item">
<a href="acintro.html" title="Custom Web pages" class="md-tabs__link">
Custom Web pages
</a>
</li>
<li class="md-tabs__item">
<a href="api.html" title="Library APIs" class="md-tabs__link">
Library APIs
</a>
</li>
<li class="md-tabs__item">
<a href="howtoembed.html" title="Examples" class="md-tabs__link">
Examples
</a>
</li>
@ -243,12 +312,12 @@
<div class="md-sidebar__scrollwrap">
<div class="md-sidebar__inner">
<nav class="md-nav md-nav--primary" data-md-level="0">
<label class="md-nav__title md-nav__title--site" for="drawer">
<span class="md-nav__button md-logo">
<label class="md-nav__title md-nav__title--site" for="__drawer">
<a href="https://Hieromon.github.io/AutoConnect/" title="AutoConnect for ESP8266/ESP32" class="md-nav__button md-logo">
<img src="../images/arduino-logo.svg" width="48" height="48">
<img src="images/arduino-logo.svg" width="48" height="48">
</span>
</a>
AutoConnect for ESP8266/ESP32
</label>
@ -258,20 +327,18 @@
<a href="https://github.com/Hieromon/AutoConnect" title="Go to repository" class="md-source" data-md-source="github">
<div class="md-source__icon">
<svg viewBox="0 0 24 24" width="24" height="24">
<use xlink:href="#github" width="24" height="24"></use>
</svg>
</div>
<div class="md-source__repository">
Hieromon/AutoConnect
<a href="https://github.com/Hieromon/AutoConnect" title="Go to repository" class="md-source" data-md-source="github">
<div class="md-source__icon">
<svg viewBox="0 0 24 24" width="24" height="24">
<use xlink:href="#__github" width="24" height="24"></use>
</svg>
</div>
</a>
<div class="md-source__repository">
Hieromon/AutoConnect
</div>
</a>
</div>
<ul class="md-nav__list" data-md-scrollfix>
@ -282,7 +349,7 @@
<li class="md-nav__item">
<a href="../index.html" title="Overview" class="md-nav__link">
<a href="index.html" title="Overview" class="md-nav__link">
Overview
</a>
</li>
@ -294,7 +361,7 @@
<li class="md-nav__item">
<a href="../gettingstarted/index.html" title="Getting started" class="md-nav__link">
<a href="gettingstarted.html" title="Getting started" class="md-nav__link">
Getting started
</a>
</li>
@ -309,14 +376,14 @@
<li class="md-nav__item md-nav__item--active">
<input class="md-toggle md-nav__toggle" data-md-toggle="toc" type="checkbox" id="toc">
<input class="md-toggle md-nav__toggle" data-md-toggle="toc" type="checkbox" id="__toc">
<label class="md-nav__link md-nav__link--active" for="toc">
<label class="md-nav__link md-nav__link--active" for="__toc">
AutoConnect menu
</label>
<a href="index.html" title="AutoConnect menu" class="md-nav__link md-nav__link--active">
<a href="menu.html" title="AutoConnect menu" class="md-nav__link md-nav__link--active">
AutoConnect menu
</a>
@ -325,7 +392,7 @@
<label class="md-nav__title" for="toc">Table of contents</label>
<label class="md-nav__title" for="__toc">Table of contents</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
@ -370,6 +437,27 @@
</li>
<li class="md-nav__item">
<a href="#custom-menu-items" title=" Custom menu items" class="md-nav__link">
Custom menu items
</a>
</li>
<li class="md-nav__item">
<a href="#home" title=" HOME" class="md-nav__link">
HOME
</a>
</li>
<li class="md-nav__item">
<a href="#by-attaching-autoconnect-menu" title=" by attaching AutoConnect menu" class="md-nav__link">
by attaching AutoConnect menu
</a>
</li>
@ -387,7 +475,7 @@
<li class="md-nav__item">
<a href="../basicusage/index.html" title="Basic usage" class="md-nav__link">
<a href="basicusage.html" title="Basic usage" class="md-nav__link">
Basic usage
</a>
</li>
@ -399,7 +487,7 @@
<li class="md-nav__item">
<a href="../advancedusage/index.html" title="Advanced usage" class="md-nav__link">
<a href="advancedusage.html" title="Advanced usage" class="md-nav__link">
Advanced usage
</a>
</li>
@ -410,24 +498,228 @@
<li class="md-nav__item md-nav__item--nested">
<input class="md-toggle md-nav__toggle" data-md-toggle="nav-6" type="checkbox" id="nav-6">
<label class="md-nav__link" for="nav-6">
Custom Web pages
</label>
<nav class="md-nav" data-md-component="collapsible" data-md-level="1">
<label class="md-nav__title" for="nav-6">
Custom Web pages
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="../api/index.html" title="Library APIs" class="md-nav__link">
Library APIs
<a href="acintro.html" title="Custom Web pages with AutoConnect" class="md-nav__link">
Custom Web pages with AutoConnect
</a>
</li>
<li class="md-nav__item">
<a href="acelements.html" title="AutoConnectElements" class="md-nav__link">
AutoConnectElements
</a>
</li>
<li class="md-nav__item">
<a href="acjson.html" title="Custom Web pages with JSON" class="md-nav__link">
Custom Web pages with JSON
</a>
</li>
<li class="md-nav__item">
<a href="achandling.html" title="Handling the custom Web pages" class="md-nav__link">
Handling the custom Web pages
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item md-nav__item--nested">
<input class="md-toggle md-nav__toggle" data-md-toggle="nav-7" type="checkbox" id="nav-7">
<label class="md-nav__link" for="nav-7">
Library APIs
</label>
<nav class="md-nav" data-md-component="collapsible" data-md-level="1">
<label class="md-nav__title" for="nav-7">
Library APIs
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="api.html" title="AutoConnect API" class="md-nav__link">
AutoConnect API
</a>
</li>
<li class="md-nav__item">
<a href="apiaux.html" title="AutoConnectAux API" class="md-nav__link">
AutoConnectAux API
</a>
</li>
<li class="md-nav__item">
<a href="apiconfig.html" title="AutoConnectConfig API" class="md-nav__link">
AutoConnectConfig API
</a>
</li>
<li class="md-nav__item">
<a href="apielements.html" title="AutoConnectElements API" class="md-nav__link">
AutoConnectElements API
</a>
</li>
<li class="md-nav__item">
<a href="../examples/index.html" title="Examples" class="md-nav__link">
<a href="apiextra.html" title="Something extra" class="md-nav__link">
Something extra
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item md-nav__item--nested">
<input class="md-toggle md-nav__toggle" data-md-toggle="nav-8" type="checkbox" id="nav-8">
<label class="md-nav__link" for="nav-8">
Examples
</label>
<nav class="md-nav" data-md-component="collapsible" data-md-level="1">
<label class="md-nav__title" for="nav-8">
Examples
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="howtoembed.html" title="How to embed" class="md-nav__link">
How to embed
</a>
</li>
<li class="md-nav__item">
<a href="datatips.html" title="Tips for data conversion" class="md-nav__link">
Tips for data conversion
</a>
</li>
<li class="md-nav__item">
<a href="menuize.html" title="Attach the menu" class="md-nav__link">
Attach the menu
</a>
</li>
<li class="md-nav__item">
<a href="wojson.html" title="Custom Web pages w/o JSON" class="md-nav__link">
Custom Web pages w/o JSON
</a>
</li>
</ul>
</nav>
</li>
@ -435,7 +727,19 @@
<li class="md-nav__item">
<a href="../faq/index.html" title="FAQ" class="md-nav__link">
<a href="lsbegin.html" title="Appendix" class="md-nav__link">
Appendix
</a>
</li>
<li class="md-nav__item">
<a href="faq.html" title="FAQ" class="md-nav__link">
FAQ
</a>
</li>
@ -447,7 +751,7 @@
<li class="md-nav__item">
<a href="../changelog/index.html" title="Change log" class="md-nav__link">
<a href="changelog.html" title="Change log" class="md-nav__link">
Change log
</a>
</li>
@ -459,7 +763,7 @@
<li class="md-nav__item">
<a href="../license/index.html" title="License" class="md-nav__link">
<a href="license.html" title="License" class="md-nav__link">
License
</a>
</li>
@ -480,7 +784,7 @@
<label class="md-nav__title" for="toc">Table of contents</label>
<label class="md-nav__title" for="__toc">Table of contents</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
@ -525,6 +829,27 @@
</li>
<li class="md-nav__item">
<a href="#custom-menu-items" title=" Custom menu items" class="md-nav__link">
Custom menu items
</a>
</li>
<li class="md-nav__item">
<a href="#home" title=" HOME" class="md-nav__link">
HOME
</a>
</li>
<li class="md-nav__item">
<a href="#by-attaching-autoconnect-menu" title=" by attaching AutoConnect menu" class="md-nav__link">
by attaching AutoConnect menu
</a>
</li>
@ -546,11 +871,11 @@
<div class="admonition info">
<p class="admonition-title">Luxbar</p>
<p>The AutoConnect menu is developed using the <a href="https://github.com/balzss/luxbar">LuxBar</a> which is licensed under the MIT License. See the <a href="../license/index.html">License</a>.</p>
<p>The AutoConnect menu is developed using the <a href="https://github.com/balzss/luxbar">LuxBar</a> which is licensed under the MIT License. See the <a href="license.html">License</a>.</p>
</div>
<h2 id="where-the-from"><i class="fa fa-external-link"></i> Where the from<a class="headerlink" href="#where-the-from" title="Permanent link">&para;</a></h2>
<p>The AutoConnect menu appears when you access the <strong>AutoConnect root path</strong>. It is assigned "<strong>/_ac</strong>" located on the <em>local IP address</em> of ESP8266/ESP32 module by default. This location can be changed in the sketch. The following screen will appear at access to <code class="codehilite">http://{localIP}/_ac</code> as the root path. This is the statistics of the current WiFi connection. You can access the menu from the here, to invoke it tap <i class="fa fa-bars"></i> at right on top. (e.g. <code class="codehilite">http://192.168.244.1/_ac</code> for SoftAP mode.)</p>
<p><img src="../images/ac.png" style="border-style:solid;border-width:1px;border-color:lightgrey;width:280px;" /></p>
<p>The AutoConnect menu appears when you access the <strong>AutoConnect root path</strong>. It is assigned "<strong>/_ac</strong>" located on the <em>local IP address</em> of ESP8266/ESP32 module by default. This location can be changed in the sketch. The following screen will appear at access to <code>http://{localIP}/_ac</code> as the root path. This is the statistics of the current WiFi connection. You can access the menu from the here, to invoke it tap <i class="fa fa-bars"></i> at right on top. (e.g. <code>http://192.168.244.1/_ac</code> for SoftAP mode.)</p>
<p><img src="images/ac.png" style="border-style:solid;border-width:1px;border-color:lightgrey;width:280px;" /></p>
<div class="admonition note">
<p class="admonition-title">What's the local IP?</p>
<p>A local IP means Local IP at connection established or SoftAP's IP.</p>
@ -564,30 +889,46 @@
<li><strong>Reset...</strong>: Rest the ESP8266/ESP32 module.</li>
<li><strong>HOME</strong>: Return to user home page.</li>
</ul>
<p><img src="../images/menu.png" style="width:280px;" /></p>
<p><img src="images/menu.png" style="width:280px;" /></p>
<h2 id="configure-new-ap"><i class="fa fa-bars"></i> Configure new AP<a class="headerlink" href="#configure-new-ap" title="Permanent link">&para;</a></h2>
<p>Scan all available access point in the vicinity and display it. Strength and security of the detected AP are marked. The <i class="fa fa-lock"></i> is indicated for the SSID that needs a security key. "<strong>Hidden:</strong>" means the number of hidden SSIDs discovered.<br />
Enter SSID and Passphrase and tap "<strong>apply</strong>" to starts WiFi connection. </p>
<p><img src="../images/newap.png" style="border-style:solid;border-width:1px;border-color:lightgrey;width:280px;" /></p>
<p><img src="images/newap.png" style="border-style:solid;border-width:1px;border-color:lightgrey;width:280px;" /></p>
<h2 id="open-ssids"><i class="fa fa-bars"></i> Open SSIDs<a class="headerlink" href="#open-ssids" title="Permanent link">&para;</a></h2>
<p>Once it was established WiFi connection, its SSID and password will be saved in EEPROM of ESP8266/ESP32 automatically. The <strong>Open SSIDs</strong> menu reads the saved SSID credentials from the EEPROM. The stored credential data are listed by the SSID as shown below. Its label is a clickable button. Tap the SSID button, starts WiFi connection it.</p>
<p><img src="../images/open.png" style="border-style:solid;border-width:1px;border-color:lightgrey;width:280px;" /></p>
<p><img src="images/open.png" style="border-style:solid;border-width:1px;border-color:lightgrey;width:280px;" /></p>
<h2 id="disconnect"><i class="fa fa-bars"></i> Disconnect<a class="headerlink" href="#disconnect" title="Permanent link">&para;</a></h2>
<p>Disconnect ESP8266/ESP32 from the current connection. It can also reset the ESP8266/ESP32 automatically after disconnection by instructing with using <a href="../api/index.html#autoreset">API</a> in the sketch.</p>
<p>Disconnect ESP8266/ESP32 from the current connection. It can also reset the ESP8266/ESP32 automatically after disconnection by instructing with using <a href="api.html#autoreset">API</a> in the sketch.</p>
<p>After tapping "Disconnect", you will not be able to reach the AutoConnect menu. Once disconnected, you will need to set the SSID again for connecting the WLAN. </p>
<h2 id="reset"><i class="fa fa-bars"></i> Reset...<a class="headerlink" href="#reset" title="Permanent link">&para;</a></h2>
<p>Reset the ESP8266/ESP32 module, it will start rebooting. After rebooting complete, the ESP8266/ESP32 module begins establishing the previous connection with WIFI_STA mode, and <em>esp8266ap</em> or <em>esp32ap</em> of an access point will disappear from WLAN.</p>
<p><img src="../images/resetting.png" style="width:280px;" /></p>
<p><img src="images/resetting.png" style="width:280px;" /></p>
<div class="admonition warning">
<p class="admonition-title">Not every ESP8266 module will be rebooted normally</p>
<p>The Reset menu is using the <strong>ESP.reset()</strong> function for ESP8266. This is an almost hardware reset. In order to resume the sketch normally, the <a href="https://github.com/esp8266/esp8266-wiki/wiki/Boot-Process#esp-boot-modes">state of GPIO0</a> is important. Since this depends on the circuit implementation for each module, not every module will be rebooted normally. See also <a href="../faq/index.html#hang-up-after-reset">FAQ</a>.</p>
<p>The Reset menu is using the <strong>ESP.reset()</strong> function for ESP8266. This is an almost hardware reset. In order to resume the sketch normally, the <a href="https://github.com/esp8266/esp8266-wiki/wiki/Boot-Process#esp-boot-modes">state of GPIO0</a> is important. Since this depends on the circuit implementation for each module, not every module will be rebooted normally. See also <a href="faq.html#hang-up-after-reset">FAQ</a>.</p>
</div>
<h2 id="custom-menu-items"><i class="fa fa-bars"></i> Custom menu items<a class="headerlink" href="#custom-menu-items" title="Permanent link">&para;</a></h2>
<p>The menu items of the custom Web page line up at the below in the AutoConnect menu if the custom Web pages are joined. Details for <a href="acintro.html#custom-web-pages-in-autoconnectmenu">Custom Web pages in AutoConnect menu</a>.</p>
<h2 id="home"><i class="fa fa-bars"></i> HOME<a class="headerlink" href="#home" title="Permanent link">&para;</a></h2>
<p>A <strong>HOME</strong> item located at the bottom of the menu list is a link to the home path. The URI as the home path is <code>/</code> by default, and it is defined by <code>AUTOCONNECT_HOMEURI</code> with <strong>AutoConnectDefs.h</strong> file.</p>
<div class="codehilite" style="background: #272822"><pre style="line-height: 125%"><span></span><span style="color: #75715e">#define AUTOCONNECT_HOMEURI &quot;/&quot;</span>
</pre></div>
<p>You can change the HOME path using the AutoConnect API. The <a href="api.html#home"><strong>AutoConnect::home</strong></a> function sets the URI as a link of the HOME item of the AutoConnect menu.</p>
<h2 id="by-attaching-autoconnect-menu"><i class="fa fa-bars"></i> by attaching AutoConnect menu<a class="headerlink" href="#by-attaching-autoconnect-menu" title="Permanent link">&para;</a></h2>
<p>The AutoConnect menu can contain HTML pages of your owns sketch as custom items. It works for HTML pages implemented by <strong>ESP8266WebServer::on</strong> handler or <strong>WebServer::on</strong> handler for ESP32. That is, you can make it as menu items to invoke the legacy web page. The below screenshot is the result of adding an example sketch for the ESP8266WebServer library known as <a href="https://github.com/esp8266/Arduino/tree/master/libraries/ESP8266WebServer/examples/FSBrowser">FSBrowser</a> to the AutoConnect menu item. It adds Edit and List items with little modification to the legacy sketch code.</p>
<div style="float:left;width:auto;height:420px;"><img style="width:auto;height:420px;" src="images/fsbmenu.png"></div>
<p><img style="margin-left:70px;width:auto;height:420px;" src="images/fsbmenu_expand.png"></p>
<p>You can extend the AutoConnect menu to improve the original sketches and according to the procedure described in section <a href="advancedusage.html#casts-the-html-pages-to-be-add-on-into-the-menu"><em>Advanced Usage</em></a>.</p>
</article>
</div>
@ -600,7 +941,7 @@ Enter SSID and Passphrase and tap "<strong>apply</strong>" to starts WiFi connec
<div class="md-footer-nav">
<nav class="md-footer-nav__inner md-grid">
<a href="../gettingstarted/index.html" title="Getting started" class="md-flex md-footer-nav__link md-footer-nav__link--prev" rel="prev">
<a href="gettingstarted.html" title="Getting started" class="md-flex md-footer-nav__link md-footer-nav__link--prev" rel="prev">
<div class="md-flex__cell md-flex__cell--shrink">
<i class="md-icon md-icon--arrow-back md-footer-nav__button"></i>
</div>
@ -615,7 +956,7 @@ Enter SSID and Passphrase and tap "<strong>apply</strong>" to starts WiFi connec
</a>
<a href="../basicusage/index.html" title="Basic usage" class="md-flex md-footer-nav__link md-footer-nav__link--next" rel="next">
<a href="basicusage.html" title="Basic usage" class="md-flex md-footer-nav__link md-footer-nav__link--next" rel="next">
<div class="md-flex__cell md-flex__cell--stretch md-footer-nav__title">
<span class="md-flex__ellipsis">
<span class="md-footer-nav__direction">
@ -637,20 +978,18 @@ Enter SSID and Passphrase and tap "<strong>apply</strong>" to starts WiFi connec
<div class="md-footer-copyright">
<div class="md-footer-copyright__highlight">
Copyright &copy; 2018 Hieromon Ikasamo
Copyright &copy; 2018-2019 Hieromon Ikasamo
</div>
powered by
<a href="http://www.mkdocs.org">MkDocs</a>
<a href="https://www.mkdocs.org">MkDocs</a>
and
<a href="https://squidfunk.github.io/mkdocs-material/">
Material for MkDocs</a>
</div>
<div class="md-footer-social">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<link rel="stylesheet" href="assets/fonts/font-awesome.css">
<a href="https://github.com/Hieromon" class="md-footer-social__link fa fa-github"></a>
@ -658,23 +997,17 @@ Enter SSID and Passphrase and tap "<strong>apply</strong>" to starts WiFi connec
</div>
</div>
</div>
</footer>
</div>
<script src="../assets/javascripts/application.8eb9be28.js"></script>
<script src="assets/javascripts/application.b806dc00.js"></script>
<script>app.initialize({version:"0.17.3",url:{base:".."}})</script>
<script src="../js/gifffer.min.js"></script>
<script>app.initialize({version:"1.0.4",url:{base:"."}})</script>
<script>!function(e,a,t,n,o,c,i){e.GoogleAnalyticsObject=o,e.ga=e.ga||function(){(e.ga.q=e.ga.q||[]).push(arguments)},e.ga.l=1*new Date,c=a.createElement(t),i=a.getElementsByTagName(t)[0],c.async=1,c.src="https://www.google-analytics.com/analytics.js",i.parentNode.insertBefore(c,i)}(window,document,"script",0,"ga"),ga("create","UA-116150854-1","auto"),ga("set","anonymizeIp",!0),ga("send","pageview");var links=document.getElementsByTagName("a");if(Array.prototype.map.call(links,function(e){e.host!=document.location.host&&e.addEventListener("click",function(){var a=e.getAttribute("data-md-action")||"follow";ga("send","event","outbound",a,e.href)})}),document.forms.search){var query=document.forms.search.query;query.addEventListener("blur",function(){if(this.value){var e=document.location.pathname;ga("send","pageview",e+"?q="+this.value)}})}</script>
<script src="js/gifffer.min.js"></script>
</body>

@ -0,0 +1,922 @@
<!doctype html>
<html lang="en" class="no-js">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
<meta http-equiv="x-ua-compatible" content="ie=edge">
<meta name="description" content="ESP8266/ESP32 WLAN configuration at run time with web interface">
<link rel="canonical" href="https://Hieromon.github.io/AutoConnect/menuize.html">
<meta name="author" content="Hieromon Ikasamo">
<meta name="lang:clipboard.copy" content="Copy to clipboard">
<meta name="lang:clipboard.copied" content="Copied to clipboard">
<meta name="lang:search.language" content="en">
<meta name="lang:search.pipeline.stopwords" content="True">
<meta name="lang:search.pipeline.trimmer" content="True">
<meta name="lang:search.result.none" content="No matching documents">
<meta name="lang:search.result.one" content="1 matching document">
<meta name="lang:search.result.other" content="# matching documents">
<meta name="lang:search.tokenizer" content="[\s\-]+">
<link rel="shortcut icon" href="assets/images/favicon.png">
<meta name="generator" content="mkdocs-1.0.4, mkdocs-material-4.0.1">
<title>Attach the menu - AutoConnect for ESP8266/ESP32</title>
<link rel="stylesheet" href="assets/stylesheets/application.982221ab.css">
<link rel="stylesheet" href="assets/stylesheets/application-palette.224b79ff.css">
<meta name="theme-color" content="#3f51b5">
<script src="assets/javascripts/modernizr.1f0bcf2b.js"></script>
<link href="https://fonts.gstatic.com" rel="preconnect" crossorigin>
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,400,400i,700|Roboto+Mono">
<style>body,input{font-family:"Roboto","Helvetica Neue",Helvetica,Arial,sans-serif}code,kbd,pre{font-family:"Roboto Mono","Courier New",Courier,monospace}</style>
<link rel="stylesheet" href="assets/fonts/material-icons.css">
<link rel="stylesheet" href="css/paragraph.css">
<link rel="stylesheet" href="css/extra.css">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.6.1/css/all.css">
<script>
window.ga = window.ga || function() {
(ga.q = ga.q || []).push(arguments)
}
ga.l = +new Date
/* Setup integration and send page view */
ga("create", "UA-116150854-1", "auto")
ga("set", "anonymizeIp", true)
ga("send", "pageview")
/* Register handler to log search on blur */
document.addEventListener("DOMContentLoaded", () => {
if (document.forms.search) {
var query = document.forms.search.query
query.addEventListener("blur", function() {
if (this.value) {
var path = document.location.pathname;
ga("send", "pageview", path + "?q=" + this.value)
}
})
}
})
</script>
<script async src="https://www.google-analytics.com/analytics.js"></script>
</head>
<body dir="ltr" data-md-color-primary="indigo" data-md-color-accent="indigo">
<svg class="md-svg">
<defs>
<svg xmlns="http://www.w3.org/2000/svg" width="416" height="448"
viewBox="0 0 416 448" id="__github">
<path fill="currentColor" d="M160 304q0 10-3.125 20.5t-10.75 19-18.125
8.5-18.125-8.5-10.75-19-3.125-20.5 3.125-20.5 10.75-19 18.125-8.5
18.125 8.5 10.75 19 3.125 20.5zM320 304q0 10-3.125 20.5t-10.75
19-18.125 8.5-18.125-8.5-10.75-19-3.125-20.5 3.125-20.5 10.75-19
18.125-8.5 18.125 8.5 10.75 19 3.125 20.5zM360
304q0-30-17.25-51t-46.75-21q-10.25 0-48.75 5.25-17.75 2.75-39.25
2.75t-39.25-2.75q-38-5.25-48.75-5.25-29.5 0-46.75 21t-17.25 51q0 22 8
38.375t20.25 25.75 30.5 15 35 7.375 37.25 1.75h42q20.5 0
37.25-1.75t35-7.375 30.5-15 20.25-25.75 8-38.375zM416 260q0 51.75-15.25
82.75-9.5 19.25-26.375 33.25t-35.25 21.5-42.5 11.875-42.875 5.5-41.75
1.125q-19.5 0-35.5-0.75t-36.875-3.125-38.125-7.5-34.25-12.875-30.25-20.25-21.5-28.75q-15.5-30.75-15.5-82.75
0-59.25 34-99-6.75-20.5-6.75-42.5 0-29 12.75-54.5 27 0 47.5 9.875t47.25
30.875q36.75-8.75 77.25-8.75 37 0 70 8 26.25-20.5
46.75-30.25t47.25-9.75q12.75 25.5 12.75 54.5 0 21.75-6.75 42 34 40 34
99.5z" />
</svg>
</defs>
</svg>
<input class="md-toggle" data-md-toggle="drawer" type="checkbox" id="__drawer" autocomplete="off">
<input class="md-toggle" data-md-toggle="search" type="checkbox" id="__search" autocomplete="off">
<label class="md-overlay" data-md-component="overlay" for="__drawer"></label>
<a href="#what-menus-can-be-made-using-autoconnect" tabindex="1" class="md-skip">
Skip to content
</a>
<header class="md-header" data-md-component="header">
<nav class="md-header-nav md-grid">
<div class="md-flex">
<div class="md-flex__cell md-flex__cell--shrink">
<a href="https://Hieromon.github.io/AutoConnect/" title="AutoConnect for ESP8266/ESP32" class="md-header-nav__button md-logo">
<img src="images/arduino-logo.svg" width="24" height="24">
</a>
</div>
<div class="md-flex__cell md-flex__cell--shrink">
<label class="md-icon md-icon--menu md-header-nav__button" for="__drawer"></label>
</div>
<div class="md-flex__cell md-flex__cell--stretch">
<div class="md-flex__ellipsis md-header-nav__title" data-md-component="title">
<span class="md-header-nav__topic">
AutoConnect for ESP8266/ESP32
</span>
<span class="md-header-nav__topic">
Attach the menu
</span>
</div>
</div>
<div class="md-flex__cell md-flex__cell--shrink">
<label class="md-icon md-icon--search md-header-nav__button" for="__search"></label>
<div class="md-search" data-md-component="search" role="dialog">
<label class="md-search__overlay" for="__search"></label>
<div class="md-search__inner" role="search">
<form class="md-search__form" name="search">
<input type="text" class="md-search__input" name="query" placeholder="Search" autocapitalize="off" autocorrect="off" autocomplete="off" spellcheck="false" data-md-component="query" data-md-state="active">
<label class="md-icon md-search__icon" for="__search"></label>
<button type="reset" class="md-icon md-search__icon" data-md-component="reset" tabindex="-1">
&#xE5CD;
</button>
</form>
<div class="md-search__output">
<div class="md-search__scrollwrap" data-md-scrollfix>
<div class="md-search-result" data-md-component="result">
<div class="md-search-result__meta">
Type to start searching
</div>
<ol class="md-search-result__list"></ol>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="md-flex__cell md-flex__cell--shrink">
<div class="md-header-nav__source">
<a href="https://github.com/Hieromon/AutoConnect" title="Go to repository" class="md-source" data-md-source="github">
<div class="md-source__icon">
<svg viewBox="0 0 24 24" width="24" height="24">
<use xlink:href="#__github" width="24" height="24"></use>
</svg>
</div>
<div class="md-source__repository">
Hieromon/AutoConnect
</div>
</a>
</div>
</div>
</div>
</nav>
</header>
<div class="md-container">
<nav class="md-tabs md-tabs--active" data-md-component="tabs">
<div class="md-tabs__inner md-grid">
<ul class="md-tabs__list">
<li class="md-tabs__item">
<a href="index.html" title="Overview" class="md-tabs__link">
Overview
</a>
</li>
<li class="md-tabs__item">
<a href="acintro.html" title="Custom Web pages" class="md-tabs__link">
Custom Web pages
</a>
</li>
<li class="md-tabs__item">
<a href="api.html" title="Library APIs" class="md-tabs__link">
Library APIs
</a>
</li>
<li class="md-tabs__item">
<a href="howtoembed.html" title="Examples" class="md-tabs__link md-tabs__link--active">
Examples
</a>
</li>
</ul>
</div>
</nav>
<main class="md-main">
<div class="md-main__inner md-grid" data-md-component="container">
<div class="md-sidebar md-sidebar--primary" data-md-component="navigation">
<div class="md-sidebar__scrollwrap">
<div class="md-sidebar__inner">
<nav class="md-nav md-nav--primary" data-md-level="0">
<label class="md-nav__title md-nav__title--site" for="__drawer">
<a href="https://Hieromon.github.io/AutoConnect/" title="AutoConnect for ESP8266/ESP32" class="md-nav__button md-logo">
<img src="images/arduino-logo.svg" width="48" height="48">
</a>
AutoConnect for ESP8266/ESP32
</label>
<div class="md-nav__source">
<a href="https://github.com/Hieromon/AutoConnect" title="Go to repository" class="md-source" data-md-source="github">
<div class="md-source__icon">
<svg viewBox="0 0 24 24" width="24" height="24">
<use xlink:href="#__github" width="24" height="24"></use>
</svg>
</div>
<div class="md-source__repository">
Hieromon/AutoConnect
</div>
</a>
</div>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="index.html" title="Overview" class="md-nav__link">
Overview
</a>
</li>
<li class="md-nav__item">
<a href="gettingstarted.html" title="Getting started" class="md-nav__link">
Getting started
</a>
</li>
<li class="md-nav__item">
<a href="menu.html" title="AutoConnect menu" class="md-nav__link">
AutoConnect menu
</a>
</li>
<li class="md-nav__item">
<a href="basicusage.html" title="Basic usage" class="md-nav__link">
Basic usage
</a>
</li>
<li class="md-nav__item">
<a href="advancedusage.html" title="Advanced usage" class="md-nav__link">
Advanced usage
</a>
</li>
<li class="md-nav__item md-nav__item--nested">
<input class="md-toggle md-nav__toggle" data-md-toggle="nav-6" type="checkbox" id="nav-6">
<label class="md-nav__link" for="nav-6">
Custom Web pages
</label>
<nav class="md-nav" data-md-component="collapsible" data-md-level="1">
<label class="md-nav__title" for="nav-6">
Custom Web pages
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="acintro.html" title="Custom Web pages with AutoConnect" class="md-nav__link">
Custom Web pages with AutoConnect
</a>
</li>
<li class="md-nav__item">
<a href="acelements.html" title="AutoConnectElements" class="md-nav__link">
AutoConnectElements
</a>
</li>
<li class="md-nav__item">
<a href="acjson.html" title="Custom Web pages with JSON" class="md-nav__link">
Custom Web pages with JSON
</a>
</li>
<li class="md-nav__item">
<a href="achandling.html" title="Handling the custom Web pages" class="md-nav__link">
Handling the custom Web pages
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item md-nav__item--nested">
<input class="md-toggle md-nav__toggle" data-md-toggle="nav-7" type="checkbox" id="nav-7">
<label class="md-nav__link" for="nav-7">
Library APIs
</label>
<nav class="md-nav" data-md-component="collapsible" data-md-level="1">
<label class="md-nav__title" for="nav-7">
Library APIs
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="api.html" title="AutoConnect API" class="md-nav__link">
AutoConnect API
</a>
</li>
<li class="md-nav__item">
<a href="apiaux.html" title="AutoConnectAux API" class="md-nav__link">
AutoConnectAux API
</a>
</li>
<li class="md-nav__item">
<a href="apiconfig.html" title="AutoConnectConfig API" class="md-nav__link">
AutoConnectConfig API
</a>
</li>
<li class="md-nav__item">
<a href="apielements.html" title="AutoConnectElements API" class="md-nav__link">
AutoConnectElements API
</a>
</li>
<li class="md-nav__item">
<a href="apiextra.html" title="Something extra" class="md-nav__link">
Something extra
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item md-nav__item--active md-nav__item--nested">
<input class="md-toggle md-nav__toggle" data-md-toggle="nav-8" type="checkbox" id="nav-8" checked>
<label class="md-nav__link" for="nav-8">
Examples
</label>
<nav class="md-nav" data-md-component="collapsible" data-md-level="1">
<label class="md-nav__title" for="nav-8">
Examples
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="howtoembed.html" title="How to embed" class="md-nav__link">
How to embed
</a>
</li>
<li class="md-nav__item">
<a href="datatips.html" title="Tips for data conversion" class="md-nav__link">
Tips for data conversion
</a>
</li>
<li class="md-nav__item md-nav__item--active">
<input class="md-toggle md-nav__toggle" data-md-toggle="toc" type="checkbox" id="__toc">
<label class="md-nav__link md-nav__link--active" for="__toc">
Attach the menu
</label>
<a href="menuize.html" title="Attach the menu" class="md-nav__link md-nav__link--active">
Attach the menu
</a>
<nav class="md-nav md-nav--secondary">
<label class="md-nav__title" for="__toc">Table of contents</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="#what-menus-can-be-made-using-autoconnect" title="What menus can be made using AutoConnect" class="md-nav__link">
What menus can be made using AutoConnect
</a>
</li>
<li class="md-nav__item">
<a href="#basic-mechanism-of-menu-generation" title="Basic mechanism of menu generation" class="md-nav__link">
Basic mechanism of menu generation
</a>
</li>
<li class="md-nav__item">
<a href="#place-the-item-for-the-legacy-sketches-on-the-menu" title="Place the item for the legacy sketches on the menu" class="md-nav__link">
Place the item for the legacy sketches on the menu
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item">
<a href="wojson.html" title="Custom Web pages w/o JSON" class="md-nav__link">
Custom Web pages w/o JSON
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item">
<a href="lsbegin.html" title="Appendix" class="md-nav__link">
Appendix
</a>
</li>
<li class="md-nav__item">
<a href="faq.html" title="FAQ" class="md-nav__link">
FAQ
</a>
</li>
<li class="md-nav__item">
<a href="changelog.html" title="Change log" class="md-nav__link">
Change log
</a>
</li>
<li class="md-nav__item">
<a href="license.html" title="License" class="md-nav__link">
License
</a>
</li>
</ul>
</nav>
</div>
</div>
</div>
<div class="md-sidebar md-sidebar--secondary" data-md-component="toc">
<div class="md-sidebar__scrollwrap">
<div class="md-sidebar__inner">
<nav class="md-nav md-nav--secondary">
<label class="md-nav__title" for="__toc">Table of contents</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="#what-menus-can-be-made-using-autoconnect" title="What menus can be made using AutoConnect" class="md-nav__link">
What menus can be made using AutoConnect
</a>
</li>
<li class="md-nav__item">
<a href="#basic-mechanism-of-menu-generation" title="Basic mechanism of menu generation" class="md-nav__link">
Basic mechanism of menu generation
</a>
</li>
<li class="md-nav__item">
<a href="#place-the-item-for-the-legacy-sketches-on-the-menu" title="Place the item for the legacy sketches on the menu" class="md-nav__link">
Place the item for the legacy sketches on the menu
</a>
</li>
</ul>
</nav>
</div>
</div>
</div>
<div class="md-content">
<article class="md-content__inner md-typeset">
<h1>Attach the menu</h1>
<h2 id="what-menus-can-be-made-using-autoconnect">What menus can be made using AutoConnect<a class="headerlink" href="#what-menus-can-be-made-using-autoconnect" title="Permanent link">&para;</a></h2>
<p>AutoConnect generates a menu dynamically depending on the instantiated <a href="acintro.html#how-it-works">AutoConnectAux</a> at the sketch executing time. Usually, it is a collection of <a href="acelements.html">AutoConnectElement</a>. In addition to this, you can generate a menu from only AutoConnectAux, without AutoConnectElements.<br>In other words, you can easily create a built-in menu featuring the WiFi connection facility embedding the legacy web pages.</p>
<h2 id="basic-mechanism-of-menu-generation">Basic mechanism of menu generation<a class="headerlink" href="#basic-mechanism-of-menu-generation" title="Permanent link">&para;</a></h2>
<p>The sketch can display the <a href="menu.html">AutoConnect menu</a> by following three patterns depending on AutoConnect-API usage.</p>
<dl>
<dt><i class="fa fa-desktop"></i>&ensp;<strong>Basic menu</strong></dt>
<dd>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 <a href="api.html#begin">AutoConnect::begin</a> and <a href="api.html#handleclient">AutoConnect::handleClient</a>.</dd>
<dt><i class="fa fa-desktop"></i>&ensp;<strong>Extra menu with custom Web pages which is consisted by <a href="acelements.html">AutoConnectElements</a></strong></dt>
<dd>It is an extended menu that appears when the sketch consists of the custom Web pages with <a href="acintro.html#how-it-works">AutoConnectAux</a> and AutoConnectElements. Refer to section <a href="acintro.html#custom-web-pages-in-autoconnect-menu"><em>Custom Web pages section</em></a>.</dd>
<dt><i class="fa fa-desktop"></i>&ensp;<strong>Extra menu which contains legacy pages</strong></dt>
<dd>It is for the legacy sketches using the <strong>on</strong> handler of ESP8266WebServer/WebServer(for ESP32) class natively and looks the same as the extra menu as above.</dd>
</dl>
<p>The mechanism to generate the AutoConnect menu is simple. It will insert the item as <code>&lt;li&gt;</code> tag generated from the <a href="apiaux.html#autoconnectaux"><strong>title</strong></a> and <a href="apiaux.html#autoconnectaux"><strong>uri</strong></a> 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.</p>
<h2 id="place-the-item-for-the-legacy-sketches-on-the-menu">Place the item for the legacy sketches on the menu<a class="headerlink" href="#place-the-item-for-the-legacy-sketches-on-the-menu" title="Permanent link">&para;</a></h2>
<p>To implement this with your sketch, use only the <a href="apiaux.html#autoconnectaux">AutoConnectAux</a> constructed with the title and URI of that page. <a href="acelements.html">AutoConnectElements</a> is not required.</p>
<p>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 <strong>Edit</strong> and <strong>List</strong>.</p>
<p><span style="display:block;margin-left:auto;margin-right:auto;width:282px;height:492px;border:1px solid lightgrey;"><img data-gifffer="images/aux_fsbrowser.gif" data-gifffer-height="490" data-gifffer-width="280" /></span></p>
<p>The changes I made to adapt the FSBrowser to the AutoConnect menu are slight as follows:</p>
<ol>
<li>Add AutoConnect declaration.</li>
<li>Add the menu item named "<strong>Edit</strong>" and "<strong>List</strong>" of AutoConnectAux as each page.</li>
<li>Replace the instance of ESP8266WebServer to AutoConnect.</li>
<li>Change the menu title to FSBrowser using <a href="apiconfig.html#title">AutoConnectConfig::title</a>.</li>
<li>Join the legacy pages to AutoConnect declared at step #1 using <a href="api.html#join">AutoConnect::join</a>.<br>Joining multiple at one time with the <a href="https://en.cppreference.com/w/cpp/language/list_initialization">list initialization</a> for <a href="https://ja.cppreference.com/w/cpp/container/vector/vector">std::vector</a>.</li>
<li>According to the basic procedure of AutoConnect.<br>Establish a connection with <a href="api.html#begin">AutoConnect::begin</a> and perform <a href="api.html#handleclient">AutoConnect::handleClient</a> in <strong>loop()</strong>.</li>
</ol>
<p><i class="fa fa-code"></i>&ensp;<strong>Modification for FSBrowser</strong> <small>(a part of sketch code)</small></p>
<div style="overflow:auto"><img style="width:auto;max-width:none;height:840px" src="images/fsbrowser_ba.svg" /></div>
<p>... and embeds a hyperlink with an <a href="apiextra.html#icons">icon</a> in the bottom of the body section of <em>index.htm</em> contained in the data folder to jump to the AutoConnect menu.</p>
<div class="codehilite" style="background: #272822"><pre style="line-height: 125%"><span></span><span style="color: #f8f8f2">&lt;</span><span style="color: #f92672">p</span> <span style="color: #a6e22e">style</span><span style="color: #f92672">=</span><span style="color: #e6db74">&quot;padding-top:15px;text-align:center&quot;</span><span style="color: #f8f8f2">&gt;</span>
<span style="color: #f8f8f2">&lt;</span><span style="color: #f92672">a</span> <span style="color: #a6e22e">href</span><span style="color: #f92672">=</span><span style="color: #e6db74">&quot;/_ac&quot;</span><span style="color: #f8f8f2">&gt;&lt;</span><span style="color: #f92672">img</span> <span style="color: #a6e22e">src</span><span style="color: #f92672">=</span><span style="color: #e6db74">&quot;data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAC2klEQVRIS61VvWsUQRSfmU2pon9BUIkQUaKFaCBKgooSb2d3NSSFKbQR/KrEIiIKBiGF2CgRxEpjQNHs7mwOUcghwUQ7g58IsbGxEBWsb2f8zR177s3t3S2cA8ftzPu993vzvoaSnMu2vRKlaqgKp74Q/tE8qjQPyHGcrUrRjwlWShmDbFMURd/a6TcQwNiYUmpFCPElUebcuQ2vz6aNATMVReHEPwzfSSntDcNwNo2rI+DcvQzhpAbA40VKyV0p1Q9snzBG1qYVcYufXV1sREraDcxpyHdXgkfpRBj6Uwm2RsC5dxxmZ9pdOY9cKTISRcHTCmGiUCh4fYyplTwG2mAUbtMTBMHXOgK9QfyXEZr+TkgQ1oUwDA40hEgfIAfj+HuQRaBzAs9eKyUZ5Htx+T3ZODKG8DzOJMANhmGomJVMXPll+hx9UUAlzZrJJ4QNCDG3VEfguu7mcpmcB/gkBOtShhQhchAlu5jlLUgc9ENgyP5gf9+y6LTv+58p5zySkgwzLNOIGc8sEoT1Lc53NMlbCQQuvMxeCME1NNPVVkmH/i3IzzXDtCSA0qQQwZWOCJDY50jsQRjJmkslEOxvTcDRO6zPxOh5xZglKkYLhWM9jMVnkIsTyMT6NBj7IbOCEjm6HxNVVTo2WXqEWJZ1T8rytB6GxizyDkPhWVpBqfiXUtbo/HywYJSpA9kMamNNPZ71R9Hcm+TMHHZNGw3EuraXEUldbfvw25UdOjqOt+JhMwJd7+jSTpZaEiIcaCDwPK83jtWnTkwnunFMtxeL/ge9r4XItt1RNNaj/0GAcV2bR3U5sG3nEh6M61US+Qrfd9Bs31GGulI2GOS/8dgcQZV1w+ApjIxB7TDwF9GcNzJzoA+rD0/8HvPnXQJCt2qFCwbBTfRI7UyXumWVt+HJ9NO4XI++bdsb0YyrqXmlh+AWOLHaLqS5CLQR5EggR3YlcVS9gKeH2hnX8r8Kmi1CAsl36QAAAABJRU5ErkJggg==&quot;</span> <span style="color: #a6e22e">border</span><span style="color: #f92672">=</span><span style="color: #e6db74">&quot;0&quot;</span> <span style="color: #a6e22e">title</span><span style="color: #f92672">=</span><span style="color: #e6db74">&quot;AutoConnect menu&quot;</span> <span style="color: #a6e22e">alt</span><span style="color: #f92672">=</span><span style="color: #e6db74">&quot;AutoConnect menu&quot;</span><span style="color: #f8f8f2">/&gt;&lt;/</span><span style="color: #f92672">a</span><span style="color: #f8f8f2">&gt;</span>
<span style="color: #f8f8f2">&lt;/</span><span style="color: #f92672">p</span><span style="color: #f8f8f2">&gt;</span>
</pre></div>
<script>
window.onload = function() {
Gifffer();
};
</script>
</article>
</div>
</div>
</main>
<footer class="md-footer">
<div class="md-footer-nav">
<nav class="md-footer-nav__inner md-grid">
<a href="datatips.html" title="Tips for data conversion" class="md-flex md-footer-nav__link md-footer-nav__link--prev" rel="prev">
<div class="md-flex__cell md-flex__cell--shrink">
<i class="md-icon md-icon--arrow-back md-footer-nav__button"></i>
</div>
<div class="md-flex__cell md-flex__cell--stretch md-footer-nav__title">
<span class="md-flex__ellipsis">
<span class="md-footer-nav__direction">
Previous
</span>
Tips for data conversion
</span>
</div>
</a>
<a href="wojson.html" title="Custom Web pages w/o JSON" class="md-flex md-footer-nav__link md-footer-nav__link--next" rel="next">
<div class="md-flex__cell md-flex__cell--stretch md-footer-nav__title">
<span class="md-flex__ellipsis">
<span class="md-footer-nav__direction">
Next
</span>
Custom Web pages w/o JSON
</span>
</div>
<div class="md-flex__cell md-flex__cell--shrink">
<i class="md-icon md-icon--arrow-forward md-footer-nav__button"></i>
</div>
</a>
</nav>
</div>
<div class="md-footer-meta md-typeset">
<div class="md-footer-meta__inner md-grid">
<div class="md-footer-copyright">
<div class="md-footer-copyright__highlight">
Copyright &copy; 2018-2019 Hieromon Ikasamo
</div>
powered by
<a href="https://www.mkdocs.org">MkDocs</a>
and
<a href="https://squidfunk.github.io/mkdocs-material/">
Material for MkDocs</a>
</div>
<div class="md-footer-social">
<link rel="stylesheet" href="assets/fonts/font-awesome.css">
<a href="https://github.com/Hieromon" class="md-footer-social__link fa fa-github"></a>
<a href="https://twitter.com/hieromon" class="md-footer-social__link fa fa-twitter"></a>
</div>
</div>
</div>
</footer>
</div>
<script src="assets/javascripts/application.b806dc00.js"></script>
<script>app.initialize({version:"1.0.4",url:{base:"."}})</script>
<script src="js/gifffer.min.js"></script>
</body>
</html>

Some files were not shown because too many files have changed in this diff Show More

Loading…
Cancel
Save