Author: sevein
Date: Mon Jun 11 15:37:05 2012
New Revision: 11759
Log:
Extend treeview functionality to browse back and forth in the hierarchy
Modified:
branches/2.0/js/dominion.js
Modified: branches/2.0/js/dominion.js
==============================================================================
--- branches/2.0/js/dominion.js Mon Jun 11 00:02:46 2012 (r11758)
+++ branches/2.0/js/dominion.js Mon Jun 11 15:37:05 2012 (r11759)
@@ -299,8 +299,8 @@
{
this.$element = element;
this.$showAllButton = this.$element.find('li:first');
- this.url = this.$element.data('xhr-location');
this.loading = false;
+
this.init();
};
@@ -322,6 +322,8 @@
{
var $target = $(e.target);
+ e.preventDefault();
+
// Detect when users scrolls to the bottom
if ($target.scrollTop() + $target.innerHeight() >=
$target.get(0).scrollHeight)
{
@@ -361,134 +363,174 @@
return this.showAll($li);
}
-
- /*
- if ('I' !== e.target.tagName)
+ else if ($li.hasClass('ancestor'))
{
- return this;
- }
- */
-
- e.preventDefault();
- e.stopPropagation();
+ e.preventDefault();
+ e.stopPropagation();
- if ($li.hasClass('ancestor') && !$li.next().hasClass('ancestor'))
- {
+ if (!$li.next().hasClass('ancestor'))
+ {
+ return this;
+ }
+ return this.showAncestor($li);
}
else if ($li.hasClass('expand'))
{
+ e.preventDefault();
+ e.stopPropagation();
+
return this.showItem($li);
}
else if ($li.hasClass('more'))
{
- var $a = $li.find('a');
+ e.preventDefault();
+ e.stopPropagation();
- var loadingId = window.setInterval(function()
+ return this.showMore($li);
+ }
+
+ return this;
+ },
+
+ showAll: function ($element)
+ {
+ $.ajax({
+ url: $element.data('xhr-location'),
+ context: this,
+ dataType: 'html',
+ data: { show: 'all' },
+ beforeSend: function ()
{
- $a.append('.');
- }, 125);
+ this.loading = true;
+ },
+ success: function (data)
+ {
+ $element
+ .hide()
+ .nextAll().remove().end()
+ .after(data).end();
+ },
+ complete: function ()
+ {
+ this.loading = false;
+ },
+ error: function ()
+ {
+ }
+ });
- if (!$li.next().length)
- {
- var action = 'nextSiblings';
- var url = $li.data('xhr-location');
- }
- else
- {
- var action = 'prevSiblings';
- var url = $li.data('xhr-location');
- }
+ return this;
+ },
+
+ showItem: function($element)
+ {
+ $.ajax({
+ url: $element.data('xhr-location'),
+ context: this,
+ dataType: 'html',
+ data: { show: 'item' },
+ beforeSend: function ()
+ {
+ this.loading = true;
+ },
+ success: function (data)
+ {
+ this.$showAllButton
- console.log($li.data('xhr-location'));
+ // Show "Show all" button
+ .show()
- $.ajax({
- url: url,
- context: this,
- dataType: 'html',
- data: { show: action },
- beforeSend: function()
- {
- this.loading = true;
- },
- success: function (data)
- {
- $li.replaceWith(data);
- },
- complete: function ()
- {
- this.loading = false;
-
- window.clearTimeout(loadingId);
- },
- error: function ()
- {
- }
- });
- }
+ // Move cursor to last ancestor
+ .nextAll(':not(.ancestor,.showall):first').prev()
+
+ // Remove all siblings below
+ .nextAll().remove().end()
+
+ // Add new nodes
+ .after(data)
+
+ // Expanded node becomes now an ancestor
+ .after($element).next()
+ .removeClass('expand').addClass('ancestor');
+ },
+ complete: function ()
+ {
+ this.loading = false;
+ },
+ error: function ()
+ {
+ }
+ });
return this;
},
- showAll: function ($element)
- {
- $.ajax({
- url: this.url,
- context: this,
- dataType: 'html',
- data: { show: 'all' },
- beforeSend: function ()
- {
- this.loading = true;
- },
- success: function (data)
- {
- $element
- .hide()
- .nextAll().remove().end()
- .after(data).end();
- },
- complete: function ()
- {
- this.loading = false;
- },
- error: function ()
- {
- }
- });
+ showAncestor: function($element)
+ {
+ $.ajax({
+ url: $element.data('xhr-location'),
+ context: this,
+ dataType: 'html',
+ data: { show: 'item' },
+ beforeSend: function ()
+ {
+ this.loading = true;
+ },
+ success: function (data)
+ {
+ $element
- return this;
- },
+ // Remove all the nodes below
+ .nextAll().remove().end()
- showItem: function($element)
- {
- $.ajax({
- url: this.url,
- context: this,
- dataType: 'html',
- data: { show: 'item', id: $element.data('id') },
- beforeSend: function ()
- {
- this.loading = true;
- },
- success: function (data)
- {
- this.$showAllButton
- .show()
- .nextAll().remove().end()
- .after(data);
- },
- complete: function ()
- {
- this.loading = false;
- },
- error: function ()
- {
- }
- });
+ // Add new nodes
+ .after(data).end();
+ },
+ complete: function ()
+ {
+ this.loading = false;
+ },
+ error: function ()
+ {
+ }
+ });
- return this;
- }
+ return this;
+ },
+
+ showMore: function($element)
+ {
+ var $a = $element.find('a');
+ var loadingId = window.setInterval(function()
+ {
+ $a.append('.');
+ }, 125);
+
+ $.ajax({
+ url: $element.data('xhr-location'),
+ context: this,
+ dataType: 'html',
+ data: { show: !$element.next().length ? 'nextSiblings' :
'prevSiblings' },
+ beforeSend: function()
+ {
+ this.loading = true;
+ },
+ success: function (data)
+ {
+ $element.replaceWith(data);
+ },
+ complete: function ()
+ {
+ this.loading = false;
+
+ window.clearTimeout(loadingId);
+ },
+ error: function ()
+ {
+ }
+ });
+ }
};
$.fn.treeview = function()
--
You received this message because you are subscribed to the Google Groups
"Qubit Toolkit Commits" group.
To post to this group, send email to [email protected].
To unsubscribe from this group, send email to
[email protected].
For more options, visit this group at
http://groups.google.com/group/qubit-commits?hl=en.
