var treeImagePath = 'jsTreeCode/' $(function() { $("#demo1").jstree({ "themes" : { "theme" : "classic", "dots" : false, "icons" : true, }, /// Peter you might want to turn this into a JSON file. /// I am running locally without a web server so I can't access a JSON file. "json_data" : { "data" : [[{ "attr" : { "JSTreeId" : "2", "JSTreeType" : "kit", "JSTreeTypeCat" : "PartSaved" }, "data" : { "title" : "Network Access Monitoring (Partially Saved)", "icon" : "../img/treeview_kit/icons/PSKitIcon.png" }, "children" : [{ "attr" : { "JSTreeId" : "3", "JSTreeType" : "document", "JSTreeTypeCat" : "Saved" }, "data" : { "title" : "At a Glance ", "icon" : "../img/treeview_kit/icons/pdfIcon.png" } }, { "attr" : { "JSTreeId" : "4", "JSTreeType" : "document", "JSTreeTypeCat" : "UnSaved" }, "data" : { "title" : "Overview", "icon" : "../img/treeview_kit/icons/pdfIcon.png" } }, { "attr" : { "JSTreeId" : "5", "JSTreeType" : "document", "JSTreeTypeCat" : "UnSaved" }, "data" : { "title" : "Selling Guide for Account Managers (unsaved)", "icon" : "../img/treeview_kit/icons/pdfIconUS.png" } }, { "attr" : { "JSTreeId" : "6", "JSTreeType" : "document" }, "data" : { "title" : "Technical Overview Presentation (unsaved)", "icon" : "../img/treeview_kit/icons/pdfIconUS.png" } }] }, { "attr" : { "JSTreeId" : "7", "JSTreeType" : "folder" }, "data" : { "title" : "Saved Search 1", "icon" : "../img/treeview_kit/icons/folderIcon.png" }, "children" : [{ "attr" : { "JSTreeId" : "8", "JSTreeType" : "kit" }, "data" : { "title" : "Network Access Monitoring", "icon" : "../img/treeview_kit/icons/kitIconOUD.png" } }] }, { "attr" : { "JSTreeId" : "9", "JSTreeType" : "folder" }, "data" : { "title" : "Saved Search 2", "icon" : "../img/treeview_kit/icons/folderIcon.png" }, "children" : [{ "attr" : { "JSTreeId" : "10", "JSTreeType" : "folder" }, "data" : { "title" : "Sub Folder 1", "icon" : "../img/treeview_kit/icons/folderIcon.png" }, "children" : [{ "attr" : { "JSTreeId" : "11", "JSTreeType" : "kit" }, "data" : { "title" : "Network Access Monitoring", "icon" : "../img/treeview_kit/icons/kitIconOUD.png" }, "children" : [{ "attr" : { "JSTreeId" : "12", "JSTreeType" : "document" }, "data" : { "title" : "At a Glance", "icon" : "../img/treeview_kit/icons/webIcon.png" } }] }] }] }]] }, "plugins" : ["themes", "checkbox", "json_data", "ui"] }).bind("after_open.jstree", function(event, data) { JSTreeAnchorColorChange('#demo1'); JSTreeExportData(); }).bind("after_close.jstree", function(event, data) { JSTreeAnchorColorChange('#demo1'); }).bind("select_node.jstree", function(event, data) { ////console.log(event,data); //alert('JSTreeId :' + (data.rslt.obj.attr('JSTreeId'))); //alert('JSTreeType :' + (data.rslt.obj.attr('JSTreeType'))); JSTreeExportData(); SaveDocTree_OutputJSObject = new Object; SaveDocTree_OutputJSObject.NodeId = (data.rslt.obj.attr('JSTreeId')); SaveDocTree_OutputJSObject.NodeType = (data.rslt.obj.attr('JSTreeType')) /// get selected node var selected = $('#demo1').jstree('get_selected'); // get children of selected node var tree = jQuery.jstree._reference('#demo1'); var children = tree._get_children(selected); tempItem = new Array; /// go throught ch children.each(function() { tempVar1 = $(this).attr('JSTreeId'); tempVar2 = $(this).attr('JSTreeType'); tempVar3 = $(this).attr('JSTreeTypeCat'); tempItem.push({ 'JSTreeId' : tempVar1, 'JSTreeType' : tempVar2, 'JSTreeTypeCat' : tempVar3 }) }); /////////////////////////////////////////////////////////////////////////////////// /////////////////////////////////////////////////////////////////////////////////// /////////////////////////////////////////////////////////////////////////////////// ////////////////////////////// Child Items of Kit //////////////////////////////// //////////////////////////// //console.log(tempItem); ///////////////////////// /////////////////////////////////////////////////////////////////////////////////// /////////////////////////////////////////////////////////////////////////////////// /// use this to see the type of node clicked. //console.log(SaveDocTree_OutputJSObject.NodeType); ///// this code dictates what happens when you click differnet types of nodes $("#slide_list").show(); if(SaveDocTree_OutputJSObject.NodeType == 'kit') { search_move_forward(); $(".search_results_type_kitview").show(); }; if(SaveDocTree_OutputJSObject.NodeType == 'document') { $("#slide_list").hide(); search_move_forward(); }; ////////////////////////////////////////////////////////////////////////////// ////////////////////////////////////////////////////////////////////////////// //////////////////////// Export the Node Data ///////////////////////////// ////////////////////////////////////////////////////////////////////////////// // //console.log (SaveDocTree_OutputJSObject); // //console.log (data) ////////////////////////////////////////////////////////////////////////////// ////////////////////////////////////////////////////////////////////////////// }).bind("loaded.jstree", function(event, data) { JSTreeAnchorColorChange('#demo1'); JSTreeAtLoad(); }); //http://www.jstree.com/static/v.1.0pre/_docs/_json_data.json adjustHeighttoContentDiv(); }); ///// what happens when you click an individual result $('#search_leftControl, .search_individual_result_btn_more, .search_individual_result_textarea, .search_individual_result_header, .search_individual_result_icon').bind('click', function() { //console.log($(this).parent().parent().css('')); //alert($(this).parent().attr('class')); if(globobj_bigslides.currentPosition != ((globobj_bigslides.numberOfSlides * -1) + 1)) { globobj_bigslides.currentPosition-- // Move slideInner using margin-left } /// globobj_bigslides.currentPosition++ globobj_listitem = new Object; globobj_listitem.jstreeid = $(this).parent().attr('jstreeid'); globobj_listitem.jstreetype = $(this).parent().attr('jstreetype'); globobj_listitem.jstreetypecat = $(this).parent().attr('jstreetypecat'); if($(this).parent().attr('class') == 'search_individual_result_more'){ globobj_listitem.jstreeid = $(this).parent().parent().attr('jstreeid'); globobj_listitem.jstreetype = $(this).parent().parent().attr('jstreetype'); globobj_listitem.jstreetypecat = $(this).parent().parent().attr('jstreetypecat'); } //////////////////////////////////////////////////////////////////////////////////////// //////////////////////////// get information when item clicked ////////////////////////// //////////////////////////////////////////////////////////////////////////////////////// console.log(globobj_listitem); //////////////////////////////////////////////////////////////////////////////////////// //////////////////////////////////////////////////////////////////////////////////////// //////////////////////////////////////////////////////////////////////////////////////// //////////////////////////////////////////////////////////////////////////////////////// search_results_moveBigSlides() }); var JSTreeExportData = function() { ///////////////////////////////////////////////////////////////// ///////////////////////////////////////////////////////////////// ///////////////////////////////////////////////////////////////// /////// Exported Entire Tree Strucuture is in JSONData ///////// ///////////////////////////////////////////////////////////////// ///////////////////////////////////////////////////////////////// var JSONTreedata = $("#demo1").jstree('get_json', -1); // //console.log(JSONTreedata); ///////////////// } var JSTreeGetCheckboxValues = function(JSTreenodeName) { var checked_ids = []; $('#demo1').jstree("get_checked", null, true).each(function(i, element) { singleEntry = {}; singleEntry.attrType = $(element).attr("JSTreeType"); singleEntry.attrId = $(element).attr("JSTreeId"); checked_ids.push(singleEntry); alert('created object: check console'); }); ////console.log(checked_ids); }; var JSTreeAnchorColorChange = function(JSTreenodeName) { var allListElements = $(JSTreenodeName); $('.jstree-icon').each(function(intIndex) { var tempvar = $(this).css('background-image'); if(tempvar.indexOf('US.png') != -1) { $(this).parent().css('color', '#717171'); }; if(tempvar.indexOf('OUD.png') != -1) { $(this).parent().css('color', '#bebfbf'); }; }); }; var JSTreeAtLoad = function(JSTreenodeName) { if(!$.browser.webkit) { //alert('hit'); $('ins.jstree-checkbox').css('line-height', '19px'); $('ins.jstree-checkbox').css('vertical-align', 'baseline'); } if(navigator.userAgent.match(/iPad/i) != null) { // $('ins.jstree-checkbox').css('background-color', 'green'); $('ins.jstree-checkbox').css('margin-right', '10px'); $('ins.jstree-checkbox').css('margin-left', '30px'); $('ins.jstree-checkbox').css('width', '18px'); $('ins.jstree-checkbox').css('height', '19px'); $('.jstree-classic li').css('line-height', '40px'); } }; /////////////////////////////////////////////////////////////////////////////////// /////////////////////////////////////////////////////////////////////////////////// /////////////////////////////////////////////////////////////////////////////////// ///////////////////////////////// The Big Slider ///////////////////////////// /////////////////////////////////////////////////////////////////////////////////// /////////////////////////////////////////////////////////////////////////////////// /////////////////////////////////////////////////////////////////////////////////// /// When the screen is resized an event is fired / $(window).bind('resize', function() { adjustHeighttoContentDiv(); }); $(window).bind('orientationchange', function(event) { window.location.reload() // search_individual_result_banner_title }); globobj_bigslides = new Object; globobj_bigslides.currentPosition = 0; globobj_bigslides.slideWidth = $('.search_results_slide_visiblearea').width(); globobj_bigslides.slides = $('.search_results_individual_slide'); globobj_bigslides.numberOfSlides = globobj_bigslides.slides.length; $('.search_results_slide_container').css('overflow', 'hidden'); //////console.log(globobj_bigslides.numberOfSlides); globobj_bigslides.slides.wrapAll('
').css({ 'float' : 'left', 'width' : globobj_bigslides.slideWidth, }); //////console.log($('#slideInnerTempBig')); $('#slideInnerTempBig').css('width', globobj_bigslides.slideWidth * globobj_bigslides.numberOfSlides); //// //// move the Big Slides in Search Results //////////// function search_results_moveBigSlides() { //////console.log('change the slides'); //////console.log(globobj_bigslides.slideWidth + " : " + globobj_bigslides.currentPosition); $('#slideInnerTempBig').animate({ 'marginLeft' : globobj_bigslides.slideWidth * (globobj_bigslides.currentPosition) }, function() { adjustHeighttoContentDiv() }); }; function search_move_forward() { if(globobj_bigslides.currentPosition != ((globobj_bigslides.numberOfSlides * -1) + 1)) { globobj_bigslides.currentPosition-- // Move slideInner using margin-left } search_results_moveBigSlides(); } function search_move_back() { if(globobj_bigslides.currentPosition != 0) { globobj_bigslides.currentPosition++ //////console.log('++'); } else { window.location = "dashboard.htm" } search_results_moveBigSlides(); adjustHeighttoContentDiv(); ; } function adjustHeighttoContentDiv() { $('.search_results_individual_slide').each(function(intIndex) { $('.search_results_scroller').css('height', (window.innerHeight - 240) + 'px'); if($(this).attr("id") == "slide_tree") { $(this).find('.search_results_slide_visiblearea').css('height', (window.innerHeight - 165) + 'px'); $(this).find('.main_contentwrapper').css('height', (window.innerHeight - 175) + 'px'); }; if($(this).attr("id") == "slide_list") { $(this).find('.main_contentwrapper').css('height', (window.innerHeight - 190) + 'px'); $(this).find('.search_results_slide_visiblearea').css('height', (window.innerHeight - 200) + 'px'); $(this).find('.document_container').css('height', (window.innerHeight - 185) + 'px'); }; if($(this).attr("id") == "slide_document") { $(this).find('.document_container').css('height', (window.innerHeight - 185) + 'px'); $(this).find('.main_contentwrapper').css('height', (window.innerHeight - 175) + 'px'); $(this).find('.search_results_slide_visiblearea').css('height', (window.innerHeight - 165) + 'px'); }; }); } ////// search results on the list page //////// function search_results_checkboxes(){ console.log('inside fun'); globobj_checkboxResult = new Array; $("input:[name=search_results_checkboxes()]:checked").each(function() { globobj_tempObj = new Object; globobj_tempObj.JSTreeId = $(this).parent().parent().attr('jstreeid'); globobj_tempObj.JSTreeType = $(this).parent().parent().attr('jstreetype'); globobj_tempObj.JSTreeTypeCat = $(this).parent().parent().attr('jstreetypecat'); globobj_checkboxResult.push(globobj_tempObj); }); console.log(globobj_checkboxResult); } $('#navBtn_info').bind('click', function() { search_results_checkboxes() });