Active Alerts
View_Widget_ActiveAlerts (View)
Element properties:
Source Code:
<View ID="View_Widget_ActiveAlerts" Accessibility="Public" Enabled="true" Target="System!System.Entity" TypeID="SystemCenter!Microsoft.SystemCenter.HTMLWidgetType" Visible="true">
<Category>Operations</Category>
<WidgetConfiguration>
<Configuration>{"widgetDisplay":{"col":1,"row":1,"sizex":10,"sizey":6},"widgetParameters":{"html":"<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n <title>Active Alerts</title>\n <link rel=\"stylesheet\" href=\"https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css\" />\n <script src=\"https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js\"></script>\n <script src=\"https://cdnjs.cloudflare.com/ajax/libs/list.js/1.5.0/list.min.js\"></script>\n <style>\n body {\n font-family: az_ea_font,'Segoe UI',az_font,system-ui,-apple-system,BlinkMacSystemFont,Roboto,Oxygen,Ubuntu,Cantarell,'Open Sans','Helvetica Neue',sans-serif;\n }\n\n .hide {\n display: none;\n }\n\n .textcapitalize {\n text-transform: capitalize;\n }\n\n .labeltextcapitalize {\n text-transform: capitalize;\n padding-left: 5px;\n }\n\n .classcenter {\n text-align: left;\n }\n\n .textcenter {\n text-align: center;\n }\n\n .resourcescount-right {\n text-align: center;\n }\n\n .ms-Table1 {\n font-family: az_ea_font,'Segoe UI',az_font,system-ui,-apple-system,BlinkMacSystemFont,Roboto,Oxygen,Ubuntu,Cantarell,'Open Sans','Helvetica Neue',sans-serif;\n color: #333;\n background-color: #fff;\n width: 100%;\n border-collapse: collapse;\n border-spacing: 0;\n table-layout: fixed;\n }\n\n .ms-Table1 tr {\n height: 31px;\n max-height: 31px;\n box-sizing: border-box;\n padding: 0 4px;\n }\n\n .ms-Table1 td {\n font-family: az_ea_font,'Segoe UI',az_font,system-ui,-apple-system,BlinkMacSystemFont,Roboto,Oxygen,Ubuntu,Cantarell,'Open Sans','Helvetica Neue',sans-serif;\n font-size: 13px;\n color: #000;\n }\n\n .ms-Table1 thead > tr > th {\n font-family: az_ea_font,'Segoe UI',az_font,system-ui,-apple-system,BlinkMacSystemFont,Roboto,Oxygen,Ubuntu,Cantarell,'Open Sans','Helvetica Neue',sans-serif;\n text-transform: uppercase;\n font-size: 10px;\n font-weight: 700;\n color: #000;\n }\n\n .flex-container {\n display: flex;\n }\n\n .ms-TextField .ms-Label {\n font-size: 12px;\n font-weight: normal;\n width: 330px;\n }\n\n .ms-TextField-field {\n margin-top: 2px;\n border-style: solid;\n border-width: 1px;\n box-sizing: border-box;\n font-size: 13px;\n height: 23px;\n outline: 0;\n padding: 2px 8px 4px;\n border-color: rgba(127,127,127,.85);\n width: 190px;\n font-family: az_ea_font,'Segoe UI',az_font,system-ui,-apple-system,BlinkMacSystemFont,Roboto,Oxygen,Ubuntu,Cantarell,'Open Sans','Helvetica Neue',sans-serif;\n font-weight: 400;\n margin-right:10px;\n }\n .ms-TextField-field[tabindex=\"0\"]:focus {\n outline: 1px solid #015cda !important;\n }\n\n input[type=text]::placeholder {\n font-style: italic;\n }\n\n input[type=text]:-ms-input-placeholder {\n font-style: italic;\n }\n\n input[type=text]::-ms-input-placeholder {\n font-style: italic;\n }\n\n .ms-Dropdown-caretDown {\n background-color: #ffffff;\n }\n\n .custom-dropdown {\n border-style: solid;\n border-width: 1px;\n box-sizing: border-box;\n font-size: 12px;\n height: 23px;\n outline: 0;\n padding: 2px 8px 4px;\n border-color: rgba(127,127,127,.85);\n width: 230px;\n margin-right: 10px;\n }\n\n #State-dropdown{\n width:170px !important;\n }\n\n #Signaltype-dropdown{\n width:170px !important;\n }\n\n .custom-dropdown[tabindex=\"0\"]:focus {\n outline: 1px solid #015cda !important;\n }\n\n .custom-dropdown option {\n font-family: az_ea_font,'Segoe UI',az_font,system-ui,-apple-system,BlinkMacSystemFont,Roboto,Oxygen,Ubuntu,Cantarell,'Open Sans','Helvetica Neue',sans-serif;\n padding: 5px;\n }\n\n .row-item {\n height: 23px;\n font-family: az_ea_font,'Segoe UI',az_font,system-ui,-apple-system,BlinkMacSystemFont,Roboto,Oxygen,Ubuntu,Cantarell,'Open Sans','Helvetica Neue',sans-serif;\n }\n\n .summary-cards {\n display: flex;\n margin-bottom: 20px;\n }\n\n .summary-card {\n border: 1px solid #eee;\n padding: 5px;\n margin-right: 5px;\n text-align: center;\n }\n\n .summary-card-title {\n font-size: 14px;\n padding: 2px;\n font-family: \"Helvetica Neue\",Helvetica,Arial,sans-serif;\n }\n\n .summary-card-link {\n font-size: 13px;\n font-family: \"Helvetica Neue\",Helvetica,Arial,sans-serif;\n }\n\n .backward-icon {\n font-size: larger;\n }\n\n .backward-icon::after {\n content: ' \\00AB';\n }\n\n #summaryHeader {\n padding-bottom: 20px;\n font-family: \"Helvetica Neue\",Helvetica,Arial,sans-serif;\n font-size: 14px;\n }\n\n #summaryHeader-title {\n margin-left: 10px;\n }\n\n th, td {\n text-align: left;\n padding: 2px 0;\n }\n\n\n table > tbody > tr {\n border: 1px solid lightgray;\n border-left: none;\n border-right: none;\n }\n\n tbody tr:hover {\n background-color: rgba(85,179,255,.2);\n }\n\n\n a {\n text-decoration: none;\n color: #015cda;\n font-weight: 600;\n font-family: az_ea_font,'Segoe UI',az_font,system-ui,-apple-system,BlinkMacSystemFont,Roboto,Oxygen,Ubuntu,Cantarell,'Open Sans','Helvetica Neue',sans-serif;\n }\n\n a:visited {\n color: #015cda;\n }\n\n a:hover {\n color: #015cda;\n }\n\n a:active {\n color: #015cda;\n }\n\n /*Column Resizing*/\n .table-resizable.resizing, .table-resizable th::before {\n cursor: e-resize;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n }\n\n .table-resizable th {\n position: relative;\n }\n\n .table-resizable th::before {\n content: '';\n display: block;\n height: 100%;\n position: absolute;\n right: 0;\n top: 0;\n width: 1em;\n }\n\n .table-resizable th:last-of-type::before {\n display: none;\n }\n\n .table-resizable td {\n max-width: 0;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n padding-right: 10px;\n }\n\n .table-resizable th {\n padding-right: 10px;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n\n thead tr:hover th {\n padding-left: 2px;\n border-right: 1px solid lightgray;\n }\n\n /*Pagination*/\n .pagination li {\n display: inline-block;\n padding: 5px;\n }\n\n .pagination-wrap {\n text-align: center;\n margin-top:10px;\n }\n\n .pagination-wrap a {\n text-decoration: none;\n }\n\n .pagination-layout {\n display: inline-flex;\n padding: 0;\n margin: 0;\n list-style-type: none;\n }\n\n .pagination-layout li {\n width: 24px;\n margin: 0 1px;\n }\n\n .pagination-layout li a.page {\n height: 20px;\n width: 20px;\n display: block;\n border: none;\n line-height: 20px;\n padding: 0;\n text-align: center;\n border-radius: 50%;\n font-weight: 600;\n font-size: 13px;\n color: #696969;\n background-color: transparent;\n font-family: az_ea_font,'Segoe UI',az_font,system-ui,-apple-system,BlinkMacSystemFont,Roboto,Oxygen,Ubuntu,Cantarell,'Open Sans','Helvetica Neue',sans-serif;\n }\n\n .pagination-layout li a.page:hover {\n background-color: #186ba0;\n color: #fff;\n }\n\n .pagination-layout li a.page:focus {\n outline: 2px solid #015cda !important;\n }\n\n .pagination-layout li.active a.page {\n background-color: #186ba0;\n color: #fff;\n }\n\n .pagination-layout li.disabled a.page:hover {\n color: #696969;\n background-color: transparent;\n cursor: default;\n }\n\n .jPagination {\n display: inline-flex;\n padding: 0;\n margin: 0;\n list-style-type: none;\n }\n\n .ddlpageItems {\n display: inline-flex;\n padding: 0;\n margin: 0;\n list-style-type: none;\n }\n\n .ddlpageItems select {\n width: 60px;\n }\n\n .jPagination li a {\n color: #555;\n text-decoration: none;\n height: 20px;\n width: 20px;\n display: block;\n border: none;\n line-height: 20px;\n padding: 0;\n text-align: center;\n border-radius: 50%;\n font-weight: 600;\n font-size: 13px;\n background-color: transparent;\n font-family: az_ea_font,'Segoe UI',az_font,system-ui,-apple-system,BlinkMacSystemFont,Roboto,Oxygen,Ubuntu,Cantarell,'Open Sans','Helvetica Neue',sans-serif;\n }\n\n .jPagination li a[tabindex=\"0\"]:focus {\n outline: 2px solid #015cda !important;\n }\n\n .jPagination li {\n width: 24px;\n margin: 0 1px;\n }\n\n /*Column Sorting*/\n .sort .caret:after,\n .sort.asc .caret:after,\n .sort.desc .caret:after {\n position: absolute;\n top: 4px;\n right: 9px;\n display: block;\n font-family: FontAwesome;\n }\n\n .sort .caret:after {\n content: \"\\f0dc\";\n color: #696969;\n padding-top: 0.12em;\n font-size:12px;\n font-family: FontAwesome;\n }\n\n .sort.asc .caret:after {\n content: \"\\f0de\";\n }\n\n .sort.desc .caret:after {\n content: \"\\f0dd\";\n }\n\n .jPaginateNext.disabled, .jPaginateBack.disabled, .jPaginateFirst.disabled, .jPaginateLast.disabled {\n color: #D8D8D8;\n cursor: default;\n }\n\n .tablesort:hover {\n cursor:pointer;\n }\n\n th span{\n height: 21px;\n width: 25px;\n position: absolute;\n margin-left:10px;\n top: 5px;\n box-sizing: border-box;\n }\n\n th[tabindex=\"0\"]:focus{\n outline: 2px solid #007ACC !important;\n }\n\n .headerrightborder{\n border-right : 3px solid lightgray;\n }\n\n .hide {\n display: none;\n }\n\n #searchresults {\n font-family: az_ea_font,'Segoe UI',az_font,system-ui,-apple-system,BlinkMacSystemFont,Roboto,Oxygen,Ubuntu,Cantarell,'Open Sans','Helvetica Neue',sans-serif;\n font-size: 13px;\n margin-top: 10px;\n }\n\n .fxs-hide-accessible-label {\n overflow: hidden;\n position: absolute;\n top: -1000px;\n left: -1000px;\n width: 0;\n height: 0;\n }\n\n tbody > tr > td > img {\n vertical-align: bottom;\n }\n\n #Reset{\n vertical-align: middle;\n width: 70px;\n height: 23px;\n }\n\n #Reset[tabindex=\"0\"]:focus {\n outline: 1px solid #015cda !important;\n }\n \n a[tabindex=\"-1\"]{\n cursor:not-allowed !important;\n outline:none !important;\n }\n\n @media screen and (-ms-high-contrast: active) {\n .pagination-layout li.active a.page {\n background-color: Highlight !important;\n border-color: Highlight !important;\n -ms-high-contrast-adjust: none;\n color: highlighttext !important;\n }\n\n .pagination-layout li:not(.disabled) a.page:hover {\n background-color: Highlight !important;\n border-color: Highlight !important;\n -ms-high-contrast-adjust: none;\n color: highlighttext !important;\n }\n }\n </style>\n</head>\n\n<body>\n <div role=\"main\">\n <div id=\"wait\" style=\"display:none;width:69px;height:89px;border:0px solid black;position:absolute;top:20%;left:50%;padding:2px;\"><img alt=\"Loading...\" style=\"height:40px;width:40px\" src='/OperationsManager/images/miscellaneous/spinney.gif' width=\"64\" height=\"64\" /></div>\n <div id=\"MainContent\" style=\"display:none\">\n <div class=\"flex-container\">\n <div class=\"row-item\">\n <select id=\"subscription-dropdown\" aria-label=\"Filter by subscriptions\" class=\"custom-dropdown\" tabindex=\"0\" onchange=\"onSubChange(this)\">\n <option value=\"0\">--Subscriptions--</option>\n </select>\n </div>\n <div class=\"row-item\">\n <select id=\"Signaltype-dropdown\" aria-label=\"Filter by Signal Type\" class=\"custom-dropdown\" tabindex=\"0\" onchange=\"onSignalChange(this)\">\n <option value=\"0\">--Signal Type--</option>\n <option value=\"microsoft.insights/metricalerts\">Metric</option>\n <option value=\"microsoft.insights/activitylogalerts\">Activity Log</option>\n <option value=\"microsoft.insights/scheduledqueryrules\">Log</option>\n <option value=\"SCOM Alert\">SCOM Alert</option>\n </select>\n </div>\n <div class=\"row-item\">\n <select id=\"State-dropdown\" aria-label=\"Filter by severity\" class=\"custom-dropdown\" tabindex=\"0\" onchange=\"onHealthChange(this)\">\n <option value=\"0\">Filter by severity...</option>\n <option value=\"error\">Critical</option>\n <option value=\"warning\">Warning</option>\n <option value=\"information\">Information</option>\n </select>\n </div>\n <div class=\"ms-TextField\">\n <input class=\"ms-TextField-field\" type=\"text\" value=\"\" aria-label=\"Filter by Name\" tabindex=\"0\" placeholder=\"Filter by Name...\"\n id=\"instancename\">\n </div>\n <div class=\"row-item\">\n <input type=\"button\" aria-label=\"Reset the filters\" tabindex=\"0\" value=\"Reset\" title=\"Reset the filters\" id=\"Reset\" />\n </div>\n </div>\n\n <div style=\"margin-top:20px;\" class=\"subscription-table\" id=\"ActiveAlertsTable\">\n <div>\n <table class=\"ms-Table1 ms-Table1--fixed table-resizable\">\n <thead>\n <tr id=\"subHead\"></tr>\n </thead>\n <tbody class=\"list\" id=\"subBody\"></tbody>\n </table>\n </div>\n <div>\n <div id=\"searchresults\" aria-live=\"assertive\" role=\"status\"></div>\n <div class=\"pagination-wrap\">\n <ul class=\"jPagination\">\n <li><a aria-label=\"first page\" class=\"jPaginateFirst disabled\" title=\"First\" href=\"javascript:void(0)\"><i class=\"fa fa-backward\"></i></a></li>\n </ul>\n <ul class=\"jPagination\">\n <li><a aria-label=\"previous page\" class=\"jPaginateBack disabled\" title=\"Previous\" href=\"javascript:void(0)\"><i class=\"fa fa-step-backward\"></i></a></li>\n </ul>\n <ul class=\"pagination pagination-layout activealertspagination\"></ul>\n <ul class=\"jPagination\">\n <li><a aria-label=\"next page\" class=\"jPaginateNext\" title=\"Next\" href=\"javascript:void(0)\"><i class=\"fa fa-step-forward\"></i></a></li>\n </ul>\n <ul class=\"jPagination\">\n <li><a aria-label=\"Last page\" class=\"jPaginateLast\" title=\"Last\" href=\"javascript:void(0)\"><i class=\"fa fa-forward\"></i></a></li>\n </ul>\n <ul class=\"ddlpageItems\">\n <li>\n <select id=\"page-dropdown\" aria-label=\"Number of items per page\" class=\"custom-dropdown\" tabindex=\"0\" onchange=\"paginationChange(this)\">\n <option value=\"10\" selected=\"selected\">10</option>\n <option value=\"15\">15</option>\n <option value=\"20\">20</option>\n <option value=\"30\">30</option>\n </select>\n </li>\n </ul>\n </div>\n </div>\n </div>\n </div>\n <div id=\"PortalReader\" class=\"fxs-hide-accessible-label\" aria-live=\"assertive\" role=\"status\">\n <div>Active Alerts Dashboard</div>\n </div>\n <div id=\"SortStatus\" class=\"fxs-hide-accessible-label\" role=\"status\" aria-live=\"assertive\">\n </div>\n <script type=\"text/javascript\">\n var pagebusystatustext = \"<div>Active Alerts dashboard is busy.</div>\";\n var pagereadystatustext = \"<div>Active Alerts dashboard is ready.</div>\";\n var pagequantity = $(\"#page-dropdown\").val();\n var paginationObject;\n var paginationList = [];\n var forwardbackwardflag = false;\n $(window.parent.document).find('.widget-title').hide();\n var requestHeaders = {\n Accept: 'q=0.8;application/json;q=0.9'\n };\n InitializeCSRFToken();\n function InitializeCSRFToken() {\n var documentcookies = document.cookie.split('; ');\n var result = {};\n for (var i = 0; i < documentcookies.length; i++) {\n var cur = documentcookies[i].split('=');\n result[cur[0]] = cur[1];\n }\n if (result[\"SCOM-CSRF-TOKEN\"] && result[\"SCOM-CSRF-TOKEN\"] != null) {\n requestHeaders[\"SCOM-CSRF-TOKEN\"] = decodeURIComponent(result[\"SCOM-CSRF-TOKEN\"]);\n }\n }\n\n var alertTypes = [\"microsoft.insights/metricalerts\", \"microsoft.insights/activitylogalerts\", \"microsoft.insights/scheduledqueryrules\"];\n var signalTypes = { \"microsoft.insights/metricalerts\": \"Metric\" , \"microsoft.insights/activitylogalerts\": \"Activity Log\" , \"microsoft.insights/scheduledqueryrules\": \"Log\" };\n\n var azureData = {\n subscriptions: {},\n alerts: {}\n }\n\n function renderSubscriptionTable(data) {\n var data = data.rows;\n var subDropdown = $('#subscription-dropdown');\n subDropdown.html('');\n subDropdown.html(\"<option value='0'>--Subscriptions--</option>\");\n for (var i = 0; i < data.length; i++) {\n subDropdown.append(\"<option value='\" + data[i].fullname.split(':')[1] + \"'>\" + data[i].displayname + \"</option>\");\n }\n }\n\n function OpenAlertDrilldown(object) {\n var objectId = $(object).data(\"scomobjectid\");\n $.ajax({\n url: \"/OperationsManager/monitoring/dashboardsForObject/DrilldownSCOMAlert?scomObjectId=\" + objectId,\n headers: requestHeaders,\n type: \"GET\",\n success: function (data) {\n var dashboardId = data[0].id;\n var mpId = data[0].mpId;\n var drilldownpath = \"/OperationsManager/#/monitoring/drilldown/alert/\" + objectId + \"/dashboard/\" + dashboardId + \"?mpId=\" + mpId + \"&show_full_screen_link=false\";\n $(object).attr(\"href\", drilldownpath);\n $(object).removeAttr(\"onclick\");\n $(object).attr(\"target\", \"_blank\");\n $(object)[0].click();\n }\n });\n }\n\n\n function renderAlertsTable(selectedSubscriptionId, selectedSignalType, healthState) {\n if (!azureData.alerts) return null;\n\n var subscriptiondata = azureData.alerts.rows;\n var subHead = $('#subHead');\n subHead.html(\"\");\n var subBody = $('#subBody');\n subBody.html(\"\");\n subHead.html(\"<th class='sort tablesort'data-sort='Severity' data-columnheader='Severity' tabindex=0>Severity<span><i class='caret'></i></span></th>\" +\n \"<th class='sort tablesort' data-sort='DisplayName' data-columnheader='Name' tabindex=0>Name<span><i class='caret'></i></span></th>\" +\n \"<th class='sort tablesort' data-sort='SignalType' data-columnheader='Signal Type' tabindex=0>Signal Type<span><i class='caret'></i></span></th>\" +\n \"<th class='sort tablesort' data-sort='TimeAdded' data-columnheader='Age' tabindex=0>Age<span><i class='caret'></i></span></th>\" +\n \"<th class='sort tablesort' data-sort='LastUpdated' data-columnheader='Last Modified' tabindex=0>Last Modified<span><i class='caret'></i></span></th>\" +\n \"<th class='sort tablesort' data-sort='HiddenResourceCount' data-columnheader='Affected Resources Count' tabindex=0>Affected Resources Count<span><i class='caret'></i></span></th>\" +\n \"<th class='sort tablesort' data-sort='AffectedResources' data-columnheader='Affected Resources' tabindex=0>Affected Resources<span><i class='caret'></i></span></th>\" +\n \"<th class='sort tablesort' data-sort='Subscription' data-columnheader='Subscription Name' tabindex=0>Subscription Name<span><i class='caret'></i></span></th>\");\n\n if (azureData.subscriptions.rows.length == 0) {\n NoResultsfound();\n return;\n }\n\n if (selectedSubscriptionId != \"\") {\n subscriptiondata = subscriptiondata.filter(x=> x.monitoringobjectname.indexOf(selectedSubscriptionId) != -1);\n }\n\n if (selectedSignalType != \"\" && selectedSignalType != \"SCOM Alert\") {\n subscriptiondata = subscriptiondata.filter(x=> x.monitoringobjectdisplayname.split(' (')[1].slice(0, -1).toLowerCase() == selectedSignalType.toLowerCase());\n }\n else if (selectedSignalType != \"\" && selectedSignalType == \"SCOM Alert\") {\n subscriptiondata = subscriptiondata.filter(x=> alertTypes.includes(x.monitoringobjectdisplayname.split(' (')[1].slice(0, -1).toLowerCase()) == false);\n }\n\n if (healthState != \"\") {\n subscriptiondata = subscriptiondata.filter(x=> x.severity.toLowerCase() == healthState.toLowerCase());\n }\n\n\n subscriptiondata.sort(function (a, b) {\n var c = new Date(a.timeadded);\n var d = new Date(b.timeadded);\n return d - c;\n });\n paginationList = [];\n for (var i = 0; i < subscriptiondata.length; i++) {\n var row = $('<tr class=\"rowname\" />');\n var displayname = \"\";\n var signalType = \"\";\n var imagepath = \"\";\n var anchortag = \"\";\n var subscriptionname = azureData.subscriptions.rows.filter(x=> x.fullname.split(':')[1] == subscriptiondata[i].monitoringobjectname.split('/')[2])[0].displayname;\n\n var targetResourceIds = \"-\";\n var targetResourcescount = \"-\";\n if (subscriptiondata[i].monitoringobjectdisplayname.indexOf(' (') > -1) {\n if (alertTypes.includes(subscriptiondata[i].monitoringobjectdisplayname.split(' (')[1].slice(0, -1).toLowerCase()) == false) {\n signalType = \"SCOM Alert\";\n displayname = subscriptiondata[i].name;\n targetResourceIds = subscriptiondata[i].monitoringobjectdisplayname.split(' (')[0];\n if (targetResourceIds.length > 20) {\n targetResourceIds = targetResourceIds.substring(0, 20) + \"...\";\n }\n targetResourcescount = 1;\n }\n else {\n displayname = subscriptiondata[i].monitoringobjectdisplayname.split(' (')[0];\n\n signalType = subscriptiondata[i].monitoringobjectdisplayname.split(' (')[1].slice(0, -1);\n signalType = signalTypes[signalType.toLowerCase()];\n\n if (subscriptiondata[i].context && subscriptiondata[i].context != null) {\n $xml = $($.parseXML(subscriptiondata[i].context));\n $xml.find(\"DataItem\").find(\"Property\").each(function () {\n if ($(this).attr(\"Name\") == \"TargetResourceIds\" && $(this).text() != \"\") {\n var resources = $(this).text().split(';');\n targetResourcescount = resources.length;\n targetResourceIds = resources[0].substring(resources[0].lastIndexOf(\"/\") + 1);\n\n if (targetResourcescount > 1) {\n targetResourceIds = targetResourceIds + \",...\"\n }\n }\n });\n }\n }\n }\n else {\n signalType = \"SCOM Alert\";\n displayname = subscriptiondata[i].name;\n };\n\n\n var anchortag = \"<a data-scomobjectid=\" + subscriptiondata[i].id + \" onclick='return OpenAlertDrilldown(this);' href='javascript:void(0)'>\" + displayname + \"</a>\";\n\n if (subscriptiondata[i].severity == \"Error\") {\n imagepath = \"<img alt='Critical' height='15px' width='15px' src='/monitoringview/images/state/critical.png' /><lable class='labeltextcapitalize'>Critical</label>\";\n }\n else if (subscriptiondata[i].severity == \"Warning\") {\n imagepath = \"<img alt='Warning' height='15px' width='15px' src='/monitoringview/images/state/warning.png' /><lable class='labeltextcapitalize'>Warning</label>\";\n }\n else if (subscriptiondata[i].severity == \"Information\") {\n imagepath = \"<img alt='Information' height='15px' width='15px' src='/monitoringview/images/severity/info.png' /><lable class='labeltextcapitalize'>Information</label>\";\n }\n else {\n imagepath = subscriptiondata[i].severity;\n }\n\n var listobject = {\n Severity: imagepath,\n AlertName: anchortag,\n TimeAdded: new Date(subscriptiondata[i].timeadded).getTime(),\n DisplayName : displayname,\n SignalType: signalType,\n Age: subscriptiondata[i].age,\n LastModified: formatDate(new Date(subscriptiondata[i].lastmodified)),\n LastUpdated: new Date(subscriptiondata[i].lastmodified).getTime(),\n AffectedResourceCount: targetResourcescount,\n HiddenResourceCount : targetResourcescount,\n AffectedResources: targetResourceIds,\n Subscription : subscriptionname\n };\n paginationList.push(listobject);\n\n }\n var options = {\n valueNames: [{ name: 'TimeAdded', attr: 'data-timestamp' }, { name: 'LastUpdated', attr: 'data-timestamp' },\n { name: 'HiddenResourceCount', attr: 'data-number' },\n 'Severity', 'AlertName', 'SignalType', 'Age', 'LastModified', 'AffectedResourceCount', 'AffectedResources', 'Subscription',\n { name: 'DisplayName', attr: 'title' }],\n page: pagequantity,\n pagination: [{\n paginationClass: \"activealertspagination\",\n left: 4,\n right: 2\n }],\n item: \"<tr><td class='hide'><span class='HiddenResourceCount'></span><span class='TimeAdded'></span><span class='LastUpdated'></span></td><td class='Severity'></td><td class='AlertName DisplayName'></td><td class='SignalType'></td><td class='Age'></td><td class='LastModified'></td><td class='AffectedResourceCount resourcescount-right'></td><td class='AffectedResources'></td><td class='Subscription'></td></tr>\"\n }\n\n paginationObject = new List('ActiveAlertsTable', options, paginationList).on(\"updated\", function (list) {\n var isFirst = list.i == 1;\n var isLast = list.i > list.matchingItems.length - list.page;\n $(\".jPaginateBack.disabled, .jPaginateNext.disabled\").removeClass(\"disabled\");\n $(\".jPaginateFirst.disabled, .jPaginateLast.disabled\").removeClass(\"disabled\");\n $(\".jPaginateBack\").attr(\"tabindex\", 0);\n $(\".jPaginateFirst\").attr(\"tabindex\", 0);\n $(\".jPaginateNext\").attr(\"tabindex\", 0);\n $(\".jPaginateLast\").attr(\"tabindex\", 0);\n if (isFirst) {\n $(\".jPaginateBack\").addClass(\"disabled\");\n $(\".jPaginateFirst\").addClass(\"disabled\");\n $(\".jPaginateBack\").attr(\"tabindex\", -1);\n $(\".jPaginateFirst\").attr(\"tabindex\", -1);\n }\n if (isLast) {\n $(\".jPaginateNext\").addClass(\"disabled\");\n $(\".jPaginateLast\").addClass(\"disabled\");\n $(\".jPaginateNext\").attr(\"tabindex\", -1);\n $(\".jPaginateLast\").attr(\"tabindex\", -1);\n }\n\n if (list.matchingItems.length <= 10) {\n $(\".pagination-wrap\").hide();\n //$(\"#searchresults\").hide();\n } else {\n $(\".pagination-wrap\").show();\n //$(\"#searchresults\").show();\n }\n\n FormatSearchResultsStatus(isFirst, isLast, list, list.matchingItems.length);\n $('.activealertspagination').trigger('contentchanged');\n });\n paginationObject.show(1, pagequantity);\n BindAccessbilityAttributes();\n AddResizeHandler();\n\n if ($.trim($(\"#instancename\").val()) != \"\") {\n paginationObject.filter(function (item) {\n return (item.values().DisplayName.toLowerCase().indexOf($.trim($(\"#instancename\").val().toLowerCase())) > -1);\n });\n }\n\n paginationObject.on('sortComplete', function () {\n $(\"#ActiveAlertsTable table thead th.tablesort.asc\").each(function () {\n var datasort = $(this).data('columnheader');\n $(\"#SortStatus\").html(datasort + \" column sorted in ascending order\");\n });\n\n $(\"#ActiveAlertsTable table thead th.tablesort.desc\").each(function () {\n var datasort = $(this).data('columnheader');\n $(\"#SortStatus\").html(datasort + \" column sorted in descending order.\");\n });\n });\n }\n\n function formatDate(date) {\n var newDate = ('0' + (date.getMonth() + 1)).slice(-2) + '/'\n + ('0' + date.getDate()).slice(-2) + '/'\n + date.getFullYear();\n\n var newTime = date.toLocaleString('en-US', { hour: 'numeric', minute: 'numeric', hour12: true });\n return newDate + \" \" + newTime;\n };\n\n function AddResizeHandler() {\n Array.prototype.forEach.call(\n document.querySelectorAll(\"table th\"),\n function (th) {\n th.style.position = 'relative';\n var grip = document.createElement('div');\n grip.innerHTML = \"&nbsp;\";\n grip.style.top = 0;\n grip.style.right = 0;\n grip.style.bottom = 0;\n grip.style.width = '5px';\n grip.style.position = 'absolute';\n grip.style.cursor = 'e-resize';\n th.appendChild(grip);\n });\n };\n\n function NoResultsfound() {\n var subBody = $('#subBody');\n subBody.html(\"\");\n var row = $('<tr />');\n row.append(\"<td colspan=8> No records found </td>\");\n subBody.append(row);\n $(\".pagination-wrap\").hide();\n $(\"#searchresults\").addClass(\"fxs-hide-accessible-label\");\n }\n\n function fillSubscriptions(data) {\n azureData.subscriptions = data;\n renderSubscriptionTable(data);\n getAlerts(data);\n }\n function getSubscriptions() {\n $(\"#PortalReader\").html(pagebusystatustext);\n $(\"#MainContent\").css(\"display\", \"none\");\n $(\"#wait\").css(\"display\", \"block\");\n $.ajax({\n url: \"/OperationsManager/data/scomObjectsByClass\",\n headers: requestHeaders,\n contentType: \"application/json\",\n type: \"POST\",\n data: JSON.stringify(\"Microsoft.SystemCenter.MicrosoftAzure.Subscription\"),\n success: fillSubscriptions\n })\n }\n function getAlerts(subscriptions) {\n var objectIds = {};\n subscriptions.rows.map(function (subscription) {\n objectIds[subscription.id] = 0;\n });\n\n $.ajax({\n url: \"/OperationsManager/data/alert\",\n headers: requestHeaders,\n contentType: \"application/json\",\n type: \"POST\",\n data: JSON.stringify({ \"classId\": null, \"objectIds\": objectIds, \"criteria\": \"((Severity = '0') OR (Severity = '1') OR (Severity = '2')) AND ((Priority = '2') OR (Priority = '1') OR (Priority = '0')) AND ((ResolutionState = '0') OR (ResolutionState = '247') OR (ResolutionState = '248') OR (ResolutionState = '249') OR (ResolutionState = '250') OR (ResolutionState = '254'))\", \"displayColumns\": [\"severity\", \"displayName\", \"monitoringobjectdisplayname\", \"name\", \"age\", \"lastmodified\", \"timeadded\", \"context\", \"monitoringobjectname\"] }),\n success: function (data) {\n azureData.alerts = data;\n renderAlertsTable('', '', '');\n $(\"#wait\").css(\"display\", \"none\");\n $(\"#MainContent\").css(\"display\", \"block\");\n $(\"#PortalReader\").html(pagereadystatustext);\n }\n })\n }\n\n $(document).ready(function () {\n getSubscriptions();\n $('#instancename').bind('input', function () {\n var value = $.trim($(this).val().toLowerCase());\n paginationObject.filter(function (item) {\n return (item.values().DisplayName.toLowerCase().indexOf(value) > -1);\n });\n });\n });\n\n function globalFilter(searchInput, target) {\n var value = $(searchInput).val().toLowerCase();\n $(target).filter(function () {\n $(this).toggle($(this).text().toLowerCase().indexOf(value) > -1)\n });\n }\n\n function onSubChange(e) {\n ApplyFilters();\n }\n\n function onSignalChange(e) {\n ApplyFilters();\n }\n\n function onHealthChange(e) {\n ApplyFilters();\n }\n\n function paginationChange(e) {\n pagequantity = $(\"#page-dropdown\").val();\n ApplyFilters();\n }\n function ApplyFilters() {\n var subscriptionid = \"\";\n if ($(\"#subscription-dropdown\").val() != \"0\") {\n subscriptionid = $(\"#subscription-dropdown\").val();\n }\n\n var signaltype = \"\";\n if ($(\"#Signaltype-dropdown\").val() != 0) {\n signaltype = $(\"#Signaltype-dropdown\").val();\n }\n\n var healthState = \"\";\n if ($(\"#State-dropdown\").val() != 0) {\n healthState = $(\"#State-dropdown\").val();\n }\n renderAlertsTable(subscriptionid, signaltype, healthState);\n }\n\n $(document).on('click', '#Reset', function () {\n $(\"#subscription-dropdown\").val(0);\n $(\"#Signaltype-dropdown\").val(0);\n $(\"#State-dropdown\").val(0);\n $(\".ms-TextField-field\").val('');\n\n ApplyFilters();\n });\n\n var ariasortlivestatus = \"\";\n\n $(document).on('focus', 'th[tabindex=0]', function () {\n $(this).addClass(\"headerrightborder\");\n var tableheader = this;\n setTimeout(function () {\n var datasort = $(tableheader).data('columnheader');\n //console.log(datasort);\n if ($(tableheader).hasClass(\"asc\")) {\n ariasortlivestatus = datasort + \" column activate to sort in descending order.\";\n }\n else if ($(tableheader).hasClass(\"desc\")) {\n ariasortlivestatus = datasort + \" column activate to sort in ascending order.\";\n }\n else {\n ariasortlivestatus = datasort + \" column activate to sort.\";\n }\n $(\"#SortStatus\").html(ariasortlivestatus);\n }, 1000);\n\n });\n\n $(document).on('focusout', 'th[tabindex=0]', function () {\n $(this).removeClass(\"headerrightborder\");\n ariasortlivestatus = \"\";\n $(\"#SortStatus\").html(ariasortlivestatus);\n });\n\n $(document).on('keydown', '.tablesort', function (event) {\n if (event.keyCode == 13) {\n $(this).click();\n }\n // + Ctrl + Left arrow key code\n else if (event.ctrlKey && event.keyCode == 39) {\n $(this).css(\"width\", (GetColumnWidth(this) + 10) + \"px\");\n }\n //- Ctrl + Right arrow Key code;\n else if (event.ctrlKey && event.keyCode == 37) {\n $(this).css(\"width\", (GetColumnWidth(this) - 10) + \"px\");\n }\n //Reset - Ctrl + down arrow Key code;\n else if (event.ctrlKey && event.keyCode == 40) {\n $(this).closest(\"thead\").find('th[style]').css('width', '');\n }\n });\n\n function GetColumnWidth(object) {\n var currentwidth = $(object).css(\"width\");\n if (currentwidth && currentwidth != null && currentwidth != \"\") {\n currentwidth = currentwidth.split('px')[0];\n }\n else {\n currentwidth = \"0\";\n };\n return parseInt(currentwidth);\n }\n\n $(function () {\n var startX,\n startWidth,\n $handle,\n $table,\n pressed = false;\n\n $(document).on({\n mousemove: function (event) {\n if (pressed) {\n $handle.width(startWidth + (event.pageX - startX));\n }\n },\n mouseup: function () {\n if (pressed) {\n $table.removeClass('resizing');\n pressed = false;\n }\n }\n }).on('mousedown', '.table-resizable th', function (event) {\n $handle = $(this);\n pressed = true;\n startX = event.pageX;\n startWidth = $handle.width();\n $table = $handle.closest('.table-resizable').addClass('resizing');\n }).on('dblclick', '.table-resizable thead', function () {\n // Reset column sizes on double click\n $(this).find('th[style]').css('width', '');\n });\n });\n\n $('.jPaginateNext').on('click', function (e) {\n e.preventDefault();\n var ullist = $('.activealertspagination').find('li');\n $.each(ullist, function (position, element) {\n if ($(element).is('.active')) {\n forwardbackwardflag = true;\n $(ullist[position + 1]).trigger('click');\n return false;\n }\n });\n\n });\n\n\n $('.jPaginateBack').on('click', function (e) {\n e.preventDefault();\n var ullist = $('.activealertspagination').find('li');\n $.each(ullist, function (position, element) {\n if ($(element).is('.active')) {\n forwardbackwardflag = true;\n $(ullist[position - 1]).trigger('click');\n return false;\n }\n });\n });\n\n $('.jPaginateFirst').on('click', function (event) {\n event.preventDefault();\n paginationObject.show(1, pagequantity);\n });\n\n $('.jPaginateLast').on('click', function (event) {\n event.preventDefault();\n\n if (pagequantity == paginationObject.matchingItems.length) {\n paginationObject.show(1, pagequantity);\n }\n else {\n var pageNo = Math.floor(paginationObject.matchingItems.length / pagequantity);\n var remainder = (paginationObject.matchingItems.length % pagequantity);\n if (remainder == 0) {\n paginationObject.show(((pageNo - 1) * pagequantity) + 1, pagequantity);\n }\n else {\n paginationObject.show((pageNo * pagequantity) + 1, pagequantity);\n }\n }\n });\n\n\n $(document).on('contentchanged', '.activealertspagination', function () {\n setTimeout(BindAccessbilityAttributes, 100);\n });\n\n $(document).on('click', '.listitem', function () {\n setTimeout(SetFocusOnActiveLink, 100);\n });\n\n function SetFocusOnActiveLink() {\n if (!forwardbackwardflag) {\n $(\".activealertspagination li.active .page\").focus();\n }\n forwardbackwardflag = false;\n };\n\n function BindAccessbilityAttributes() {\n $.each($(\".activealertspagination li:not(.disabled) .page\"), function (position, element) {\n $(element).parent().addClass('listitem');\n $(element).attr(\"aria-label\", \"Page Number : \" + $(element).html());\n });\n $(\".activealertspagination li.active .page\").attr(\"aria-label\", \"Page Number : \" + $(\".activealertspagination li.active .page\").html() + \" selected\");\n $(\".activealertspagination li.disabled .page\").removeAttr(\"href\");\n }\n function FormatSearchResultsStatus(isFirst, isLast, list, size) {\n $(\"#searchresults\").removeClass(\"fxs-hide-accessible-label\");\n var statustext = \"\";\n if (size > 0) {\n if (isFirst && isLast) {\n if (list.matchingItems.length > 1) {\n statustext = list.matchingItems.length + \" Results found\";\n }\n else {\n statustext = list.matchingItems.length + \" Result found\";\n }\n }\n else if (isLast) {\n statustext = \"Showing \" + list.i + \" to \" + (list.i + (list.matchingItems.length - list.i)) + \" of \" + list.matchingItems.length + \" Results\";\n }\n else {\n statustext = \"Showing \" + list.i + \" to \" + (list.i + parseInt(list.page) - 1) + \" of \" + list.matchingItems.length + \" Results\";\n }\n }\n else {\n NoResultsfound();\n statustext = \"No Records found\";\n }\n\n if ($(\"#searchresults\").html() != statustext) {\n $(\"#searchresults\").html(statustext);\n }\n }\n </script>\n </div>\n</body>\n</html>"},"widgetRefreshInterval":60}</Configuration>
<Type>HtmlCustomWidget</Type>
</WidgetConfiguration>
</View>