ads
8 months ago
control
8 months ago
img
10 years ago
blocker.js
1 week ago
blocker.min.js
1 week ago
embed.js
5 years ago
embed.min.js
7 months ago
front.js
1 day ago
front.min.js
1 day ago
jquery-ui-timepicker-addon.js
10 years ago
jquery-ui-timepicker-addon.min.js
7 months ago
jquery.dataTables.min.js
1 year ago
jquery.validate.js
7 months ago
jquery.validate.min.js
1 week ago
jqueryFileTree.js
5 years ago
jqueryFileTree.min.js
7 months ago
overwatch.js
7 months ago
overwatch.min.js
7 months ago
password-strength.js
2 years ago
password-strength.min.js
7 months ago
simple-scrollbar.js
7 months ago
simple-scrollbar.min.js
7 months ago
simplebar.js
6 years ago
validator.min.js
9 years ago
vue.js
9 months ago
vue.min.js
9 months ago
wpdm-admin.js
1 week ago
wpdm-admin.min.js
1 week ago
wpdm.js
6 months ago
wpdm.min.js
6 months ago
overwatch.js
119 lines
| 1 | /* |
| 2 | Ⓒ copyright: Shahnur Alam ( https://github.com/codename065/ ) |
| 3 | Version: 1.0.0 |
| 4 | */ |
| 5 | const OverWatch = (ID) => { |
| 6 | const area = document.getElementById(ID); |
| 7 | const buffer_html = area.innerHTML.replaceAll(/{(.+)}/ig, "<data name='$1'>{$1}</data>"); |
| 8 | area.innerHTML = buffer_html; |
| 9 | let _loops = []; |
| 10 | let _attrs = []; |
| 11 | let looped_sections = document.querySelectorAll(`#${ID} loop`); |
| 12 | let attrs = document.querySelectorAll(`#${ID} [o-attr]`); |
| 13 | |
| 14 | for (const [key, elm] of Object.entries(attrs)) { |
| 15 | let _attr = elm.getAttribute("o-attr"); |
| 16 | let _var = elm.getAttribute('w-val'); |
| 17 | if(!_attrs[_var]) _attrs[_var] = [] |
| 18 | _attrs[_var].push({_attr: _attr, _var: _var, _elm: elm}); |
| 19 | } |
| 20 | for (const [key, loop] of Object.entries(looped_sections)) { |
| 21 | let _for = loop.getAttribute(":for"); |
| 22 | let _each = loop.getAttribute(":each"); |
| 23 | _loops[_for] = {_for: _for, _each: _each, _repeat: loop.innerHTML, _loop: loop}; |
| 24 | loop.innerHTML = ''; |
| 25 | } |
| 26 | //console.log('_loops', _loops); |
| 27 | |
| 28 | let parent = []; |
| 29 | //let data_source = {}; |
| 30 | let flat_data = []; |
| 31 | let key = ''; |
| 32 | |
| 33 | const handler = { |
| 34 | |
| 35 | set(target, prop, value) { |
| 36 | //console.log('Called for ', parent); |
| 37 | key = parent.length > 0 ? parent.join('.') + `.${prop}` : prop; |
| 38 | //console.log('Called for ', key); |
| 39 | parent = []; |
| 40 | if (typeof value === 'object') { |
| 41 | value = new Proxy(value, handler); |
| 42 | //console.log('key:', key); |
| 43 | process(key, value); |
| 44 | } |
| 45 | Reflect.set(target, prop, value); |
| 46 | interpret(key, value); |
| 47 | }, |
| 48 | |
| 49 | get(target, prop, receiver) { |
| 50 | if(typeof prop === 'string') |
| 51 | parent.push(prop); |
| 52 | return Reflect.get(target, prop); |
| 53 | } |
| 54 | |
| 55 | }; |
| 56 | |
| 57 | const interpret = (key, value) => { |
| 58 | //console.log('KEY:', key); |
| 59 | document.querySelectorAll(`#${ID} data[name='${key}']`).forEach(elm => { |
| 60 | elm.innerHTML = value; |
| 61 | }); |
| 62 | if(_attrs[key]) { |
| 63 | let elms = _attrs[key]; |
| 64 | elms.forEach((elm) => { |
| 65 | elm._elm.setAttribute(elm._attr, value); |
| 66 | }); |
| 67 | } |
| 68 | }; |
| 69 | |
| 70 | const valueof = (data_source, index) => { |
| 71 | let value = data_source; |
| 72 | index = index.split('.'); |
| 73 | index.forEach(prop => { |
| 74 | value = Reflect.get(data_source, prop); |
| 75 | }); |
| 76 | //console.log('vo ', value); |
| 77 | return value; |
| 78 | } |
| 79 | |
| 80 | const process = (name, obj) => { |
| 81 | //console.log('Processed ' + name, obj); |
| 82 | if (_loops[name]) { |
| 83 | let loop = _loops[name]; |
| 84 | let _for = obj; |
| 85 | let _html = ''; |
| 86 | let index = 0; |
| 87 | //console.log('LOOP:', loop); |
| 88 | //console.log('_for:', _for); |
| 89 | try { |
| 90 | _for.forEach(item => { |
| 91 | let keys = Object.keys(item); |
| 92 | let _processed_html = loop._repeat; |
| 93 | keys.forEach(key => { |
| 94 | _processed_html = `<loop_item key='${name}.${index}.${key}'>` + _processed_html.replace(`:${loop._each}.${key}`, item[key]) + `</loop_item>`; |
| 95 | }); |
| 96 | _html += _processed_html; |
| 97 | index++; |
| 98 | }); |
| 99 | loop._loop.innerHTML = _html; |
| 100 | } catch (e) { |
| 101 | |
| 102 | } |
| 103 | //console.log(_html) |
| 104 | } |
| 105 | |
| 106 | for (let [key, value] of Object.entries(obj)) { |
| 107 | const index = `${name}.${key}`; |
| 108 | if (typeof value !== 'object') { |
| 109 | interpret(index, value); |
| 110 | } else if (typeof value === 'object') { |
| 111 | value = new Proxy(value, handler); |
| 112 | process(index, value); |
| 113 | } |
| 114 | } |
| 115 | }; |
| 116 | |
| 117 | return new Proxy({}, handler); |
| 118 | } |
| 119 |