Location via proxy:   [ UP ]  
[Report a bug]   [Manage cookies]                
Scribd
Upload
426 views

Java Script

This document contains the HTML and JavaScript code for a ServiceNow interface used for creating and editing workflows. Key details: - The interface contains toolbar buttons for creating new workflows, opening existing ones, and starting/validating the current workflow. - There is a diagram area for visually representing the workflow and dragging/dropping activities. - A sidebar lists available activities that can be added to the workflow. - JavaScript code initializes a WorkflowDiagram object to power the interactive diagram functionality.

Uploaded by

Giriprasad Gunalan
Copyright
© © All Rights Reserved
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
426 views

Java Script

This document contains the HTML and JavaScript code for a ServiceNow interface used for creating and editing workflows. Key details: - The interface contains toolbar buttons for creating new workflows, opening existing ones, and starting/validating the current workflow. - There is a diagram area for visually representing the workflow and dragging/dropping activities. - A sidebar lists available activities that can be added to the workflow. - JavaScript code initializes a WorkflowDiagram object to power the interactive diagram functionality.

Uploaded by

Giriprasad Gunalan
Copyright
© © All Rights Reserved
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
You are on page 1/ 7

<html class=" ltr" lang="en" dir="ltr"><head><title>ServiceNow</title><meta cont

ent="chrome=1" http-equiv="X-UA-Compatible"></meta><meta content="public" http-e


quiv="cache-control"></meta><link href="favicon.ico?v=4" rel="shortcut icon"></l
ink><link type="text/css" href="/styles/css_includes.cssx?v=08-27-2014_1022&amp;
c=2014-03-11_05:21:35_ec5c6c216f0d710086b0a9302e3ee4e7&amp;theme=" rel="styleshe
et"></link><script type="text/javascript">var g_loadTime = new Date();
var lastActivity = new Date();
var g_lang = 'en';
var g_popup_timeout = parseInt(100);
var g_export_warn_threshold = parseInt(10000);
var g_event_handler_ids = {};
var g_event_handlers = new Array();
var g_event_handlers_onLoad = new Array();
var g_event_handlers_onSubmit = new Array();
var g_event_handlers_onChange = new Array();
var g_event_handlers_onCellEdit = {};
var g_user_date_time_format = "yyyy-MM-dd HH:mm:ss";
var g_user_date_format = "yyyy-MM-dd";
var g_user_decimal_separator = ".";
var g_user_grouping_separator = ",";
var g_glide_list_separator = ", ";
var g_tz_offset = -21600000;
var g_first_day_of_week = parseInt(1, 10);
var g_date_picker_first_day_of_week = parseInt(0, 10);
var g_submitted = false;
var g_max_table_length = 30;
var g_fontSizePreference = "9pt";
var g_fontSize = "10pt";
var g_jsErrorNotify = "true";
var g_cancelPreviousTransaction = true;
var g_text_direction = "ltr";
var g_glide_list_filter_max_length = parseInt("0", 10);
var g_accessibility = false;
var g_ck = 'b43092656f4d710086b0a9302e3ee44948ea51cef2758e957212b291a02bcb67
cadb5554';var g_acWaitTime = parseInt(250);var g_autoRequest = '';</script><scri
pt type="text/javascript" src="/scripts/js_includes.jsx?v=08-27-2014_1022&amp;lp
=Thu_Oct_16_03_38_45_PDT_2014&amp;c=3_36"></script><script type="text/javascript
">(function() {
var preferences = {};
var properties = {};preferences["glide.ui.navpage.state"] = '{\"formPane\"
:\"east\",\"edge_center.north.isClosed\":false,\"edge_center.west.isClosed\":fal
se,\"edge_center.west.size\":242,\"main.south.isClosed\":true,\"main.south.size\
":\"57%\",\"main.east.isClosed\":true,\"main.east.size\":\"50%\"}';GlideManager.
init({
preferences: preferences,
properties: properties
});
})();
/**
* Every window needs to observe these events.
*/
if (Prototype.Browser.IE && !isMSIE9) {
document.onfocusout = function() { CustomEvent.fireTop(GlideEvent.WINDOW_B
LURRED, window); };
document.onfocusin = function() { CustomEvent.fireTop(GlideEvent.WINDOW_FO
CUSED, window); };
} else {

Event.observe(window, 'blur', function() { CustomEvent.fireTop(GlideEvent.


WINDOW_BLURRED, window); });
Event.observe(window, 'focus', function() { CustomEvent.fireTop(GlideEven
t.WINDOW_FOCUSED, window); });
}</script><script type="text/javascript">g_swLoadTime = new StopWatch(g_load
Time);
if (window.CustomEvent)
CustomEvent.fireAll("ck_updated", "b43092656f4d710086b0a9302e3ee44948ea5
1cef2758e957212b291a02bcb67cadb5554");
Event.observe(window, 'load', function() {
if (typeof g_ck != 'undefined') {
CustomEvent.observe("ck_updated", function(ck) { g_ck = ck; });
CustomEvent.fireAll("ck_updated", "b43092656f4d710086b0a9302e3ee44948ea5
1cef2758e957212b291a02bcb67cadb5554");CustomEvent.fireTop('user.impersonation',
'');}try {
var helpico=getTopWindow().document.getElementById("help_ico");
if (helpico) {
var urlname=window.location.pathname.split("?");
var search_str = window.location.search;
// if this is a form, extract the record's sys_id...
var sys_id_loc = search_str.search(/sys_id=[0-9a-f]{32}/i);
var sys_id_str = (sys_id_loc != -1) ? search_str.substr(sys_id_l
oc, 39) : null;
// make the URL to our context help processor...
var url_search = "?sysparm_url=" + urlname[0];
if (sys_id_loc != -1)
url_search += "&" + sys_id_str;
helpico.href="context_help.do" + url_search;
}
} catch (exception) {}synchCache();
pageLoaded();
});
function synchCache() {
try {
var w = getTopWindow();
if (w.g_cache_message)
w.g_cache_message.stamp("bf1b49996f89710086b0a9302e3ee4ba");
if (w.g_cache_td)
w.g_cache_td.stamp("30214a616f4d710086b0a9302e3ee491");
} catch(e) {}
}</script><script type="text/javascript">// NOTE: this code runs before func
tions.js (or any js file) is loaded
window.g_fontSizeMessage = "Font size";
if (g_fontSizePreference)
setPreferredFontSize(0); // adjust to user preference</script><
noscript>This site requires JavaScript to be enabled</noscript></head><body oncl
ick="CustomEvent.fireAll('body_clicked', event);" ontouchend="CustomEvent.fireAl
l('body_clicked', event);" onFocus="popupClose();"><div class="body-vertical-spa
cer"></div><div class="outputmsg_div"><div id="output_messages" style="display:n
one" class="outputmsg_container"><img onclick="GlideUI.get().clearOutputMessages
(this)" class="outputmsg_close" src="images/x.gifx"></img><div class="outputmsg_
div"></div></div><script>addRenderEvent(function() {CustomEvent.fire('glide_opti
cs_inspect_update_watchfield', '');});</script></div><link type="text/css" href=
"/styles/diagrammer.cssx?v=08-27-2014_1022" rel="stylesheet"></link><link type="

text/css" href="/styles/workflow_diagram.cssx?v=08-27-2014_1022" rel="stylesheet


"></link><script type="text/javascript" src="/scripts/GwtGraphicsIncludes.jsx?v=
08-27-2014_1022"></script><script type="text/javascript" src="/scripts/GwtDiagra
mIncludes.jsx?v=08-27-2014_1022"></script><script type="text/javascript" src="/s
cripts/WorkflowIncludes.jsx?v=08-27-2014_1022"></script><style type="text/css">B
ODY {
overflow: auto;
margin: 0px 0px 0px 0px;
}</style><script type="text/javascript" src="/scripts/navpage.jsx?v=0
8-27-2014_1022"></script><input type="hidden" id="sys_display.activity_type_"></
input><input type="hidden" id="activity_type_" onchange="wfDiagram.activityTypeS
elected(this.value)"></input><input type="hidden" id="sys_display.link_to_"></in
put><input type="hidden" id="link_to_" onchange="wfDiagram.linkToSelected(this.v
alue)"></input><table cellpadding="0" class="toolbar" style="table-layout:fixed;
" border="0" cellspacing="0"><tr height="0px"><td id="td1" style="width: 100%;">
</td><td id="td2" style="width: 200px;"></td></tr><tr><td colspan="2"><table id=
"tool_banner" cellpadding="0" height="30" border="0" cellspacing="0" width="100%
"><tr><td width="30%" height="30" align="left"><img src="images/toolbar_separato
r.gifx"></img><a onclick="wfDiagram.newWorkflow()">New</a><img src="images/toolb
ar_separator.gifx"></img><a onclick="wfDiagram.loadWorkflow()">Open</a><img src=
"images/toolbar_separator.gifx"></img><a id="workflow_canvas_gearmenu" onclick="
wfDiagram.showStatusActions(event);" title="Workflow Actions"><img src="images/t
oolbar_action.gifx"></img></a><img src="images/toolbar_separator.gifx"></img></t
d><td id="version_status_" height="30" style="visibility:visible;" width="10%" a
lign="left"><input type="hidden" id="sys_display.workflow_id_" onchange="wfDiagr
am.setDisplayName(this.value)"></input><input type="hidden" id="workflow_id_" on
change="wfDiagram.workflowChanged(this.value)"></input></td><td width="20%" heig
ht="30"><span id="workflow_properties_span_" style="white-space:nowrap; visibili
ty:hidden; display:none"><span><img onclick="wfDiagram.editWorkflowProperties();
" class="pointerhand" title="Workflow Properties" src="images/toolbar_info.gifx"
></img>&nbsp;</span><span id="workflow_name_" class="workflow_name" size="10"></
span><i>&nbsp;-&nbsp;<span id="workflow_status_"></span></i>&nbsp;&nbsp;<img id=
"workflow_canvas_run_button" class="pointerhand" onclick="javascript:wfDiagram.s
tartWorkflow();" title="Start" src="images/icons/green_forward.gifx"></img>&nbsp
;&nbsp;<img id="workflow_canvas_validate_button" class="pointerhand" onclick="ja
vascript:wfDiagram.validateWorkflow();" title="Validate" src="images/validate_wo
rkflow.gifx"></img>&nbsp;&nbsp;</span></td><td valign="top" align="right" width=
"40%"><span id="status_area_"></span>&nbsp;<a target="_blank" href="http://wiki.
servicenow.com/index.php?title=CSHelp:Workflow_Canvas"><img id="workflow_canvas_
help" class="pointerhand" title="Help" src="images/help.gif"></img></a>&nbsp;<im
g id="wrk_loading_gif" src="images/anim_static.gifx" height="30" border="0" widt
h="20"></img>&nbsp;<img id="activityIcon" title="Collapse and Expand Menu" heigh
t="30" width="24" onclick="wfDiagram.slider.slide()" src="images/activity_colaps
e.gifx" border="0"></img></td></tr></table></td></tr><tr valign="top" style="hei
ght: 100%; background-color: #fff;"><td style="height: 100%;"><div id="diagram_a
rea_" style="height: 100%; width: 100%; overflow:auto; position: relative;"></di
v></td><td style="height: 100%;"><div id="activities" style="height:100%;"><p st
yle="padding:10px; color:#555;"><i><a onclick="wfDiagram.newWorkflow()">Trying t
o create a new Workflow?</a><br></br><a onclick="wfDiagram.loadWorkflow()">Looki
ng for a workflow? Choose from the list of existing workflows and templates.</a>
</i></p></div></td></tr></table><script language="JavaScript" eval="true">var wf
Diagram;
addUnloadEvent(diagramWorkflowUnload_);
addLoadEvent(diagramWorkflowOnload_);
function diagramWorkflowOnload_() {
//load by explicit workflow version (sysparm_sys_id) or work
flow (sysparm_wf_id)
wfDiagram = new WorkflowDiagram('diagram_area_', 'com.glideapp.workf

low.ui.WorkflowDiagramProcessor', '',
true, true, true);
wfDiagram.addDefaultActions();
wfDiagram.slider = new GwtSlideEffect('td2', 'activityIc
on');
if ('' != '')
wfDiagram.workflowChanged('');
}
function diagramWorkflowUnload_() {
wfDiagram.destroy();
}</script><div style="border:none; visibility:hidden"><form acti
on="slushbucket.do" method="GET" style="display:inline" name="sys_personalize"><
input name="sysparm_ck" id="sysparm_ck" type="hidden" value="b43092656f4d710086b
0a9302e3ee44948ea51cef2758e957212b291a02bcb67cadb5554"></input><input type="hidd
en" value="workflow_ide.do?sysparm_cancelable=true@99@sysparm_nostack=true" name
="sysparm_referring_url"></input><input type="hidden" value="" name="sysparm_vie
w"></input></form></div><script>(function() {
addLateLoadEvent(throwFrameLoaded);
// find if padding is needed
var pad = (isMSIE6 || isMSIE7 || navigator.userAgent.indexOf('MSIE 8') !
= -1) ? 1 : 0;
function throwFrameLoaded() {
try {
if (window.parent.CustomEvent) {
// history suggests that if we don't size it down on page lo
ad,
// when we check the height it will show the previous page's
height
window.parent.CustomEvent.fire('content_frame.loaded', self.
name, 10);
window.parent.CustomEvent.fire('content_frame.loaded', self.
name, getPageHeight());
}
} catch (e) {}
}
function throwFrameSized() {
try {
if (window.parent.CustomEvent) {
// IE9/IE10: resize events will be continuously triggered wh
en there is a difference between document.body.scrollHeight and window.frameElem
ent.height
// to solve this issue, we do not fire event if the height w
e are going to set is the same as the height obtained after the previous fired e
vent
var previousHeight = window["g_iframe_height"];
var pageHeight = getPageHeight();
if (previousHeight != pageHeight) {
window.parent.CustomEvent.fire('content_frame.resized',
self.name, pageHeight);
// IE9/IE10: page height may be changed again after the
above firing. So we have to call getPageHeight() to get the new height after the
above event has been fired.
window["g_iframe_height"] = getPageHeight();
}
}
} catch (e) {}

}
/**
* Simply speaking, scrollHeight and offsetHeight work differently on d
ifferent browsers
* and in and out of quirks mode. IE9 has bugs that do not report them
correctly even if
* you pick the right one, so we've built some extra controls.
*/
function getPageHeight() {
var popupElement, popupHeight;
// first, look for popup
if ($$('body > div.popup').length > 0) {
popupElement = $$('body > div.popup')[0];
popupHeight = popupElement.scrollHeight + popupElement.offsetTop
;
//padding is needed or else the bottom border of the popup will
be missing
return (document.body.scrollHeight > popupHeight ? document.body
.scrollHeight : popupHeight) + pad;
}
// then, look for form elements
// use more specific selector to reduce browser response time
if ($$('body > div.section_header_content_no_scroll').length > 0)
return $$('body > div.section_header_content_no_scroll')[0].scro
llHeight;
// then, look for touch scroll elements *CALGARY and forward*
if ($$('body > .touch_scroll').length > 0)
return $$('body > .touch_scroll')[0].scrollHeight;
// then, get the normal page height
if (document.body.scrollHeight)
return document.body.scrollHeight;
return document.body.offsetHeight;
}
// start observing only after page has been loaded to avoid handling lar
ge number of resize events especially on IE 7 and IE 8
addAfterPageLoadedEvent(function() {
CustomEvent.observe('frame.resized', throwFrameSized);
Event.observe(document.onresize ? document : window, "resize", throw
FrameSized);
_frameChanged();
});
})();</script><script type="text/javascript" src="/scripts/js_includes_last.
jsx?v=08-27-2014_1022&amp;lp=Thu_Oct_16_03_38_45_PDT_2014&amp;c=3_36"></script><
script type="text/javascript">addLoadEvent(function() {
GlideUI.get().fireNotifications();
});
addLoadEvent(function() {
// changeHandlerHack
jslog("fireAllChangeHandlers start");
fireAllChangeHandlers();
jslog("fireAllChangeHandlers end");
});

runBeforeRender.defer();
addLateLoadEvent(function() {
CustomEvent.fireTop('page_loaded_fully');
});
// run all of the addLoad and addLateLoad functions
// last deferred include runs the on after all loaded functions
// see functions_bootstrap.js::runAfterAllLoaded for details on why we c
annot defer execution of runAfterAllLoaded on IE6
//
(hint: it is due to using the window.onload event to run the addRe
nderEvents and addLoadEvents in IE6)
if (!isMSIE6)
runAfterAllLoaded.defer();
else
runAfterAllLoaded();</script><script id="glide:page_timing_div" type
="application/xml"><img class="pointerhand" title="Response time(ms): #{RESP}, n
etwork: #{NETW}, browser: #{REND}, server: #{SERV}" src="images/response_time.gi
fx" height="12" width="12"></img><span style="display:none" class="timing_span">
Response time(ms): #{RESP}, network: #{NETW}, server: #{SERV},&nbsp;<a class="ti
ming_span">browser: #{REND}</a><span style="position:relative; width: 1px;">&nbs
p;<span style="position:absolute; bottom:0px; right:0px"><span id="page_timing_d
etails"></span><a><div>&nbsp;</div></a></span></span></span></script><script id=
"glide:page_timing_details" type="application/xml"><div class="timing_details">#
{details}</div></script><script id="glide:page_timing_detail_line" type="applica
tion/xml"><div data-children="#{child_count}" class="timing_detail_line #{has_ch
ildren}">#{HTML:name}: #{ms}
#{children}</div></script><script id="glide:page_timing_child_line" typ
e="application/xml"><div class="timing_detail_line timing_detail_line_child">#{H
TML:name}: #{ms}</div></script><script type="text/javascript">var g_serverTime =
parseInt("32") + parseInt("0");
var g_logClientViewRoles = "";
// do not do this for the navigation menu
if (window.name != 'gsft_nav') {
addLoadEvent(function() {
CustomEvent.fire('page_timing', { name: 'SERV', ms: g_serverTi
me });
CustomEvent.fire('page_timing_network', { name: 'NETW', loadTi
me: g_loadTime });
CustomEvent.fire('page_timing', { name: 'REND', startTime: g_l
oadTime });
CustomEvent.fire('page_timing_show', { show: 'false' });
CustomEvent.observe('partial.page.reload', function() {
CustomEvent.fire('page_timing_clear');
});
});
}
// The following line is used to set the time when we start requesti
ng a new page
Event.observe(window, 'beforeunload', function() {
try {
//PRB591320: Wrapping windows.parent call inside try-ca
tch block
//to avoid javascript access denial error when called fr
om embedded iframe URL/source is different domain
window.parent['g_startTime'] = new Date().getTim
e();

} catch (e) {}
CustomEvent.fireTop('request_start', document);
});
// simple pages fire this (stats.do, etc.)
CustomEvent.observe('simple_page.unload', function() {
try {
//PRB591320: Wrapping windows.parent call inside try-ca
tch block
//to avoid javascript access denial error when called fr
om embedded iframe URL/source is different domain
window.parent['g_startTime'] = new Date().getTime();
} catch (e) {}
});
// indicate we have completed the request (used by RequestManager.js
for cancel widget)
addLoadEvent(function() {
CustomEvent.fireTop("request_complete", window.location);var o =
{};
o.types = {};
o.transaction_id = '7990d6256f4d710086b0a9302e3ee46f';
o.table_name = '';
o.form_name = 'workflow_ide';
o.view_id = 'Default view';
o.win = window;
CustomEvent.fire('page_timing_client', o);
});</script></body></html>

You might also like