diff --git a/build/minified/modules/sidebar.js b/build/minified/modules/sidebar.js
new file mode 100644
index 000000000..31a7af8dd
--- /dev/null
+++ b/build/minified/modules/sidebar.js
@@ -0,0 +1,341 @@
+/* ******************************
+ Semantic Module: Dropdown
+ Author: Jack Lukic
+ Notes: First Commit May 25, 2013
+
+****************************** */
+
+;(function ( $, window, document, undefined ) {
+
+$.fn.sidebar = function(parameters) {
+ var
+ $allModules = $(this),
+
+ settings = ( $.isPlainObject(parameters) )
+ ? $.extend(true, {}, $.fn.sidebar.settings, parameters)
+ : $.fn.sidebar.settings,
+
+ className = settings.className,
+ namespace = settings.namespace,
+ error = settings.error,
+
+ eventNamespace = '.' + namespace,
+ moduleNamespace = 'module-' + namespace,
+ moduleSelector = $allModules.selector || '',
+
+ time = new Date().getTime(),
+ performance = [],
+
+ query = arguments[0],
+ methodInvoked = (typeof query == 'string'),
+ queryArguments = [].slice.call(arguments, 1),
+ invokedResponse
+ ;
+
+ $allModules
+ .each(function() {
+ var
+ $body = $('body'),
+ $module = $(this),
+
+ element = this,
+ instance = $module.data(moduleNamespace),
+ module
+ ;
+
+ module = {
+
+ initialize: function() {
+ module.debug('Initializing sidebar', $module);
+ module.instantiate();
+ },
+
+ instantiate: function() {
+ module.verbose('Storing instance of module', module);
+ $module
+ .data(moduleNamespace, module)
+ ;
+ },
+
+ destroy: function() {
+ module.verbose('Destroying previous module for', $module);
+ $module
+ .off(namespace)
+ .removeData(moduleNamespace)
+ ;
+ },
+
+ attach: {
+
+ events: function(selector, event) {
+ var
+ $toggle = $(selector)
+ ;
+ event = $.isFunction(module[event])
+ ? module[event]
+ : module.toggle
+ ;
+ if($toggle.size() > 0) {
+ module.debug('Attaching sidebar events to element', selector, event);
+ $toggle
+ .on('click' + eventNamespace, event)
+ ;
+ }
+ else {
+ module.error(error.notFound);
+ }
+ }
+
+ },
+
+ show: function() {
+ if(module.is.closed()) {
+ module.debug('Showing sidebar');
+ $body
+ .animate(module.get.bodyCSS(), settings.duration, settings.onShow)
+ ;
+ $module
+ .addClass(className.open)
+ ;
+ }
+ },
+
+ hide: function() {
+ if(module.is.open()) {
+ $module
+ .removeClass(className.open)
+ ;
+ }
+ },
+
+ toggle: function() {
+ if(module.is.open()) {
+ module.close();
+ }
+ else {
+ module.open();
+ }
+ },
+
+ get: {
+ bodyCSS: function() {
+
+ }
+ },
+
+ is: {
+ open: function() {
+ return $module.is(':visible');
+ },
+ closed: function() {
+ return $module.is(':not(:visible)');
+ }
+ },
+
+ 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) {
+ if(settings.performance) {
+ module.performance.log(arguments);
+ }
+ else {
+ module.debug = Function.prototype.bind.call(console.info, console, settings.moduleName + ':');
+ module.debug.apply(console, arguments);
+ }
+ }
+ },
+ verbose: function() {
+ if(settings.verbose && settings.debug) {
+ if(settings.performance) {
+ module.performance.log(arguments);
+ }
+ else {
+ module.verbose = Function.prototype.bind.call(console.info, console, settings.moduleName + ':');
+ module.verbose.apply(console, arguments);
+ }
+ }
+ },
+ error: function() {
+ module.error = Function.prototype.bind.call(console.error, console, settings.moduleName + ':');
+ module.error.apply(console, arguments);
+ },
+ 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[0],
+ 'Arguments' : [].slice.call(message, 1) || '',
+ 'Execution Time' : executionTime
+ });
+ }
+ clearTimeout(module.performance.timer);
+ module.performance.timer = setTimeout(module.performance.display, 100);
+ },
+ display: function() {
+ var
+ title = settings.moduleName + ':',
+ totalTime = 0
+ ;
+ time = false;
+ clearTimeout(module.performance.timer);
+ $.each(performance, function(index, data) {
+ totalTime += data['Execution Time'];
+ });
+ title += ' ' + totalTime + 'ms';
+ if(moduleSelector) {
+ title += ' \'' + moduleSelector + '\'';
+ }
+ if( (console.group !== undefined || console.table !== undefined) && performance.length > 0) {
+ console.groupCollapsed(title);
+ if(console.table) {
+ console.table(performance);
+ }
+ else {
+ $.each(performance, function(index, data) {
+ console.log(data['Name'] + ': ' + data['Execution Time']+'ms');
+ });
+ }
+ console.groupEnd();
+ }
+ performance = [];
+ }
+ },
+ invoke: function(query, passedArguments, context) {
+ var
+ maxDepth,
+ found,
+ response
+ ;
+ passedArguments = passedArguments || queryArguments;
+ context = element || context;
+ if(typeof query == 'string' && instance !== undefined) {
+ query = query.split(/[\. ]/);
+ maxDepth = query.length - 1;
+ $.each(query, function(depth, value) {
+ var camelCaseValue = (depth != maxDepth)
+ ? value + query[depth + 1].charAt(0).toUpperCase() + query[depth + 1].slice(1)
+ : query
+ ;
+ if( $.isPlainObject( instance[value] ) && (depth != maxDepth) ) {
+ instance = instance[value];
+ }
+ else if( $.isPlainObject( instance[camelCaseValue] ) && (depth != maxDepth) ) {
+ instance = instance[camelCaseValue];
+ }
+ else if( instance[value] !== undefined ) {
+ found = instance[value];
+ return false;
+ }
+ else if( instance[camelCaseValue] !== undefined ) {
+ found = instance[camelCaseValue];
+ return false;
+ }
+ else {
+ module.error(error.method);
+ return false;
+ }
+ });
+ }
+ if ( $.isFunction( found ) ) {
+ response = found.apply(context, passedArguments);
+ }
+ else if(found !== undefined) {
+ response = found;
+ }
+ if($.isArray(invokedResponse)) {
+ invokedResponse.push(response);
+ }
+ else if(typeof invokedResponse == 'string') {
+ invokedResponse = [invokedResponse, response];
+ }
+ else if(response !== undefined) {
+ invokedResponse = response;
+ }
+ return found;
+ }
+ };
+
+ if(methodInvoked) {
+ if(instance === undefined) {
+ module.initialize();
+ }
+ module.invoke(query);
+ }
+ else {
+ if(instance !== undefined) {
+ module.destroy();
+ }
+ module.initialize();
+ }
+ })
+ ;
+
+ return (invokedResponse !== undefined)
+ ? invokedResponse
+ : this
+ ;
+};
+
+$.fn.sidebar.settings = {
+
+ moduleName : 'Sidebar',
+ namespace : 'sidebar',
+
+ verbose : true,
+ debug : true,
+ performance : true,
+
+ side : 'left',
+ duration : 500,
+
+ onChange : function(){},
+ onShow : function(){},
+ onHide : function(){},
+
+ className: {
+ open: 'active'
+ },
+
+ error : {
+ method : 'The method you called is not defined.',
+ notFound : 'There were no elements that matched the specified selector'
+ }
+
+};
+
+})( jQuery, window , document );
\ No newline at end of file
diff --git a/build/packaged/modules/sidebar.js b/build/packaged/modules/sidebar.js
new file mode 100644
index 000000000..31a7af8dd
--- /dev/null
+++ b/build/packaged/modules/sidebar.js
@@ -0,0 +1,341 @@
+/* ******************************
+ Semantic Module: Dropdown
+ Author: Jack Lukic
+ Notes: First Commit May 25, 2013
+
+****************************** */
+
+;(function ( $, window, document, undefined ) {
+
+$.fn.sidebar = function(parameters) {
+ var
+ $allModules = $(this),
+
+ settings = ( $.isPlainObject(parameters) )
+ ? $.extend(true, {}, $.fn.sidebar.settings, parameters)
+ : $.fn.sidebar.settings,
+
+ className = settings.className,
+ namespace = settings.namespace,
+ error = settings.error,
+
+ eventNamespace = '.' + namespace,
+ moduleNamespace = 'module-' + namespace,
+ moduleSelector = $allModules.selector || '',
+
+ time = new Date().getTime(),
+ performance = [],
+
+ query = arguments[0],
+ methodInvoked = (typeof query == 'string'),
+ queryArguments = [].slice.call(arguments, 1),
+ invokedResponse
+ ;
+
+ $allModules
+ .each(function() {
+ var
+ $body = $('body'),
+ $module = $(this),
+
+ element = this,
+ instance = $module.data(moduleNamespace),
+ module
+ ;
+
+ module = {
+
+ initialize: function() {
+ module.debug('Initializing sidebar', $module);
+ module.instantiate();
+ },
+
+ instantiate: function() {
+ module.verbose('Storing instance of module', module);
+ $module
+ .data(moduleNamespace, module)
+ ;
+ },
+
+ destroy: function() {
+ module.verbose('Destroying previous module for', $module);
+ $module
+ .off(namespace)
+ .removeData(moduleNamespace)
+ ;
+ },
+
+ attach: {
+
+ events: function(selector, event) {
+ var
+ $toggle = $(selector)
+ ;
+ event = $.isFunction(module[event])
+ ? module[event]
+ : module.toggle
+ ;
+ if($toggle.size() > 0) {
+ module.debug('Attaching sidebar events to element', selector, event);
+ $toggle
+ .on('click' + eventNamespace, event)
+ ;
+ }
+ else {
+ module.error(error.notFound);
+ }
+ }
+
+ },
+
+ show: function() {
+ if(module.is.closed()) {
+ module.debug('Showing sidebar');
+ $body
+ .animate(module.get.bodyCSS(), settings.duration, settings.onShow)
+ ;
+ $module
+ .addClass(className.open)
+ ;
+ }
+ },
+
+ hide: function() {
+ if(module.is.open()) {
+ $module
+ .removeClass(className.open)
+ ;
+ }
+ },
+
+ toggle: function() {
+ if(module.is.open()) {
+ module.close();
+ }
+ else {
+ module.open();
+ }
+ },
+
+ get: {
+ bodyCSS: function() {
+
+ }
+ },
+
+ is: {
+ open: function() {
+ return $module.is(':visible');
+ },
+ closed: function() {
+ return $module.is(':not(:visible)');
+ }
+ },
+
+ 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) {
+ if(settings.performance) {
+ module.performance.log(arguments);
+ }
+ else {
+ module.debug = Function.prototype.bind.call(console.info, console, settings.moduleName + ':');
+ module.debug.apply(console, arguments);
+ }
+ }
+ },
+ verbose: function() {
+ if(settings.verbose && settings.debug) {
+ if(settings.performance) {
+ module.performance.log(arguments);
+ }
+ else {
+ module.verbose = Function.prototype.bind.call(console.info, console, settings.moduleName + ':');
+ module.verbose.apply(console, arguments);
+ }
+ }
+ },
+ error: function() {
+ module.error = Function.prototype.bind.call(console.error, console, settings.moduleName + ':');
+ module.error.apply(console, arguments);
+ },
+ 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[0],
+ 'Arguments' : [].slice.call(message, 1) || '',
+ 'Execution Time' : executionTime
+ });
+ }
+ clearTimeout(module.performance.timer);
+ module.performance.timer = setTimeout(module.performance.display, 100);
+ },
+ display: function() {
+ var
+ title = settings.moduleName + ':',
+ totalTime = 0
+ ;
+ time = false;
+ clearTimeout(module.performance.timer);
+ $.each(performance, function(index, data) {
+ totalTime += data['Execution Time'];
+ });
+ title += ' ' + totalTime + 'ms';
+ if(moduleSelector) {
+ title += ' \'' + moduleSelector + '\'';
+ }
+ if( (console.group !== undefined || console.table !== undefined) && performance.length > 0) {
+ console.groupCollapsed(title);
+ if(console.table) {
+ console.table(performance);
+ }
+ else {
+ $.each(performance, function(index, data) {
+ console.log(data['Name'] + ': ' + data['Execution Time']+'ms');
+ });
+ }
+ console.groupEnd();
+ }
+ performance = [];
+ }
+ },
+ invoke: function(query, passedArguments, context) {
+ var
+ maxDepth,
+ found,
+ response
+ ;
+ passedArguments = passedArguments || queryArguments;
+ context = element || context;
+ if(typeof query == 'string' && instance !== undefined) {
+ query = query.split(/[\. ]/);
+ maxDepth = query.length - 1;
+ $.each(query, function(depth, value) {
+ var camelCaseValue = (depth != maxDepth)
+ ? value + query[depth + 1].charAt(0).toUpperCase() + query[depth + 1].slice(1)
+ : query
+ ;
+ if( $.isPlainObject( instance[value] ) && (depth != maxDepth) ) {
+ instance = instance[value];
+ }
+ else if( $.isPlainObject( instance[camelCaseValue] ) && (depth != maxDepth) ) {
+ instance = instance[camelCaseValue];
+ }
+ else if( instance[value] !== undefined ) {
+ found = instance[value];
+ return false;
+ }
+ else if( instance[camelCaseValue] !== undefined ) {
+ found = instance[camelCaseValue];
+ return false;
+ }
+ else {
+ module.error(error.method);
+ return false;
+ }
+ });
+ }
+ if ( $.isFunction( found ) ) {
+ response = found.apply(context, passedArguments);
+ }
+ else if(found !== undefined) {
+ response = found;
+ }
+ if($.isArray(invokedResponse)) {
+ invokedResponse.push(response);
+ }
+ else if(typeof invokedResponse == 'string') {
+ invokedResponse = [invokedResponse, response];
+ }
+ else if(response !== undefined) {
+ invokedResponse = response;
+ }
+ return found;
+ }
+ };
+
+ if(methodInvoked) {
+ if(instance === undefined) {
+ module.initialize();
+ }
+ module.invoke(query);
+ }
+ else {
+ if(instance !== undefined) {
+ module.destroy();
+ }
+ module.initialize();
+ }
+ })
+ ;
+
+ return (invokedResponse !== undefined)
+ ? invokedResponse
+ : this
+ ;
+};
+
+$.fn.sidebar.settings = {
+
+ moduleName : 'Sidebar',
+ namespace : 'sidebar',
+
+ verbose : true,
+ debug : true,
+ performance : true,
+
+ side : 'left',
+ duration : 500,
+
+ onChange : function(){},
+ onShow : function(){},
+ onHide : function(){},
+
+ className: {
+ open: 'active'
+ },
+
+ error : {
+ method : 'The method you called is not defined.',
+ notFound : 'There were no elements that matched the specified selector'
+ }
+
+};
+
+})( jQuery, window , document );
\ No newline at end of file
diff --git a/build/uncompressed/modules/sidebar.css b/build/uncompressed/modules/sidebar.css
new file mode 100644
index 000000000..c3608541c
--- /dev/null
+++ b/build/uncompressed/modules/sidebar.css
@@ -0,0 +1,102 @@
+/*******************************
+ Semantic Module: Sidebar
+ Author: Jack Lukic
+ Notes: First Commit March 25, 2013
+ Sidebar Menu System
+*******************************/
+/*******************************
+ Sidebar
+*******************************/
+.ui.sidebar {
+ position: fixed;
+ -webkit-transform: translateX(-275px);
+ -moz-transform: translateX(-275px);
+ -o-transform: translateX(-275px);
+ -ms-transform: translateX(-275px);
+ transform: translateX(-275px);
+ width: 275px;
+ height: 100%;
+ -ms-overflow-y: auto;
+ overflow-y: auto;
+ top: 0px;
+ left: 0px;
+ z-index: 900;
+ -webkit-transition: -webkit-transform 0.5s ease;
+ -moz-transition: -moz-transform 0.5s ease;
+ transition: transform 0.5s ease;
+}
+/*******************************
+ Types
+*******************************/
+.ui.right.sidebar {
+ left: auto;
+ right: 0px;
+ -webkit-transform: translateX(275px);
+ -moz-transform: translateX(275px);
+ -o-transform: translateX(275px);
+ -ms-transform: translateX(275px);
+ transform: translateX(275px);
+}
+.ui.top.sidebar {
+ width: 100%;
+ height: 40px;
+ overflow: hidden;
+ -webkit-transform: translateY(-40px);
+ -moz-transform: translateY(-40px);
+ -o-transform: translateY(-40px);
+ -ms-transform: translateY(-40px);
+ transform: translateY(-40px);
+}
+.ui.bottom.sidebar {
+ width: 100%;
+ height: 40px;
+ overflow: hidden;
+ top: auto;
+ bottom: 0px;
+ -webkit-transform: translateY(40px);
+ -moz-transform: translateY(40px);
+ -o-transform: translateY(40px);
+ -ms-transform: translateY(40px);
+ transform: translateY(40px);
+}
+/*******************************
+ States
+*******************************/
+.ui.active.sidebar {
+ -webkit-transform: translateX(0deg);
+ -moz-transform: translateX(0deg);
+ -o-transform: translateX(0deg);
+ -ms-transform: translateX(0deg);
+ transform: translateX(0deg);
+}
+.ui.active.top.sidebar,
+.ui.active.bottom.sidebar {
+ -webkit-transform: translateY(0deg);
+ -moz-transform: translateY(0deg);
+ -o-transform: translateY(0deg);
+ -ms-transform: translateY(0deg);
+ transform: translateY(0deg);
+}
+/*******************************
+ Variations
+*******************************/
+.ui.floating.sidebar {
+ -webkit-box-shadow: 5px 0px 5px rgba(0, 0, 0, 0.2);
+ -moz-box-shadow: 5px 0px 5px rgba(0, 0, 0, 0.2);
+ box-shadow: 5px 0px 5px rgba(0, 0, 0, 0.2);
+}
+.ui.right.floating.sidebar {
+ -webkit-box-shadow: -5px 0px 5px rgba(0, 0, 0, 0.2);
+ -moz-box-shadow: -5px 0px 5px rgba(0, 0, 0, 0.2);
+ box-shadow: -5px 0px 5px rgba(0, 0, 0, 0.2);
+}
+.ui.top.floating.sidebar {
+ -webkit-box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.2);
+ -moz-box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.2);
+ box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.2);
+}
+.ui.bottom.floating.sidebar {
+ -webkit-box-shadow: 0px -5px 5px rgba(0, 0, 0, 0.2);
+ -moz-box-shadow: 0px -5px 5px rgba(0, 0, 0, 0.2);
+ box-shadow: 0px -5px 5px rgba(0, 0, 0, 0.2);
+}
diff --git a/build/uncompressed/modules/sidebar.js b/build/uncompressed/modules/sidebar.js
new file mode 100644
index 000000000..31a7af8dd
--- /dev/null
+++ b/build/uncompressed/modules/sidebar.js
@@ -0,0 +1,341 @@
+/* ******************************
+ Semantic Module: Dropdown
+ Author: Jack Lukic
+ Notes: First Commit May 25, 2013
+
+****************************** */
+
+;(function ( $, window, document, undefined ) {
+
+$.fn.sidebar = function(parameters) {
+ var
+ $allModules = $(this),
+
+ settings = ( $.isPlainObject(parameters) )
+ ? $.extend(true, {}, $.fn.sidebar.settings, parameters)
+ : $.fn.sidebar.settings,
+
+ className = settings.className,
+ namespace = settings.namespace,
+ error = settings.error,
+
+ eventNamespace = '.' + namespace,
+ moduleNamespace = 'module-' + namespace,
+ moduleSelector = $allModules.selector || '',
+
+ time = new Date().getTime(),
+ performance = [],
+
+ query = arguments[0],
+ methodInvoked = (typeof query == 'string'),
+ queryArguments = [].slice.call(arguments, 1),
+ invokedResponse
+ ;
+
+ $allModules
+ .each(function() {
+ var
+ $body = $('body'),
+ $module = $(this),
+
+ element = this,
+ instance = $module.data(moduleNamespace),
+ module
+ ;
+
+ module = {
+
+ initialize: function() {
+ module.debug('Initializing sidebar', $module);
+ module.instantiate();
+ },
+
+ instantiate: function() {
+ module.verbose('Storing instance of module', module);
+ $module
+ .data(moduleNamespace, module)
+ ;
+ },
+
+ destroy: function() {
+ module.verbose('Destroying previous module for', $module);
+ $module
+ .off(namespace)
+ .removeData(moduleNamespace)
+ ;
+ },
+
+ attach: {
+
+ events: function(selector, event) {
+ var
+ $toggle = $(selector)
+ ;
+ event = $.isFunction(module[event])
+ ? module[event]
+ : module.toggle
+ ;
+ if($toggle.size() > 0) {
+ module.debug('Attaching sidebar events to element', selector, event);
+ $toggle
+ .on('click' + eventNamespace, event)
+ ;
+ }
+ else {
+ module.error(error.notFound);
+ }
+ }
+
+ },
+
+ show: function() {
+ if(module.is.closed()) {
+ module.debug('Showing sidebar');
+ $body
+ .animate(module.get.bodyCSS(), settings.duration, settings.onShow)
+ ;
+ $module
+ .addClass(className.open)
+ ;
+ }
+ },
+
+ hide: function() {
+ if(module.is.open()) {
+ $module
+ .removeClass(className.open)
+ ;
+ }
+ },
+
+ toggle: function() {
+ if(module.is.open()) {
+ module.close();
+ }
+ else {
+ module.open();
+ }
+ },
+
+ get: {
+ bodyCSS: function() {
+
+ }
+ },
+
+ is: {
+ open: function() {
+ return $module.is(':visible');
+ },
+ closed: function() {
+ return $module.is(':not(:visible)');
+ }
+ },
+
+ 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) {
+ if(settings.performance) {
+ module.performance.log(arguments);
+ }
+ else {
+ module.debug = Function.prototype.bind.call(console.info, console, settings.moduleName + ':');
+ module.debug.apply(console, arguments);
+ }
+ }
+ },
+ verbose: function() {
+ if(settings.verbose && settings.debug) {
+ if(settings.performance) {
+ module.performance.log(arguments);
+ }
+ else {
+ module.verbose = Function.prototype.bind.call(console.info, console, settings.moduleName + ':');
+ module.verbose.apply(console, arguments);
+ }
+ }
+ },
+ error: function() {
+ module.error = Function.prototype.bind.call(console.error, console, settings.moduleName + ':');
+ module.error.apply(console, arguments);
+ },
+ 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[0],
+ 'Arguments' : [].slice.call(message, 1) || '',
+ 'Execution Time' : executionTime
+ });
+ }
+ clearTimeout(module.performance.timer);
+ module.performance.timer = setTimeout(module.performance.display, 100);
+ },
+ display: function() {
+ var
+ title = settings.moduleName + ':',
+ totalTime = 0
+ ;
+ time = false;
+ clearTimeout(module.performance.timer);
+ $.each(performance, function(index, data) {
+ totalTime += data['Execution Time'];
+ });
+ title += ' ' + totalTime + 'ms';
+ if(moduleSelector) {
+ title += ' \'' + moduleSelector + '\'';
+ }
+ if( (console.group !== undefined || console.table !== undefined) && performance.length > 0) {
+ console.groupCollapsed(title);
+ if(console.table) {
+ console.table(performance);
+ }
+ else {
+ $.each(performance, function(index, data) {
+ console.log(data['Name'] + ': ' + data['Execution Time']+'ms');
+ });
+ }
+ console.groupEnd();
+ }
+ performance = [];
+ }
+ },
+ invoke: function(query, passedArguments, context) {
+ var
+ maxDepth,
+ found,
+ response
+ ;
+ passedArguments = passedArguments || queryArguments;
+ context = element || context;
+ if(typeof query == 'string' && instance !== undefined) {
+ query = query.split(/[\. ]/);
+ maxDepth = query.length - 1;
+ $.each(query, function(depth, value) {
+ var camelCaseValue = (depth != maxDepth)
+ ? value + query[depth + 1].charAt(0).toUpperCase() + query[depth + 1].slice(1)
+ : query
+ ;
+ if( $.isPlainObject( instance[value] ) && (depth != maxDepth) ) {
+ instance = instance[value];
+ }
+ else if( $.isPlainObject( instance[camelCaseValue] ) && (depth != maxDepth) ) {
+ instance = instance[camelCaseValue];
+ }
+ else if( instance[value] !== undefined ) {
+ found = instance[value];
+ return false;
+ }
+ else if( instance[camelCaseValue] !== undefined ) {
+ found = instance[camelCaseValue];
+ return false;
+ }
+ else {
+ module.error(error.method);
+ return false;
+ }
+ });
+ }
+ if ( $.isFunction( found ) ) {
+ response = found.apply(context, passedArguments);
+ }
+ else if(found !== undefined) {
+ response = found;
+ }
+ if($.isArray(invokedResponse)) {
+ invokedResponse.push(response);
+ }
+ else if(typeof invokedResponse == 'string') {
+ invokedResponse = [invokedResponse, response];
+ }
+ else if(response !== undefined) {
+ invokedResponse = response;
+ }
+ return found;
+ }
+ };
+
+ if(methodInvoked) {
+ if(instance === undefined) {
+ module.initialize();
+ }
+ module.invoke(query);
+ }
+ else {
+ if(instance !== undefined) {
+ module.destroy();
+ }
+ module.initialize();
+ }
+ })
+ ;
+
+ return (invokedResponse !== undefined)
+ ? invokedResponse
+ : this
+ ;
+};
+
+$.fn.sidebar.settings = {
+
+ moduleName : 'Sidebar',
+ namespace : 'sidebar',
+
+ verbose : true,
+ debug : true,
+ performance : true,
+
+ side : 'left',
+ duration : 500,
+
+ onChange : function(){},
+ onShow : function(){},
+ onHide : function(){},
+
+ className: {
+ open: 'active'
+ },
+
+ error : {
+ method : 'The method you called is not defined.',
+ notFound : 'There were no elements that matched the specified selector'
+ }
+
+};
+
+})( jQuery, window , document );
\ No newline at end of file
diff --git a/node/src/documents/modules/sidebar.html b/node/src/documents/modules/sidebar.html
new file mode 100755
index 000000000..6e4ea1244
--- /dev/null
+++ b/node/src/documents/modules/sidebar.html
@@ -0,0 +1,204 @@
+---
+layout : 'default'
+css : 'sidebar'
+
+title : 'Sidebar'
+type : 'UI Module'
+---
+
+<script src="/components/semantic/modules/sidebar.js"></script>
+
+<div class="segment">
+ <div class="container">
+ <h1 class="ui dividing header">Sidebar</h1>
+ <p>A sidebar is a menu hidden beside page content</p>
+ </div>
+</div>
+<div class="main container">
+
+ <div class="peek">
+ <div class="ui vertical pointing secondary menu">
+ <a class="active item">Initializing</a>
+ <a class="item">Usage</a>
+ <a class="item">Types</a>
+ <a class="item">Behavior</a>
+ <a class="item">Settings</a>
+ </div>
+ </div>
+ <div class="ui grid">
+ <div class="ten wide column">
+
+ <h2 class="ui header">Initializing</h2>
+ <p>Sidebars are initialized by calling sidebar on an element with class ui sidebar</p>
+ <div class="code" data-demo="true" data-title="Initializing a sidebar">
+ $('.ui.sidebar')
+ .sidebar()
+ ;
+ </div>
+
+ <h3>Controlling a sidebar</h3>
+ <p>It may also be useful to set a dedicated button as controlling a sidebar. You can do this by calling a separate method</p>
+ <div class="code" data-demo="true" data-title="Initializing a sidebar">
+ $('.sidebar')
+ .sidebar('attach events', '.toggle.button')
+ ;
+ </div>
+
+ <h3>Altering a sidebar width</h3>
+
+ <p>Altering the size of sidebar can be done by modifying sidebar.css</p>
+ <h2 class="ui dividing header">Usage</h2>
+
+
+ <p>If a sidebar is called without any arguments all default settings will be used.</p>
+
+
+ <h3 class="ui header">Visibility</h3>
+ <p>After the animation queue finishes for an element, its final visibility state is determined. If an animation is an outward sidebar, the final visibility status will be hidden. If an animation is inward the element will be visible after the animatino finishes.</p>
+ <div class="code" data-demo="true" data-title="Disapearing element">
+ $('.dog.image')
+ .sidebar('scale')
+ ;
+ </div>
+
+ <h3 class="ui header">Static Animations</h3>
+ <p>Animations that do not have an in or out animation defined, will maintain their current visibility after running</p>
+ <div class="code" data-demo="true" data-title="Looping">
+ $('.dog.image')
+ .sidebar('pulse')
+ ;
+ </div>
+
+ <h3 class="ui header">Sidebar Direction</h3>
+
+ <p>If an animation direction is not specified it will automatically be determined based on the elements current visibility. For example, if the element is visible the animation "fade out" will be called, if the animation is not visible "fade in".</p>
+
+ <div class="code" data-demo="true" data-title="Automatically choosing direction">
+ $('.dog.image')
+ // fade up out is used if available
+ .sidebar('fade up')
+ // this is now fade up in
+ .sidebar('fade up')
+ ;
+ </div>
+ <div class="code" data-demo="true" data-title="Specifying a direction">
+ $('.dog.image')
+ // if a direction if specified it will be obeyed
+ .sidebar('horizontal flip in')
+ .sidebar('vertical flip in')
+ ;
+ </div>
+
+ <h3 class="ui header">Passing in settings</h3>
+ <p>Sidebars use similar argument shorthand as <a href="http://api.jquery.com/animate/">animate</a>. You can specify callback functions, animation duration, and other settings using the same arguments. Durations can be specified as strings with css shorthand, or with numbers.</p>
+
+ <h3 class="ui header">Queuing animations</h3>
+
+ <p>Animations called in sequence will be queued. Any queued animation will automatically determine the sidebar direction if none is specified.</p>
+ <div class="code" data-demo="true" data-title="Queueing animations">
+ $('.dog.image')
+ .sidebar('horizontal flip', '500ms')
+ .sidebar('horizontal flip', 500, function() {
+ alert('done!');
+ })
+ ;
+ </div>
+
+ <h2 class="ui dividing header">Types</h2>
+
+ <h3>Emphasis</h3>
+ <div class="example">
+ <h4 class="ui header">Flash</h4>
+ <p>An element can flash to draw attention to itself</p>
+ <div class="code" data-demo="true">
+ $('.dog.image')
+ .sidebar('flash')
+ ;
+ </div>
+ </div>
+ <div class="example">
+ <h4 class="ui header">Shake</h4>
+ <p>An element can shake to draw attention to its position</p>
+ <div class="code" data-demo="true">
+ $('.dog.image')
+ .sidebar('shake')
+ ;
+ </div>
+ </div>
+ <div class="example">
+ <h4 class="ui header">Tada</h4>
+ <p>An element can give user positive feedback for an action</p>
+ <div class="code" data-demo="true">
+ $('.dog.image')
+ .sidebar('tada')
+ ;
+ </div>
+ </div>
+ <div class="example">
+ <h4 class="ui header">Bounce</h4>
+ <p>An element can bounce to politely remind you of itself</p>
+ <div class="code" data-demo="true">
+ $('.dog.image')
+ .sidebar('bounce')
+ ;
+ </div>
+ </div>
+
+ <h3>Appearance</h3>
+ <div class="example">
+ <h4 class="ui header">Flip</h4>
+ <p>An element can flip into or out of view vertically or horizontally</p>
+ <div class="code" data-demo="true">
+ $('.dog.image')
+ .sidebar('horizontal flip')
+ .sidebar('vertical flip')
+ ;
+ </div>
+ </div>
+ <div class="example">
+ <h4 class="ui header">Fade</h4>
+ <p>An element can fade into or out of view descending and ascending</p>
+ <div class="code" data-demo="true">
+ $('.dog.image')
+ .sidebar('fade')
+ .sidebar('fade up')
+ .sidebar('fade down')
+ ;
+ </div>
+ </div>
+ <div class="example">
+ <h4 class="ui header">Scale</h4>
+ <p>An element can scale into or out of view</p>
+ <div class="code" data-demo="true">
+ $('.dog.image')
+ .sidebar('scale')
+ ;
+ </div>
+ </div>
+
+ <div class="example">
+ <h4 class="ui header">Slide</h4>
+ <div class="code" data-demo="true">
+ $('.dog.image')
+ .sidebar('slide up')
+ .sidebar('slide down')
+ ;
+ </div>
+ </div>
+
+ <h2 class="ui dividing header">Behavior</h2>
+
+
+
+
+ <h2 class="ui dividing header">Settings</h2>
+ </div>
+ <div class="five wide right floated fixed column">
+ <img src="/images/demo/vector.png" class="ui dog image">
+ </div>
+ </div>
+
+</div>
+</body>
+
+</html>
\ No newline at end of file
diff --git a/node/src/files/components/semantic/modules/sidebar.css b/node/src/files/components/semantic/modules/sidebar.css
new file mode 100644
index 000000000..c3608541c
--- /dev/null
+++ b/node/src/files/components/semantic/modules/sidebar.css
@@ -0,0 +1,102 @@
+/*******************************
+ Semantic Module: Sidebar
+ Author: Jack Lukic
+ Notes: First Commit March 25, 2013
+ Sidebar Menu System
+*******************************/
+/*******************************
+ Sidebar
+*******************************/
+.ui.sidebar {
+ position: fixed;
+ -webkit-transform: translateX(-275px);
+ -moz-transform: translateX(-275px);
+ -o-transform: translateX(-275px);
+ -ms-transform: translateX(-275px);
+ transform: translateX(-275px);
+ width: 275px;
+ height: 100%;
+ -ms-overflow-y: auto;
+ overflow-y: auto;
+ top: 0px;
+ left: 0px;
+ z-index: 900;
+ -webkit-transition: -webkit-transform 0.5s ease;
+ -moz-transition: -moz-transform 0.5s ease;
+ transition: transform 0.5s ease;
+}
+/*******************************
+ Types
+*******************************/
+.ui.right.sidebar {
+ left: auto;
+ right: 0px;
+ -webkit-transform: translateX(275px);
+ -moz-transform: translateX(275px);
+ -o-transform: translateX(275px);
+ -ms-transform: translateX(275px);
+ transform: translateX(275px);
+}
+.ui.top.sidebar {
+ width: 100%;
+ height: 40px;
+ overflow: hidden;
+ -webkit-transform: translateY(-40px);
+ -moz-transform: translateY(-40px);
+ -o-transform: translateY(-40px);
+ -ms-transform: translateY(-40px);
+ transform: translateY(-40px);
+}
+.ui.bottom.sidebar {
+ width: 100%;
+ height: 40px;
+ overflow: hidden;
+ top: auto;
+ bottom: 0px;
+ -webkit-transform: translateY(40px);
+ -moz-transform: translateY(40px);
+ -o-transform: translateY(40px);
+ -ms-transform: translateY(40px);
+ transform: translateY(40px);
+}
+/*******************************
+ States
+*******************************/
+.ui.active.sidebar {
+ -webkit-transform: translateX(0deg);
+ -moz-transform: translateX(0deg);
+ -o-transform: translateX(0deg);
+ -ms-transform: translateX(0deg);
+ transform: translateX(0deg);
+}
+.ui.active.top.sidebar,
+.ui.active.bottom.sidebar {
+ -webkit-transform: translateY(0deg);
+ -moz-transform: translateY(0deg);
+ -o-transform: translateY(0deg);
+ -ms-transform: translateY(0deg);
+ transform: translateY(0deg);
+}
+/*******************************
+ Variations
+*******************************/
+.ui.floating.sidebar {
+ -webkit-box-shadow: 5px 0px 5px rgba(0, 0, 0, 0.2);
+ -moz-box-shadow: 5px 0px 5px rgba(0, 0, 0, 0.2);
+ box-shadow: 5px 0px 5px rgba(0, 0, 0, 0.2);
+}
+.ui.right.floating.sidebar {
+ -webkit-box-shadow: -5px 0px 5px rgba(0, 0, 0, 0.2);
+ -moz-box-shadow: -5px 0px 5px rgba(0, 0, 0, 0.2);
+ box-shadow: -5px 0px 5px rgba(0, 0, 0, 0.2);
+}
+.ui.top.floating.sidebar {
+ -webkit-box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.2);
+ -moz-box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.2);
+ box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.2);
+}
+.ui.bottom.floating.sidebar {
+ -webkit-box-shadow: 0px -5px 5px rgba(0, 0, 0, 0.2);
+ -moz-box-shadow: 0px -5px 5px rgba(0, 0, 0, 0.2);
+ box-shadow: 0px -5px 5px rgba(0, 0, 0, 0.2);
+}
diff --git a/node/src/files/components/semantic/modules/sidebar.js b/node/src/files/components/semantic/modules/sidebar.js
new file mode 100644
index 000000000..31a7af8dd
--- /dev/null
+++ b/node/src/files/components/semantic/modules/sidebar.js
@@ -0,0 +1,341 @@
+/* ******************************
+ Semantic Module: Dropdown
+ Author: Jack Lukic
+ Notes: First Commit May 25, 2013
+
+****************************** */
+
+;(function ( $, window, document, undefined ) {
+
+$.fn.sidebar = function(parameters) {
+ var
+ $allModules = $(this),
+
+ settings = ( $.isPlainObject(parameters) )
+ ? $.extend(true, {}, $.fn.sidebar.settings, parameters)
+ : $.fn.sidebar.settings,
+
+ className = settings.className,
+ namespace = settings.namespace,
+ error = settings.error,
+
+ eventNamespace = '.' + namespace,
+ moduleNamespace = 'module-' + namespace,
+ moduleSelector = $allModules.selector || '',
+
+ time = new Date().getTime(),
+ performance = [],
+
+ query = arguments[0],
+ methodInvoked = (typeof query == 'string'),
+ queryArguments = [].slice.call(arguments, 1),
+ invokedResponse
+ ;
+
+ $allModules
+ .each(function() {
+ var
+ $body = $('body'),
+ $module = $(this),
+
+ element = this,
+ instance = $module.data(moduleNamespace),
+ module
+ ;
+
+ module = {
+
+ initialize: function() {
+ module.debug('Initializing sidebar', $module);
+ module.instantiate();
+ },
+
+ instantiate: function() {
+ module.verbose('Storing instance of module', module);
+ $module
+ .data(moduleNamespace, module)
+ ;
+ },
+
+ destroy: function() {
+ module.verbose('Destroying previous module for', $module);
+ $module
+ .off(namespace)
+ .removeData(moduleNamespace)
+ ;
+ },
+
+ attach: {
+
+ events: function(selector, event) {
+ var
+ $toggle = $(selector)
+ ;
+ event = $.isFunction(module[event])
+ ? module[event]
+ : module.toggle
+ ;
+ if($toggle.size() > 0) {
+ module.debug('Attaching sidebar events to element', selector, event);
+ $toggle
+ .on('click' + eventNamespace, event)
+ ;
+ }
+ else {
+ module.error(error.notFound);
+ }
+ }
+
+ },
+
+ show: function() {
+ if(module.is.closed()) {
+ module.debug('Showing sidebar');
+ $body
+ .animate(module.get.bodyCSS(), settings.duration, settings.onShow)
+ ;
+ $module
+ .addClass(className.open)
+ ;
+ }
+ },
+
+ hide: function() {
+ if(module.is.open()) {
+ $module
+ .removeClass(className.open)
+ ;
+ }
+ },
+
+ toggle: function() {
+ if(module.is.open()) {
+ module.close();
+ }
+ else {
+ module.open();
+ }
+ },
+
+ get: {
+ bodyCSS: function() {
+
+ }
+ },
+
+ is: {
+ open: function() {
+ return $module.is(':visible');
+ },
+ closed: function() {
+ return $module.is(':not(:visible)');
+ }
+ },
+
+ 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) {
+ if(settings.performance) {
+ module.performance.log(arguments);
+ }
+ else {
+ module.debug = Function.prototype.bind.call(console.info, console, settings.moduleName + ':');
+ module.debug.apply(console, arguments);
+ }
+ }
+ },
+ verbose: function() {
+ if(settings.verbose && settings.debug) {
+ if(settings.performance) {
+ module.performance.log(arguments);
+ }
+ else {
+ module.verbose = Function.prototype.bind.call(console.info, console, settings.moduleName + ':');
+ module.verbose.apply(console, arguments);
+ }
+ }
+ },
+ error: function() {
+ module.error = Function.prototype.bind.call(console.error, console, settings.moduleName + ':');
+ module.error.apply(console, arguments);
+ },
+ 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[0],
+ 'Arguments' : [].slice.call(message, 1) || '',
+ 'Execution Time' : executionTime
+ });
+ }
+ clearTimeout(module.performance.timer);
+ module.performance.timer = setTimeout(module.performance.display, 100);
+ },
+ display: function() {
+ var
+ title = settings.moduleName + ':',
+ totalTime = 0
+ ;
+ time = false;
+ clearTimeout(module.performance.timer);
+ $.each(performance, function(index, data) {
+ totalTime += data['Execution Time'];
+ });
+ title += ' ' + totalTime + 'ms';
+ if(moduleSelector) {
+ title += ' \'' + moduleSelector + '\'';
+ }
+ if( (console.group !== undefined || console.table !== undefined) && performance.length > 0) {
+ console.groupCollapsed(title);
+ if(console.table) {
+ console.table(performance);
+ }
+ else {
+ $.each(performance, function(index, data) {
+ console.log(data['Name'] + ': ' + data['Execution Time']+'ms');
+ });
+ }
+ console.groupEnd();
+ }
+ performance = [];
+ }
+ },
+ invoke: function(query, passedArguments, context) {
+ var
+ maxDepth,
+ found,
+ response
+ ;
+ passedArguments = passedArguments || queryArguments;
+ context = element || context;
+ if(typeof query == 'string' && instance !== undefined) {
+ query = query.split(/[\. ]/);
+ maxDepth = query.length - 1;
+ $.each(query, function(depth, value) {
+ var camelCaseValue = (depth != maxDepth)
+ ? value + query[depth + 1].charAt(0).toUpperCase() + query[depth + 1].slice(1)
+ : query
+ ;
+ if( $.isPlainObject( instance[value] ) && (depth != maxDepth) ) {
+ instance = instance[value];
+ }
+ else if( $.isPlainObject( instance[camelCaseValue] ) && (depth != maxDepth) ) {
+ instance = instance[camelCaseValue];
+ }
+ else if( instance[value] !== undefined ) {
+ found = instance[value];
+ return false;
+ }
+ else if( instance[camelCaseValue] !== undefined ) {
+ found = instance[camelCaseValue];
+ return false;
+ }
+ else {
+ module.error(error.method);
+ return false;
+ }
+ });
+ }
+ if ( $.isFunction( found ) ) {
+ response = found.apply(context, passedArguments);
+ }
+ else if(found !== undefined) {
+ response = found;
+ }
+ if($.isArray(invokedResponse)) {
+ invokedResponse.push(response);
+ }
+ else if(typeof invokedResponse == 'string') {
+ invokedResponse = [invokedResponse, response];
+ }
+ else if(response !== undefined) {
+ invokedResponse = response;
+ }
+ return found;
+ }
+ };
+
+ if(methodInvoked) {
+ if(instance === undefined) {
+ module.initialize();
+ }
+ module.invoke(query);
+ }
+ else {
+ if(instance !== undefined) {
+ module.destroy();
+ }
+ module.initialize();
+ }
+ })
+ ;
+
+ return (invokedResponse !== undefined)
+ ? invokedResponse
+ : this
+ ;
+};
+
+$.fn.sidebar.settings = {
+
+ moduleName : 'Sidebar',
+ namespace : 'sidebar',
+
+ verbose : true,
+ debug : true,
+ performance : true,
+
+ side : 'left',
+ duration : 500,
+
+ onChange : function(){},
+ onShow : function(){},
+ onHide : function(){},
+
+ className: {
+ open: 'active'
+ },
+
+ error : {
+ method : 'The method you called is not defined.',
+ notFound : 'There were no elements that matched the specified selector'
+ }
+
+};
+
+})( jQuery, window , document );
\ No newline at end of file
diff --git a/src/modules/sidebar.js b/src/modules/sidebar.js
new file mode 100755
index 000000000..31a7af8dd
--- /dev/null
+++ b/src/modules/sidebar.js
@@ -0,0 +1,341 @@
+/* ******************************
+ Semantic Module: Dropdown
+ Author: Jack Lukic
+ Notes: First Commit May 25, 2013
+
+****************************** */
+
+;(function ( $, window, document, undefined ) {
+
+$.fn.sidebar = function(parameters) {
+ var
+ $allModules = $(this),
+
+ settings = ( $.isPlainObject(parameters) )
+ ? $.extend(true, {}, $.fn.sidebar.settings, parameters)
+ : $.fn.sidebar.settings,
+
+ className = settings.className,
+ namespace = settings.namespace,
+ error = settings.error,
+
+ eventNamespace = '.' + namespace,
+ moduleNamespace = 'module-' + namespace,
+ moduleSelector = $allModules.selector || '',
+
+ time = new Date().getTime(),
+ performance = [],
+
+ query = arguments[0],
+ methodInvoked = (typeof query == 'string'),
+ queryArguments = [].slice.call(arguments, 1),
+ invokedResponse
+ ;
+
+ $allModules
+ .each(function() {
+ var
+ $body = $('body'),
+ $module = $(this),
+
+ element = this,
+ instance = $module.data(moduleNamespace),
+ module
+ ;
+
+ module = {
+
+ initialize: function() {
+ module.debug('Initializing sidebar', $module);
+ module.instantiate();
+ },
+
+ instantiate: function() {
+ module.verbose('Storing instance of module', module);
+ $module
+ .data(moduleNamespace, module)
+ ;
+ },
+
+ destroy: function() {
+ module.verbose('Destroying previous module for', $module);
+ $module
+ .off(namespace)
+ .removeData(moduleNamespace)
+ ;
+ },
+
+ attach: {
+
+ events: function(selector, event) {
+ var
+ $toggle = $(selector)
+ ;
+ event = $.isFunction(module[event])
+ ? module[event]
+ : module.toggle
+ ;
+ if($toggle.size() > 0) {
+ module.debug('Attaching sidebar events to element', selector, event);
+ $toggle
+ .on('click' + eventNamespace, event)
+ ;
+ }
+ else {
+ module.error(error.notFound);
+ }
+ }
+
+ },
+
+ show: function() {
+ if(module.is.closed()) {
+ module.debug('Showing sidebar');
+ $body
+ .animate(module.get.bodyCSS(), settings.duration, settings.onShow)
+ ;
+ $module
+ .addClass(className.open)
+ ;
+ }
+ },
+
+ hide: function() {
+ if(module.is.open()) {
+ $module
+ .removeClass(className.open)
+ ;
+ }
+ },
+
+ toggle: function() {
+ if(module.is.open()) {
+ module.close();
+ }
+ else {
+ module.open();
+ }
+ },
+
+ get: {
+ bodyCSS: function() {
+
+ }
+ },
+
+ is: {
+ open: function() {
+ return $module.is(':visible');
+ },
+ closed: function() {
+ return $module.is(':not(:visible)');
+ }
+ },
+
+ 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) {
+ if(settings.performance) {
+ module.performance.log(arguments);
+ }
+ else {
+ module.debug = Function.prototype.bind.call(console.info, console, settings.moduleName + ':');
+ module.debug.apply(console, arguments);
+ }
+ }
+ },
+ verbose: function() {
+ if(settings.verbose && settings.debug) {
+ if(settings.performance) {
+ module.performance.log(arguments);
+ }
+ else {
+ module.verbose = Function.prototype.bind.call(console.info, console, settings.moduleName + ':');
+ module.verbose.apply(console, arguments);
+ }
+ }
+ },
+ error: function() {
+ module.error = Function.prototype.bind.call(console.error, console, settings.moduleName + ':');
+ module.error.apply(console, arguments);
+ },
+ 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[0],
+ 'Arguments' : [].slice.call(message, 1) || '',
+ 'Execution Time' : executionTime
+ });
+ }
+ clearTimeout(module.performance.timer);
+ module.performance.timer = setTimeout(module.performance.display, 100);
+ },
+ display: function() {
+ var
+ title = settings.moduleName + ':',
+ totalTime = 0
+ ;
+ time = false;
+ clearTimeout(module.performance.timer);
+ $.each(performance, function(index, data) {
+ totalTime += data['Execution Time'];
+ });
+ title += ' ' + totalTime + 'ms';
+ if(moduleSelector) {
+ title += ' \'' + moduleSelector + '\'';
+ }
+ if( (console.group !== undefined || console.table !== undefined) && performance.length > 0) {
+ console.groupCollapsed(title);
+ if(console.table) {
+ console.table(performance);
+ }
+ else {
+ $.each(performance, function(index, data) {
+ console.log(data['Name'] + ': ' + data['Execution Time']+'ms');
+ });
+ }
+ console.groupEnd();
+ }
+ performance = [];
+ }
+ },
+ invoke: function(query, passedArguments, context) {
+ var
+ maxDepth,
+ found,
+ response
+ ;
+ passedArguments = passedArguments || queryArguments;
+ context = element || context;
+ if(typeof query == 'string' && instance !== undefined) {
+ query = query.split(/[\. ]/);
+ maxDepth = query.length - 1;
+ $.each(query, function(depth, value) {
+ var camelCaseValue = (depth != maxDepth)
+ ? value + query[depth + 1].charAt(0).toUpperCase() + query[depth + 1].slice(1)
+ : query
+ ;
+ if( $.isPlainObject( instance[value] ) && (depth != maxDepth) ) {
+ instance = instance[value];
+ }
+ else if( $.isPlainObject( instance[camelCaseValue] ) && (depth != maxDepth) ) {
+ instance = instance[camelCaseValue];
+ }
+ else if( instance[value] !== undefined ) {
+ found = instance[value];
+ return false;
+ }
+ else if( instance[camelCaseValue] !== undefined ) {
+ found = instance[camelCaseValue];
+ return false;
+ }
+ else {
+ module.error(error.method);
+ return false;
+ }
+ });
+ }
+ if ( $.isFunction( found ) ) {
+ response = found.apply(context, passedArguments);
+ }
+ else if(found !== undefined) {
+ response = found;
+ }
+ if($.isArray(invokedResponse)) {
+ invokedResponse.push(response);
+ }
+ else if(typeof invokedResponse == 'string') {
+ invokedResponse = [invokedResponse, response];
+ }
+ else if(response !== undefined) {
+ invokedResponse = response;
+ }
+ return found;
+ }
+ };
+
+ if(methodInvoked) {
+ if(instance === undefined) {
+ module.initialize();
+ }
+ module.invoke(query);
+ }
+ else {
+ if(instance !== undefined) {
+ module.destroy();
+ }
+ module.initialize();
+ }
+ })
+ ;
+
+ return (invokedResponse !== undefined)
+ ? invokedResponse
+ : this
+ ;
+};
+
+$.fn.sidebar.settings = {
+
+ moduleName : 'Sidebar',
+ namespace : 'sidebar',
+
+ verbose : true,
+ debug : true,
+ performance : true,
+
+ side : 'left',
+ duration : 500,
+
+ onChange : function(){},
+ onShow : function(){},
+ onHide : function(){},
+
+ className: {
+ open: 'active'
+ },
+
+ error : {
+ method : 'The method you called is not defined.',
+ notFound : 'There were no elements that matched the specified selector'
+ }
+
+};
+
+})( jQuery, window , document );
\ No newline at end of file
diff --git a/src/modules/sidebar.less b/src/modules/sidebar.less
new file mode 100755
index 000000000..5217a1e4a
--- /dev/null
+++ b/src/modules/sidebar.less
@@ -0,0 +1,124 @@
+/*******************************
+ Semantic Module: Sidebar
+ Author: Jack Lukic
+ Notes: First Commit March 25, 2013
+ Sidebar Menu System
+*******************************/
+
+/*******************************
+ Sidebar
+*******************************/
+
+.ui.sidebar {
+ position: fixed;
+
+ -webkit-transform: translateX(-275px);
+ -moz-transform: translateX(-275px);
+ -o-transform: translateX(-275px);
+ -ms-transform: translateX(-275px);
+ transform: translateX(-275px);
+
+ width: 275px;
+ height: 100%;
+
+ -ms-overflow-y: auto;
+ overflow-y: auto;
+ top: 0px;
+ left: 0px;
+ z-index: 900;
+
+ -webkit-transition: -webkit-transform 0.5s ease;
+ -moz-transition: -moz-transform 0.5s ease;
+ transition: transform 0.5s ease;
+}
+
+
+/*******************************
+ Types
+*******************************/
+
+.ui.right.sidebar {
+ left: auto;
+ right: 0px;
+ -webkit-transform: translateX(275px);
+ -moz-transform: translateX(275px);
+ -o-transform: translateX(275px);
+ -ms-transform: translateX(275px);
+ transform: translateX(275px);
+}
+
+.ui.top.sidebar {
+ width: 100%;
+ height: 40px;
+ overflow: hidden;
+ -webkit-transform: translateY(-40px);
+ -moz-transform: translateY(-40px);
+ -o-transform: translateY(-40px);
+ -ms-transform: translateY(-40px);
+ transform: translateY(-40px);
+}
+
+.ui.bottom.sidebar {
+ width: 100%;
+ height: 40px;
+ overflow: hidden;
+ top: auto;
+ bottom: 0px;
+ -webkit-transform: translateY(40px);
+ -moz-transform: translateY(40px);
+ -o-transform: translateY(40px);
+ -ms-transform: translateY(40px);
+ transform: translateY(40px);
+}
+
+
+/*******************************
+ States
+*******************************/
+
+.ui.active.sidebar {
+ -webkit-transform: translateX(0deg);
+ -moz-transform: translateX(0deg);
+ -o-transform: translateX(0deg);
+ -ms-transform: translateX(0deg);
+ transform: translateX(0deg);
+}
+
+.ui.active.top.sidebar,
+.ui.active.bottom.sidebar {
+ -webkit-transform: translateY(0deg);
+ -moz-transform: translateY(0deg);
+ -o-transform: translateY(0deg);
+ -ms-transform: translateY(0deg);
+ transform: translateY(0deg);
+}
+
+
+
+/*******************************
+ Variations
+*******************************/
+
+.ui.floating.sidebar {
+ -webkit-box-shadow: 5px 0px 5px rgba(0, 0, 0, 0.2);
+ -moz-box-shadow: 5px 0px 5px rgba(0, 0, 0, 0.2);
+ box-shadow: 5px 0px 5px rgba(0, 0, 0, 0.2);
+}
+
+.ui.right.floating.sidebar {
+ -webkit-box-shadow: -5px 0px 5px rgba(0, 0, 0, 0.2);
+ -moz-box-shadow: -5px 0px 5px rgba(0, 0, 0, 0.2);
+ box-shadow: -5px 0px 5px rgba(0, 0, 0, 0.2);
+}
+
+.ui.top.floating.sidebar {
+ -webkit-box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.2);
+ -moz-box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.2);
+ box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.2);
+}
+
+.ui.bottom.floating.sidebar {
+ -webkit-box-shadow: 0px -5px 5px rgba(0, 0, 0, 0.2);
+ -moz-box-shadow: 0px -5px 5px rgba(0, 0, 0, 0.2);
+ box-shadow: 0px -5px 5px rgba(0, 0, 0, 0.2);
+}