nephalim

index_html.h

Oct 23rd, 2021
1,124
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. // index.html file in raw data format for PROGMEM
  2. //
  3. const char index_html[] PROGMEM = R"=====(
  4. <!DOCTYPE html>
  5. <html>
  6. <head>
  7.  <title>ESP-radio</title>
  8.  <meta http-equiv="content-type" content="text/html; charset=utf-8">
  9.  <link rel="Shortcut Icon" type="image/ico" href="favicon.ico">
  10.  <script>
  11.  function changeBgImg()
  12.  {
  13.  let oint = Math.floor(1 + Math.random() * 114);
  14.  if(oint < 10) oint = "00"+ oint;
  15.  if(oint > 9 && oint < 100) oint = "0"+ oint;
  16.  oint = "url('http://imz-11.narod.ru/angelina_jolie/"+oint+".jpg')";
  17.  var block = document.getElementById('bee');
  18.  block.style.backgroundImage = oint;
  19.  }
  20.  </script>
  21. </head>
  22. <body id="bee">
  23.  <ul>
  24.   <li><a class="pull-left active" href="/index.html">ESP Radio</a></li>
  25.   <li><a class="pull-left" href="/config.html">Налаштування</a></li>
  26.   <li><a class="pull-left" href="/about.html">Про програму</a></li>
  27.  </ul>
  28.  <br><br><br>
  29.  <center>
  30.   <h1>** ESP Radio:: Інтернет WiFi Радіо**</h1>
  31.   <button class="button" onclick="httpGet('downpreset=1')">Попередня станція</button>
  32.   <button class="button" onclick="httpGet('uppreset=1')">Наступна станція</button>
  33.   <button class="button" onclick="httpGet('downvolume=2')">Тихіше</button>
  34.   <button class="button" onclick="httpGet('upvolume=2')">Гучніше</button>
  35.   <button class="button" onclick="httpGet('stop')">Зупинити</button>
  36.   <button class="button" onclick="httpGet('resume')">Відновити</button>
  37.   <button class="button" onclick="what_play_now()">Інфо по треку</button>
  38.   <button class="button" onclick="trafik_info()">Інфо по трафіку</button>
  39.   <table class="table_block">
  40.    <tr>
  41.     <td colspan="2"><center>
  42.       <label for="selpres"><big style="margin-top:100px;color: white;text-shadow: 2px 2px 2px black;">Список доступних станцій:</big></label>
  43.       <br>
  44.       <select class="select selectw" onChange="handlepreset(this)" id="selpres">
  45.        <option value="-1">Виберіть станцію</option>
  46.       </select>
  47.       <br><br>
  48.     </center></td>
  49.    </tr>
  50.    <tr>
  51.     <td><center>
  52.      <label for="HA"><big style="margin-top:100px;color: white;text-shadow: 2px 2px 2px black;">Посилення ВЧ:</big></label>
  53.      <br>
  54.      <select class="select" onChange="handletone(this)" id="HA">
  55.       <option style="background-color:black;" value="8">-12 dB</option>
  56.       <option style="background-color:black;" value="9">-10.5 dB</option>
  57.       <option style="background-color:black;" value="10">-9 dB</option>
  58.       <option style="background-color:black;" value="11">-7.5 dB</option>
  59.       <option style="background-color:black;" value="12">-6 dB</option>
  60.       <option style="background-color:black;" value="13">-4.5 dB</option>
  61.       <option style="background-color:black;" value="14">-3 dB</option>
  62.       <option style="background-color:black;" value="15">-1.5 dB</option>
  63.       <option style="background-color:black;" value="0" selected>Вимкнено</option>
  64.       <option style="background-color:black;" value="1">+1.5 dB</option>
  65.       <option style="background-color:black;" value="2">+3 dB</option>
  66.       <option style="background-color:black;" value="3">+4.5 dB</option>
  67.       <option style="background-color:black;" value="4">+6 dB</option>
  68.       <option style="background-color:black;" value="5">+7.5 dB</option>
  69.       <option style="background-color:black;" value="6">+9 dB</option>
  70.       <option style="background-color:black;" value="7">+10.5 dB</option>
  71.      </select>
  72.      <br><br>
  73.     </td>
  74.     <td><center>
  75.      <label for="HF"><big style="margin-top:100px;color: white;text-shadow: 2px 2px 2px black;">Частота ВЧ:</big></label>
  76.      <br>
  77.      <select class="select" onChange="handletone(this)" id="HF">
  78.        <option style="background-color:black;" value="1">1 kГц</option>
  79.        <option style="background-color:black;" value="2">2 kГц</option>
  80.        <option style="background-color:black;" value="3">3 kГц</option>
  81.        <option style="background-color:black;" value="4">4 kГц</option>
  82.        <option style="background-color:black;" value="5">5 kГц</option>
  83.        <option style="background-color:black;" value="6">6 kГц</option>
  84.        <option style="background-color:black;" value="7">7 kГц</option>
  85.        <option style="background-color:black;" value="8">8 kГц</option>
  86.        <option style="background-color:black;" value="9">9 kГц</option>
  87.        <option style="background-color:black;" value="10">10 kГц</option>
  88.        <option style="background-color:black;" value="11">11 kГц</option>
  89.        <option style="background-color:black;" value="12">12 kГц</option>
  90.        <option style="background-color:black;" value="13">13 kГц</option>
  91.        <option style="background-color:black;" value="14">14 kГц</option>
  92.        <option style="background-color:black;" value="15">15 kГц</option>
  93.      </select>
  94.      <br><br>
  95.     </center></td>
  96.     <br><br>
  97.    </tr>
  98.    <tr>
  99.     <td style="height:80px;"><center>
  100.      <label for="LA"><big style="margin-top:100px;color: white;text-shadow: 2px 2px 2px black;">Посилення НЧ:</big></label>
  101.      <br>
  102.      <select class="select" onChange="handletone(this)" id="LA">
  103.       <option style="background-color:black;" value="0" selected>Вимкнено</option>
  104.       <option style="background-color:black;" value="1">+1 dB</option>
  105.       <option style="background-color:black;" value="2">+2 dB</option>
  106.       <option style="background-color:black;" value="3">+3 dB</option>
  107.       <option style="background-color:black;" value="4">+4 dB</option>
  108.       <option style="background-color:black;" value="5">+5 dB</option>
  109.       <option style="background-color:black;" value="6">+6 dB</option>
  110.       <option style="background-color:black;" value="7">+7 dB</option>
  111.       <option style="background-color:black;" value="8">+8 dB</option>
  112.       <option style="background-color:black;" value="9">+9 dB</option>
  113.       <option style="background-color:black;" value="10">+10 dB</option>
  114.       <option style="background-color:black;" value="11">+11 dB</option>
  115.       <option style="background-color:black;" value="12">+12 dB</option>
  116.       <option style="background-color:black;" value="13">+13 dB</option>
  117.       <option style="background-color:black;" value="14">+14 dB</option>
  118.       <option style="background-color:black;" value="15">+15 dB</option>
  119.      </select>
  120.      <br>
  121.     </td>
  122.     <td style="height:80px;"><center>
  123.      <label for="LF"><big style="margin-top:100px;color: white;text-shadow: 2px 2px 2px black;">Частота НЧ:</big></label>
  124.      <br>
  125.      <select class="select" onChange="handletone(this)" id="LF">
  126.       <option style="background-color:black;" value="2">10 Гц</option>
  127.       <option style="background-color:black;" value="3">20 Гц</option>
  128.       <option style="background-color:black;" value="4">30 Гц</option>
  129.       <option style="background-color:black;" value="5">40 Гц</option>
  130.       <option style="background-color:black;" value="6">50 Гц</option>
  131.       <option style="background-color:black;" value="7">60 Гц</option>
  132.       <option style="background-color:black;" value="8">70 Гц</option>
  133.       <option style="background-color:black;" value="9">80 Гц</option>
  134.       <option style="background-color:black;" value="10">90 Гц</option>
  135.       <option style="background-color:black;" value="11">100 Гц</option>
  136.       <option style="background-color:black;" value="12">110 Гц</option>
  137.       <option style="background-color:black;" value="13">120 Гц</option>
  138.       <option style="background-color:black;" value="14">130 Гц</option>
  139.       <option style="background-color:black;" value="15">140 Гц</option>
  140.      </select>
  141.     </center></td>
  142.     <br><br>
  143.    </tr>
  144.   </table>
  145.   <br>
  146.   <input type="text" size="60" id="station" placeholder="Введіть станцію або файл тут..." style="width:620px;">
  147.   <button class="button button-play" onclick="setstat()">Відтворити</button>
  148.   <br>
  149.   <br>
  150.   <input type="text" size="72" id="resultstr" placeholder="Тут відображатимуться результати запитів" style="width:730px;" readonly /><br>
  151.   <br><br>
  152.   <p><a target="blank" href="http://www.internet-radio.com">Знайти нові Інтернет станції можна тут</a></p>
  153.    <p style="color: white;text-shadow: 2px 2px 2px black;">Приклади для введення: <i>us1.internet-radio.com:8105</i>, <i>skonto.ls.lv:8002/mp3</i>, <i>85.17.121.103:8800</i></p><br>
  154.   </center>
  155.   <script>
  156.    var intervalID;
  157.    function what_play_now()
  158.    {
  159.    httpGet('status');
  160.    clearInterval(intervalID);
  161.    intervalID = setInterval("httpGet('status');", 60000);
  162.    }
  163.    function trafik_info()
  164.    {
  165.    httpGet('test');
  166.    clearInterval(intervalID);
  167.    intervalID = setInterval("httpGet('test');", 500);
  168.    }
  169.    var cts = 0;
  170.    function httpGet ( theReq )
  171.    {
  172.     if(theReq == 'status')
  173.     {
  174.      cts < 60 ? cts++ : clearInterval(intervalID);  
  175.     }
  176.     var theUrl = "/?" + theReq + "&version=" + Math.random() ;
  177.     var xhr = new XMLHttpRequest() ;
  178.     xhr.onreadystatechange = function() {
  179.       if ( xhr.readyState == XMLHttpRequest.DONE )
  180.       {
  181.         resultstr.value = xhr.responseText ;
  182.       }
  183.     }
  184.     xhr.open ( "GET", theUrl, false ) ;
  185.     xhr.send() ;
  186.    }
  187.  
  188.    function handlepreset ( presctrl )
  189.    {
  190.     if ( presctrl.value >= 0 )
  191.     {
  192.       httpGet ( "preset=" + presctrl.value ) ;
  193.     }
  194.    }
  195.  
  196.    function handletone ( tonectrl )
  197.    {
  198.      var theUrl = "/?tone" + tonectrl.id + "=" + tonectrl.value +
  199.                   "&version=" + Math.random() ;
  200.      var xhr = new XMLHttpRequest() ;
  201.      xhr.onreadystatechange = function() {
  202.        if ( xhr.readyState == XMLHttpRequest.DONE )
  203.        {
  204.          resultstr.value = xhr.responseText ;
  205.        }
  206.      }
  207.      xhr.open ( "GET", theUrl, false ) ;
  208.      xhr.send() ;
  209.    }
  210.  
  211.    function setstat()
  212.    {
  213.      var theUrl = "/?station=" + station.value + "&version=" + Math.random() ;
  214.      var xhr = new XMLHttpRequest() ;
  215.      xhr.onreadystatechange = function() {
  216.        if ( xhr.readyState == XMLHttpRequest.DONE )
  217.        {
  218.          resultstr.value = xhr.responseText ;
  219.        }
  220.      }
  221.      xhr.open ( "GET", theUrl, false ) ;
  222.      xhr.send() ;
  223.    }
  224.    // Fill preset list initially
  225.    //
  226.    var i, select, opt, stations ;
  227.    select = document.getElementById("selpres") ;
  228.    var theUrl = "/?list=0" + "&version=" + Math.random() ;
  229.    var xhr = new XMLHttpRequest() ;
  230.    xhr.onreadystatechange = function() {
  231.      if ( xhr.readyState == XMLHttpRequest.DONE )
  232.      {
  233.        stations = xhr.responseText.split ( "|" ) ;
  234.        for ( i = 0 ; i < ( stations.length - 1 ) ; i++ )
  235.        {
  236.          opt = document.createElement( "OPTION" ) ;
  237.          opt.value = stations[i].substring ( 0, 2 ) ;
  238.          opt.text = stations[i].substring ( 2 ) ;
  239.          opt.style.backgroundColor = "black";
  240.          select.add( opt ) ;
  241.        }
  242.        changeBgImg();
  243.      }
  244.    }
  245.    xhr.open ( "GET", theUrl, false ) ;
  246.    xhr.send() ;
  247.   </script>
  248.   <script type="text/javascript">
  249.     var stylesheet = document.createElement('link') ;
  250.     stylesheet.href = 'radio.css' ;
  251.     stylesheet.rel = 'stylesheet' ;
  252.     stylesheet.type = 'text/css' ;
  253.     document.getElementsByTagName('head')[0].appendChild(stylesheet) ;
  254.   </script>
  255.  </body>
  256. </html>
  257. <noscript>
  258.   <link rel="stylesheet" href="radio.css">
  259.   Вибачте, але цей скрипт не працює при вимкненому JavaScript!
  260. </noscript>
  261. )=====" ;
RAW Paste Data