From 77dd489a7a84d2bc39254ee58db6810b7c20b8c3 Mon Sep 17 00:00:00 2001 From: Jack Lukic Date: Fri, 24 May 2013 11:11:25 -0400 Subject: [PATCH] first commit dropdown js Former-commit-id: 33ceace51459a5d5b9825c7f2e1f55642e28a708 Former-commit-id: 313afa0e09e1d7b3112f4edf279d7870faa39e99 --- src/modules/dropdown.js | 287 ++++++++++++++++++++++++++++++++++++++++ 1 file changed, 287 insertions(+) create mode 100644 src/modules/dropdown.js diff --git a/src/modules/dropdown.js b/src/modules/dropdown.js new file mode 100644 index 000000000..2232038b6 --- /dev/null +++ b/src/modules/dropdown.js @@ -0,0 +1,287 @@ +/* ****************************** + Semantic Module: Checkbox + Author: Jack Lukic + Notes: First Commit MAy 25, 2013 + + Simple plug-in which maintains the state for ui dropdown + +****************************** */ + +;(function ( $, window, document, undefined ) { + +$.fn.dropdown = function(parameters) { + var + $allModules = $(this), + + settings = $.extend(true, {}, $.fn.dropdown.settings, parameters), + + eventNamespace = '.' + settings.namespace, + moduleNamespace = 'module-' + settings.namespace, + + selector = $allModules.selector || '', + time = new Date().getTime(), + performance = [], + + query = arguments[0], + methodInvoked = (typeof query == 'string'), + queryArguments = [].slice.call(arguments, 1), + invokedResponse + ; + + $allModules + .each(function() { + var + $module = $(this), + $menu = $(this).find(settings.selector.menu), + + selector = $module.selector || '', + element = this, + instance = $module.data('module-' + settings.namespace), + + className = settings.className, + namespace = settings.namespace, + errors = settings.errors, + module + ; + + module = { + + initialize: function() { + if(settings.context && selector !== '') { + module.verbose('Initializing dropdown with delegated events', $module); + $(element, settings.context) + .on(selector, 'click' + eventNamespace, module.toggle) + .data(moduleNamespace, module) + ; + } + else { + module.verbose('Initializing dropdown with bound events', $module); + $module + .on('click' + eventNamespace, module.toggle) + .data(moduleNamespace, module) + ; + } + }, + + can: { + show: function() { + return $module.hasClass(className.disabled); + } + }, + + destroy: function() { + module.verbose('Destroying previous dropdown for', $module); + $module + .off(namespace) + ; + }, + + enable: function() { + module.debug('Enabling dropdown'); + $module + .addClass(className.active) + ; + $menu + .show() + ; + $.proxy(settings.onChange, $menu.get())(); + $.proxy(settings.onShow, $menu.get())(); + }, + + disable: function() { + module.debug('Disabling dropdown'); + $module + .removeClass(className.active) + ; + $menu + .hide() + ; + $.proxy(settings.onChange, $menu.get())(); + $.proxy(settings.onHide, $menu.get())(); + }, + + toggle: function() { + if(module.can.show()) { + module.show(); + } + else { + module.hide(); + } + }, + + setting: function(name, value) { + if(value !== undefined) { + if( $.isPlainObject(name) ) { + $.extend(true, settings, name); + } + else { + settings[name] = value; + } + } + else { + return settings[name]; + } + }, + internal: function(name, value) { + if(value !== undefined) { + if( $.isPlainObject(name) ) { + $.extend(true, module, name); + } + else { + module[name] = value; + } + } + else { + return module[name]; + } + }, + debug: function() { + if(settings.debug) { + module.performance.log(arguments[0]); + module.verbose = Function.prototype.bind.call(console.info, console, settings.moduleName + ':'); + } + }, + verbose: function() { + if(settings.verbose && settings.debug) { + module.performance.log(arguments[0]); + module.verbose = Function.prototype.bind.call(console.info, console, settings.moduleName + ':'); + } + }, + error: function() { + if(console.log !== undefined) { + module.error = Function.prototype.bind.call(console.log, console, settings.moduleName + ':'); + } + }, + performance: { + log: function(message) { + var + currentTime, + executionTime, + previousTime + ; + if(settings.performance) { + currentTime = new Date().getTime(); + previousTime = time || currentTime, + executionTime = currentTime - previousTime; + time = currentTime; + performance.push({ + 'Element' : element, + 'Name' : message, + 'Execution Time' : executionTime + }); + clearTimeout(module.performance.timer); + module.performance.timer = setTimeout(module.performance.display, 100); + } + }, + display: function() { + var + title = settings.moduleName, + caption = settings.moduleName + ': ' + selector + '(' + $allModules.size() + ' elements)', + totalExecutionTime = 0 + ; + if(selector) { + title += 'Performance (' + selector + ')'; + } + if( (console.group !== undefined || console.table !== undefined) && performance.length > 0) { + console.groupCollapsed(title); + if(console.table) { + $.each(performance, function(index, data) { + totalExecutionTime += data['Execution Time']; + }); + console.table(performance); + } + else { + $.each(performance, function(index, data) { + totalExecutionTime += data['Execution Time']; + }); + } + console.log('Total Execution Time:', totalExecutionTime +'ms'); + console.groupEnd(); + performance = []; + time = false; + } + } + }, + invoke: function(query, passedArguments, context) { + var + maxDepth, + found + ; + passedArguments = passedArguments || queryArguments; + context = element || context; + if(typeof query == 'string' && instance !== undefined) { + query = query.split('.'); + maxDepth = query.length - 1; + $.each(query, function(depth, value) { + if( $.isPlainObject( instance[value] ) && (depth != maxDepth) ) { + instance = instance[value]; + return true; + } + else if( instance[value] !== undefined ) { + found = instance[value]; + return true; + } + module.error(errors.method); + return false; + }); + } + if ( $.isFunction( found ) ) { + module.verbose('Executing invoked function', found); + return found.apply(context, passedArguments); + } + return found || false; + } + }; + + if(methodInvoked) { + if(instance === undefined) { + module.initialize(); + } + invokedResponse = module.invoke(query); + } + else { + if(instance !== undefined) { + module.destroy(); + } + module.initialize(); + } + }) + ; + return (invokedResponse) + ? invokedResponse + : this + ; +}; + +$.fn.dropdown.settings = { + + moduleName : 'Dropdown Module', + namespace : 'dropdown', + + verbose : true, + debug : true, + performance : false, + + // delegated event context + context : false, + required : 'auto', + + onChange : function(){}, + onShow : function(){}, + onHide : function(){}, + + errors : { + method : 'The method you called is not defined.' + }, + + selector : { + menu : '.menu' + }, + + className : { + active : 'visible' + } + +}; + +})( jQuery, window , document );