From 324ee36fe31763e507b422ab0a88e4230045e205 Mon Sep 17 00:00:00 2001 From: "Timoney, Daniel (dt5972)" Date: Wed, 15 Feb 2017 10:37:53 -0500 Subject: Initial commit for OpenECOMP SDN-C OA&M Change-Id: I7ab579fd0d206bf356f36d52dcdf4f71f1fa2680 Signed-off-by: Timoney, Daniel (dt5972) Former-commit-id: 2a9f0edd09581f907e62ec4689b5ac94dd5382ba --- dgbuilder/public/red/ui/sidebar.js | 154 +++++++++++++++++++++++++++++++++++++ 1 file changed, 154 insertions(+) create mode 100644 dgbuilder/public/red/ui/sidebar.js (limited to 'dgbuilder/public/red/ui/sidebar.js') diff --git a/dgbuilder/public/red/ui/sidebar.js b/dgbuilder/public/red/ui/sidebar.js new file mode 100644 index 00000000..f55e516c --- /dev/null +++ b/dgbuilder/public/red/ui/sidebar.js @@ -0,0 +1,154 @@ +/** + * Copyright 2013 IBM Corp. + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + **/ +RED.sidebar = (function() { + + //$('#sidebar').tabs(); + var sidebar_tabs = RED.tabs.create({ + id:"sidebar-tabs", + onchange:function(tab) { + $("#sidebar-content").children().hide(); + $("#"+tab.id).show(); + }, + onremove: function(tab) { + $("#"+tab.id).remove(); + } + }); + function addTab(title,content,closeable) { + $("#sidebar-content").append(content); + $(content).hide(); + sidebar_tabs.addTab({id:"tab-"+title,label:title,closeable:closeable}); + //content.style.position = "absolute"; + //$('#sidebar').tabs("refresh"); + } + + function removeTab(title) { + sidebar_tabs.removeTab("tab-"+title); + } + + var sidebarSeparator = {}; + $("#sidebar-separator").draggable({ + axis: "x", + start:function(event,ui) { + sidebarSeparator.closing = false; + sidebarSeparator.opening = false; + var winWidth = $(window).width(); + sidebarSeparator.start = ui.position.left; + sidebarSeparator.chartWidth = $("#workspace").width(); + sidebarSeparator.chartRight = winWidth-$("#workspace").width()-$("#workspace").offset().left-2; + + + if (!RED.menu.isSelected("btn-sidebar")) { + sidebarSeparator.opening = true; + var newChartRight = 15; + $("#sidebar").addClass("closing"); + $("#workspace").css("right",newChartRight); + $("#chart-zoom-controls").css("right",newChartRight+20); + $("#sidebar").width(0); + RED.menu.setSelected("btn-sidebar",true); + RED.view.resize(); + } + + + sidebarSeparator.width = $("#sidebar").width(); + }, + drag: function(event,ui) { + var d = ui.position.left-sidebarSeparator.start; + var newSidebarWidth = sidebarSeparator.width-d; + if (sidebarSeparator.opening) { + newSidebarWidth -= 13; + } + + if (newSidebarWidth > 150) { + if (sidebarSeparator.chartWidth+d < 200) { + ui.position.left = 200+sidebarSeparator.start-sidebarSeparator.chartWidth; + d = ui.position.left-sidebarSeparator.start; + newSidebarWidth = sidebarSeparator.width-d; + } + } + + if (newSidebarWidth < 150) { + if (!sidebarSeparator.closing) { + $("#sidebar").addClass("closing"); + sidebarSeparator.closing = true; + } + if (!sidebarSeparator.opening) { + newSidebarWidth = 150; + ui.position.left = sidebarSeparator.width-(150 - sidebarSeparator.start); + d = ui.position.left-sidebarSeparator.start; + } + } else if (newSidebarWidth > 150 && (sidebarSeparator.closing || sidebarSeparator.opening)) { + sidebarSeparator.closing = false; + $("#sidebar").removeClass("closing"); + } + + var newChartRight = sidebarSeparator.chartRight-d; + $("#workspace").css("right",newChartRight); + $("#chart-zoom-controls").css("right",newChartRight+20); + $("#sidebar").width(newSidebarWidth); + + sidebar_tabs.resize(); + RED.view.resize(); + + }, + stop:function(event,ui) { + RED.view.resize(); + if (sidebarSeparator.closing) { + $("#sidebar").removeClass("closing"); + RED.menu.setSelected("btn-sidebar",false); + if ($("#sidebar").width() < 180) { + $("#sidebar").width(180); + $("#workspace").css("right",208); + $("#chart-zoom-controls").css("right",228); + } + } + $("#sidebar-separator").css("left","auto"); + $("#sidebar-separator").css("right",($("#sidebar").width()+13)+"px"); + } + }); + + function toggleSidebar(state) { + if (!state) { + $("#main-container").addClass("sidebar-closed"); + } else { + $("#main-container").removeClass("sidebar-closed"); + } + } + + function showSidebar(id) { + RED.menu.setSelected("btn-sidebar",true); + sidebar_tabs.activateTab("tab-"+id); + } + + function containsTab(id) { + return sidebar_tabs.contains("tab-"+id); + } + + + $(function() { + RED.keyboard.add(/* SPACE */ 32,{ctrl:true},function(){RED.menu.setSelected("btn-sidebar",!RED.menu.isSelected("btn-sidebar"));d3.event.preventDefault();}); + showSidebar("info"); + }); + + + return { + addTab: addTab, + removeTab: removeTab, + show: showSidebar, + containsTab: containsTab, + toggleSidebar: toggleSidebar + } + +})(); -- cgit 1.2.3-korg