build 0006

Optimize JS

static/js/lg-utils.js

@@ -1,136 +0,0 @@
-
-var utils = {
-    getAttribute: function(el, label) {
-        return el[label];
-    },
-
-    setAttribute: function(el, label, value) {
-        el[label] = value;
-    },
-    wrap: function(el, className) {
-        if (!el) {
-            return;
-        }
-
-        var wrapper = document.createElement('div');
-        wrapper.className = className;
-        el.parentNode.insertBefore(wrapper, el);
-        el.parentNode.removeChild(el);
-        wrapper.appendChild(el);
-    },
-
-    addClass: function(el, className) {
-        if (!el) {
-            return;
-        }
-
-        if (el.classList) {
-            el.classList.add(className);
-        } else {
-            el.className += ' ' + className;
-        }
-    },
-
-    removeClass: function(el, className) {
-        if (!el) {
-            return;
-        }
-
-        if (el.classList) {
-            el.classList.remove(className);
-        } else {
-            el.className = el.className.replace(new RegExp('(^|\\b)' + className.split(' ').join('|') + '(\\b|$)', 'gi'), ' ');
-        }
-    },
-
-    hasClass: function(el, className) {
-        if (el.classList) {
-            return el.classList.contains(className);
-        } else {
-            return new RegExp('(^| )' + className + '( |$)', 'gi').test(el.className);
-        }
-    },
-
-    // ex Transform
-    // ex TransitionTimingFunction
-    setVendor: function(el, property, value) {
-        if (!el) {
-            return;
-        }
-
-        el.style[property.charAt(0).toLowerCase() + property.slice(1)] = value;
-        el.style['webkit' + property] = value;
-        el.style['moz' + property] = value;
-        el.style['ms' + property] = value;
-        el.style['o' + property] = value;
-    },
-
-    trigger: function(el, event, detail = null) {
-        if (!el) {
-            return;
-        }
-
-        let customEvent = new CustomEvent(event, {
-            detail: detail
-        });
-        el.dispatchEvent(customEvent);
-    },
-
-    Listener: {
-        uid: 0
-    },
-    on: function(el, events, fn) {
-        if (!el) {
-            return;
-        }
-
-        events.split(' ').forEach(event => {
-            var _id = this.getAttribute(el, 'lg-event-uid') || '';
-            utils.Listener.uid++;
-            _id += '&' + utils.Listener.uid;
-            this.setAttribute(el, 'lg-event-uid', _id);
-            utils.Listener[event + utils.Listener.uid] = fn;
-            el.addEventListener(event.split('.')[0], fn, false);
-        });
-    },
-
-    off: function(el, event) {
-        if (!el) {
-            return;
-        }
-
-        var _id = this.getAttribute(el, 'lg-event-uid');
-        if (_id) {
-            _id = _id.split('&');
-            for (var i = 0; i < _id.length; i++) {
-                if (_id[i]) {
-                    var _event = event + _id[i];
-                    if (_event.substring(0, 1) === '.') {
-                        for (var key in utils.Listener) {
-                            if (utils.Listener.hasOwnProperty(key)) {
-                                if (key.split('.').indexOf(_event.split('.')[1]) > -1) {
-                                    el.removeEventListener(key.split('.')[0], utils.Listener[key]);
-                                    this.setAttribute(el, 'lg-event-uid', this.getAttribute(el, 'lg-event-uid').replace('&' + _id[i], ''));
-                                    delete utils.Listener[key];
-                                }
-                            }
-                        }
-                    } else {
-                        el.removeEventListener(_event.split('.')[0], utils.Listener[_event]);
-                        this.setAttribute(el, 'lg-event-uid', this.getAttribute(el, 'lg-event-uid').replace('&' + _id[i], ''));
-                        delete utils.Listener[_event];
-                    }
-                }
-            }
-        }
-    },
-
-    param: function(obj) {
-        return Object.keys(obj).map(function(k) {
-            return encodeURIComponent(k) + '=' + encodeURIComponent(obj[k]);
-        }).join('&');
-    }
-};
-
-export
-default utils;

static/js/my.js

@@ -5,6 +5,8 @@ function httpGet(theUrl)
     xmlHttp.send( null );
     return JSON.parse(xmlHttp.responseText);
 }
+
+
 function onchange(e){
     var val = e.target.value;
     console.log(val);
@@ -20,6 +22,8 @@ function onchange(e){
         tagsac.appendChild(add_elem);
     });
 }
+
+
 function search(e){
     if (e.keyCode === 13) {
         var tagsac = document.getElementById("myInput");
@@ -39,11 +43,7 @@ function search(e){
             imgc.innerHTML = '';
             resp_res.forEach(function(item, i, resp_res) {
             var add_elem_a = document.createElement("button");
-            if (item["type"] == "i") {
+            add_elem_a.setAttribute("onclick", "see_full('"+item["url_full"]+"', '"+item["id"]+"', '"+item["type"]+"')");
-                add_elem_a.setAttribute("onclick", "see_full_img('"+item["url_full"]+"', '"+item["id"]+"', '"+item["type"]+"')");
-            } else {
-                add_elem_a.setAttribute("onclick", "see_full_vid('"+item["url_full"]+"', '"+item["id"]+"', '"+item["type"]+"')");
-            }
             add_elem_a.setAttribute("id", item["id"]);
             add_elem_a.setAttribute("class", "buttimg");
             var add_elem_img = document.createElement("img");
@@ -57,11 +57,9 @@ function search(e){
     }
 }
 
-function see_full_vid(url, id_button, type){
+
-    var fulldata = document.getElementById("fulldata");
+function see_full(url, id_button, type){
-    if (fulldata != null){
+    close_full();
-        fulldata.remove();
-    }
     var add_elem_br = document.createElement("br");
     var add_elem_p = document.createElement("p");
     add_elem_p.setAttribute("class", "fullimagep");
@@ -75,53 +73,34 @@ function see_full_vid(url, id_button, type){
     var add_elem_ai = document.createElement("a");
     add_elem_ai.setAttribute("href", url);
     add_elem_ai.setAttribute("target", "_blank");
-    var add_elem_img = document.createElement("video");
+    if (type == "v"){
-    add_elem_img.setAttribute("src", url);
+        var add_elem_data = document.createElement("video");
-    add_elem_img.setAttribute("class", "fullimage");
+        add_elem_data.setAttribute("src", url);
-    add_elem_img.controls = true;
+        add_elem_data.setAttribute("class", "fullimage");
-    add_elem_ai.append(add_elem_img)
+        add_elem_data.controls = true;
+    } else {
+        var add_elem_data = document.createElement("img");
+        add_elem_data.setAttribute("src", url);
+        add_elem_data.setAttribute("class", "fullimage");
+    }
+    add_elem_ai.append(add_elem_data)
     add_elem_p.appendChild(add_elem_button);
     add_elem_p.appendChild(add_elem_br);
     add_elem_p.appendChild(add_elem_ai);
-    var targetimg = document.getElementById(id_button);
+    var targetdata = document.getElementById(id_button);
-    targetimg.after(add_elem_p)
+    targetdata.after(add_elem_p)
     add_elem_a.click();
 }
 
-function see_full_img(url, id_button, type){
+
+function close_full(){
     var fulldata = document.getElementById("fulldata");
     if (fulldata != null){
         fulldata.remove();
     }
-    var add_elem_br = document.createElement("br");
-    var add_elem_p = document.createElement("p");
-    add_elem_p.setAttribute("class", "fullimagep");
-    add_elem_p.setAttribute("id", "fulldata");
-    var add_elem_a = document.createElement("a");
-    add_elem_a.setAttribute("href", "#"+id_button);
-    var add_elem_button = document.createElement("button");
-    add_elem_button.textContent = 'CLOSE';
-    add_elem_button.setAttribute("class", "buttonclose");
-    add_elem_button.setAttribute("onclick", "close_full()");
-    var add_elem_ai = document.createElement("a");
-    add_elem_ai.setAttribute("href", url);
-    add_elem_ai.setAttribute("target", "_blank");
-    var add_elem_img = document.createElement("img");
-    add_elem_img.setAttribute("src", url);
-    add_elem_img.setAttribute("class", "fullimage");
-    add_elem_ai.append(add_elem_img)
-    add_elem_p.appendChild(add_elem_button);
-    add_elem_p.appendChild(add_elem_br);
-    add_elem_p.appendChild(add_elem_ai);
-    var targetimg = document.getElementById(id_button);
-    targetimg.after(add_elem_p)
-    add_elem_a.click();
-}
-function close_full(){
-    var fulldata = document.getElementById("fulldata");
-    fulldata.remove();
 }
 
+
 function main_my(){
     var tagBox = document.getElementById("myInput");
     tagBox.addEventListener("input", onchange);