+++ /dev/null
-/*\r
- * Fuel UX Tree\r
- * https://github.com/ExactTarget/fuelux\r
- *\r
- * Copyright (c) 2012 ExactTarget\r
- * Licensed under the MIT license.\r
- */\r
-\r
-define(['require','jquery'],function(require) {\r
-\r
- var $ = require('jquery');\r
-\r
-\r
- // TREE CONSTRUCTOR AND PROTOTYPE\r
-\r
- var Tree = function (element, options) {\r
- this.$element = $(element);\r
- this.options = $.extend({}, $.fn.tree.defaults, options);\r
-\r
- this.$element.on('click', '.tree-item', $.proxy( function(ev) { this.selectItem(ev.currentTarget); } ,this));\r
- this.$element.on('click', '.tree-folder-header', $.proxy( function(ev) { this.selectFolder(ev.currentTarget); }, this));\r
-\r
- this.render();\r
- };\r
-\r
- Tree.prototype = {\r
- constructor: Tree,\r
-\r
- render: function () {\r
- this.populate(this.$element);\r
- },\r
-\r
- populate: function ($el) {\r
- var self = this;\r
- var loader = $el.parent().find('.tree-loader:eq(0)');\r
-\r
- loader.show();\r
- this.options.dataSource.data($el.data(), function (items) {\r
- loader.hide();\r
-\r
- $.each( items.data, function(index, value) {\r
- var $entity;\r
-\r
- if(value.type === "folder") {\r
- $entity = self.$element.find('.tree-folder:eq(0)').clone().show();\r
- $entity.find('.tree-folder-name').html(value.name);\r
- $entity.find('.tree-loader').html(self.options.loadingHTML);\r
- $entity.find('.tree-folder-header').data(value);\r
- } else if (value.type === "item") {\r
- $entity = self.$element.find('.tree-item:eq(0)').clone().show();\r
- $entity.find('.tree-item-name').html(value.name);\r
- $entity.data(value);\r
- }\r
-\r
- if($el.hasClass('tree-folder-header')) {\r
- $el.parent().find('.tree-folder-content:eq(0)').append($entity);\r
- } else {\r
- $el.append($entity);\r
- }\r
- });\r
-\r
- self.$element.trigger('loaded');\r
- });\r
- },\r
-\r
- selectItem: function (el) {\r
- var $el = $(el);\r
- var $all = this.$element.find('.tree-selected');\r
- var data = [];\r
-\r
- if (this.options.multiSelect) {\r
- $.each($all, function(index, value) {\r
- var $val = $(value);\r
- if($val[0] !== $el[0]) {\r
- data.push( $(value).data() );\r
- }\r
- });\r
- } else if ($all[0] !== $el[0]) {\r
- $all.removeClass('tree-selected')\r
- .find('i').removeClass('icon-ok').addClass('tree-dot');\r
- data.push($el.data());\r
- }\r
-\r
- if($el.hasClass('tree-selected')) {\r
- $el.removeClass('tree-selected');\r
- $el.find('i').removeClass('icon-ok').addClass('tree-dot');\r
- } else {\r
- $el.addClass ('tree-selected');\r
- $el.find('i').removeClass('tree-dot').addClass('icon-ok');\r
- if (this.options.multiSelect) {\r
- data.push( $el.data() );\r
- }\r
- }\r
-\r
- if(data.length) {\r
- this.$element.trigger('selected', {info: data});\r
- }\r
-\r
- },\r
-\r
- selectFolder: function (el) {\r
- var $el = $(el);\r
- var $par = $el.parent();\r
-\r
- if($el.find('.icon-folder-close').length) {\r
- if ($par.find('.tree-folder-content').children().length) {\r
- $par.find('.tree-folder-content:eq(0)').show();\r
- } else {\r
- this.populate( $el );\r
- }\r
-\r
- $par.find('.icon-folder-close:eq(0)')\r
- .removeClass('icon-folder-close')\r
- .addClass('icon-folder-open');\r
-\r
- this.$element.trigger('opened', $el.data());\r
- } else {\r
- if(this.options.cacheItems) {\r
- $par.find('.tree-folder-content:eq(0)').hide();\r
- } else {\r
- $par.find('.tree-folder-content:eq(0)').empty();\r
- }\r
-\r
- $par.find('.icon-folder-open:eq(0)')\r
- .removeClass('icon-folder-open')\r
- .addClass('icon-folder-close');\r
-\r
- this.$element.trigger('closed', $el.data());\r
- }\r
- },\r
-\r
- selectedItems: function () {\r
- var $sel = this.$element.find('.tree-selected');\r
- var data = [];\r
-\r
- $.each($sel, function (index, value) {\r
- data.push($(value).data());\r
- });\r
- return data;\r
- }\r
- };\r
-\r
-\r
- // TREE PLUGIN DEFINITION\r
-\r
- $.fn.tree = function (option, value) {\r
- var methodReturn;\r
-\r
- var $set = this.each(function () {\r
- var $this = $(this);\r
- var data = $this.data('tree');\r
- var options = typeof option === 'object' && option;\r
-\r
- if (!data) $this.data('tree', (data = new Tree(this, options)));\r
- if (typeof option === 'string') methodReturn = data[option](value);\r
- });\r
-\r
- return (methodReturn === undefined) ? $set : methodReturn;\r
- };\r
-\r
- $.fn.tree.defaults = {\r
- multiSelect: false,\r
- loadingHTML: '<div>Loading...</div>',\r
- cacheItems: true\r
- };\r
-\r
- $.fn.tree.Constructor = Tree;\r
-\r
-});\r