diff --git a/index.html b/index.html new file mode 100644 index 0000000..da5a362 --- /dev/null +++ b/index.html @@ -0,0 +1,13 @@ + + + + Mini Query + + +
eyed
+
klass
+ click me + + + + \ No newline at end of file diff --git a/lib/miniquery.js b/lib/miniquery.js new file mode 100644 index 0000000..ecb691d --- /dev/null +++ b/lib/miniquery.js @@ -0,0 +1,83 @@ +SweetSelector = { + select: (option) => { + switch(option[0]) { + case '#': + let resId = document.getElementById(option.slice(1)); + console.log(resId); + break; + case '.': + let resClass = document.getElementsByClassName(option.slice(1)); + console.log(resClass); + break; + default: + let resTag = document.getElementsByTagName(option) + console.log(resTag); + break; + } + } +} + +DOM = { + hide: (option) => { + document.querySelectorAll(option).forEach((value) => {value.style.visibility = "hidden"}); + }, + show: (option) => { + document.querySelectorAll(option).forEach((value) => {value.style.visibility = "visible"}); + }, + addClass: (option, newClass) => { + document.querySelectorAll(option).forEach((value) => {value.classList.add(newClass);}); + }, + removeClass: (option, newClass) => { + document.querySelectorAll(option).forEach((value) => {value.classList.remove(newClass);}) + } +} + +EventDispatcher = { + on: (option, mthd, func) => { + document.querySelectorAll(option).forEach((value) => {value.addEventListener(mthd, func);}); + }, + trigger: (option, mthd) => { + document.querySelectorAll(option).forEach((value) => {value.dispatchEvent(new MouseEvent(mthd));}) + } +} + +AjaxWrapper = { + request: (obj) => { + var req = new XMLHttpRequest(); + req.onreadystatechange = function () { + if (req.readyState == 4 && req.status == 200) { + obj.success() + } else { + obj.failed() + } + } + req.open(obj.type, obj.url); + req.send(); + // req.onload = obj.success; + }, +} + +const miniquery = function(option) { + if(this.__proto__.constructor !== miniquery) { + return new miniquery(option) + } + + this.element = document.querySelectorAll(option); + + this.hide = () => {DOM.hide(option)} + this.show = () => {DOM.show(option)} + + this.addClass = (newClass) => {DOM.addClass(option, newClass)} + this.removeClass = (newClass) => {DOM.removeClass(option, newClass)} + + this.on = (newMethod, funct) => {EventDispatcher.on(option, newMethod, funct)} + this.trigger = (newMethod, funct) => {EventDispatcher.trigger} + + this.ajax = (obj) => {AjaxWrapper.request(obj)} +} + +const $ = function(option) { + if(this.__proto__.constructor !== miniquery) { + return new miniquery(option) + } +} \ No newline at end of file diff --git a/lib/test.js b/lib/test.js new file mode 100644 index 0000000..b9b60dc --- /dev/null +++ b/lib/test.js @@ -0,0 +1,26 @@ +miniquery('#eyed'); +miniquery('.klass'); +miniquery('a'); + +miniquery('#eyed').hide(); +miniquery('#eyed').show(); +miniquery('.klass').addClass('shadi'); +miniquery('.klass'); +miniquery('.klass').removeClass('shadi'); +miniquery('.klass'); + +miniquery('.klass').on('click', function() {console.log("awsome!")}); +miniquery('.klass').trigger('click'); + +miniquery().ajax({ + url: 'http://localhost:3000', + type: 'GET', + success: function() { + console.log('connected!'); + }, + failed: function() { + console.log('failed'); + } +}) + +$('#eyed').hide() \ No newline at end of file