| [483] | 1 | define([ |
|---|
| 2 | "./contextMenuTab", |
|---|
| 3 | "./GanttTaskControl", |
|---|
| 4 | "./GanttProjectControl", |
|---|
| 5 | "dijit/Dialog", |
|---|
| 6 | "dijit/form/Button", |
|---|
| 7 | "dijit/form/Form", |
|---|
| 8 | "dijit/registry", |
|---|
| 9 | "dojo/_base/declare", |
|---|
| 10 | "dojo/_base/array", |
|---|
| 11 | "dojo/_base/lang", |
|---|
| 12 | "dojo/date/locale", |
|---|
| 13 | "dojo/request", |
|---|
| 14 | "dojo/on", |
|---|
| 15 | "dojo/dom", |
|---|
| 16 | "dojo/dom-class", |
|---|
| 17 | "dojo/dom-construct", |
|---|
| 18 | "dojo/dom-style", |
|---|
| 19 | "dojo/dom-attr", |
|---|
| 20 | "dojo/dom-geometry", |
|---|
| 21 | "dojo/keys", |
|---|
| 22 | "dojo/domReady!" |
|---|
| 23 | ], function(contextMenuTab, GanttTaskControl, GanttProjectControl, |
|---|
| 24 | Dialog, Button, Form, |
|---|
| 25 | registry, declare, arrayUtil, lang, locale, request, on, |
|---|
| 26 | dom, domClass, domConstruct, domStyle, domAttr, domGeometry, keys){ |
|---|
| 27 | return declare("dojox.gantt.TabMenu", [], { |
|---|
| 28 | constructor: function(chart){ |
|---|
| 29 | this.ganttChart = chart; |
|---|
| 30 | this.menuPanel = null; |
|---|
| 31 | this.paneContentArea = null; |
|---|
| 32 | this.paneActionBar = null; |
|---|
| 33 | this.tabPanelDlg = null; |
|---|
| 34 | this.tabPanelDlgId = null; |
|---|
| 35 | this.arrTabs = []; |
|---|
| 36 | this.isShow = false; |
|---|
| 37 | this.buildContent(); |
|---|
| 38 | }, |
|---|
| 39 | buildContent: function(){ |
|---|
| 40 | this.createMenuPanel(); |
|---|
| 41 | this.createTabPanel(); |
|---|
| 42 | |
|---|
| 43 | //tasks customization |
|---|
| 44 | var taskSucAdd = this.createTab(11, "Add Successor Task", "t", true, this); |
|---|
| 45 | taskSucAdd.addItem(1, "Id", "id", true); |
|---|
| 46 | taskSucAdd.addItem(2, "Name", "name"); |
|---|
| 47 | taskSucAdd.addItem(3, "Start Time", "startTime"); |
|---|
| 48 | taskSucAdd.addItem(4, "Duration (hours)", "duration"); |
|---|
| 49 | taskSucAdd.addItem(5, "Percent Complete (%)", "percentage"); |
|---|
| 50 | taskSucAdd.addItem(6, "Task Assignee", "taskOwner"); |
|---|
| 51 | taskSucAdd.addAction("addSuccessorTaskAction"); |
|---|
| 52 | |
|---|
| 53 | var taskChildAdd = this.createTab(10, "Add Child Task", "t", true, this); |
|---|
| 54 | taskChildAdd.addItem(1, "Id", "id", true); |
|---|
| 55 | taskChildAdd.addItem(2, "Name", "name"); |
|---|
| 56 | taskChildAdd.addItem(3, "Start Time", "startTime"); |
|---|
| 57 | taskChildAdd.addItem(4, "Duration (hours)", "duration"); |
|---|
| 58 | taskChildAdd.addItem(5, "Percent Complete (%)", "percentage"); |
|---|
| 59 | taskChildAdd.addItem(6, "Task Assignee", "taskOwner"); |
|---|
| 60 | taskChildAdd.addAction("addChildTaskAction"); |
|---|
| 61 | |
|---|
| 62 | var taskDuration = this.createTab(4, "Set Duration(hours)", "t", true, this, true); |
|---|
| 63 | taskDuration.addItem(1, "Duration (hours)", "duration", true); |
|---|
| 64 | taskDuration.addAction("durationUpdateAction"); |
|---|
| 65 | |
|---|
| 66 | var taskCP = this.createTab(5, "Set Complete Percentage (%)", "t", true, this, true); |
|---|
| 67 | taskCP.addItem(1, "Percent Complete (%)", "percentage", true); |
|---|
| 68 | taskCP.addAction("cpUpdateAction"); |
|---|
| 69 | |
|---|
| 70 | var taskOwner = this.createTab(20, "Set Owner", "t", true, this, true); |
|---|
| 71 | taskOwner.addItem(1, "Task Assignee", "taskOwner", true); |
|---|
| 72 | taskOwner.addAction("ownerUpdateAction"); |
|---|
| 73 | |
|---|
| 74 | var taskPrevious = this.createTab(13, "Set Previous Task", "t", true, this); |
|---|
| 75 | taskPrevious.addItem(1, "Previous Task Id", "previousTaskId", true); |
|---|
| 76 | taskPrevious.addAction("ptUpdateAction"); |
|---|
| 77 | |
|---|
| 78 | var taskRename = this.createTab(1, "Rename Task", "t", true, this, true); |
|---|
| 79 | taskRename.addItem(1, "New Name", "name", true); |
|---|
| 80 | taskRename.addAction("renameTaskAction"); |
|---|
| 81 | |
|---|
| 82 | var taskDelete = this.createTab(2, "Delete Task", "t", true, this); |
|---|
| 83 | taskDelete.addAction("deleteAction"); |
|---|
| 84 | |
|---|
| 85 | //projects customization |
|---|
| 86 | var projectAdd = this.createTab(12, "Add New Project", "p", false, this); |
|---|
| 87 | projectAdd.addItem(1, "Id", "id", true); |
|---|
| 88 | projectAdd.addItem(2, "Name", "name", true); |
|---|
| 89 | projectAdd.addItem(3, "Start Date", "startDate", true); |
|---|
| 90 | projectAdd.addAction("addProjectAction"); |
|---|
| 91 | |
|---|
| 92 | var projectCP = this.createTab(8, "Set Complete Percentage (%)", "p", true, this, true); |
|---|
| 93 | projectCP.addItem(1, "Percent Complete (%)", "percentage", true); |
|---|
| 94 | projectCP.addAction("cpProjectAction"); |
|---|
| 95 | |
|---|
| 96 | var projectRename = this.createTab(6, "Rename Project", "p", true, this, true); |
|---|
| 97 | projectRename.addItem(1, "New Name", "name", true); |
|---|
| 98 | projectRename.addAction("renameProjectAction"); |
|---|
| 99 | |
|---|
| 100 | var projectDelete = this.createTab(7, "Delete Project", "p", true, this); |
|---|
| 101 | projectDelete.addAction("deleteProjectAction"); |
|---|
| 102 | |
|---|
| 103 | //task relative |
|---|
| 104 | var projectTaskAdd = this.createTab(9, "Add New Task", "p", true, this); |
|---|
| 105 | projectTaskAdd.addItem(1, "Id", "id", true); |
|---|
| 106 | projectTaskAdd.addItem(2, "Name", "name"); |
|---|
| 107 | projectTaskAdd.addItem(3, "Start Time", "startTime"); |
|---|
| 108 | projectTaskAdd.addItem(4, "Duration (hours)", "duration"); |
|---|
| 109 | projectTaskAdd.addItem(5, "Percent Complete (%)", "percentage"); |
|---|
| 110 | projectTaskAdd.addItem(6, "Task Assignee", "taskOwner"); |
|---|
| 111 | projectTaskAdd.addItem(7, "Parent Task Id", "parentTaskId"); |
|---|
| 112 | projectTaskAdd.addItem(8, "Previous Task Id", "previousTaskId"); |
|---|
| 113 | projectTaskAdd.addAction("addTaskAction"); |
|---|
| 114 | }, |
|---|
| 115 | createMenuPanel: function(){ |
|---|
| 116 | this.menuPanel = domConstruct.create("div", { |
|---|
| 117 | innerHTML: "<table></table>", |
|---|
| 118 | className: "ganttMenuPanel" |
|---|
| 119 | }, this.ganttChart.content); |
|---|
| 120 | domClass.add(this.menuPanel.firstChild, "ganttContextMenu"); |
|---|
| 121 | this.menuPanel.firstChild.cellPadding = 0; |
|---|
| 122 | this.menuPanel.firstChild.cellSpacing = 0; |
|---|
| 123 | }, |
|---|
| 124 | createTabPanel: function(){ |
|---|
| 125 | this.tabPanelDlg = registry.byId(this.tabPanelDlgId) || |
|---|
| 126 | new Dialog({ |
|---|
| 127 | title: "Settings" |
|---|
| 128 | }); |
|---|
| 129 | this.tabPanelDlgId = this.tabPanelDlg.id; |
|---|
| 130 | this.tabPanelDlg.closeButtonNode.style.display = "none"; |
|---|
| 131 | var tabPanel = this.tabPanelDlg.containerNode; |
|---|
| 132 | this.paneContentArea = domConstruct.create("div", {className: "dijitDialogPaneContentArea"}, tabPanel); |
|---|
| 133 | this.paneActionBar = domConstruct.create("div", {className: "dijitDialogPaneActionBar"}, tabPanel); |
|---|
| 134 | this.paneContentArea.innerHTML = "<table cellpadding=0 cellspacing=0><tr><th></th></tr><tr><td></td></tr></table>"; |
|---|
| 135 | var headerCell = this.paneContentArea.firstChild.rows[0].cells[0]; |
|---|
| 136 | headerCell.colSpan = 2; |
|---|
| 137 | headerCell.innerHTML = "Description: "; |
|---|
| 138 | domClass.add(headerCell, "ganttDialogContentHeader"); |
|---|
| 139 | var contentCell = this.paneContentArea.firstChild.rows[1].cells[0]; |
|---|
| 140 | contentCell.innerHTML = "<table></table>"; |
|---|
| 141 | domClass.add(contentCell.firstChild, "ganttDialogContentCell"); |
|---|
| 142 | contentCell.align = "center"; |
|---|
| 143 | this.ok = new Button({label: "OK"}); |
|---|
| 144 | this.cancel = new Button({label: "Cancel"}); |
|---|
| 145 | this.paneActionBar.appendChild(this.ok.domNode); |
|---|
| 146 | this.paneActionBar.appendChild(this.cancel.domNode); |
|---|
| 147 | }, |
|---|
| 148 | addItemMenuPanel: function(tab){ |
|---|
| 149 | var row = this.menuPanel.firstChild.insertRow(this.menuPanel.firstChild.rows.length); |
|---|
| 150 | var cell = domConstruct.create("td", { |
|---|
| 151 | className: "ganttContextMenuItem", |
|---|
| 152 | innerHTML: tab.Description |
|---|
| 153 | }); |
|---|
| 154 | domAttr.set(cell, "tabIndex", 0); |
|---|
| 155 | this.ganttChart._events.push( |
|---|
| 156 | on(cell, "click", lang.hitch(this, function(){ |
|---|
| 157 | try{ |
|---|
| 158 | this.hide(); |
|---|
| 159 | tab.show(); |
|---|
| 160 | }catch(e){ |
|---|
| 161 | console.log("dialog open exception: " + e.message); |
|---|
| 162 | } |
|---|
| 163 | })) |
|---|
| 164 | ); |
|---|
| 165 | this.ganttChart._events.push( |
|---|
| 166 | on(cell, "keydown", lang.hitch(this, function(event){ |
|---|
| 167 | if(event.keyCode != keys.ENTER){return;} |
|---|
| 168 | try{ |
|---|
| 169 | this.hide(); |
|---|
| 170 | tab.show(); |
|---|
| 171 | }catch(e){ |
|---|
| 172 | console.log("dialog open exception: " + e.message); |
|---|
| 173 | } |
|---|
| 174 | })) |
|---|
| 175 | ); |
|---|
| 176 | this.ganttChart._events.push( |
|---|
| 177 | on(cell, "mouseover", lang.hitch(this, function(){ |
|---|
| 178 | domClass.add(cell, "ganttContextMenuItemHover"); |
|---|
| 179 | })) |
|---|
| 180 | ); |
|---|
| 181 | this.ganttChart._events.push( |
|---|
| 182 | on(cell, "mouseout", lang.hitch(this, function(){ |
|---|
| 183 | domClass.remove(cell, "ganttContextMenuItemHover"); |
|---|
| 184 | })) |
|---|
| 185 | ); |
|---|
| 186 | row.appendChild(cell); |
|---|
| 187 | }, |
|---|
| 188 | show: function(elem, object){ |
|---|
| 189 | if(object.constructor == GanttTaskControl){ |
|---|
| 190 | arrayUtil.forEach(this.arrTabs, function(tab){ |
|---|
| 191 | if(tab.type == "t"){ |
|---|
| 192 | tab.object = object; |
|---|
| 193 | this.addItemMenuPanel(tab); |
|---|
| 194 | } |
|---|
| 195 | }, this); |
|---|
| 196 | }else if(object.constructor == GanttProjectControl){ |
|---|
| 197 | arrayUtil.forEach(this.arrTabs, function(tab){ |
|---|
| 198 | if(tab.type == "p"){ |
|---|
| 199 | tab.object = object; |
|---|
| 200 | this.addItemMenuPanel(tab); |
|---|
| 201 | } |
|---|
| 202 | }, this); |
|---|
| 203 | } |
|---|
| 204 | this.isShow = true; |
|---|
| 205 | domStyle.set(this.menuPanel, { |
|---|
| 206 | zIndex: 15, |
|---|
| 207 | visibility: "visible" |
|---|
| 208 | }); |
|---|
| 209 | //make sure menu box inside gantt's bounding box |
|---|
| 210 | var menuBox = domGeometry.position(this.menuPanel, true), |
|---|
| 211 | bBox = domGeometry.position(this.ganttChart.content, true), |
|---|
| 212 | pos = domGeometry.position(elem, true); |
|---|
| 213 | if((pos.y + menuBox.h) > (bBox.y + bBox.h + 50)){ |
|---|
| 214 | this.menuPanel.style.top = pos.y - menuBox.h + pos.h + "px"; |
|---|
| 215 | }else{ |
|---|
| 216 | this.menuPanel.style.top = pos.y + "px"; |
|---|
| 217 | } |
|---|
| 218 | if(domGeometry.isBodyLtr()){ |
|---|
| 219 | this.menuPanel.style.left = pos.x + pos.w + 5 + "px"; |
|---|
| 220 | }else{ |
|---|
| 221 | this.menuPanel.style.left = pos.x - menuBox.w - 5 + "px"; |
|---|
| 222 | } |
|---|
| 223 | }, |
|---|
| 224 | hide: function(){ |
|---|
| 225 | this.isShow = false; |
|---|
| 226 | this.menuPanel.style.visibility = "hidden"; |
|---|
| 227 | }, |
|---|
| 228 | clear: function(){ |
|---|
| 229 | this.menuPanel.removeChild(this.menuPanel.firstChild); |
|---|
| 230 | this.menuPanel.innerHTML = "<table></table>"; |
|---|
| 231 | domClass.add(this.menuPanel.firstChild, "ganttContextMenu"); |
|---|
| 232 | this.menuPanel.firstChild.cellPadding = 0; |
|---|
| 233 | this.menuPanel.firstChild.cellSpacing = 0; |
|---|
| 234 | }, |
|---|
| 235 | createTab: function(id, desc, type, showOInfo, menu, withDefaultValue){ |
|---|
| 236 | var tab = new contextMenuTab(id, desc, type, showOInfo, menu, withDefaultValue); |
|---|
| 237 | this.arrTabs.push(tab); |
|---|
| 238 | return tab; |
|---|
| 239 | } |
|---|
| 240 | }); |
|---|
| 241 | }); |
|---|
