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 +} +  | 
