graphic sb
DESCRIPTION
Graphic sbTRANSCRIPT
Graphic Voice Page Control Tool
Michael
In order to get better user experience, we suggest the graphic tool for solve those requirements. It has easily operation in UI design, more powerfulexpansibility. We can get a directly view of a voice page and easily for download selected voice pages’ construct Excel, XML, ER Diagram
Why graphic tool?
Requirements
1. Ability to download a searchable/read-only version of Voice Site (Ex: Excel, XML, ER Diagram Hendy Putra etc)2. Show parent pages for a page3. Error Pop-Up if trying to delete a page that other pages point to
Implementation
Using SVG for create image Using AJAX for data communication by SB API.
Database Changes
targetPageId destinationPageId domId node1 node2
0ac53296-02-133afe940d6-9af5e7c2-b95
0ac53296-02-133afe940d6-9af5e7c2-b95
pageTypeSelection
M595.4096767535219,668.71
M695.4096767535219,668.71
Add an new table for store the relation ship informationand the node of line’s position.
For compatible old voice page, API will be execute in fist time system initialization, data will be inserted into the table, data is parsed from the voice xml.And the table will be updated, when relation changed
Mockup Work Flow for better understanding what it is
Click for choice voice page
Click for show diagram
It will spend a bit time for initialize system and loading js or image files in frist time
Drag-ableDrag-able
Double click for editDrag-able
Home page and selected page
End page
Normal page Selected page
All of relation with selected voice pages will display here with links
Delete
Maybe we can do following expandable features in future
Tool panel, we can drag a page item for create
buttons for print page and save as image or xml file
Minimize tool panelhide tool panel
Node for change the line’s position
Home page
End the call
Page comment will popup when mouse over
Check out phone number and assign an new onefloat
float
float
Click for select a voice page item
Click the button for edit goto relation
Highlight for exist relationClick button for add relation with destination object
Drag the arrows for create relation with the destination voice page
Click button for add relation ship with destination object
Destination page will be selected in drop down box when clicked
Double click the voice page item
Click for change typeChange page nameChange page number
Change home pageCopy voice pageDelete voice pageShow detail of voice page