Незначительные доработки стилей
[esp-clock.git] / data / web / script.js
index 67c213ffc792a5bd1f39884038100372e3414c53..c40f7e1d010716da669c095e26581754d15f68ac 100644 (file)
@@ -1,61 +1,26 @@
-(function (window, document) {
-
-    // we fetch the elements each time because docusaurus removes the previous
-    // element references on page navigation
-    function getElements() {
-        return {
-            layout: document.getElementById('layout'),
-            menu: document.getElementById('menu'),
-            menuLink: document.getElementById('menuLink')
-        };
-    }
-
-    function toggleClass(element, className) {
-        var classes = element.className.split(/\s+/);
-        var length = classes.length;
-        var i = 0;
-
-        for (; i < length; i++) {
-            if (classes[i] === className) {
-                classes.splice(i, 1);
-                break;
-            }
-        }
-        // The className is not found
-        if (length === classes.length) {
-            classes.push(className);
-        }
+var pages
+var parameters = {}
+var daynames = ['Пн', 'Вт', 'Ср', 'Чт', 'Пт', 'Сб', 'Вс'] 
 
 
-        element.className = classes.join(' ');
+function toggleMenu(e) {
+  active = (document.getElementById('menuLink').className.indexOf('active') !== -1)
+  if (active || e.target.id == 'menuLink' || e.target.id == 'menuBtn') {
+    elements = [ document.getElementById('layout'), document.getElementById('menu'), document.getElementById('menuLink') ]
+    for (const element of elements) {
+      if (!active) {
+        element.classList.add('active')
+      } else {
+        element.classList.remove('active')
+      }
     }
     }
-
-    function toggleAll() {
-        var active = 'active';
-        var elements = getElements();
-
-        toggleClass(elements.layout, active);
-        toggleClass(elements.menu, active);
-        toggleClass(elements.menuLink, active);
+    if (e.target.id == 'menuLink' || e.target.id == 'menuBtn') {
+      e.preventDefault()
     }
     }
-    
-    function handleEvent(e) {
-        var elements = getElements();
-        
-        if (e.target.id === elements.menuLink.id) {
-            toggleAll();
-            e.preventDefault();
-        } else if (elements.menu.className.indexOf('active') !== -1) {
-            toggleAll();
-        }
-    }
-    
-    document.addEventListener('click', handleEvent);
-
-}(this, this.document));
+    e.stopPropagation()
+  }
+}
 
 
-var pages
-var parameters = {}
-var daynames = ['Пн', 'Вт', 'Ср', 'Чт', 'Пт', 'Сб', 'Вс'] 
+document.getElementById('layout').addEventListener('click', toggleMenu)
 
 function encode(r){
   r = String(r)
 
 function encode(r){
   r = String(r)
@@ -271,7 +236,7 @@ function ElementHTML(element) {
       return '<div class="pure-u-1 pure-u-md-1-3"><label for="_ui_element_' + element.id + '">' + encode(element.label) + '</label>'
         + '<input data-ui_class="password" type="password" id="_ui_element_' + element.id + '" value="' + encode(value) 
         + '" class="pure-u-1" style="display:inline-block" maxlength="99" oninput="sendUpdate(\'' + element.id + '\')" />'
       return '<div class="pure-u-1 pure-u-md-1-3"><label for="_ui_element_' + element.id + '">' + encode(element.label) + '</label>'
         + '<input data-ui_class="password" type="password" id="_ui_element_' + element.id + '" value="' + encode(value) 
         + '" class="pure-u-1" style="display:inline-block" maxlength="99" oninput="sendUpdate(\'' + element.id + '\')" />'
-        + '<div class="hint" onclick="ShowPwd(\'' + element.id + '\')">&#x1F441;</div></div>'
+        + '<div class="hint" onclick="ShowPwd(\'' + element.id + '\')">&#61550;</div></div>'
     case 'input':
       var pattern = ""
       if (element.pattern) {
     case 'input':
       var pattern = ""
       if (element.pattern) {
@@ -288,7 +253,7 @@ function ElementHTML(element) {
       return '<div class="pure-u-1 pure-u-md-1-3"><label for="_ui_element_' + element.id + '">' + encode(element.label) + '</label>'
         + '<input data-ui_class="input" type="text" id="_ui_element_' + element.id + '" value="' + encode(value) +'"'+ pattern
         + ' class="pure-u-1" style="display:inline-block" maxlength="99" oninput="sendUpdate(\'' + element.id + '\')" />' 
       return '<div class="pure-u-1 pure-u-md-1-3"><label for="_ui_element_' + element.id + '">' + encode(element.label) + '</label>'
         + '<input data-ui_class="input" type="text" id="_ui_element_' + element.id + '" value="' + encode(value) +'"'+ pattern
         + ' class="pure-u-1" style="display:inline-block" maxlength="99" oninput="sendUpdate(\'' + element.id + '\')" />' 
-        + '<div class="hint" onclick="OpenSelect(\'' + element.id+ '\'); getWiFi(\'' + element.id + '\')">&#128246;</div>'
+        + '<div class="hint" onclick="OpenSelect(\'' + element.id+ '\'); getWiFi(\'' + element.id + '\')">&#61931;</div>'
         + '<div class="modal" id="_ui_elemmodal_' + element.id + '" hidden>' 
         + '<div class="modal-content">'
         + '<div id="_ui_elemselect_' + element.id + '"></div>'
         + '<div class="modal" id="_ui_elemmodal_' + element.id + '" hidden>' 
         + '<div class="modal-content">'
         + '<div id="_ui_elemselect_' + element.id + '"></div>'
@@ -315,7 +280,7 @@ function ElementHTML(element) {
       return options
     case 'week':
       days = '<div class="pure-u-1 pure-u-md-1-3"><label for="_ui_element_' + element.id + '">' + encode(element.label) + '</label>' 
       return options
     case 'week':
       days = '<div class="pure-u-1 pure-u-md-1-3"><label for="_ui_element_' + element.id + '">' + encode(element.label) + '</label>' 
-        + '<table data-ui_class="week" data-value="' + value + '" id="_ui_element_' + element.id + '" cellpadding="5" border="0" align="left"><tbody><tr>'
+        + '<table data-ui_class="week" data-value="' + value + '" id="_ui_element_' + element.id + '" cellpadding="5" border="0" class="week"><tbody><tr>'
       for (i=0; i<7; i++) {
         a_enabled = (value[i] == "1")
         days = days + '<td><div class="weekday' + (a_enabled?"-selected":"") + '" id="_ui_elpart_'+i+'_'+element.id+'" onclick="ClickDay(\'' + element.id + '\', ' + i + ')">'+ daynames[i] + '</div></td>'
       for (i=0; i<7; i++) {
         a_enabled = (value[i] == "1")
         days = days + '<td><div class="weekday' + (a_enabled?"-selected":"") + '" id="_ui_elpart_'+i+'_'+element.id+'" onclick="ClickDay(\'' + element.id + '\', ' + i + ')">'+ daynames[i] + '</div></td>'
@@ -371,6 +336,7 @@ function DrawNavigator(project, pages) {
   for (const page of pages) {
     list = list + '<li id="_ui_pglink_' + page.id 
       + '" class="pure-menu-item"><a class="pure-menu-link" onclick="DrawPage(\''+ page.id +'\')" href="#' + page.id + '">'
   for (const page of pages) {
     list = list + '<li id="_ui_pglink_' + page.id 
       + '" class="pure-menu-item"><a class="pure-menu-link" onclick="DrawPage(\''+ page.id +'\')" href="#' + page.id + '">'
+      + (page.icon?'<span class="icon">'+page.icon+'</span>':'')
       + page.title+'</a></li>'
   }
   menu.innerHTML = list
       + page.title+'</a></li>'
   }
   menu.innerHTML = list
@@ -379,20 +345,23 @@ function DrawNavigator(project, pages) {
 function DrawContacts(contacts) {
   if (!contacts) return;
   var contact_list = '<hr><h4 class="pure-u1">Контакты</h4>'
 function DrawContacts(contacts) {
   if (!contacts) return;
   var contact_list = '<hr><h4 class="pure-u1">Контакты</h4>'
-  for (const contact of contacts) {
+  for (contact of contacts) {
     const url = new URL(contact)
     var ref
     const url = new URL(contact)
     var ref
-    console.log(url)
     switch (url.protocol) {
       case 'http':
       case 'https:':
     switch (url.protocol) {
       case 'http':
       case 'https:':
-        ref = '&#8962; '+url.hostname
+        ref = '<span class="icon">&#61461;</span>'+url.hostname
         break
       case 'mailto:':
         break
       case 'mailto:':
-        ref = '&#9993; '+url.pathname
+        ref = '<span class="icon">&#61664;</span>'+url.pathname
+        break
+      case 'tg:':
+        ref = '<span class="icon">&#62150;</span>'+url.pathname
+        contact = 'tg://resolve?domain='+url.pathname
         break
       default:
         break
       default:
-        ref = '&#128389; '+url.pathname
+        ref = '<span class="icon">&#62074;</span>'+url.pathname
     }
     contact_list += '<a href="'+contact+'">'+ref+'</a>'
   }
     }
     contact_list += '<a href="'+contact+'">'+ref+'</a>'
   }