diff options
author | Patrick J Cherry <patrick@bytemark.co.uk> | 2011-06-09 18:09:52 +0100 |
---|---|---|
committer | Patrick J Cherry <patrick@bytemark.co.uk> | 2011-06-09 18:09:52 +0100 |
commit | 495c44445642cfae8f23fadde299ad5307f5be58 (patch) | |
tree | 0104c9eef164235aa5ab05b126c8f63e52fb8624 /static | |
parent | 0c88fcc91db1b003cd5d5311f62700c7867b4099 (diff) |
Big commit
--HG--
rename : views/please_authenticate.haml => views/login.haml
Diffstat (limited to 'static')
l--------- | static/common | 1 | ||||
-rw-r--r-- | static/images/BytemarkLogo180.png | bin | 0 -> 4982 bytes | |||
l--------- | static/javascript | 1 | ||||
-rw-r--r-- | static/mauve_utils.js | 152 | ||||
-rw-r--r-- | static/mauve_utils.js.old | 150 | ||||
-rw-r--r-- | static/stylesheets/bytemark.css | 183 | ||||
-rw-r--r-- | static/stylesheets/mauve.css | 41 |
7 files changed, 389 insertions, 139 deletions
diff --git a/static/common b/static/common new file mode 120000 index 0000000..945c9b4 --- /dev/null +++ b/static/common @@ -0,0 +1 @@ +.
\ No newline at end of file diff --git a/static/images/BytemarkLogo180.png b/static/images/BytemarkLogo180.png Binary files differnew file mode 100644 index 0000000..d3cb3c4 --- /dev/null +++ b/static/images/BytemarkLogo180.png diff --git a/static/javascript b/static/javascript new file mode 120000 index 0000000..e3b95b4 --- /dev/null +++ b/static/javascript @@ -0,0 +1 @@ +/usr/share/javascript
\ No newline at end of file diff --git a/static/mauve_utils.js b/static/mauve_utils.js index 2a14dc2..8a4a9db 100644 --- a/static/mauve_utils.js +++ b/static/mauve_utils.js @@ -1,150 +1,24 @@ -// rather simple first stab at automating image rollovers - any image with -// a class of auto_hover will set its source to be the original name + _hover.png -// when rolled over, and back again when the mouse moves away. -// -// need to initialise by calling addAutoHover() after document has loaded. -// -function addAutoHover() { - $$('img.auto_hover').each(function(image) { - image.observe('mouseover', function(event) { - image.src = image.src.gsub(".png", "_hover.png"); - }); - image.observe('mouseout', function(event) { - image.src = image.src.gsub("_hover.png", ".png"); - }); - preload = new Image(); - preload.src = image.src.gsub(".png", "_hover.png"); - }); -}; -function addRefresh() { - updater1 = new Ajax.PeriodicalUpdater("alert_summary", "/_alert_summary", - { method: 'get', frequency: 120 }); - updater2 = new Ajax.PeriodicalUpdater("alert_counts", "/_alert_counts", - { method: 'get', frequency: 120 }); -} +// Controls the showing of details on alerts. -// Pop up the big white box at the top when something goes wrong, scroll so -// user can see it. -// -function reportError(message) { - $('errors_list').insert('<li>'+message+'</li>'); - $('errors').show(); - $('errors').scrollTo(); +function next_date(n, d, when) { + switch(when) { + case "daytime" + next_daytime_hour(d) + n; + case "working" + next_working_hour(d) + n; + default + d + n; + } } -// Hide the big white box again -// -function clearErrors() { $('errors').hide(); } -// Wrapper around reportError to report an error in updating a particular -// alert. -// -function acknowledgeFailed(id, message) { - if (message) - reportError("<strong>Couldn't update alert "+id+":</strong> "+message); - else - reportError("<strong>Couldn't update alert "+id+"</strong>"); +function is_daytime_hour(d) { + return (d.getHours() => 8 and d.getHours() <= 17); } -// Updates the page from a JSON representation of a particular alert. -// -function updateAlert(alert) { - var strip = $('alert_'+alert.id); - if (!strip) { - reportError("Alert "+id+" not rendered - bug?"); - return; - } - - image = strip.down(".acknowledge img"); - image.src = alert.acknowledged_at ? - "/images/acknowledge_acknowledged.png" : - "/images/acknowledge_unacknowledged.png" - - if (strip.down(".source")) - strip.down(".source").update(alert.source); - if (strip.down(".subject")) - strip.down(".subject").update(alert.subject); - if (strip.down(".summary") && strip.down(".summary").down()) - strip.down(".summary").down().update(alert.summary); - strip.next().update(alert.detail); - - if (alert.acknowledged_at) - strip.next().hide(); -} -// called when user hits the acknowledge button for an alert - makes a callback -// to the server to communicate the change, and updates the button -// appropriately. -// -function toggleAcknowledge(id) { - updater = new Ajax.Request('/alert/'+id+'/acknowledge', { - - method: 'post', - - // ignored by server, see http://www.ruby-forum.com/topic/162976 for why - postBody: 'x', - - onFailure: function(xhr) { acknowledgeFailed(id, "Failure - "+xhr.statusText); }, - - onException: function(xhr, ex) { acknowledgeFailed(id, Dumper(ex)); }, - - onSuccess: function(xhr) { - if (xhr.status == 200) { - content_type = xhr.getResponseHeader("Content-Type"); - if (content_type != "application/json") { - acknowledgeFailed(id, "Got "+content_type+" not application/json from server"); - } else { - updateAlert(xhr.responseText.evalJSON()); - } - } else { - acknowledgeFailed(id, "Connection problem"); - } - } - }); -}; +function next_working_hour(d) { -// Controls the showing of details on alerts. -function toggleDetailView(id) { - updater = new Ajax.Request('/alert/'+id+'/toggleDetailView', { - method: 'post', - postBody: 'x', - onFailure: function(xhr) { acknowledgeFailed(id, "Failure - "+xhr.statusText); }, - onException: function(xhr, ex) { acknowledgeFailed(id, Dumper(ex)); }, - onSuccess: function(xhr) { - if (xhr.status == 200) { - content_type = xhr.getResponseHeader("Content-Type"); - if (content_type != "application/json") { - acknowledgeFailed(id, "Got "+content_type+" not application/json from server"); - } else { - //updateAlert(xhr.responseText.evalJSON()); - } - } else { - acknowledgeFailed(id, "Connection problem"); - } - } - }); } - -// Controls the showing of folding on alerts. -function toggleFoldingView(subject) { - updater = new Ajax.Request('/alert/fold/'+subject, { - method: 'post', - postBody: 'x', - onFailure: function(xhr) { acknowledgeFailed(subject, "Failure - "+xhr.statusText); }, - onException: function(xhr, ex) { acknowledgeFailed(subject, Dumper(ex)); }, - onSuccess: function(xhr) { - if (xhr.status == 200) { - content_type = xhr.getResponseHeader("Content-Type"); - if (content_type != "application/json") { - acknowledgeFailed(subject, "Got "+content_type+" not application/json from server"); - } else { - //updateAlert(xhr.responseText.evalJSON()); - } - } else { - acknowledgeFailed(subject, "Connection problem"); - } - } - }); -} diff --git a/static/mauve_utils.js.old b/static/mauve_utils.js.old new file mode 100644 index 0000000..2a14dc2 --- /dev/null +++ b/static/mauve_utils.js.old @@ -0,0 +1,150 @@ +// rather simple first stab at automating image rollovers - any image with +// a class of auto_hover will set its source to be the original name + _hover.png +// when rolled over, and back again when the mouse moves away. +// +// need to initialise by calling addAutoHover() after document has loaded. +// +function addAutoHover() { + $$('img.auto_hover').each(function(image) { + image.observe('mouseover', function(event) { + image.src = image.src.gsub(".png", "_hover.png"); + }); + image.observe('mouseout', function(event) { + image.src = image.src.gsub("_hover.png", ".png"); + }); + preload = new Image(); + preload.src = image.src.gsub(".png", "_hover.png"); + }); +}; + +function addRefresh() { + updater1 = new Ajax.PeriodicalUpdater("alert_summary", "/_alert_summary", + { method: 'get', frequency: 120 }); + updater2 = new Ajax.PeriodicalUpdater("alert_counts", "/_alert_counts", + { method: 'get', frequency: 120 }); +} + +// Pop up the big white box at the top when something goes wrong, scroll so +// user can see it. +// +function reportError(message) { + $('errors_list').insert('<li>'+message+'</li>'); + $('errors').show(); + $('errors').scrollTo(); +} +// Hide the big white box again +// +function clearErrors() { $('errors').hide(); } + +// Wrapper around reportError to report an error in updating a particular +// alert. +// +function acknowledgeFailed(id, message) { + if (message) + reportError("<strong>Couldn't update alert "+id+":</strong> "+message); + else + reportError("<strong>Couldn't update alert "+id+"</strong>"); +} + +// Updates the page from a JSON representation of a particular alert. +// +function updateAlert(alert) { + var strip = $('alert_'+alert.id); + if (!strip) { + reportError("Alert "+id+" not rendered - bug?"); + return; + } + + image = strip.down(".acknowledge img"); + image.src = alert.acknowledged_at ? + "/images/acknowledge_acknowledged.png" : + "/images/acknowledge_unacknowledged.png" + + if (strip.down(".source")) + strip.down(".source").update(alert.source); + if (strip.down(".subject")) + strip.down(".subject").update(alert.subject); + if (strip.down(".summary") && strip.down(".summary").down()) + strip.down(".summary").down().update(alert.summary); + strip.next().update(alert.detail); + + if (alert.acknowledged_at) + strip.next().hide(); +} + +// called when user hits the acknowledge button for an alert - makes a callback +// to the server to communicate the change, and updates the button +// appropriately. +// +function toggleAcknowledge(id) { + updater = new Ajax.Request('/alert/'+id+'/acknowledge', { + + method: 'post', + + // ignored by server, see http://www.ruby-forum.com/topic/162976 for why + postBody: 'x', + + onFailure: function(xhr) { acknowledgeFailed(id, "Failure - "+xhr.statusText); }, + + onException: function(xhr, ex) { acknowledgeFailed(id, Dumper(ex)); }, + + onSuccess: function(xhr) { + if (xhr.status == 200) { + content_type = xhr.getResponseHeader("Content-Type"); + if (content_type != "application/json") { + acknowledgeFailed(id, "Got "+content_type+" not application/json from server"); + } else { + updateAlert(xhr.responseText.evalJSON()); + } + } else { + acknowledgeFailed(id, "Connection problem"); + } + } + }); +}; + + +// Controls the showing of details on alerts. +function toggleDetailView(id) { + updater = new Ajax.Request('/alert/'+id+'/toggleDetailView', { + method: 'post', + postBody: 'x', + onFailure: function(xhr) { acknowledgeFailed(id, "Failure - "+xhr.statusText); }, + onException: function(xhr, ex) { acknowledgeFailed(id, Dumper(ex)); }, + onSuccess: function(xhr) { + if (xhr.status == 200) { + content_type = xhr.getResponseHeader("Content-Type"); + if (content_type != "application/json") { + acknowledgeFailed(id, "Got "+content_type+" not application/json from server"); + } else { + //updateAlert(xhr.responseText.evalJSON()); + } + } else { + acknowledgeFailed(id, "Connection problem"); + } + } + }); +} + + +// Controls the showing of folding on alerts. +function toggleFoldingView(subject) { + updater = new Ajax.Request('/alert/fold/'+subject, { + method: 'post', + postBody: 'x', + onFailure: function(xhr) { acknowledgeFailed(subject, "Failure - "+xhr.statusText); }, + onException: function(xhr, ex) { acknowledgeFailed(subject, Dumper(ex)); }, + onSuccess: function(xhr) { + if (xhr.status == 200) { + content_type = xhr.getResponseHeader("Content-Type"); + if (content_type != "application/json") { + acknowledgeFailed(subject, "Got "+content_type+" not application/json from server"); + } else { + //updateAlert(xhr.responseText.evalJSON()); + } + } else { + acknowledgeFailed(subject, "Connection problem"); + } + } + }); +} diff --git a/static/stylesheets/bytemark.css b/static/stylesheets/bytemark.css new file mode 100644 index 0000000..c0fd54a --- /dev/null +++ b/static/stylesheets/bytemark.css @@ -0,0 +1,183 @@ +/*----------------------------\ +| Bytemark Internal Stylesheet| +\-----------------------------/ + +To give your page a nice feel, make sure it starts: + <html><head> + <link rel="stylesheet" + href="https://admin.bytemark.co.uk/common/bytemark.css" + type="text/css" + /> + </head><body> + . + . + . + . + </body></head> + +Using headers in the correct order (i.e. h1, h2, h3) also helps. + +Patrick +2004-06-38 +*/ + +pre, code { + font-family: monospace; +} + +ul { + background-color: white; + color: black; +} + +.OK { + background-color: LawnGreen; + color: black; +} + +.Failed { + background-color: OrangeRed; + color: black; +} + +h1 { + background-color: #ffea05; + color: black; + padding: 10px; + margin: 5px; + font-size: x-large; + font-weight: normal; +} +h2 { + background-color: #ABABAB; + color: white; + padding: 5px 5px; + margin: 5px 5px 0px 5px; + font-weight: bold; + font-size: large; +} +h2 a { + color: white; + font-weight: bold; + font-size: large; +} + +h3, th { + font-weight: bold; + font-size: small; + background-color: #E4E4E4; + color: black; +} +h3 { + padding: 3px 5px; + margin: 5px 5px 0px 5px; +} +h4 { + padding: 3px 5px; + margin: 5px 5px 0px 5px; +} +html { + background-color: #666; + color: white; + padding: 5px 5px; + font-family: arial, sans-serif; +} + +body { + margin: 0px; + padding: 5px 5px 5px 5px; + background-color: white; + color: black; + border: none; +} + +div#navbar { + /* try to cancel out the body padding above, leaving a bit of a margin beneath */ + margin: -5px -5px 5px -5px; + padding-left: 15px; + width: 100%; + background-color: #666; + font-size: 14px; +} + +div#navbar ul { + margin: 0px; + padding: 0px; + list-style: none; +} + +div#navbar ul li { + float: left; + margin-right: 2px; + padding: 4px 4px; + background: none; + color: #333; + background: #ccc; + border: 1px solid #9b8748; + border-bottom: none; +} + +div#navbar a { + display: block; + text-decoration: none; + margin: 0px; + min-height: 16px; + color: inherit; + vertical-align: bottom; +} + +div#navbar li#nav_index a { + background-image: url(/common/images/BytemarkLogo180.png); + background-repeat:no-repeat; + background-position:left center; + padding-left: 180px; + width: 0px; + overflow: hidden; +} + +div#navbar li#nav_index, div#navbar li#nav_selected { + background-color: white; + color: #333; +} + +div#navbar br { + clear: both; +} + +p { + margin: 0px 5px; + padding: 7px; + background-color: white; + color: black; +} +table { + margin: 5px 0px; + padding: 0px; +} +table.full { + width: 100%; +} +tr { + margin: 0px; + padding: 0px; +} +td { + vertical-align: top; + margin: 5px; + padding: 5px; +} +ul { + padding: 0px 20px; +} +a { + text-decoration: none; +} +a:link { + color: #0061ab; +} + +div#nav form { + display: inline; +} + + diff --git a/static/stylesheets/mauve.css b/static/stylesheets/mauve.css new file mode 100644 index 0000000..d15e588 --- /dev/null +++ b/static/stylesheets/mauve.css @@ -0,0 +1,41 @@ +tr.hilight { + background-color: #eee; +} + +tr.triggered.hilight { + background-color: #f98; +} + +tr.acknowledged.triggered.hilight { + background-color: #fa5; +} + + +.triggered { + background-color: #fba; +} + +.acknowledged { + color: #444; +} + +.acknowledged.triggered { + background-color: #fb6; +} + +.missing_data { + +} + +body { + min-width: 800px; +} + +.out_of_date { + font-style: italic; +} + +.detail { + background-color: white +} + |