Permalink
Browse files

Adding ability for links that reference a section with a #href name t…

…o change the tabs.
  • Loading branch information...
1 parent 4a89c1a commit 1dc1b391edbc15e480d7fd4e56ba6ae0dc318a3f @anutron committed May 5, 2013
Showing with 69 additions and 5 deletions.
  1. +38 −0 Source/3rdParty/MooHashChange.js
  2. +24 −0 Source/Behaviors/Behavior.Tabs.js
  3. +5 −4 Source/Layout/TabSwapper.Hash.js
  4. +2 −1 package.yml
@@ -0,0 +1,38 @@
+/*
+---
+description: Added the onhashchange event
+
+license: MIT-style
+
+authors:
+- sdf1981cgn
+- Greggory Hernandez
+
+requires:
+- core/1.2.4: '*'
+
+provides: [Element.Events.hashchange]
+
+...
+*/
+Element.Events.hashchange = {
+ onAdd: function () {
+ var hash = location.hash;
+
+ var hashchange = function () {
+ if (hash == location.hash) return;
+ else hash = location.hash;
+
+ var value = (hash.indexOf('#') == 0 ? hash.substr(1) : hash);
+ window.fireEvent('hashchange', value);
+ document.fireEvent('hashchange', value);
+ };
+
+ if (("onhashchange" in window) && ((document.documentMode != 5) && (document.documentMode != 7))) {
+ window.onhashchange = hashchange;
+ }
+ else {
+ hashchange.periodical(50);
+ }
+ }
+};
@@ -51,6 +51,30 @@ Behavior.addGlobalFilters({
ts.addEvent('active', function(index){
api.fireEvent('layout:display', sections[0].getParent());
});
+
+ // get the element to delegate clicks to - defaults to the container
+ var target = element;
+ if (api.get('delegationTarget')) target = element.getElement(api.get('delegationTarget'));
+ if (!target) api.fail('Could not find delegation target for tabs');
+
+ // delegate watching click events for any element with an #href
+ target.addEvent('click:relay([href^=#])', function(event, link){
+ if (link.get('href') == "#") return;
+ // attempt to find the target for the link within the page
+ var target = element.getElement(link.get('href'));
+ // if the target IS a tab, do nothing; valid targets are *sections*
+ if (ts.tabs.contains(target)) return;
+ // if no target was found at all, warn
+ if (!target) api.warn('Could not switch tab; no section found for ' + link.get('href'));
+ // if the target is a section, show it.
+ if (ts.sections.contains(target)) {
+ event.preventDefault();
+ var delegator = api.getDelegator();
+ if (delegator) delegator._eventHandler(event, ts.tabs[ts.sections.indexOf(target)]);
+ ts.show(ts.sections.indexOf(target));
+ }
+ });
+
element.store('TabSwapper', ts);
api.onCleanup(function(){
ts.destroy();
@@ -7,7 +7,7 @@ description: Stores tab selection in the window.hash
license: MIT-Style License
-requires: [/TabSwapper, More/String.QueryString, More/Object.Extras]
+requires: [/TabSwapper, More/String.QueryString, More/Object.Extras, /Element.Events.hashchange]
provides: TabSwapper.Hash
@@ -30,6 +30,7 @@ TabSwapper.Hash = new Class({
hash = this.options.hash;
delete options.hash;
delete this.options.hash;
+ options.preventDefault = true;
}
this.parent(options);
if (hash){
@@ -46,7 +47,7 @@ TabSwapper.Hash = new Class({
// shows a section based on the window location hash value
showByHash: function(){
var i = this.getIndexByHash();
- if (i !== null) this.show(i);
+ if (i || i===0) this.show(i);
return this;
},
// gets the index to show based on an elementID
@@ -65,7 +66,7 @@ TabSwapper.Hash = new Class({
var hash = getHash();
if (!hash) return this;
var value = hash[this.options.hash];
- if (isNaN(value.toInt())){
+ if (value && isNaN(value.toInt())){
var i = this.getIndexById(value);
if (i !== null) value = i;
else return null;
@@ -81,7 +82,7 @@ TabSwapper.Hash = new Class({
show: function(i){
this.parent.apply(this, arguments);
if (this.options.hash) {
- var hash = getHash();
+ var hash = getHash() || {};
hash[this.options.hash] = this.tabs[i].get('id') || this.sections[i].get('id') || i;
window.location.hash = Object.cleanValues(Object.toQueryString(hash));
}
View
@@ -48,5 +48,6 @@ sources: [
Source/3rdParty/Autocompleter.JSONP.js,
Source/3rdParty/Autocompleter.Local.js,
Source/3rdParty/Autocompleter.Observer.js,
- Source/3rdParty/Autocompleter.Remote.js
+ Source/3rdParty/Autocompleter.Remote.js,
+ Source/3rdParty/MooHashChange.js
]

0 comments on commit 1dc1b39

Please sign in to comment.