Scribd
Upload
475 views7 pages

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
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
475 views7 pages

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
We take content rights seriously. If you suspect this is your content, claim it here.
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