/** * @fileOverview svelte - the lightweight modern DOM manipulation and events library * @author Matt Begent * @version 1.4.3 */ (function (window, document) { 'use strict'; var svelteProto = { /** * Each loop * @memberOf Svelte * @param {function} callback Function to be run on each selector * @returns Svelte * @example * $('.each').each(function() { }); */ each: function(callback) { for (var i = 0, len = this.s.length; i < len; i++) { callback(this.s[i]); } return this; }, /** * Find a new selector within a parent selector * @memberOf Svelte * @param {string} selector Find a new selector within a parent selector * @returns Svelte * @example * $('.parent').find('.child'); */ find: function(selector) { return new Svelte(selector, this.s[0]); }, /** * Set the CSS for an element * @memberOf Svelte * @param {string} property Property of element to set * @param {string} value Value of property to set * @returns Svelte * @example * $('.color').css('color', 'red'); */ css: function(property, value) { if(value) { return this.each(function(el) { el.style[property] = value; }); } else { return getComputedStyle(this.s[0])[property]; } }, /** * Sets selector to display none * @memberOf Svelte * @returns Svelte * @example * $('.hide').hide(); */ hide: function() { return this.each(function(el) { el.style.display = 'none'; }); }, /** * Sets selector to display block * @memberOf Svelte * @returns Svelte * @example * $('.show').show(); */ show: function() { return this.each(function(el) { el.style.display = 'block'; }); }, /** * Checks whether the selector is visible * @memberOf Svelte * @returns Boolean * @example * $('.visible').visible(); */ visible: function() { if(this.s.length > 0) { return this.s[0].offsetWidth > 0 || this.s[0].offsetHeight > 0; } else { return false; } }, /** * Toggles the display property of the selector * @memberOf Svelte * @returns Boolean * @example * $('.visible').visible(); */ toggle: function() { return this.each(function(el) { if(el.style.display === '' || el.style.display === 'block') { el.style.display = 'none'; } else { el.style.display = 'block'; } }); }, /** * Adds a class to the selector * @memberOf Svelte * @param {string} className Name of class to add * @returns Svelte * @example * $('.class').addClass('another-class'); */ addClass: function(className) { return this.each(function(el) { el.classList.add(className); }); }, /** * Removes a class from the selector * @memberOf Svelte * @param {string} className Name of class to remove * @returns Svelte * @example * $('.class remove-class').removeClass('remove-class'); */ removeClass: function(className) { return this.each(function(el) { el.classList.remove(className); }); }, /** * Toggles a class from the selector * @memberOf Svelte * @param {string} className Name of class to toggle * @returns Svelte * @example * $('.class toggle-class').toggleClass('toggle-class'); */ toggleClass: function(className) { return this.each(function(el) { el.classList.toggle(className); }); }, /** * Checks whether the selector has a specific class * @memberOf Svelte * @returns Boolean * @example * $('.class').hasClass('another-class'); */ hasClass: function(className) { if(this.s.length > 0) { return this.s[0].classList.contains(className); } else { return false; } }, /** * Attaches an event to the selector * @memberOf Svelte * @param {string} name Name of event e.g. click or names of events separated by spaces e.g. 'keyup keydown' * @param {function} callback Callback to run when event is triggered * @returns Svelte * @example * $('.click-me').on('click', function() { alert('Clicked!'); }); */ on: function(name, callback) { return this.each(function(el) { name.split(' ').forEach(function(ev){ el.addEventListener(ev, callback); }); }); }, /** * Attaches an event to the selector and removes after callback * @memberOf Svelte * @param {string} name Name of event e.g. 'click' or names of events separated by spaces e.g. 'keyup keydown' * @param {function} callback Callback to run when event is triggered * @returns Svelte * @example * $('.click-me').one('click', function() { alert('Clicked!'); }); */ one: function(name, callback) { return this.each(function(el) { name.split(' ').forEach(function(ev){ var callbackWithRemove = function() { callback(); el.removeEventListener(ev, callbackWithRemove); // remove event }; el.addEventListener(ev, callbackWithRemove); }); }); }, /** * Removes an event from the selector * @memberOf Svelte * @param {string} name Name of event e.g. click or names of events separated by spaces e.g. 'keyup keydown' * @param {function} callback Callback to run when event is triggered * @returns Svelte * @example * $('.click-me').off('click', function() { alert('Clicked!'); }); */ off: function(name, callback) { return this.each(function(el) { name.split(' ').forEach(function(ev){ el.removeEventListener(ev, callback); }); }); }, /** * Sets the first selector to be focussed * @memberOf Svelte * @returns Svelte * @example * $('.focus').focus(); */ focus: function() { if(this.s.length > 0) { this.s[0].focus(); } return this; }, /** * Removes keyboard focus from first selector * @memberOf Svelte * @returns Svelte * @example * $('.blur').blur(); */ blur: function() { if(this.s.length > 0) { this.s[0].blur(); } return this; }, /** * Trigger an event from the selector * @memberOf Svelte * @param {string} name Name of event e.g. click * @param {object} detail The data passed when initializing the event * @returns Svelte * @example * $('.click-me').trigger('click'); */ trigger: function(name, detail) { return this.each(function(el) { var triggerEvent = ((detail) ? new CustomEvent(name, detail) : document.createEvent('HTMLEvents')); if(!detail) { triggerEvent.initEvent(name, true, false); } el.dispatchEvent(triggerEvent); }); }, /** * Find the previous sibling to the current selector * @memberOf Svelte * @returns Svelte * @example * $('.selector').prev(); */ prev: function() { if(this.s.length > 0) { this.s = this.s[0].previousElementSibling; } else { this.s = []; } return this; }, /** * Find the next sibling to the current selector * @memberOf Svelte * @returns Svelte * @example * $('.selector').next(); */ next: function() { if(this.s.length > 0) { this.s = this.s[0].nextElementSibling; } else { this.s = []; } return this; }, /** * Find the first element of the selector * @memberOf Svelte * @returns Svelte * @example * $('.selector').first(); */ first: function() { if(this.s.length > 0) { this.s = this.s[0]; } return this; }, /** * Find the last element of the selector * @memberOf Svelte * @returns Svelte * @example * $('.selector').last(); */ last: function() { if(this.s.length > 0) { var arrayLength = this.s.length; this.s = this.s.slice(arrayLength-1,arrayLength); } return this; }, /** * Find the parent of the selector * @memberOf Svelte * @returns Svelte * @example * $('.selector').parent(); */ parent: function() { if(this.s.length > 0) { this.s = this.s[0].parentNode; } return this; }, /** * Find the children of the selector * @memberOf Svelte * @returns Svelte * @example * $('.selector').children(); */ children: function() { if(this.s.length > 0) { this.s.slice.call(this.s[0].children); } else { this.s = []; } return this; }, /** * Add HTML to the page in relation to the current selector * @memberOf Svelte * @param {string} position The position to add the html - before, after, atstart, atend * @param {string} html The HTML to add * @returns Svelte * @example * $('.html').append('before','

I am before

'); */ append: function(position, html) { return this.each(function(el) { switch(position.toLowerCase()){ case 'before': return el.insertAdjacentHTML('beforebegin', html); case 'after': return el.insertAdjacentHTML('afterend', html); case 'atstart': return el.insertAdjacentHTML('afterbegin', html); case 'atend': return el.insertAdjacentHTML('beforeend', html); } }); }, /** * Set the text of a selector * @memberOf Svelte * @param {string} text Text to set * @returns Svelte or text * @example * $('.text').text('Some text.'); */ text: function(text) { if(text) { return this.each(function(el) { el.textContent = text; }); } else { return this.s[0].textContent.trim(); } }, /** * Set the HTML of a selector * @memberOf Svelte * @param {string} html HTML to set * @returns Svelte or HTML * @example * $('.text').html('A span.'); */ html: function(html) { if(html) { return this.each(function(el) { el.innerHTML = html; }); } else { return this.s[0].innerHTML; } }, /** * Set the outerHTML of a selector * @memberOf Svelte * @param {string} html HTML to set * @returns Svelte or HTML * @example * $('.text').outerHTML('A span.'); */ outerHTML: function(html) { if(html) { return this.each(function(el) { el.outerHTML = html; }); } else { return this.s[0].outerHTML; } }, /** * Empty the HTML of a selector * @memberOf Svelte * @returns Svelte * @example * $('.empty-me').empty(); */ empty: function() { return this.each(function(el) { el.innerHTML = ''; }); }, /** * Clone a selector * @memberOf Svelte * @returns Svelte * @example * $('.empty-me').clone(); */ clone: function() { return this.each(function(el) { el.clodeNode(true); }); }, /** * Removes a selector * @memberOf Svelte * @returns Svelte * @example * $('.remove-me').remove(); */ remove: function() { return this.each(function(el) { el.parentNode.removeChild(el); }); }, /** * Get or set the attribute of a selector * @memberOf Svelte * @param {string} name Attr to get or set * @param {string} value Value to set * @returns Svelte * @example * $('.get-attr').attr('data-attr'); * $('.set-attr').attr('data-attr','Value'); */ attr: function(name, value) { if(!value) { return this.s[0].getAttribute(name); } else { return this.each(function(el) { el.setAttribute(name, value); }); } }, /** * Remove an attribute from a selector * @memberOf Svelte * @param {string} name Attr to remove * @returns Svelte * @example * $('.attr').removeAttr('data-attr'); */ removeAttr: function(name) { return this.each(function(el) { el.removeAttribute(name); }); }, /** * Get the value of a selector * @memberOf Svelte * @param {string} value Value to set * @returns value * @example * $('.input').val(); */ val: function(value) { if(value) { return this.each(function(el) { el.value = value; }); } else { if(this.s.length > 0) { return this.s[0].value; } else { return undefined; } } }, /** * Get the number of matched elements in the selector * @memberOf Svelte * @returns length * @example * $('.length').length(); */ length: function() { return this.s.length; }, /** * Get the height of the first element in the selector * @memberOf Svelte * @returns number height * @example * $('.height').height(); */ height: function() { if(this.s.length > 0) { return this.s[0].offsetHeight; } else { return null; } }, /** * Get the width of the first element in the selector * @memberOf Svelte * @returns number width * @example * $('.width').width(); */ width: function() { if(this.s.length > 0) { return this.s[0].offsetWidth; } else { return null; } }, /** * Returns the position of the first element in the selector relative to the viewport * @memberOf Svelte * @returns TextRectangle object * @example * $('.position').position(); */ position: function() { if(this.s.length > 0) { return this.s[0].getBoundingClientRect(); } else { return null; } }, /** * Returns true if the element matches the selector string * @memberOf Svelte * @param {string} selector Selector to match * @returns boolean * @example * $('.paragraph').matches('p'); */ matches: function(selector) { return this.s[0].matches(selector); }, /** * Returns closest element to selector * @memberOf Svelte * @param {string} selector Selector to match * @returns Svelte * @example * $('.logo').closest('.header'); */ closest: function(selector) { return new Svelte(this.s[0].closest(selector)); } }; /** @constructor Svelte */ function Svelte(selector, context) { return Object.create(svelteProto, { s: { get: function () { if(typeof selector === 'string') { var startAt = ((context === 'string') ? document.querySelectorAll(selector) : context) || document; // tidy up var nl = startAt.querySelectorAll(selector); var arr = []; for (var i = 0, len = arr.length = nl.length; i < len; i++) { arr[i] = nl[i]; } return arr; } else { return [selector]; // could be an object, dom node or a function but always kept in an array } }, set: function(value) { selector = value; } } }); } // AMD support if (typeof define === "function" && define.amd) { define(function() { return Svelte; }); } // Expose svelte to the world:-) window.$ = window.Svelte = Svelte; // Expose functions to the world window.$.fn = svelteProto; }(window, document)); // Polyfills // Matches - prefixed in IE, IOS7 Safari and older Android browser versions if(!Element.prototype.matches) { Element.prototype.matches = Element.prototype.matchesSelector || Element.prototype.msMatchesSelector || Element.prototype.webkitMatchesSelector; } // Closest - not yet supported by IE and Safari if(!Element.prototype.closest) { Element.prototype.closest = function closest(selector) { var node = this; while (node) { if (node.matches(selector)) { return node; } else { node = node.parentElement; } } return null; }; }