visage-app 0.3.3 → 0.9.0.pre1

data/lib/visage-app/public/stylesheets/screen.css

@@ -29,34 +29,50 @@ body {
 }
 
 div#header {
-  height: 40px;
-  background-color: #3465a4;
   margin-bottom: 16px;
-  border-bottom: 6px solid #c5d6ed;
-  background: -moz-linear-gradient(100% 100% 90deg, #3465a4, #142e52);
-  background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#142e52), to(#3465a4));
+  border-bottom: 2px solid #C5D6ED;
+  background-color: #3465a4;
+  background: -moz-linear-gradient(100% 100% 90deg, #244671, #4C94F0);
+  background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#4C94F0), to(#244671));
+  -moz-box-shadow: -7px 0 7px rgba(0,0,0,0.4);
+  -webkit-box-shadow: -7px 0 7px rgba(0,0,0,0.4);
 }
 
 div#nav {
-  padding-top: 10px;
   color: white;
-  font-family: sans-serif;
+  font-family: Bitstream Vera Sans, Helvetica Neue, sans-serif;
   text-align: right;
   font-size: 16px;
 }
 
-div#nav a {
-  margin-top: 8px;
-  margin-left: 12px;
+div#nav ul {
+  padding: 8px 0px;
+}
+
+div#nav ul li {
+  display: inline;
+  padding: 8px 0px;
+}
+
+div#nav ul li a {
+  padding: 8px 16px;
   color: white;
+  text-shadow: 0 2px 1px rgba(0,0,0,0.5);
   font-weight: bold;
 }
 
-div#nav a:hover {
-  text-shadow: 0 1px 6px rgba(115,157,211,0.9);
+div#nav ul li a:hover {
+  text-shadow: 0 2px 1px rgba(255,255,255,0.1);
+  background: -webkit-gradient(linear, left top, left bottom, from(#529EFF), to(#274C7A));
+  background: -moz-linear-gradient(top, #529EFF, #274C7A);
   text-decoration: none;
 }
 
+div#nav span.title {
+  font-weight: bold;
+}
+
+
 div#content, div#nav {
   width: 950px;
   margin: auto;
@@ -86,7 +102,6 @@ div#profile-meta input.create.profile {
   -webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
   -moz-border-radius: 5px;
   -webkit-border-radius: 5px;
-  text-shadow: 0 -1px 1px rgba(0,0,0,0.25);
   background: #888;
   color: white;
   padding: 5px 10px 6px;
@@ -94,8 +109,8 @@ div#profile-meta input.create.profile {
   border-bottom: 1px solid rgba(0,0,0,0.25);
   position: relative;
   cursor: pointer;
-font-weight: bold;
-background-image: -webkit-gradient(
+  font-weight: bold;
+  background-image: -webkit-gradient(
     linear,
     left bottom,
     left top,
@@ -116,8 +131,8 @@ p.error {
 
 div.builder {
   float: left;
-  margin-left: 25px;
   width: 450px;
+  margin-left: 25px;
   margin-bottom: 24px;
 }
 
@@ -190,15 +205,13 @@ span.glob.example {
 }
 
 div#graphs {
-  clear: both;
   padding: 0 2em;
   border-top: 1px dashed #babdb6;
   margin-top: 2em;
 }
 
 div.graph {
-  margin: 0.5em 0;
-  clear: both;
+  margin: 32px 0 48px;
 }
 
 h1, h2, h3, h4, h5 {
@@ -244,6 +257,7 @@ div#bottom_nav {
 }
 
 div#footer {
+  clear: both;
   font-size: 0.6em;
   color: gray;
   text-align: center;
@@ -269,9 +283,15 @@ div#profiles div#sort {
 
 div#profiles ul li {
   margin-bottom: 8px;
+  padding-left: 24px;
+  margin-left: -24px;
   list-style-type: none;
 }
 
+div#profiles ul li.active {
+  background: url("/images/active.png") no-repeat scroll 10px;
+}
+
 div#profiles ul {
   margin-bottom: 16px;
 }
@@ -282,3 +302,32 @@ div#profiles p.create {
   margin-top: 24px;
   font-size: 85%;
 }
+
+.mask {
+  position: absolute;
+  opacity: 0.7;
+  filter: alpha(opacity=90);
+  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=90);
+  z-index: 999;
+  background: #000;
+}
+
+div#shortcuts {
+  font-family:      Bitstream Vera Sans, Helvetica Neue, sans-serif;
+  z-index:          1000;
+  width:            600px;
+  position:         absolute;
+  top:              100px;
+  left:             50%;
+  margin-left:      -300px;
+  background-color: white;
+  padding:          8px;
+}
+
+div#shortcuts table td, div#shortcuts table th {
+  padding: 4px 8px;
+}
+
+div#shortcuts table th {
+  text-align: left;
+}

data/lib/visage-app/views/layout.haml

@@ -4,20 +4,30 @@
     %title= include_page_title
     %link{:rel => "icon", :type => "image/gif", :href => "/favicon.gif"}
     %link{:rel => 'stylesheet', :href => '/stylesheets/screen.css', :type => 'text/css'}
-    %script{:type => "text/javascript", :src => link_to("/javascripts/raphael.js")}
-    %script{:type => "text/javascript", :src => link_to("/javascripts/g.raphael.js")}
-    %script{:type => "text/javascript", :src => link_to("/javascripts/g.line.js")}
     %script{:type => "text/javascript", :src => link_to("/javascripts/mootools-1.2.3-core.js")}
-    %script{:type => "text/javascript", :src => link_to("/javascripts/mootools-1.2.3.1-more.js")}
+    %script{:type => "text/javascript", :src => link_to("/javascripts/mootools-1.2.5.1-more.js")}
+    %script{:type => "text/javascript", :src => link_to("/javascripts/highcharts.js")}
     %script{:type => "text/javascript", :src => link_to("/javascripts/graph.js")}
+    %script{:type => "text/javascript", :src => link_to("/javascripts/keyboard.js")}
 
   %body
     %div#wrapper
       %div#header
         %div#nav
-          %a{:href => link_to("/profiles")} profiles
-          %a{:href => link_to("/builder")} builder
+          %ul
+            %li
+              %a{:href => link_to("/profiles")} profiles
+            %li
+              %a{:href => link_to("/builder")} builder
 
       %div#content
         = yield
 
+      %div#footer
+        Visage
+        |
+        %a{:href => link_to("/profiles")} Profiles
+        |
+        %a{:href => link_to("/builder")} Builder
+
+

data/lib/visage-app/views/profile.haml

@@ -5,14 +5,10 @@
   %h2#profile_name= profile_name
   - @profile.graphs.each do |graph|
     %div{:id => graph.id, :class => 'graph'}
+      %img{:src => "/images/loader.gif"}
       :javascript
         window.addEvent('domready', function() {
           var graph = new visageGraph('#{graph.id}', '#{graph.host}', '#{graph.plugin}', {
-            width: 900,
-            height: 220,
-            gridWidth: 800,
-            gridHeight: 200,
-            shade: false,
             pluginInstance: '#{graph.instances.join(',')}',
             name: '#{graph.plugin} on #{graph.host}',
             start: '#{@start}',

data/lib/visage-app/views/profiles.haml

@@ -8,9 +8,9 @@
     |
     %a{:href => link_to("/profiles?sort=created")} created
 
-  %ul
-    - @profiles.each do |prof|
-      %li
+  %ul#navigation
+    - @profiles.each_with_index do |prof,index|
+      %li{:class => index == 0 ? 'active shortcut' : 'shortcut'}
         %a{:href => link_to("/profiles/#{prof.url}")}= prof.profile_name
 
   %p.create

metadata

@@ -1,12 +1,13 @@
 --- !ruby/object:Gem::Specification 
 name: visage-app
 version: !ruby/object:Gem::Version 
-  prerelease: false
+  prerelease: true
   segments: 
   - 0
-  - 3
-  - 3
-  version: 0.3.3
+  - 9
+  - 0
+  - pre1
+  version: 0.9.0.pre1
 platform: ruby
 authors: 
 - Lindsay Holmwood
@@ -14,7 +15,7 @@ autorequire:
 bindir: bin
 cert_chain: []
 
-date: 2010-10-18 00:00:00 +11:00
+date: 2010-11-05 00:00:00 +11:00
 default_executable: visage-app
 dependencies: 
 - !ruby/object:Gem::Dependency 
@@ -97,6 +98,7 @@ extra_rdoc_files:
 files: 
 - .gitignore
 - AUTHORS
+- LICENCE
 - README.md
 - Rakefile
 - VERSION
@@ -119,27 +121,24 @@ files:
 - lib/visage-app/collectd/rrds.rb
 - lib/visage-app/config.rb
 - lib/visage-app/config.ru
-- lib/visage-app/config/fallback-colors.yaml
 - lib/visage-app/config/file.rb
-- lib/visage-app/config/plugin-colors.yaml
 - lib/visage-app/graph.rb
 - lib/visage-app/helpers.rb
 - lib/visage-app/patches.rb
 - lib/visage-app/profile.rb
 - lib/visage-app/public/favicon.gif
+- lib/visage-app/public/images/active.png
 - lib/visage-app/public/images/add.png
 - lib/visage-app/public/images/hosts.png
+- lib/visage-app/public/images/loader.gif
 - lib/visage-app/public/images/metrics.png
 - lib/visage-app/public/images/search.png
-- lib/visage-app/public/javascripts/g.line-min.js
-- lib/visage-app/public/javascripts/g.line.js
-- lib/visage-app/public/javascripts/g.raphael-min.js
-- lib/visage-app/public/javascripts/g.raphael.js
 - lib/visage-app/public/javascripts/graph.js
+- lib/visage-app/public/javascripts/highcharts.js
+- lib/visage-app/public/javascripts/highcharts.src.js
+- lib/visage-app/public/javascripts/keyboard.js
 - lib/visage-app/public/javascripts/mootools-1.2.3-core.js
-- lib/visage-app/public/javascripts/mootools-1.2.3.1-more.js
-- lib/visage-app/public/javascripts/raphael-min.js
-- lib/visage-app/public/javascripts/raphael.js
+- lib/visage-app/public/javascripts/mootools-1.2.5.1-more.js
 - lib/visage-app/public/stylesheets/screen.css
 - lib/visage-app/views/builder.haml
 - lib/visage-app/views/layout.haml
@@ -165,11 +164,13 @@ required_ruby_version: !ruby/object:Gem::Requirement
       version: "0"
 required_rubygems_version: !ruby/object:Gem::Requirement 
   requirements: 
-  - - ">="
+  - - ">"
     - !ruby/object:Gem::Version 
       segments: 
-      - 0
-      version: "0"
+      - 1
+      - 3
+      - 1
+      version: 1.3.1
 requirements: []
 
 rubyforge_project: 

data/lib/visage-app/config/fallback-colors.yaml

@@ -1,82 +0,0 @@
---- 
-Aluminium 1: 
-  color: "#eeeeec"
-  fallback_order: 20
-Aluminium 2: 
-  color: "#d3d7cf"
-  fallback_order: 20
-Aluminium 3: 
-  color: "#babdb6"
-  fallback_order: 15
-Aluminium 4: 
-  color: "#888a85"
-  fallback_order: 20
-Aluminium 5: 
-  color: "#555753"
-  fallback_order: 20
-Aluminium 6: 
-  color: "#2e3436"
-  fallback_order: 7
-Butter 1: 
-  color: "#fce94f"
-  fallback_order: 12
-Butter 2: 
-  color: "#edd400"
-  fallback_order: 4
-Butter 3: 
-  color: "#c4a000"
-  fallback_order: 20
-Chameleon 1: 
-  color: "#8ae234"
-  fallback_order: 11
-Chameleon 2: 
-  color: "#73d216"
-  fallback_order: 1
-Chameleon 3: 
-  color: "#4e9a06"
-  fallback_order: 20
-Chocolate 1: 
-  color: "#e9b96e"
-  fallback_order: 14
-Chocolate 2: 
-  color: "#c17d11"
-  fallback_order: 5
-Chocolate 3: 
-  color: "#8f5902"
-  fallback_order: 20
-Orange 1: 
-  color: "#fcaf3e"
-  fallback_order: 13
-Orange 2: 
-  color: "#f57900"
-  fallback_order: 5
-Orange 3: 
-  color: "#ce5c00"
-  fallback_order: 20
-Plum 1: 
-  color: "#ad7fa8"
-  fallback_order: 9
-Plum 2: 
-  color: "#5c3566"
-  fallback_order: 20
-Plum 3: 
-  color: "#5c3566"
-  fallback_order: 1
-Scarlet Red 1: 
-  color: "#ef2929"
-  fallback_order: 8
-Scarlet Red 2: 
-  color: "#cc0000"
-  fallback_order: 0
-Scarlet Red 3: 
-  color: "#a40000"
-  fallback_order: 20
-Sky Blue 1: 
-  color: "#729fcf"
-  fallback_order: 10
-Sky Blue 2: 
-  color: "#3465a4"
-  fallback_order: 2
-Sky Blue 3: 
-  color: "#204a87"
-  fallback_order: 20

data/lib/visage-app/config/plugin-colors.yaml

@@ -1,60 +0,0 @@
----
-memory:
-  memory-used:
-    value: "#cc0000"
-  memory-buffered:
-    value: "#edd400"
-  memory-cached:
-    value: "#3465a4"
-  memory-free:
-    value: "#73d216"
-cpu:
-  cpu-idle:
-    value: "#eeeeec"
-  cpu-wait:
-    value: "#edd400"
-  cpu-user:
-    value: "#3465a4"
-  cpu-system:
-    value: "#cc0000"
-  cpu-nice:
-    value: "#73d216"
-  cpu-softirq:
-    value: "#ad7fa8"
-  cpu-interrupt:
-    value: "#5c3566"
-  cpu-steal:
-    value: "#2e3436"
-swap:
-  swap-used:
-    value: "#cc0000"
-  swap-free:
-    value: "#73d216"
-  swap-cached:
-    value: "#3465a4"
-  swap_io-in:
-    value: "#edd400"
-  swap_io-out:
-    value: "#5c3566"
-load:
-  load:
-    longterm: "#ef2929"
-    shortterm: "#73d216"
-    midterm: "#3465a4"
-df:
-  df:
-    used: "#cc0000"
-    free: "#73d216"
-disk:
-  disk_merged:
-     read: "#8ae234"
-     write: "#ef2929"
-  disk_time:
-     read: "#729fcf"
-     write: "#fcaf3e"
-  disk_ops:
-     read: "#ad7fa8"
-     write: "#fce94f"
-  disk_octets:
-     read: "#c17d11"
-     write: "#888a85"