// Contains functions for the buttons
var steps = [];
window.rows = 0, window.initialRows = 14, window.cols = window.initialCols = 8; //Define initial rows and cols
var presets = [["None"],["Demo",["UE A","com.ecomp.ue3"],["vA-SBG","com.ecomp.dc1.a_sbg"],["vNS","com.ecomp.dc1.ns"],["vAS","com.ecomp.dc1.as"],["TF/BGCF","com.ecomp.usp.tf_bgcf"],["ENUM","com.ecomp.usp.enum"],["n-SBG","com.ecomp.dc1.n_sbg"],["SIP PSX","com.ecomp.vni.sip_psx"],["BVoIP AS","com.ecomp.vni.bvoip_as"],["IPBE","com.ecomp.vni.ipbe"],["IPFR UE B","com.ecomp.ue5"]],["Layer3Access",["Order Trigger System"],["MSO"],["SDN-C"],["A&AI"],["PO"]]];
var presetNames = [];
for(var i = 0; i This program was designed to aid in the process of creating, editing, and sharing sequence diagrams by utilizing drag-n-drop javascript ' +
'frameworks. https://github.com/kevingilboy/Advanced-Service-Editor Nodes are designated by blue, rounded rectangles and ' +
'can be dragged to the dropzone above the horizontal grid lines. Nodes automatically generate "lifelines" that run to the ' +
'of the page. When arrows are resized, they snap to these lifelines. A node\'s dependent arrows (those that touch its ' +
'lifelines) remain stuck to it while the node is dragged and rearranged. Dragging a node on top of another node results ' +
'in the overlapped node and all nodes to its right to be shifted over one unit to the right. Arrows can be ' +
'dragged to the main dropzone that contains many horizontal lines. Arrows can be resized and snap to nearby lifelines at ' +
'the end of resizing. Notes are designated by yellow rectangles and can be ' +
'dragged to the main dropzone that contains many horizontal lines. There are many options to save your work and load it to either a ' +
'new workspace or current one. To save everything in the current workspace, click the save ' +
'button in the lower left hand corner. A menu will pop up with multiple save destinations:
'
}
bootbox.dialog({
backdrop:true,
animate:false,
onEscape: function() {},
title: 'Create New Project',
size: 'large',
message: 'Project from preset :
'+availablePresetHTML+'
'
});
function confirm () {
bootbox.confirm({
size:'small',
message:"***This will erase everything***",
callback: function(result){
if (result == true){
bootbox.hideAll();
newProject(null,null,14);
}
}
});
}
}
function newProjectFromPreset(type){
newProject(null,null,14);
if (type!=null) window.selectedPreset = type;
for (var i=0; i
';
// document.getElementById("numbers").innerHTML +='
';
//var lineHTML='
';
if (navigator.userAgent.toLowerCase().indexOf('firefox') > -1) {
templineheight = 17
} else {
templineheight = Math.ceil((gridPitchy)/2)
}
var lineHTML='
';
$("#lines").append(lineHTML);
if (linesToMakeDouble!=null && linesToMakeDouble.indexOf(rows.toString())!=-1){
toggleDoubleLine(document.getElementById("row"+rows),linesToMakeDouble,doubleLineText,doubleLineType);
step++;
console.log(step);
}
}
function toggleDoubleLine (target,lines,text,type) {
while (target.id.substring(0,3)!="row"){
target = target.parentNode;
}
//console.log(target.style);
if ($(target).hasClass('dottedLine')){
$(target).removeClass('dottedLine');
$(target).addClass('doubleLine');
if (text==null){
bootbox.confirm({
closeButton:false,backdrop:true,animate:false,
size:'small',
title: "Add Separator Text",
onEscape: function() {},
message: ''+
'
Message type : Editing: Getting Started
'+
'Nodes
Arrows
Notes
File Management
Saving
' +
'Saving workspace
'+
'
It is also possible to export a single node and its dependent ' + 'arrows. To do so, right click on any node and click export. Enter a file name and click "Export". Exporting is useful ' + 'for saving frequently used nodes as they can be imported and appended to any project with ease.
' + 'To load a previous workspace, click the load ' + 'button in the lower left hand corner. A menu will pop up with multiple loading destinations:
There are two ways to load a file into the current workspace:
'+ 'To load an entire, previously saved workspace and replace the current one, ' + 'click the load button in the lower left hand corner. You will be prompted to choose a file and then click "Replace".
To load an entire, previously saved workspace on top of a current one, ' + 'click the load button in the lower left hand corner. You will be prompted to choose a file and then click "Append". ' + 'An append location marker will show up and you can click anywhere on the designated dropzone to change the location where the ' + 'file will be appended. After choosing a spot, click "Okay". If you choose a location that intersects with another node, ' + 'that node and the nodes to its right will be shifted one unit to the right.
To import a node that has previously been exported, right click ' + 'on the node dropzone and click "import". You will be prompted to choose a file and then click "Import". ' + 'An append location marker will show up and you can click anywhere on the designated dropzone to change the location where the ' + 'file will be appended. After choosing a spot, click "Okay". If you choose a location that intersects with another node, ' + 'that node and the nodes to its right will be shifted one unit to the right.
' + 'To rename your workspace, double click on the title bar ' + 'and type a new title. This does not change the names of previously saved versions of the workspace.
' + 'There are many features in this program to allow for its ease of use.
'+ 'When an arrow on the screen lacks a left or right ' + 'endpoint, the arrow is colored (red = 0 connections, yellow = 1 connection) and *Link missing lifeline ' + 'appears in the sidebar. Clicking this text flashes the invalid arrows. When a successful connection has been made, ' + 'the arrow fades to green and then to transparent.
' + 'When prompted to enter the inner text of a module, ' + 'the editor searches through its preloaded dictionary to offer suggestions for text. Entering a term that is not in the ' + 'dictionary appends it to the dictionary for the entirity of the session.
' + 'Clicking the autofit button fits the screen size to the exact dimensions of the ' + 'diagram. Highly recommended before making a printable output as it will scale the diagram and allow for max print size.
' + 'Right clicking on nodes and arrows deploys a custom context menu allowing ' + 'you to perform many operations on modules such as cut, copy, paste, delete, rename, import and export.
' + 'Holding the control key allows the user to select multiple' + 'nodes in any order. Holding the shift key allows the user to select multiple nodes in a row. Selecting multiple nodes allows ' + 'you to perform an operation (such as drag, cut, copy, paste, delete, and export).
' + 'Clicking "print" allows you to export the current workspace to a ' + 'printable (saveable and email-able) pdf document. These docments are meant for presentation and cannot be ' + 'reimported into the workspace.
' + 'Nodes can be nested inside of other nodes. This can be done by either 1) ' + 'right-clicking on a single node and selecting "make child inside" 2) selecting a group of nodes, right-clicking, and selecting ' + '"make group from selected". Blank slots can be added inside groups for nodes to be dragged into by right clicking and selecting '+ '"make slot inside". Upon making a group, connected arrows are broken and shaded yellow forcing the user to reconnect the arrows '+ 'to the nodes inner components. Nested nodes can be expanded and collapsed by double clicking on them. Arrow connections are preserved through '+ 'this process
' + 'Clicking on the trash can brings up a menu that allows you ' + 'to restore previously deleted modules and append them to the current workspace. Follow instructions on load:append for how to append.
'+ 'Double-clicking on a horizontal grid line allows the user to make a double-lined ' + 'separator on the diagram.
' }) }