added admin interface

admin/assets/js/pages/treeview/bootstrap-treeview.js

@@ -0,0 +1,169 @@
+var defaultData = [
+	{
+	  text: 'Parent 1',
+	  href: '#parent1',
+	  tags: ['4'],
+	  nodes: [
+		{
+		  text: 'Child 1',
+		  href: '#child1',
+		  tags: ['2'],
+		  nodes: [
+			{
+			  text: 'Grandchild 1',
+			  href: '#grandchild1',
+			  tags: ['0']
+			},
+			{
+			  text: 'Grandchild 2',
+			  href: '#grandchild2',
+			  tags: ['0']
+			}
+		  ]
+		},
+		{
+		  text: 'Child 2',
+		  href: '#child2',
+		  tags: ['0']
+		}
+	  ]
+	},
+	{
+	  text: 'Parent 2',
+	  href: '#parent2',
+	  tags: ['0']
+	},
+	{
+	  text: 'Parent 3',
+	  href: '#parent3',
+	   tags: ['0']
+	},
+	{
+	  text: 'Parent 4',
+	  href: '#parent4',
+	  tags: ['0']
+	},
+	{
+	  text: 'Parent 5',
+	  href: '#parent5'  ,
+	  tags: ['0']
+	}
+  ];
+
+$('#treeview1').treeview({
+	data: defaultData
+});
+
+$('#treeview2').treeview({
+	levels: 1,
+	showBorder: false,
+	data: defaultData
+});
+
+$('#treeview3').treeview({
+	levels: 99,
+	showBorder: false,
+	data: defaultData
+});
+
+$('#treeview4').treeview({
+	expandIcon: 'icon-arrow-right',
+	collapseIcon: 'icon-arrow-down',
+	nodeIcon: 'icon-folder',
+	showBorder: false,
+	data: defaultData
+});
+
+$('#treeview5').treeview({
+	showTags: true,
+	showBorder: false,
+	data: defaultData
+  });
+
+$('#treeview6').treeview({
+	data: defaultData,
+	showIcon: false,
+	showCheckbox: true,
+	showBorder: false,
+});
+
+// Searchable
+var $searchableTree = $('#treeview7').treeview({
+	data: defaultData,
+	showBorder: false,
+});
+
+var search = function(e) {
+	var pattern = $('#input-search').val();
+	var options = {
+	  ignoreCase: true,
+	  exactMatch: false,
+	};
+	var results = $searchableTree.treeview('search', [ pattern, options ]);
+}
+$('#btn-search').on('click', search);
+$('#input-search').on('keyup', search);
+
+// Selectable
+var initSelectableTree = function() {
+	return $('#treeview8').treeview({
+		data: defaultData,
+		showBorder: false,
+	  multiSelect: $('#chk-select-multi').is(':checked'),
+	  onNodeSelected: function(event, node) {
+		// $('#selectable-output').prepend('<p>' + node.text + ' was selected</p>');
+		toastr.options.closeButton = true;
+		toastr.options.positionClass = 'toast-top-right';
+		toastr.options.showDuration = 1000;
+		toastr['info'](node.text + ' was selected');
+	  },
+	  onNodeUnselected: function (event, node) {
+		// $('#selectable-output').prepend('<p>' + node.text + ' was unselected</p>');
+		toastr.options.closeButton = true;
+		toastr.options.positionClass = 'toast-top-right';
+		toastr.options.showDuration = 1000;
+		toastr['error'](node.text + ' was unselected');
+	  }
+	});
+};
+var $selectableTree = initSelectableTree();
+
+// JSON
+var json = '[' +
+          '{' +
+            '"text": "Parent 1",' +
+            '"nodes": [' +
+              '{' +
+                '"text": "Child 1",' +
+                '"nodes": [' +
+                  '{' +
+                    '"text": "Grandchild 1"' +
+                  '},' +
+                  '{' +
+                    '"text": "Grandchild 2"' +
+                  '}' +
+                ']' +
+              '},' +
+              '{' +
+                '"text": "Child 2"' +
+              '}' +
+            ']' +
+          '},' +
+          '{' +
+            '"text": "Parent 2"' +
+          '},' +
+          '{' +
+            '"text": "Parent 3"' +
+          '},' +
+          '{' +
+            '"text": "Parent 4"' +
+          '},' +
+          '{' +
+            '"text": "Parent 5"' +
+          '}' +
+		']';
+		
+var $tree = $('#treeview9').treeview({
+	data: json,
+	showBorder: false
+});

admin/assets/js/pages/treeview/jstree.js

@@ -0,0 +1,89 @@
+// inline data demo
+jQuery('#treeExample1').jstree({
+	'core' : {
+		'data' : [
+			{
+				"text" : "Root node",
+				"children" : [
+					{ "text" : "Child node 1" },
+					{ "text" : "Child node 2" }
+			]}
+		]
+	}
+});
+
+// html demo
+jQuery('#treeExample2, #treeExample3, #treeExample4').jstree();
+
+// Json demo
+jQuery('#treeExample5').jstree({
+	'core' : {
+		'data' : {
+			"url" : "assets/data/treeview_jstree.json",
+			"dataType" : "json" // needed only if you do not supply JSON headers
+		}
+	}
+});
+
+// Ajax demo
+jQuery('#treeExample6').jstree({
+	'core' : {
+		'data' : {
+			"url" : "//www.jstree.com/fiddle/?lazy",
+			"data" : function (node) {
+				return { "id" : node.id };
+			}
+		}
+	}
+});
+
+// data from callback
+jQuery('#treeExample7').jstree({
+	'core' : {
+		'data' : function (node, cb) {
+			if(node.id === "#") {
+				cb([{"text" : "Root", "id" : "1", "children" : true}]);
+			}
+			else {
+				cb(["Child"]);
+			}
+		}
+	}
+});
+
+// interaction and events
+jQuery('#evts_button').on("click", function () {
+	var instance = jQuery('#treeExample8').jstree(true);
+	instance.deselect_all();
+	instance.select_node('1');
+});
+jQuery('#treeExample8')
+	.on("changed.jstree", function (e, data) {
+		if(data.selected.length) {
+			alert('The selected node is: ' + data.instance.get_node(data.selected[0]).text);
+		}
+	})
+	.jstree({
+		'core' : {
+			'multiple' : false,
+			'data' : [
+				{ "text" : "Root node", "children" : [
+						{ "text" : "Child node 1", "id" : 1 },
+						{ "text" : "Child node 2" }
+				]}
+			]
+		}
+	});
+
+// Checkbox
+$("#treeExample9").jstree({
+	"plugins" : [ "checkbox" ]
+});
+
+// Drag and drop
+$("#treeExample10").jstree({
+	"core" : {
+		"check_callback" : true
+	},
+	"plugins" : [ "dnd" ]
+});