2 * Copyright 2013 IBM Corp.
4 * Licensed under the Apache License, Version 2.0 (the "License");
5 * you may not use this file except in compliance with the License.
6 * You may obtain a copy of the License at
8 * http://www.apache.org/licenses/LICENSE-2.0
10 * Unless required by applicable law or agreed to in writing, software
11 * distributed under the License is distributed on an "AS IS" BASIS,
12 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
13 * See the License for the specific language governing permissions and
14 * limitations under the License.
16 RED.sidebar = (function() {
18 //$('#sidebar').tabs();
19 var sidebar_tabs = RED.tabs.create({
21 onchange:function(tab) {
22 $("#sidebar-content").children().hide();
25 onremove: function(tab) {
26 $("#"+tab.id).remove();
29 function addTab(title,content,closeable) {
30 $("#sidebar-content").append(content);
32 sidebar_tabs.addTab({id:"tab-"+title,label:title,closeable:closeable});
33 //content.style.position = "absolute";
34 //$('#sidebar').tabs("refresh");
37 function removeTab(title) {
38 sidebar_tabs.removeTab("tab-"+title);
41 var sidebarSeparator = {};
42 $("#sidebar-separator").draggable({
44 start:function(event,ui) {
45 sidebarSeparator.closing = false;
46 sidebarSeparator.opening = false;
47 var winWidth = $(window).width();
48 sidebarSeparator.start = ui.position.left;
49 sidebarSeparator.chartWidth = $("#workspace").width();
50 sidebarSeparator.chartRight = winWidth-$("#workspace").width()-$("#workspace").offset().left-2;
53 if (!RED.menu.isSelected("btn-sidebar")) {
54 sidebarSeparator.opening = true;
55 var newChartRight = 15;
56 $("#sidebar").addClass("closing");
57 $("#workspace").css("right",newChartRight);
58 $("#chart-zoom-controls").css("right",newChartRight+20);
59 $("#sidebar").width(0);
60 RED.menu.setSelected("btn-sidebar",true);
65 sidebarSeparator.width = $("#sidebar").width();
67 drag: function(event,ui) {
68 var d = ui.position.left-sidebarSeparator.start;
69 var newSidebarWidth = sidebarSeparator.width-d;
70 if (sidebarSeparator.opening) {
71 newSidebarWidth -= 13;
74 if (newSidebarWidth > 150) {
75 if (sidebarSeparator.chartWidth+d < 200) {
76 ui.position.left = 200+sidebarSeparator.start-sidebarSeparator.chartWidth;
77 d = ui.position.left-sidebarSeparator.start;
78 newSidebarWidth = sidebarSeparator.width-d;
82 if (newSidebarWidth < 150) {
83 if (!sidebarSeparator.closing) {
84 $("#sidebar").addClass("closing");
85 sidebarSeparator.closing = true;
87 if (!sidebarSeparator.opening) {
88 newSidebarWidth = 150;
89 ui.position.left = sidebarSeparator.width-(150 - sidebarSeparator.start);
90 d = ui.position.left-sidebarSeparator.start;
92 } else if (newSidebarWidth > 150 && (sidebarSeparator.closing || sidebarSeparator.opening)) {
93 sidebarSeparator.closing = false;
94 $("#sidebar").removeClass("closing");
97 var newChartRight = sidebarSeparator.chartRight-d;
98 $("#workspace").css("right",newChartRight);
99 $("#chart-zoom-controls").css("right",newChartRight+20);
100 $("#sidebar").width(newSidebarWidth);
102 sidebar_tabs.resize();
106 stop:function(event,ui) {
108 if (sidebarSeparator.closing) {
109 $("#sidebar").removeClass("closing");
110 RED.menu.setSelected("btn-sidebar",false);
111 if ($("#sidebar").width() < 180) {
112 $("#sidebar").width(180);
113 $("#workspace").css("right",208);
114 $("#chart-zoom-controls").css("right",228);
117 $("#sidebar-separator").css("left","auto");
118 $("#sidebar-separator").css("right",($("#sidebar").width()+13)+"px");
122 function toggleSidebar(state) {
124 $("#main-container").addClass("sidebar-closed");
126 $("#main-container").removeClass("sidebar-closed");
130 function showSidebar(id) {
131 RED.menu.setSelected("btn-sidebar",true);
132 sidebar_tabs.activateTab("tab-"+id);
135 function containsTab(id) {
136 return sidebar_tabs.contains("tab-"+id);
141 RED.keyboard.add(/* SPACE */ 32,{ctrl:true},function(){RED.menu.setSelected("btn-sidebar",!RED.menu.isSelected("btn-sidebar"));d3.event.preventDefault();});
148 removeTab: removeTab,
150 containsTab: containsTab,
151 toggleSidebar: toggleSidebar