From 90b9f818c9e8294e0ff065eee3208d913ad4eb98 Mon Sep 17 00:00:00 2001 From: jlukic Date: Mon, 30 Sep 2013 17:20:14 -0400 Subject: [PATCH] Work on rating and tab updates. Tab documentation Former-commit-id: 4ee9aec071f2bce938bd8ecad0a44a2ba1d46af7 Former-commit-id: c4150544f8249c3a544cac1c1433422c2e2a95c2 --- RELEASE NOTES.md | 15 +- build/less/collections/grid.less | 3 +- build/less/modules/rating.js | 80 ++++--- build/less/modules/tab.js | 31 ++- build/minified/modules/rating.js | 80 ++++--- build/minified/modules/tab.js | 31 ++- build/uncompressed/collections/grid.css | 3 +- build/uncompressed/modules/rating.js | 80 ++++--- build/uncompressed/modules/tab.js | 31 ++- node/src/documents/modules/rating.html.eco | 41 ++++ node/src/documents/modules/tab.html.eco | 203 ++++++++++++++---- .../files/build/less/collections/grid.less | 3 +- node/src/files/build/less/modules/rating.js | 80 ++++--- node/src/files/build/less/modules/tab.js | 31 ++- .../files/build/minified/modules/rating.js | 80 ++++--- node/src/files/build/minified/modules/tab.js | 31 ++- .../build/uncompressed/collections/grid.css | 3 +- .../build/uncompressed/modules/rating.js | 80 ++++--- .../files/build/uncompressed/modules/tab.js | 31 ++- node/src/files/javascript/tab.js | 25 ++- src/modules/rating.js | 80 ++++--- src/modules/tab.js | 31 ++- 22 files changed, 741 insertions(+), 332 deletions(-) diff --git a/RELEASE NOTES.md b/RELEASE NOTES.md index 7e346b60a..9d16e6d44 100755 --- a/RELEASE NOTES.md +++ b/RELEASE NOTES.md @@ -1,13 +1,24 @@ ## RELEASE NOTES -### Version 0.2.5- Sep 30, 2013 +### Version 0.3.0 - Sep 30, 2013 + +**Additions** +- Adds new UI module tab with documentation. + +**Updates** +- Adds new methods to rating, 'get rating', 'clear rating', adds new setting 'clearable' +- Adds rating as first callback parameter on 'onRate' + +**Fixes** + +### Version 0.2.5 - Sep 30, 2013 **Fixes** - Fixes checkbox selector issue with multiple inputs inside a checkbox - Modal no longer uses inline css to center when in fixed position mode - Fixes dropdown to now set active item to whatever hidden input field is when using action updateForm -### Version 0.2.4- Sep 28, 2013 +### Version 0.2.4 - Sep 28, 2013 **Updates** diff --git a/build/less/collections/grid.less b/build/less/collections/grid.less index 2e332a322..9e5b89220 100644 --- a/build/less/collections/grid.less +++ b/build/less/collections/grid.less @@ -98,7 +98,8 @@ .ui.page.grid { margin: 0%; - padding: 0% 2%; + padding-left: 0%; + padding-right: 0%; } diff --git a/build/less/modules/rating.js b/build/less/modules/rating.js index 7267eb2ea..0eabb5953 100644 --- a/build/less/modules/rating.js +++ b/build/less/modules/rating.js @@ -87,29 +87,6 @@ $.fn.rating = function(parameters) { ; }, - setRating: function(rating) { - var - $activeIcon = $icon.eq(rating - 1) - ; - module.verbose('Setting current rating to', rating); - $module - .removeClass(className.hover) - ; - $icon - .removeClass(className.hover) - ; - $activeIcon - .nextAll() - .removeClass(className.active) - ; - $activeIcon - .addClass(className.active) - .prevAll() - .addClass(className.active) - ; - $.proxy(settings.onRate, element)(); - }, - event: { mouseenter: function() { var @@ -138,11 +115,57 @@ $.fn.rating = function(parameters) { }, click: function() { var - $activeIcon = $(this) + $activeIcon = $(this), + currentRating = module.getRating(), + rating = $icon.index($activeIcon) + 1 + ; + if(settings.clearable && currentRating == rating) { + module.clearRating(); + } + else { + module.setRating( rating ); + } + } + }, + + clearRating: function() { + module.debug('Clearing current rating'); + module.setRating(0); + }, + + getRating: function() { + var + currentRating = $icon.filter('.' + className.active).size() + ; + module.verbose('Current rating retrieved', currentRating); + return currentRating; + }, + + setRating: function(rating) { + var + ratingIndex = (rating - 1 >= 0) + ? (rating - 1) + : 0, + $activeIcon = $icon.eq(ratingIndex) + ; + $module + .removeClass(className.hover) + ; + $icon + .removeClass(className.hover) + .removeClass(className.active) + ; + if(rating > 0) { + module.verbose('Setting current rating to', rating); + $activeIcon + .addClass(className.active) + .prevAll() + .addClass(className.active) ; - module.setRating( $icon.index($activeIcon) + 1); } + $.proxy(settings.onRate, element)(rating); }, + setting: function(name, value) { if(value !== undefined) { if( $.isPlainObject(name) ) { @@ -231,9 +254,6 @@ $.fn.rating = function(parameters) { if(moduleSelector) { title += ' \'' + moduleSelector + '\''; } - if($allModules.size() > 1) { - title += ' ' + '(' + $allModules.size() + ')'; - } if( (console.group !== undefined || console.table !== undefined) && performance.length > 0) { console.groupCollapsed(title); if(console.table) { @@ -336,7 +356,9 @@ $.fn.rating.settings = { initialRating : 0, interactive : true, - onRate : function(){}, + clearable : false, + + onRate : function(rating){}, error : { method : 'The method you called is not defined' diff --git a/build/less/modules/tab.js b/build/less/modules/tab.js index 1cd832a0e..f6efcdcb6 100644 --- a/build/less/modules/tab.js +++ b/build/less/modules/tab.js @@ -54,6 +54,15 @@ initialize: function() { module.debug('Initializing Tabs', $module); + + // set up automatic routing + if(settings.auto) { + module.verbose('Setting up automatic tab retrieval from server'); + settings.apiSettings = { + url: settings.path + '/{$tab}' + }; + } + // attach history events if(settings.history) { if( $.address === undefined ) { @@ -65,11 +74,6 @@ return false; } else { - if(settings.auto) { - settings.apiSettings = { - url: settings.path + '/{$tab}' - }; - } module.verbose('Address library found adding state change event'); $.address .state(settings.path) @@ -78,9 +82,10 @@ ; } } + // attach events if navigation wasn't set to window if( !$.isWindow( element ) ) { - module.debug('Attaching events to tab activator', $module); + module.debug('Attaching tab activation events to element', $module); $module .on('click' + eventNamespace, module.event.click) ; @@ -103,7 +108,7 @@ }, event: { - click: function() { + click: function(event) { module.debug('Navigation clicked'); var tabPath = $(this).data(metadata.tab) @@ -115,6 +120,7 @@ else { module.changeTab(tabPath); } + event.preventDefault(); } else { module.debug('No tab specified'); @@ -262,6 +268,7 @@ }, request = $tab.data(metadata.promise) || false, existingRequest = ( request && request.state() === 'pending' ), + requestSettings, cachedContent ; @@ -281,8 +288,10 @@ ; } else if($.api !== undefined) { - module.debug('Retrieving remote content', fullTabPath); - $.api( $.extend(true, { headers: { 'X-Remote': true } }, settings.apiSettings, apiSettings) ); + console.log(settings.apiSettings); + requestSettings = $.extend(true, { headers: { 'X-Remote': true } }, settings.apiSettings, apiSettings); + module.debug('Retrieving remote content', fullTabPath, requestSettings); + $.api( requestSettings ); } else { module.error(error.api); @@ -372,7 +381,7 @@ module.error(error.recursion); } else { - module.debug('No default tabs found for', tabPath); + module.debug('No default tabs found for', tabPath, $tabs); } recursionDepth = 0; return tabPath; @@ -642,7 +651,7 @@ // max depth a tab can be nested maxDepth : 25, // dont load content on first load - ignoreFirstLoad : true, + ignoreFirstLoad : false, // load tab content new every tab click alwaysRefresh : false, // cache the content requests to pull locally diff --git a/build/minified/modules/rating.js b/build/minified/modules/rating.js index 7267eb2ea..0eabb5953 100644 --- a/build/minified/modules/rating.js +++ b/build/minified/modules/rating.js @@ -87,29 +87,6 @@ $.fn.rating = function(parameters) { ; }, - setRating: function(rating) { - var - $activeIcon = $icon.eq(rating - 1) - ; - module.verbose('Setting current rating to', rating); - $module - .removeClass(className.hover) - ; - $icon - .removeClass(className.hover) - ; - $activeIcon - .nextAll() - .removeClass(className.active) - ; - $activeIcon - .addClass(className.active) - .prevAll() - .addClass(className.active) - ; - $.proxy(settings.onRate, element)(); - }, - event: { mouseenter: function() { var @@ -138,11 +115,57 @@ $.fn.rating = function(parameters) { }, click: function() { var - $activeIcon = $(this) + $activeIcon = $(this), + currentRating = module.getRating(), + rating = $icon.index($activeIcon) + 1 + ; + if(settings.clearable && currentRating == rating) { + module.clearRating(); + } + else { + module.setRating( rating ); + } + } + }, + + clearRating: function() { + module.debug('Clearing current rating'); + module.setRating(0); + }, + + getRating: function() { + var + currentRating = $icon.filter('.' + className.active).size() + ; + module.verbose('Current rating retrieved', currentRating); + return currentRating; + }, + + setRating: function(rating) { + var + ratingIndex = (rating - 1 >= 0) + ? (rating - 1) + : 0, + $activeIcon = $icon.eq(ratingIndex) + ; + $module + .removeClass(className.hover) + ; + $icon + .removeClass(className.hover) + .removeClass(className.active) + ; + if(rating > 0) { + module.verbose('Setting current rating to', rating); + $activeIcon + .addClass(className.active) + .prevAll() + .addClass(className.active) ; - module.setRating( $icon.index($activeIcon) + 1); } + $.proxy(settings.onRate, element)(rating); }, + setting: function(name, value) { if(value !== undefined) { if( $.isPlainObject(name) ) { @@ -231,9 +254,6 @@ $.fn.rating = function(parameters) { if(moduleSelector) { title += ' \'' + moduleSelector + '\''; } - if($allModules.size() > 1) { - title += ' ' + '(' + $allModules.size() + ')'; - } if( (console.group !== undefined || console.table !== undefined) && performance.length > 0) { console.groupCollapsed(title); if(console.table) { @@ -336,7 +356,9 @@ $.fn.rating.settings = { initialRating : 0, interactive : true, - onRate : function(){}, + clearable : false, + + onRate : function(rating){}, error : { method : 'The method you called is not defined' diff --git a/build/minified/modules/tab.js b/build/minified/modules/tab.js index 1cd832a0e..f6efcdcb6 100644 --- a/build/minified/modules/tab.js +++ b/build/minified/modules/tab.js @@ -54,6 +54,15 @@ initialize: function() { module.debug('Initializing Tabs', $module); + + // set up automatic routing + if(settings.auto) { + module.verbose('Setting up automatic tab retrieval from server'); + settings.apiSettings = { + url: settings.path + '/{$tab}' + }; + } + // attach history events if(settings.history) { if( $.address === undefined ) { @@ -65,11 +74,6 @@ return false; } else { - if(settings.auto) { - settings.apiSettings = { - url: settings.path + '/{$tab}' - }; - } module.verbose('Address library found adding state change event'); $.address .state(settings.path) @@ -78,9 +82,10 @@ ; } } + // attach events if navigation wasn't set to window if( !$.isWindow( element ) ) { - module.debug('Attaching events to tab activator', $module); + module.debug('Attaching tab activation events to element', $module); $module .on('click' + eventNamespace, module.event.click) ; @@ -103,7 +108,7 @@ }, event: { - click: function() { + click: function(event) { module.debug('Navigation clicked'); var tabPath = $(this).data(metadata.tab) @@ -115,6 +120,7 @@ else { module.changeTab(tabPath); } + event.preventDefault(); } else { module.debug('No tab specified'); @@ -262,6 +268,7 @@ }, request = $tab.data(metadata.promise) || false, existingRequest = ( request && request.state() === 'pending' ), + requestSettings, cachedContent ; @@ -281,8 +288,10 @@ ; } else if($.api !== undefined) { - module.debug('Retrieving remote content', fullTabPath); - $.api( $.extend(true, { headers: { 'X-Remote': true } }, settings.apiSettings, apiSettings) ); + console.log(settings.apiSettings); + requestSettings = $.extend(true, { headers: { 'X-Remote': true } }, settings.apiSettings, apiSettings); + module.debug('Retrieving remote content', fullTabPath, requestSettings); + $.api( requestSettings ); } else { module.error(error.api); @@ -372,7 +381,7 @@ module.error(error.recursion); } else { - module.debug('No default tabs found for', tabPath); + module.debug('No default tabs found for', tabPath, $tabs); } recursionDepth = 0; return tabPath; @@ -642,7 +651,7 @@ // max depth a tab can be nested maxDepth : 25, // dont load content on first load - ignoreFirstLoad : true, + ignoreFirstLoad : false, // load tab content new every tab click alwaysRefresh : false, // cache the content requests to pull locally diff --git a/build/uncompressed/collections/grid.css b/build/uncompressed/collections/grid.css index 2cf88cb45..bd79875fa 100644 --- a/build/uncompressed/collections/grid.css +++ b/build/uncompressed/collections/grid.css @@ -78,7 +78,8 @@ --------------------*/ .ui.page.grid { margin: 0%; - padding: 0% 2%; + padding-left: 0%; + padding-right: 0%; } /*------------------- Responsive diff --git a/build/uncompressed/modules/rating.js b/build/uncompressed/modules/rating.js index 7267eb2ea..0eabb5953 100644 --- a/build/uncompressed/modules/rating.js +++ b/build/uncompressed/modules/rating.js @@ -87,29 +87,6 @@ $.fn.rating = function(parameters) { ; }, - setRating: function(rating) { - var - $activeIcon = $icon.eq(rating - 1) - ; - module.verbose('Setting current rating to', rating); - $module - .removeClass(className.hover) - ; - $icon - .removeClass(className.hover) - ; - $activeIcon - .nextAll() - .removeClass(className.active) - ; - $activeIcon - .addClass(className.active) - .prevAll() - .addClass(className.active) - ; - $.proxy(settings.onRate, element)(); - }, - event: { mouseenter: function() { var @@ -138,11 +115,57 @@ $.fn.rating = function(parameters) { }, click: function() { var - $activeIcon = $(this) + $activeIcon = $(this), + currentRating = module.getRating(), + rating = $icon.index($activeIcon) + 1 + ; + if(settings.clearable && currentRating == rating) { + module.clearRating(); + } + else { + module.setRating( rating ); + } + } + }, + + clearRating: function() { + module.debug('Clearing current rating'); + module.setRating(0); + }, + + getRating: function() { + var + currentRating = $icon.filter('.' + className.active).size() + ; + module.verbose('Current rating retrieved', currentRating); + return currentRating; + }, + + setRating: function(rating) { + var + ratingIndex = (rating - 1 >= 0) + ? (rating - 1) + : 0, + $activeIcon = $icon.eq(ratingIndex) + ; + $module + .removeClass(className.hover) + ; + $icon + .removeClass(className.hover) + .removeClass(className.active) + ; + if(rating > 0) { + module.verbose('Setting current rating to', rating); + $activeIcon + .addClass(className.active) + .prevAll() + .addClass(className.active) ; - module.setRating( $icon.index($activeIcon) + 1); } + $.proxy(settings.onRate, element)(rating); }, + setting: function(name, value) { if(value !== undefined) { if( $.isPlainObject(name) ) { @@ -231,9 +254,6 @@ $.fn.rating = function(parameters) { if(moduleSelector) { title += ' \'' + moduleSelector + '\''; } - if($allModules.size() > 1) { - title += ' ' + '(' + $allModules.size() + ')'; - } if( (console.group !== undefined || console.table !== undefined) && performance.length > 0) { console.groupCollapsed(title); if(console.table) { @@ -336,7 +356,9 @@ $.fn.rating.settings = { initialRating : 0, interactive : true, - onRate : function(){}, + clearable : false, + + onRate : function(rating){}, error : { method : 'The method you called is not defined' diff --git a/build/uncompressed/modules/tab.js b/build/uncompressed/modules/tab.js index 1cd832a0e..f6efcdcb6 100644 --- a/build/uncompressed/modules/tab.js +++ b/build/uncompressed/modules/tab.js @@ -54,6 +54,15 @@ initialize: function() { module.debug('Initializing Tabs', $module); + + // set up automatic routing + if(settings.auto) { + module.verbose('Setting up automatic tab retrieval from server'); + settings.apiSettings = { + url: settings.path + '/{$tab}' + }; + } + // attach history events if(settings.history) { if( $.address === undefined ) { @@ -65,11 +74,6 @@ return false; } else { - if(settings.auto) { - settings.apiSettings = { - url: settings.path + '/{$tab}' - }; - } module.verbose('Address library found adding state change event'); $.address .state(settings.path) @@ -78,9 +82,10 @@ ; } } + // attach events if navigation wasn't set to window if( !$.isWindow( element ) ) { - module.debug('Attaching events to tab activator', $module); + module.debug('Attaching tab activation events to element', $module); $module .on('click' + eventNamespace, module.event.click) ; @@ -103,7 +108,7 @@ }, event: { - click: function() { + click: function(event) { module.debug('Navigation clicked'); var tabPath = $(this).data(metadata.tab) @@ -115,6 +120,7 @@ else { module.changeTab(tabPath); } + event.preventDefault(); } else { module.debug('No tab specified'); @@ -262,6 +268,7 @@ }, request = $tab.data(metadata.promise) || false, existingRequest = ( request && request.state() === 'pending' ), + requestSettings, cachedContent ; @@ -281,8 +288,10 @@ ; } else if($.api !== undefined) { - module.debug('Retrieving remote content', fullTabPath); - $.api( $.extend(true, { headers: { 'X-Remote': true } }, settings.apiSettings, apiSettings) ); + console.log(settings.apiSettings); + requestSettings = $.extend(true, { headers: { 'X-Remote': true } }, settings.apiSettings, apiSettings); + module.debug('Retrieving remote content', fullTabPath, requestSettings); + $.api( requestSettings ); } else { module.error(error.api); @@ -372,7 +381,7 @@ module.error(error.recursion); } else { - module.debug('No default tabs found for', tabPath); + module.debug('No default tabs found for', tabPath, $tabs); } recursionDepth = 0; return tabPath; @@ -642,7 +651,7 @@ // max depth a tab can be nested maxDepth : 25, // dont load content on first load - ignoreFirstLoad : true, + ignoreFirstLoad : false, // load tab content new every tab click alwaysRefresh : false, // cache the content requests to pull locally diff --git a/node/src/documents/modules/rating.html.eco b/node/src/documents/modules/rating.html.eco index eaa19ccf7..4d70804cd 100755 --- a/node/src/documents/modules/rating.html.eco +++ b/node/src/documents/modules/rating.html.eco @@ -122,6 +122,22 @@ type : 'UI Module' +
+

Clearing Ratings

+

When clearable is set to true you can clear the rating by clicking on the current start rating.

+
+ $('.demo.rating') + .rating('setting', 'clearable', true) + ; +
+
+ + + + + +
+

Variations

@@ -166,6 +182,26 @@ type : 'UI Module' +
+

Get Rating

+

A rating can be retrieved

+
+ $('.ui.rating') + .rating('set rating', 3) + ; +
+
+ +
+

Clear Rating

+

A rating can be cleared

+
+ $('.ui.rating') + .rating('clear rating') + ; +
+
+

Settings

@@ -184,6 +220,11 @@ type : 'UI Module' 0 A number representing the default rating to apply + + clearable + false + If enabled clicking on the current star rating will clear the rating + interactive true diff --git a/node/src/documents/modules/tab.html.eco b/node/src/documents/modules/tab.html.eco index c2516c99c..6a8bca410 100755 --- a/node/src/documents/modules/tab.html.eco +++ b/node/src/documents/modules/tab.html.eco @@ -15,82 +15,203 @@ type : 'UI Module'
- Usage Examples + Coupling Behavior Settings
-

Usage

+

Examples

-

Opening tabs with menus

-

Tabs are usually used in concert with an element that activates the tab.

-

When using tabs, unlike other UI components, the menu or activating element is initialized instead of the tab.

+
-
- Tabs are connected to their activators with a metadata attribute data-tab. This should be added to both the activating element and the tab itself. -
-
- $('.demo.menu .item') - .tab() +

Opening tabs with menus

+

Tabs are usually used in concert with an element that activates the tab. When using tabs, unlike other UI components, the menu or activating element is initialized instead of the tab.

+

Tabs are connected to their activators with a metadata attribute data-tab. This should be added to both the activating element and the tab itself.

+ +
+

Default tabs

+

After any tab is opened it will look for a default tab to open inside of the current tab. This is the first tab that begins with the same stem url as the parent tab. For example a tab with the path data-tab="home" might open a tab automatically data-tab="/home/inbox".

+

This will happen recursively for every tab open, allowing as many levels of tabs as you like

+
+ +
+ $('.first.example .menu .item') + .tab({ + context: '.first.example' + }) ; -
-
-
- First - Second - Third +
+
+
+ First + Second + Third
- First Tab +
+ 1A + 1B + 1C +
+
1A
+
1B
+
1C
+
+
...
+
...
+
+ +
+ First + Second + Third +
+
+
+ 1A + 1B + 1C +
+
1A
+
1B
+
1C
- Second Tab +
+ 2A + 2B + 2C +
+
2A
+
2B
+
2C
- Third Tab +
+ 3A + 3B + 3C +
+
3A
+
3B
+
3C
-

Managing Back/Forward Buttons with Tabs

-

Tabs can attach to a history change event to allow for tabs to maintain history events. Tabs use Asual's Address library to provide cross-browser push state support. This makes sure in browser that don't support push state, hashchange is used with in page anchors to provide history functionality.

-
-
Use proper path
- Make sure when you use history to specify the proper path. This is required for determining the stem url from the part of the url maintaining in page history. Using the incorrect path will cause the module to work incorrectly, producing unexpected results. -
-
-
Route your URLs
- Be sure to set up routes on your server for any url used with history. If you use history to change the url to a location that does not exist, it will 404 on the next refresh. For example this documentation will 404 on refresh because Github Pages are only set up to server static site content. +

Optional Coupling

+ +
+

Managing History with Tabs

+

Tabs can attach to a history change event to allow for tabs to maintain history events. Tabs use Asual's Address library to provide cross-browser push state support. This makes sure in browser that don't support push state, hashchange is used with in page anchors to provide history functionality.

+
+

Setup Paths

+ Make sure when you use history to specify the path. This is required for determining the stem url from the part of the url maintaining in page history. The path is the URL without any tabs open. This cannot usually be set automatically because on future page refreshes the URL may include an internal link. Using the incorrect path will cause the module to work incorrectly, producing unexpected results. +
+
+

Route your URLs

+ Be sure to set up routes on your server for any url used with history. If you use history to change the url to a location that does not exist, it will 404 on the next refresh. The docs for example, are static github hosted pages, so will 404 if the page url changes +
+
+ $('.history.example .menu .item') + .tab({ + context : '.history.example', + history : true, + path : '/modules/tab.html' + }) + ; +
+
+ First + Second + Third +
+
+
+ 1A + 1B + 1C +
+
1A
+
1B
+
1C
+
+
+
+ 2A + 2B + 2C +
+
2A
+
2B
+
2C
+
+
+
+ 3A + 3B + 3C +
+
3A
+
3B
+
3C
+
-
- $('.history.menu .item') + +
+

Retreiving Dynamic Tab Content

+

The easiest way to setup dynamic content is to use the parameter auto, this will automatically retrieve content at a remote url matching the url set in the browser. The URL will receive an addition HTTP Header 'X-Remote': true. You can use this on your server's back-end to determine whether a request is an AJAX request from a tab

+

This uses a similar technique to pJax or Rail's turbolinks.

+ +
There are a variety of settings for configuring dynamic content behavior. Visit the tab settings section for more information
+ +
+ $('.dynamic.example .menu .item') .tab({ - history : true, + context : '.dynamic.example', + auto : true, path : '/modules/tab.html' }) ; -
-
-
+
+
First Second Third
- First Tab +
+ 1A + 1B + 1C +
+
+
+
- Second Tab +
+ 2A + 2B + 2C +
+
+
+
- Third Tab +
+ 3A + 3B + 3C +
+
+
+
-

Examples

- -

Behavior

All the following behaviors can be called using the syntax $('.foo').tab('behavior name', argumentOne, argumentTwo) diff --git a/node/src/files/build/less/collections/grid.less b/node/src/files/build/less/collections/grid.less index 2e332a322..9e5b89220 100644 --- a/node/src/files/build/less/collections/grid.less +++ b/node/src/files/build/less/collections/grid.less @@ -98,7 +98,8 @@ .ui.page.grid { margin: 0%; - padding: 0% 2%; + padding-left: 0%; + padding-right: 0%; } diff --git a/node/src/files/build/less/modules/rating.js b/node/src/files/build/less/modules/rating.js index 7267eb2ea..0eabb5953 100644 --- a/node/src/files/build/less/modules/rating.js +++ b/node/src/files/build/less/modules/rating.js @@ -87,29 +87,6 @@ $.fn.rating = function(parameters) { ; }, - setRating: function(rating) { - var - $activeIcon = $icon.eq(rating - 1) - ; - module.verbose('Setting current rating to', rating); - $module - .removeClass(className.hover) - ; - $icon - .removeClass(className.hover) - ; - $activeIcon - .nextAll() - .removeClass(className.active) - ; - $activeIcon - .addClass(className.active) - .prevAll() - .addClass(className.active) - ; - $.proxy(settings.onRate, element)(); - }, - event: { mouseenter: function() { var @@ -138,11 +115,57 @@ $.fn.rating = function(parameters) { }, click: function() { var - $activeIcon = $(this) + $activeIcon = $(this), + currentRating = module.getRating(), + rating = $icon.index($activeIcon) + 1 + ; + if(settings.clearable && currentRating == rating) { + module.clearRating(); + } + else { + module.setRating( rating ); + } + } + }, + + clearRating: function() { + module.debug('Clearing current rating'); + module.setRating(0); + }, + + getRating: function() { + var + currentRating = $icon.filter('.' + className.active).size() + ; + module.verbose('Current rating retrieved', currentRating); + return currentRating; + }, + + setRating: function(rating) { + var + ratingIndex = (rating - 1 >= 0) + ? (rating - 1) + : 0, + $activeIcon = $icon.eq(ratingIndex) + ; + $module + .removeClass(className.hover) + ; + $icon + .removeClass(className.hover) + .removeClass(className.active) + ; + if(rating > 0) { + module.verbose('Setting current rating to', rating); + $activeIcon + .addClass(className.active) + .prevAll() + .addClass(className.active) ; - module.setRating( $icon.index($activeIcon) + 1); } + $.proxy(settings.onRate, element)(rating); }, + setting: function(name, value) { if(value !== undefined) { if( $.isPlainObject(name) ) { @@ -231,9 +254,6 @@ $.fn.rating = function(parameters) { if(moduleSelector) { title += ' \'' + moduleSelector + '\''; } - if($allModules.size() > 1) { - title += ' ' + '(' + $allModules.size() + ')'; - } if( (console.group !== undefined || console.table !== undefined) && performance.length > 0) { console.groupCollapsed(title); if(console.table) { @@ -336,7 +356,9 @@ $.fn.rating.settings = { initialRating : 0, interactive : true, - onRate : function(){}, + clearable : false, + + onRate : function(rating){}, error : { method : 'The method you called is not defined' diff --git a/node/src/files/build/less/modules/tab.js b/node/src/files/build/less/modules/tab.js index 1cd832a0e..f6efcdcb6 100644 --- a/node/src/files/build/less/modules/tab.js +++ b/node/src/files/build/less/modules/tab.js @@ -54,6 +54,15 @@ initialize: function() { module.debug('Initializing Tabs', $module); + + // set up automatic routing + if(settings.auto) { + module.verbose('Setting up automatic tab retrieval from server'); + settings.apiSettings = { + url: settings.path + '/{$tab}' + }; + } + // attach history events if(settings.history) { if( $.address === undefined ) { @@ -65,11 +74,6 @@ return false; } else { - if(settings.auto) { - settings.apiSettings = { - url: settings.path + '/{$tab}' - }; - } module.verbose('Address library found adding state change event'); $.address .state(settings.path) @@ -78,9 +82,10 @@ ; } } + // attach events if navigation wasn't set to window if( !$.isWindow( element ) ) { - module.debug('Attaching events to tab activator', $module); + module.debug('Attaching tab activation events to element', $module); $module .on('click' + eventNamespace, module.event.click) ; @@ -103,7 +108,7 @@ }, event: { - click: function() { + click: function(event) { module.debug('Navigation clicked'); var tabPath = $(this).data(metadata.tab) @@ -115,6 +120,7 @@ else { module.changeTab(tabPath); } + event.preventDefault(); } else { module.debug('No tab specified'); @@ -262,6 +268,7 @@ }, request = $tab.data(metadata.promise) || false, existingRequest = ( request && request.state() === 'pending' ), + requestSettings, cachedContent ; @@ -281,8 +288,10 @@ ; } else if($.api !== undefined) { - module.debug('Retrieving remote content', fullTabPath); - $.api( $.extend(true, { headers: { 'X-Remote': true } }, settings.apiSettings, apiSettings) ); + console.log(settings.apiSettings); + requestSettings = $.extend(true, { headers: { 'X-Remote': true } }, settings.apiSettings, apiSettings); + module.debug('Retrieving remote content', fullTabPath, requestSettings); + $.api( requestSettings ); } else { module.error(error.api); @@ -372,7 +381,7 @@ module.error(error.recursion); } else { - module.debug('No default tabs found for', tabPath); + module.debug('No default tabs found for', tabPath, $tabs); } recursionDepth = 0; return tabPath; @@ -642,7 +651,7 @@ // max depth a tab can be nested maxDepth : 25, // dont load content on first load - ignoreFirstLoad : true, + ignoreFirstLoad : false, // load tab content new every tab click alwaysRefresh : false, // cache the content requests to pull locally diff --git a/node/src/files/build/minified/modules/rating.js b/node/src/files/build/minified/modules/rating.js index 7267eb2ea..0eabb5953 100644 --- a/node/src/files/build/minified/modules/rating.js +++ b/node/src/files/build/minified/modules/rating.js @@ -87,29 +87,6 @@ $.fn.rating = function(parameters) { ; }, - setRating: function(rating) { - var - $activeIcon = $icon.eq(rating - 1) - ; - module.verbose('Setting current rating to', rating); - $module - .removeClass(className.hover) - ; - $icon - .removeClass(className.hover) - ; - $activeIcon - .nextAll() - .removeClass(className.active) - ; - $activeIcon - .addClass(className.active) - .prevAll() - .addClass(className.active) - ; - $.proxy(settings.onRate, element)(); - }, - event: { mouseenter: function() { var @@ -138,11 +115,57 @@ $.fn.rating = function(parameters) { }, click: function() { var - $activeIcon = $(this) + $activeIcon = $(this), + currentRating = module.getRating(), + rating = $icon.index($activeIcon) + 1 + ; + if(settings.clearable && currentRating == rating) { + module.clearRating(); + } + else { + module.setRating( rating ); + } + } + }, + + clearRating: function() { + module.debug('Clearing current rating'); + module.setRating(0); + }, + + getRating: function() { + var + currentRating = $icon.filter('.' + className.active).size() + ; + module.verbose('Current rating retrieved', currentRating); + return currentRating; + }, + + setRating: function(rating) { + var + ratingIndex = (rating - 1 >= 0) + ? (rating - 1) + : 0, + $activeIcon = $icon.eq(ratingIndex) + ; + $module + .removeClass(className.hover) + ; + $icon + .removeClass(className.hover) + .removeClass(className.active) + ; + if(rating > 0) { + module.verbose('Setting current rating to', rating); + $activeIcon + .addClass(className.active) + .prevAll() + .addClass(className.active) ; - module.setRating( $icon.index($activeIcon) + 1); } + $.proxy(settings.onRate, element)(rating); }, + setting: function(name, value) { if(value !== undefined) { if( $.isPlainObject(name) ) { @@ -231,9 +254,6 @@ $.fn.rating = function(parameters) { if(moduleSelector) { title += ' \'' + moduleSelector + '\''; } - if($allModules.size() > 1) { - title += ' ' + '(' + $allModules.size() + ')'; - } if( (console.group !== undefined || console.table !== undefined) && performance.length > 0) { console.groupCollapsed(title); if(console.table) { @@ -336,7 +356,9 @@ $.fn.rating.settings = { initialRating : 0, interactive : true, - onRate : function(){}, + clearable : false, + + onRate : function(rating){}, error : { method : 'The method you called is not defined' diff --git a/node/src/files/build/minified/modules/tab.js b/node/src/files/build/minified/modules/tab.js index 1cd832a0e..f6efcdcb6 100644 --- a/node/src/files/build/minified/modules/tab.js +++ b/node/src/files/build/minified/modules/tab.js @@ -54,6 +54,15 @@ initialize: function() { module.debug('Initializing Tabs', $module); + + // set up automatic routing + if(settings.auto) { + module.verbose('Setting up automatic tab retrieval from server'); + settings.apiSettings = { + url: settings.path + '/{$tab}' + }; + } + // attach history events if(settings.history) { if( $.address === undefined ) { @@ -65,11 +74,6 @@ return false; } else { - if(settings.auto) { - settings.apiSettings = { - url: settings.path + '/{$tab}' - }; - } module.verbose('Address library found adding state change event'); $.address .state(settings.path) @@ -78,9 +82,10 @@ ; } } + // attach events if navigation wasn't set to window if( !$.isWindow( element ) ) { - module.debug('Attaching events to tab activator', $module); + module.debug('Attaching tab activation events to element', $module); $module .on('click' + eventNamespace, module.event.click) ; @@ -103,7 +108,7 @@ }, event: { - click: function() { + click: function(event) { module.debug('Navigation clicked'); var tabPath = $(this).data(metadata.tab) @@ -115,6 +120,7 @@ else { module.changeTab(tabPath); } + event.preventDefault(); } else { module.debug('No tab specified'); @@ -262,6 +268,7 @@ }, request = $tab.data(metadata.promise) || false, existingRequest = ( request && request.state() === 'pending' ), + requestSettings, cachedContent ; @@ -281,8 +288,10 @@ ; } else if($.api !== undefined) { - module.debug('Retrieving remote content', fullTabPath); - $.api( $.extend(true, { headers: { 'X-Remote': true } }, settings.apiSettings, apiSettings) ); + console.log(settings.apiSettings); + requestSettings = $.extend(true, { headers: { 'X-Remote': true } }, settings.apiSettings, apiSettings); + module.debug('Retrieving remote content', fullTabPath, requestSettings); + $.api( requestSettings ); } else { module.error(error.api); @@ -372,7 +381,7 @@ module.error(error.recursion); } else { - module.debug('No default tabs found for', tabPath); + module.debug('No default tabs found for', tabPath, $tabs); } recursionDepth = 0; return tabPath; @@ -642,7 +651,7 @@ // max depth a tab can be nested maxDepth : 25, // dont load content on first load - ignoreFirstLoad : true, + ignoreFirstLoad : false, // load tab content new every tab click alwaysRefresh : false, // cache the content requests to pull locally diff --git a/node/src/files/build/uncompressed/collections/grid.css b/node/src/files/build/uncompressed/collections/grid.css index 2cf88cb45..bd79875fa 100644 --- a/node/src/files/build/uncompressed/collections/grid.css +++ b/node/src/files/build/uncompressed/collections/grid.css @@ -78,7 +78,8 @@ --------------------*/ .ui.page.grid { margin: 0%; - padding: 0% 2%; + padding-left: 0%; + padding-right: 0%; } /*------------------- Responsive diff --git a/node/src/files/build/uncompressed/modules/rating.js b/node/src/files/build/uncompressed/modules/rating.js index 7267eb2ea..0eabb5953 100644 --- a/node/src/files/build/uncompressed/modules/rating.js +++ b/node/src/files/build/uncompressed/modules/rating.js @@ -87,29 +87,6 @@ $.fn.rating = function(parameters) { ; }, - setRating: function(rating) { - var - $activeIcon = $icon.eq(rating - 1) - ; - module.verbose('Setting current rating to', rating); - $module - .removeClass(className.hover) - ; - $icon - .removeClass(className.hover) - ; - $activeIcon - .nextAll() - .removeClass(className.active) - ; - $activeIcon - .addClass(className.active) - .prevAll() - .addClass(className.active) - ; - $.proxy(settings.onRate, element)(); - }, - event: { mouseenter: function() { var @@ -138,11 +115,57 @@ $.fn.rating = function(parameters) { }, click: function() { var - $activeIcon = $(this) + $activeIcon = $(this), + currentRating = module.getRating(), + rating = $icon.index($activeIcon) + 1 + ; + if(settings.clearable && currentRating == rating) { + module.clearRating(); + } + else { + module.setRating( rating ); + } + } + }, + + clearRating: function() { + module.debug('Clearing current rating'); + module.setRating(0); + }, + + getRating: function() { + var + currentRating = $icon.filter('.' + className.active).size() + ; + module.verbose('Current rating retrieved', currentRating); + return currentRating; + }, + + setRating: function(rating) { + var + ratingIndex = (rating - 1 >= 0) + ? (rating - 1) + : 0, + $activeIcon = $icon.eq(ratingIndex) + ; + $module + .removeClass(className.hover) + ; + $icon + .removeClass(className.hover) + .removeClass(className.active) + ; + if(rating > 0) { + module.verbose('Setting current rating to', rating); + $activeIcon + .addClass(className.active) + .prevAll() + .addClass(className.active) ; - module.setRating( $icon.index($activeIcon) + 1); } + $.proxy(settings.onRate, element)(rating); }, + setting: function(name, value) { if(value !== undefined) { if( $.isPlainObject(name) ) { @@ -231,9 +254,6 @@ $.fn.rating = function(parameters) { if(moduleSelector) { title += ' \'' + moduleSelector + '\''; } - if($allModules.size() > 1) { - title += ' ' + '(' + $allModules.size() + ')'; - } if( (console.group !== undefined || console.table !== undefined) && performance.length > 0) { console.groupCollapsed(title); if(console.table) { @@ -336,7 +356,9 @@ $.fn.rating.settings = { initialRating : 0, interactive : true, - onRate : function(){}, + clearable : false, + + onRate : function(rating){}, error : { method : 'The method you called is not defined' diff --git a/node/src/files/build/uncompressed/modules/tab.js b/node/src/files/build/uncompressed/modules/tab.js index 1cd832a0e..f6efcdcb6 100644 --- a/node/src/files/build/uncompressed/modules/tab.js +++ b/node/src/files/build/uncompressed/modules/tab.js @@ -54,6 +54,15 @@ initialize: function() { module.debug('Initializing Tabs', $module); + + // set up automatic routing + if(settings.auto) { + module.verbose('Setting up automatic tab retrieval from server'); + settings.apiSettings = { + url: settings.path + '/{$tab}' + }; + } + // attach history events if(settings.history) { if( $.address === undefined ) { @@ -65,11 +74,6 @@ return false; } else { - if(settings.auto) { - settings.apiSettings = { - url: settings.path + '/{$tab}' - }; - } module.verbose('Address library found adding state change event'); $.address .state(settings.path) @@ -78,9 +82,10 @@ ; } } + // attach events if navigation wasn't set to window if( !$.isWindow( element ) ) { - module.debug('Attaching events to tab activator', $module); + module.debug('Attaching tab activation events to element', $module); $module .on('click' + eventNamespace, module.event.click) ; @@ -103,7 +108,7 @@ }, event: { - click: function() { + click: function(event) { module.debug('Navigation clicked'); var tabPath = $(this).data(metadata.tab) @@ -115,6 +120,7 @@ else { module.changeTab(tabPath); } + event.preventDefault(); } else { module.debug('No tab specified'); @@ -262,6 +268,7 @@ }, request = $tab.data(metadata.promise) || false, existingRequest = ( request && request.state() === 'pending' ), + requestSettings, cachedContent ; @@ -281,8 +288,10 @@ ; } else if($.api !== undefined) { - module.debug('Retrieving remote content', fullTabPath); - $.api( $.extend(true, { headers: { 'X-Remote': true } }, settings.apiSettings, apiSettings) ); + console.log(settings.apiSettings); + requestSettings = $.extend(true, { headers: { 'X-Remote': true } }, settings.apiSettings, apiSettings); + module.debug('Retrieving remote content', fullTabPath, requestSettings); + $.api( requestSettings ); } else { module.error(error.api); @@ -372,7 +381,7 @@ module.error(error.recursion); } else { - module.debug('No default tabs found for', tabPath); + module.debug('No default tabs found for', tabPath, $tabs); } recursionDepth = 0; return tabPath; @@ -642,7 +651,7 @@ // max depth a tab can be nested maxDepth : 25, // dont load content on first load - ignoreFirstLoad : true, + ignoreFirstLoad : false, // load tab content new every tab click alwaysRefresh : false, // cache the content requests to pull locally diff --git a/node/src/files/javascript/tab.js b/node/src/files/javascript/tab.js index 1ebf16ec1..c02a44853 100755 --- a/node/src/files/javascript/tab.js +++ b/node/src/files/javascript/tab.js @@ -5,7 +5,6 @@ semantic.dropdown.ready = function() { // selector cache var - $examples = $('.example'), // alias handler ; @@ -15,10 +14,26 @@ semantic.dropdown.ready = function() { }; - $('.demo.menu') - .first() - .find('.item') - .tab() + $('.first.example .menu .item') + .tab({ + context: '.first.example' + }) + ; + + $('.history.example .menu .item') + .tab({ + context : '.history.example', + history : true, + path : '/modules/tab.html' + }) + ; + + $('.dynamic.example .menu .item') + .tab({ + context : '.dynamic.example', + auto : true, + path : '/modules/tab.html' + }) ; }; diff --git a/src/modules/rating.js b/src/modules/rating.js index 7267eb2ea..0eabb5953 100755 --- a/src/modules/rating.js +++ b/src/modules/rating.js @@ -87,29 +87,6 @@ $.fn.rating = function(parameters) { ; }, - setRating: function(rating) { - var - $activeIcon = $icon.eq(rating - 1) - ; - module.verbose('Setting current rating to', rating); - $module - .removeClass(className.hover) - ; - $icon - .removeClass(className.hover) - ; - $activeIcon - .nextAll() - .removeClass(className.active) - ; - $activeIcon - .addClass(className.active) - .prevAll() - .addClass(className.active) - ; - $.proxy(settings.onRate, element)(); - }, - event: { mouseenter: function() { var @@ -138,11 +115,57 @@ $.fn.rating = function(parameters) { }, click: function() { var - $activeIcon = $(this) + $activeIcon = $(this), + currentRating = module.getRating(), + rating = $icon.index($activeIcon) + 1 + ; + if(settings.clearable && currentRating == rating) { + module.clearRating(); + } + else { + module.setRating( rating ); + } + } + }, + + clearRating: function() { + module.debug('Clearing current rating'); + module.setRating(0); + }, + + getRating: function() { + var + currentRating = $icon.filter('.' + className.active).size() + ; + module.verbose('Current rating retrieved', currentRating); + return currentRating; + }, + + setRating: function(rating) { + var + ratingIndex = (rating - 1 >= 0) + ? (rating - 1) + : 0, + $activeIcon = $icon.eq(ratingIndex) + ; + $module + .removeClass(className.hover) + ; + $icon + .removeClass(className.hover) + .removeClass(className.active) + ; + if(rating > 0) { + module.verbose('Setting current rating to', rating); + $activeIcon + .addClass(className.active) + .prevAll() + .addClass(className.active) ; - module.setRating( $icon.index($activeIcon) + 1); } + $.proxy(settings.onRate, element)(rating); }, + setting: function(name, value) { if(value !== undefined) { if( $.isPlainObject(name) ) { @@ -231,9 +254,6 @@ $.fn.rating = function(parameters) { if(moduleSelector) { title += ' \'' + moduleSelector + '\''; } - if($allModules.size() > 1) { - title += ' ' + '(' + $allModules.size() + ')'; - } if( (console.group !== undefined || console.table !== undefined) && performance.length > 0) { console.groupCollapsed(title); if(console.table) { @@ -336,7 +356,9 @@ $.fn.rating.settings = { initialRating : 0, interactive : true, - onRate : function(){}, + clearable : false, + + onRate : function(rating){}, error : { method : 'The method you called is not defined' diff --git a/src/modules/tab.js b/src/modules/tab.js index 1cd832a0e..f6efcdcb6 100755 --- a/src/modules/tab.js +++ b/src/modules/tab.js @@ -54,6 +54,15 @@ initialize: function() { module.debug('Initializing Tabs', $module); + + // set up automatic routing + if(settings.auto) { + module.verbose('Setting up automatic tab retrieval from server'); + settings.apiSettings = { + url: settings.path + '/{$tab}' + }; + } + // attach history events if(settings.history) { if( $.address === undefined ) { @@ -65,11 +74,6 @@ return false; } else { - if(settings.auto) { - settings.apiSettings = { - url: settings.path + '/{$tab}' - }; - } module.verbose('Address library found adding state change event'); $.address .state(settings.path) @@ -78,9 +82,10 @@ ; } } + // attach events if navigation wasn't set to window if( !$.isWindow( element ) ) { - module.debug('Attaching events to tab activator', $module); + module.debug('Attaching tab activation events to element', $module); $module .on('click' + eventNamespace, module.event.click) ; @@ -103,7 +108,7 @@ }, event: { - click: function() { + click: function(event) { module.debug('Navigation clicked'); var tabPath = $(this).data(metadata.tab) @@ -115,6 +120,7 @@ else { module.changeTab(tabPath); } + event.preventDefault(); } else { module.debug('No tab specified'); @@ -262,6 +268,7 @@ }, request = $tab.data(metadata.promise) || false, existingRequest = ( request && request.state() === 'pending' ), + requestSettings, cachedContent ; @@ -281,8 +288,10 @@ ; } else if($.api !== undefined) { - module.debug('Retrieving remote content', fullTabPath); - $.api( $.extend(true, { headers: { 'X-Remote': true } }, settings.apiSettings, apiSettings) ); + console.log(settings.apiSettings); + requestSettings = $.extend(true, { headers: { 'X-Remote': true } }, settings.apiSettings, apiSettings); + module.debug('Retrieving remote content', fullTabPath, requestSettings); + $.api( requestSettings ); } else { module.error(error.api); @@ -372,7 +381,7 @@ module.error(error.recursion); } else { - module.debug('No default tabs found for', tabPath); + module.debug('No default tabs found for', tabPath, $tabs); } recursionDepth = 0; return tabPath; @@ -642,7 +651,7 @@ // max depth a tab can be nested maxDepth : 25, // dont load content on first load - ignoreFirstLoad : true, + ignoreFirstLoad : false, // load tab content new every tab click alwaysRefresh : false, // cache the content requests to pull locally