mikroavr

Untitled

Feb 24th, 2021
927
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. const char index_html[] PROGMEM = R"rawliteral(
  2. <!DOCTYPE html>
  3. <html>
  4. <head>
  5. <meta name="viewport" content="width=device-width, initial-scale=1">
  6.   <style>
  7.   body {font-family: Arial, Helvetica, sans-serif;}
  8.   form {border: 3px solid #f1f1f1;}
  9.  
  10.   input[type=number],input[type=password] {
  11.   width: 20%;
  12.   font-size: 11px;
  13.   padding: 12px 12px;
  14.   margin: 4px 0;
  15.   display: inline-block;
  16.   border: 1px solid #ccc;
  17.   box-sizing: border-box;
  18. }
  19.  
  20. input[type=text]:focus {
  21.   background-color: lightgreen;
  22. }
  23.  
  24. input[type=number]:focus {
  25.   background-color: lightgreen;
  26. }
  27.  
  28.  
  29.  
  30. input[type=text]{
  31.   width: 100%;
  32.   font-size: 11px;
  33.   padding: 12px 12px;
  34.   margin: 4px 0;
  35.   display: inline-block;
  36.   border: 1px solid #ccc;
  37.   box-sizing: border-box;
  38. }
  39. .container {
  40.   padding: 16px;
  41. }
  42. button {
  43.   background-color: #4CAF50;
  44.   color: white;
  45.   padding: 14px 20px;
  46.   margin: 8px 0;
  47.   border: none;
  48.   cursor: pointer;
  49.   width: 100%;
  50. }
  51.  
  52. textarea {
  53.   width: 100%;
  54.   height: 150px;
  55.   font-size: 11px;
  56.   padding: 12px 20px;
  57.   box-sizing: border-box;
  58.   border: 2px solid #ccc;
  59.   border-radius: 4px;
  60.   background-color: #f8f8f8;
  61.   resize: none;
  62. }
  63.   </style>
  64. </head>
  65. <body>
  66.   <h2> SETTING PARAMETER</h2>
  67.   <h3> ADAPTER PM05</h3>
  68.  
  69.   <form action="/setting_post">
  70.   <div class = "container">
  71.   <h3> CONFIG AKSES DATA DAN METODE PUSH</h3>
  72.   <p> pilih jenis akses internet dan metode push data nya</p>
  73.    <label for="uname"><b>Akses Data?</b></label>
  74.     <select name = "type_inet">
  75.       <option> Ethernet </option>
  76.       <option> WiFi     </option>
  77.     </select>
  78.     </div>
  79.    
  80.     <div class = "container">
  81.     <label for="uname"><b>Metode Push?</b></label>
  82.     <select name = "type_push">
  83.       <option> HTTP Post JSON </option>
  84.       <option disabled> MQTT JSON     </option>
  85.     </select>
  86.     </div>
  87.     <div class = "container">
  88.     <button type="submit">SAVE</button>
  89.     </div>
  90.     </form>
  91.  
  92.     <form action="/setting_server">
  93.     <div class = "container">
  94.     <h3> CONFIG PUSH HTTP JSON </h3>
  95.     <p> Isi Jika menggunakan metode HTTP Post JSON</p>
  96.     <label for="uname"><b>AUTH</b></label>
  97.      <input type="text" name="token" maxlength="32" required>
  98.    
  99.     <label for="uname"><b>SERVER</b></label>
  100.     <input type="text" name="server" maxlength="80"required>
  101.      <label for="uname"><b>UPDATE TIME/MENIT</b></label></br>
  102.      
  103.     <input type="number" name="update_time" required pattern="/^-?\d+\.?\d*$/"
  104.    onKeyPress="if(this.value.length==3) return false;" min="1" max = "60" required/>
  105.      <button type="submit">SAVE</button>
  106.     </div>
  107.     </form>
  108.  
  109.   <form action="/setting_kwh">
  110.     <div class = "container">
  111.     <h3>SETTING KWH PARAMETER</h3>
  112.     <p> Pilih Jumlah KWH dan type KWH yang ingin di monitoring</p>
  113.     <p style="color:red;"><b>PASTIKAN setiap Slave berbeda ID nya</b> </p>
  114.     <label for="uname"><b>Total Kwh?</b></label>
  115.     <select name = "total_kwh">  
  116.       <option> 1</option>
  117.       <option> 2</option>
  118.       <option> 3</option>
  119.       <option> 4</option>
  120.       <option> 5</option>
  121.     </select>
  122.     </div>
  123.  
  124.     <div class = "container">
  125.     <label for="uname"><b>Slave1</b></label>
  126.     <input type="number" placeholder="id" name="slave1" required>
  127.     <select name = "kwh1">  
  128.       <option> Thera 025</option>
  129.       <option> Thera 055</option>
  130.       <option> Thera 075</option>
  131.       <option> PM2100 </option>
  132.       <option> PM800 </option>
  133.       <option disabled> PM51XX_PM53XX </option>
  134.       <option> Amptron-Ai205 </option>
  135.       <option> Elite 300 </option>
  136.       <option disabled> SDM630 </option>
  137.     </select>
  138.     </div>
  139.    
  140.     <div class = "container">
  141.     <label for="uname"><b>Slave2</b></label>
  142.     <input type="number" placeholder="id" name="slave2">
  143.     <select name = "kwh2">  
  144.       <option> Thera 025</option>
  145.       <option> Thera 055</option>
  146.       <option> Thera 075</option>
  147.       <option> PM2100 </option>
  148.       <option> PM800 </option>
  149.       <option disabled> PM51XX_PM53XX </option>
  150.       <option> Amptron-Ai205 </option>
  151.       <option> Elite 300 </option>
  152.       <option disabled> SDM630 </option>
  153.     </select>
  154.     </div>
  155.  
  156.     <div class = "container">
  157.     <label for="uname"><b>Slave3</b></label>
  158.     <input type="number" placeholder="id" name="slave3">
  159.     <select name = "kwh3">  
  160.       <option> Thera 025</option>
  161.       <option> Thera 055</option>
  162.       <option> Thera 075</option>
  163.       <option> PM2100 </option>
  164.       <option> PM800 </option>
  165.       <option disabled> PM51XX_PM53XX </option>
  166.       <option> Amptron-Ai205 </option>
  167.       <option> Elite 300 </option>
  168.       <option disabled> SDM630 </option>
  169.     </select>
  170.     </div>
  171.  
  172.     <div class = "container">
  173.     <label for="uname"><b>Slave4</b></label>
  174.     <input type="number" placeholder="id" name="slave4">
  175.     <select name = "kwh4">  
  176.       <option> Thera 025</option>
  177.       <option> Thera 055</option>
  178.       <option> Thera 075</option>
  179.       <option> PM2100 </option>
  180.       <option> PM800 </option>
  181.       <option disabled> PM51XX_PM53XX </option>
  182.       <option> Amptron-Ai205 </option>
  183.       <option> Elite 300 </option>
  184.       <option disabled> SDM630 </option>
  185.     </select>
  186.     </div>
  187.    
  188.     <div class = "container">
  189.     <label for="uname"><b>Slave5</b></label>
  190.     <input type="number" placeholder="id" name="slave5">
  191.     <select name = "kwh5">  
  192.       <option> Thera 025</option>
  193.       <option> Thera 055</option>
  194.       <option> Thera 075</option>
  195.       <option> PM2100 </option>
  196.       <option> PM800 </option>
  197.       <option disabled> PM51XX_PM53XX </option>
  198.       <option> Amptron-Ai205 </option>
  199.       <option> Elite 300 </option>
  200.       <option disabled> SDM630 </option>
  201.     </select>
  202.     </div>
  203.     <div class = "container">
  204.     <button type="submit">SAVE</button>
  205.     </div>
  206.     </form>
  207.  
  208.     <form action="/setting_wifi">
  209.     <div class = "container">
  210.       <h3>WIFI CONFIG</h3>
  211.       <p>Pilih jika menggunakan akses internet dengan Wifi  </p>
  212.       <label for="uname"><b>SSID</b></label>
  213.       <input type="text" name="ssid_wifi" maxlength="30" required>
  214.       <label for="uname"><b>PASSWORD</b></label>
  215.       <input type="text" name="pass_wifi" maxlength="30" required>
  216.     <button type="submit">SAVE</button>
  217.     </div>
  218.     </form>
  219.  
  220.     <form action="/setting_eth">
  221.     <div class = "container">
  222.     <h3>ETHERNET CONFIG</h3>
  223.     <p>Pilih jika menggunakan akses internet dengan Ethernet  </p>
  224.     </div>
  225.  
  226.     <div class = "container">
  227.     <label for="uname"><b>MAC</b></label>
  228.     </div>
  229.     <div class = "container">
  230.     <input type="number" name="mac1" required pattern="/^-?\d+\.?\d*$/"
  231.    onKeyPress="if(this.value.length==3) return false;" min="16" max = "255"/>
  232.     <input type="number" name="mac2" required pattern="/^-?\d+\.?\d*$/"
  233.    onKeyPress="if(this.value.length==3) return false;" min="16" max = "255"/>
  234.     <input type="number" name="mac3" required pattern="/^-?\d+\.?\d*$/"
  235.    onKeyPress="if(this.value.length==3) return false;" min="16" max = "255"/>
  236.     <input type="number" name="mac4" required pattern="/^-?\d+\.?\d*$/"
  237.    onKeyPress="if(this.value.length==3) return false;" min="16" max = "255"/>
  238.     <input type="number" name="mac5" required pattern="/^-?\d+\.?\d*$/"
  239.    onKeyPress="if(this.value.length==3) return false;" min="16" max = "255"/>
  240.     <input type="number" name="mac6" required pattern="/^-?\d+\.?\d*$/"
  241.    onKeyPress="if(this.value.length==3) return false;" min="16" max = "255"/>
  242.     </div>
  243.  
  244.     <div class = "container">
  245.     <label for="uname"><b>IP</b></label>
  246.     </div>
  247.     <div class = "container">
  248.     <input type="number" name="ip1" required pattern="/^-?\d+\.?\d*$/"
  249.    onKeyPress="if(this.value.length==3) return false;" />
  250.     <input type="number" name="ip2" required pattern="/^-?\d+\.?\d*$/"
  251.    onKeyPress="if(this.value.length==3) return false;" />
  252.     <input type="number" name="ip3" required pattern="/^-?\d+\.?\d*$/"
  253.    onKeyPress="if(this.value.length==3) return false;" />
  254.     <input type="number" name="ip4" required pattern="/^-?\d+\.?\d*$/"
  255.    onKeyPress="if(this.value.length==3) return false;" />
  256.     </div>
  257.  
  258.     <div class = "container">
  259.     <label for="uname"><b>DNS</b></label>
  260.     </div>
  261.     <div class = "container">
  262.     <input type="number" name="dns1" required pattern="/^-?\d+\.?\d*$/"
  263.    onKeyPress="if(this.value.length==3) return false;" />
  264.     <input type="number" name="dns2" required pattern="/^-?\d+\.?\d*$/"
  265.    onKeyPress="if(this.value.length==3) return false;" />
  266.     <input type="number" name="dns3" required pattern="/^-?\d+\.?\d*$/"
  267.    onKeyPress="if(this.value.length==3) return false;" />
  268.     <input type="number" name="dns4" required pattern="/^-?\d+\.?\d*$/"
  269.    onKeyPress="if(this.value.length==3) return false;" />
  270.     </div>
  271.    
  272.      <div class = "container">
  273.     <button type="submit">SAVE</button>
  274.     </div>
  275.   </form>
  276.  
  277.   <p> &copy; 2021 mikroavr.com All Rights Reserved</p>
  278.  
  279. </body>
  280. </html>
  281. )rawliteral";
RAW Paste Data