nutcracker-web 0.0.1

data/assets/javascripts/views/cluster.js.coffee

@@ -0,0 +1,58 @@
+class Nutcracker.Views.Cluster extends Backbone.View
+  template: JST['cluster']
+
+  render: ->
+    @curIndex = @collection.indexOf(@model)
+    @nextCluster = @collection.at @curIndex+1
+    @prevCluster = @collection.at @curIndex-1
+
+    @$el.html @template {@model, @nextCluster, @prevCluster}
+
+    options = {
+      is3D: true
+      titleTextStyle:
+        fontSize: 17.5
+        color: '#333333'
+      width:  300
+      height: 300
+      sliceVisibilityThreshold: 0
+      chartArea:
+        width: '100%'
+        height: '80%'
+      legend:
+        position: 'bottom'
+    }
+
+    data = [['Node','Node']]
+    @model.get("nodes").map (node)->
+      data.push [node.get("hostname"),node.get("info").max_memory]
+
+    chart = new Backbone.GoogleChart({
+      formatter:
+        callback: humanize.filesize
+        columns: [1]
+      chartType: 'PieChart'
+      options: options
+      dataTable: data
+    })
+
+    chart.on "select", (chart) =>
+      Nutcracker.router.navigate @model.get("nodes").at(
+        chart.getSelection()[0].row
+      ).get('routeURL'), trigger: true
+
+    @$el.find("#chart2").html chart.render().el
+    @$el.find("#chart1").html new Backbone.GoogleChart({
+      formatter:
+        callback: humanize.filesize
+        columns: [1]
+      chartType: 'PieChart'
+      options: options
+      dataTable: [
+        ['Memory', 'Memory']
+        ['Free', @model.get("nodes").freeMemory() ]
+        ['Used', @model.get('nodes').usedMemory() ]
+      ]
+    }).render().el
+    
+    this

data/assets/javascripts/views/config.js.coffee

@@ -0,0 +1,6 @@
+class Nutcracker.Views.Config extends Backbone.View
+  template: JST["config"]
+
+  render: ->
+    @$el.html @template {@model}
+    this

data/assets/javascripts/views/footer.js.coffee

@@ -0,0 +1,8 @@
+class Nutcracker.Views.Footer extends Backbone.View
+  className: "container navbar navbar-fixed-bottom navbar-inverse"
+  template: JST['footer']
+  
+  render: ->
+    @$el.html @template({@model})
+    this
+

data/assets/javascripts/views/navbar.js.coffee

@@ -0,0 +1,28 @@
+class Nutcracker.Views.Navbar extends Backbone.View
+  className: "navbar navbar-inverse navbar-fixed-top"
+  template: JST['navbar']
+  
+  initialize: =>
+    Backbone.history.bind "all", @routeChange
+
+  render: ->
+    $(@el).html @template {@model}
+    this
+
+  resetButtons: ->
+    @$el.find("li").removeClass 'active'
+
+  activate: ( id )=>
+    @$(id).addClass 'active'
+
+  routeChange: (route, object, action, args) =>
+    @resetButtons()
+    if /showOverview/g.test action
+      @activate '#overview'
+    if /showConfig/.test action
+      @activate '#config'
+    else if /showCluster/ig.test action
+      @activate '#clusters'
+    else if /showNode/gi.test action
+      @activate '#nodes'
+    

data/assets/javascripts/views/node.js.coffee

@@ -0,0 +1,54 @@
+class Nutcracker.Views.Node extends Backbone.View
+  template: JST['node']
+
+  render: ->
+    @curIndex = @collection.indexOf(@model)
+    @nextNode = @collection.at @curIndex+1
+    @prevNode = @collection.at @curIndex-1
+
+    options = {
+      is3D: true
+      titleTextStyle:
+        fontSize: 17.5
+        color: '#333333'
+      titleTextStyle:
+        fontSize: 17.5
+        color: '#333333'
+      width: 300,
+      height: 300,
+      sliceVisibilityThreshold: 0
+      chartArea:
+        width: '100%'
+        height: '80%'
+      legend:
+        position: 'bottom'
+    }
+    
+    @$el.html @template {@model,@nextNode,@prevNode}
+    @$el.find("#chart1").append new Backbone.GoogleChart({
+      chartType: 'PieChart'
+      formatter:
+        callback: humanize.filesize
+        columns: [1]
+      options: _(title: 'Memory').extend options
+      dataTable: [
+          ['Memory', 'Memory'],
+          ['Free', @model.get('freeMemory')],
+          ['Used', @model.get('usedMemory')]
+      ],
+    }).render().el
+
+    @$el.find("#chart2").append new Backbone.GoogleChart({
+      formatter:
+        callback: humanize.numberFormat
+        columns: [1]
+      chartType: 'PieChart'
+      options: _(title: 'Hits').extend options
+      dataTable: [
+        ['Memory', 'Memory'],
+        ['Hits', @model.get("info").hits],
+        ['Misses', @model.get("info").misses]
+      ],
+    }).render().el
+
+    this

data/assets/javascripts/views/overview.js.coffee

@@ -0,0 +1,6 @@
+class Nutcracker.Views.Overview extends Backbone.View
+  template: JST['overview']
+
+  render: ->
+    @$el.html @template({@model})
+    this

data/assets/stylesheets/application.css

@@ -0,0 +1,24 @@
+/*
+ *= require_self
+ *= require_tree .
+ */
+body { padding-top: 60px; }
+
+a.nextPrevButton,a.nextPrevButton:hover  {
+  color: #333333;
+}
+
+.nosel {
+  user-select: none;
+  -webkit-user-select: none;
+}
+.chartsBox {
+  border-left:2px solid #dddddd;
+  border-right:2px solid #dddddd;
+  border-top:2px solid #dddddd;
+  border-bottom:2px solid #dddddd;
+  padding-top: 0px;
+  -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
+  -moz-box-sizing: border-box;    /* Firefox, other Gecko */
+  box-sizing: border-box;         /* Opera/IE 8+ */
+}