mongo_browser 0.2.0.rc2 → 0.2.5

data/app/assets/javascripts/app/controllers/servers/show_controller.js.coffee

@@ -0,0 +1,17 @@
+class ServersShowCtrl
+  @$inject = ["$scope", "$http"]
+  constructor: (@$scope, @$http) ->
+    @loading = true
+    @fetchServerInfo()
+
+    $scope.isLoading = => @loading
+
+  fetchServerInfo: ->
+    @$http.get("/api/server_info").success(@onLoadComplete)
+
+  onLoadComplete: (data) =>
+    @$scope.serverInfo = data
+    @loading = false
+
+angular.module("mb")
+  .controller("servers.show", ServersShowCtrl)

data/app/assets/javascripts/app/directives.js.coffee

@@ -9,6 +9,19 @@ module.directive "onEsc", ->
       return unless event.keyCode is EscapeCode
       $scope.$apply(attrs.onEsc)
 
+module.directive "showButton", ->
+  replace: true
+  restrict: "E"
+  scope:
+    path: "@path",
+    label: "@label"
+  template: """
+            <a class="btn btn-success" href="{{path}}">
+              <i class="icon-th-list"></i>
+              {{label || "Show"}}
+            </a>
+            """
+
 module.directive "deleteButton", ->
   replace: true
   restrict: "E"
@@ -18,3 +31,13 @@ module.directive "deleteButton", ->
               Delete
             </a>
             """
+
+module.directive "refreshButton", ->
+  replace: true
+  restrict: "E"
+  template: """
+            <a class="btn">
+              <i class="icon-refresh"></i>
+              Refresh
+            </a>
+            """

data/app/assets/javascripts/app/filters.js.coffee

@@ -7,7 +7,7 @@ module.filter "humanSize", -> (bytes) ->
 
   "#{scaledSize} #{sizes[n]}"
 
-module.filter "jsonDocument", -> (document) ->
+module.filter "jsonDocument", -> (document = {}) ->
   str = JSON.stringify(document, undefined, 2)
 
   # Replace for the ObjectId
@@ -46,3 +46,16 @@ module.filter "documentsPath", (collectionsPathFilter) ->
     collectionName = collection.name || ":collectionName"
 
     "#{collectionsPathFilter(name: dbName)}/#{collectionName}/documents"
+
+module.filter "documentPath", (documentsPathFilter) ->
+  (document = {}) ->
+    dbName = document.dbName || ":dbName"
+    collectionName = document.collectionName || ":collectionName"
+    id = document.id || ":id"
+
+    "#{documentsPathFilter(dbName: dbName, name: collectionName)}/#{id}"
+
+module.filter "documentPrettyTime", ->
+  (document) ->
+    timestamp = document.id.toString().substring(0, 8)
+    new Date(parseInt(timestamp, 16) * 1000).toGMTString()

data/app/assets/javascripts/app/modules/alerts.js.coffee

@@ -0,0 +1,58 @@
+alerts = angular.module("mb.alerts", [])
+
+class Alerts
+  @$inject = ["$log", "$timeout", "alertTimeout"]
+  constructor: (@$log, @$timeout, @alertTimeout) ->
+    @lastId = 0
+    @messages = []
+
+  # Returns a next id for the new message
+  nextId: ->
+    @lastId += 1
+
+  push: (type, text) ->
+    id = @nextId()
+    @$log.info("Alert [#{id}, #{type}]", text)
+
+    @messages.push(id: id, type: type, text: text)
+    @delayedDispose(id)
+
+    id
+
+  # Helper methods for various alerts types
+  info: (text) -> @push("info", text)
+  error: (text) -> @push("error", text)
+
+  # Disposes a message with the given id
+  dispose: (id) ->
+    at = @messages.map((message) -> message.id).indexOf(id)
+    @messages.splice(at, 1)
+
+  # Dispose the message after the given time in milliseconds
+  delayedDispose: (id) ->
+    if @alertTimeout? and @alertTimeout > 0
+      disposeTheAlert = =>
+        @$log.info("Disposing alert", id, "after", @alertTimeout, "milliseconds")
+        @dispose(id)
+      @$timeout(disposeTheAlert, @alertTimeout)
+
+alerts.service "alerts", Alerts
+
+class AlertsCtrl
+  @$inject = ["$scope", "alerts"]
+  constructor: (@$scope, @alerts) ->
+    @$scope.alertMessages = @alerts.messages
+
+    @$scope.disposeAlert = (id) =>
+      @alerts.dispose(id)
+
+alerts.controller "alerts", AlertsCtrl
+
+alerts.directive "alerts", ->
+  restrict: "E"
+  transclude: true
+
+  templateUrl: "/ng/templates/alerts.html"
+  replace: true
+
+  controller: "alerts"

data/app/assets/javascripts/app/modules/pager.js.coffee

@@ -46,7 +46,7 @@ pager.factory "pager", ->
       left.concat(middle).concat(right)
 
 # TODO block button when the resource is loading
-class PagerController
+class PagerCtrl
   constructor: (@$scope, @pager) ->
     @$scope.$watch "page", => @paginate()
     @$scope.$watch "totalPages", => @paginate()
@@ -73,7 +73,7 @@ class PagerController
     prepare = @pager(page: @$scope.page, totalPages: @$scope.totalPages)
     @$scope.windowedPageNumbers = prepare.windowedPageNumbers()
 
-pager.controller "pager", PagerController
+pager.controller "pager", PagerCtrl
 
 pager.directive "pager", ->
   templateUrl: "/ng/templates/pager.html"

data/app/assets/javascripts/app/modules/spinner.js.coffee

@@ -0,0 +1,29 @@
+spinner = angular.module("mb.spinner", [])
+
+spinner.factory "httpRequestTracker", [
+  "$http", ($http) ->
+    hasPendingRequests: ->
+      $http.pendingRequests.length > 0
+]
+
+class SpinnerCtrl
+  @$inject = ["$scope", "httpRequestTracker"]
+  constructor: (@$scope, @httpRequestTracker) ->
+    @$scope.showSpinner = @showSpinner
+
+  showSpinner: =>
+    @httpRequestTracker.hasPendingRequests()
+
+spinner.controller "spinner", SpinnerCtrl
+
+spinner.directive "spinner", ->
+  replace: true
+  restrict: "E"
+  template: """
+            <li class="spinner">
+              <a href="#">
+                <img ng-show="showSpinner()" src="/assets/ajax-loader.gif" />
+              </a>
+            </li>
+            """
+  controller: "spinner"

data/app/assets/javascripts/app/modules/table_filter.js.coffee

@@ -1,6 +1,6 @@
 taleFilter = angular.module("mb.tableFilter", [])
 
-class TableFilterController
+class TableFilterCtrl
   constructor: ($scope) ->
     # Clears the filter value
     $scope.clear = -> $scope.value = ""
@@ -8,17 +8,17 @@ class TableFilterController
     # Reruns true when the filter is empty
     $scope.isEmpty = -> !$scope.value
 
-TableFilterController.$inject = ["$scope"]
+TableFilterCtrl.$inject = ["$scope"]
 
-taleFilter.controller "tableFilter", TableFilterController
+taleFilter.controller "tableFilter", TableFilterCtrl
 
 # Filter for databases and collections
 taleFilter.directive "tableFilter", ->
   restrict: "E"
   transclude: true
+  replace: true
 
   templateUrl: "/ng/templates/table_filter.html"
-  replace: true
 
   scope:
     placeholder: "@placeholder"

data/app/assets/javascripts/app/resources.js.coffee

@@ -1,22 +1,28 @@
 angular.module "mb.resources", ["ngResource", "mb.filters"], ($provide) ->
 
   $provide.factory "Database", [
-    "$resource", (resource) ->
+    "$resource", ($resource) ->
 
-      resource "/api/databases.json", {},
-        query: method: "GET", isArray: true
+      paramDefaults = dbName: "@name"
+      $resource "/api/databases/:dbName/:action", paramDefaults,
+        query: { method: "GET", isArray: true },
+        stats: { method: "GET", params: { action: "stats" } }
   ]
 
   $provide.factory "Collection", [
-    "$resource", "$filter", (resource, $filter) ->
+    "$resource", "$filter", ($resource, $filter) ->
 
-      resource "/api#{$filter("collectionsPath")()}.json", {},
-        query: method: "GET", isArray: true
+      paramDefaults = dbName: "@dbName", collectionName: "@name"
+      $resource "/api#{$filter("collectionsPath")()}/:collectionName/:action",
+        paramDefaults,
+          query: { method: "GET", isArray: true },
+          stats: { method: "GET", params: { action: "stats" } }
   ]
 
   $provide.factory "Document", [
-    "$resource", "$filter", (resource, $filter) ->
+    "$resource", "$filter", ($resource, $filter) ->
 
-      resource "/api#{$filter("documentsPath")()}.json", {},
+      paramDefaults = dbName: "@dbName", collectionName: "@collectionName", id: "@id"
+      $resource "/api#{$filter("documentsPath")()}/:id", paramDefaults,
         query: method: "GET", isArray: false
   ]

data/app/assets/javascripts/app/services.js.coffee

@@ -1,36 +1,14 @@
-angular.module "mb.services", [], ($provide) ->
+module = angular.module("mb.services", [])
 
-  $provide.factory "alerts", [
-    "$log", "$timeout", ($log, $timeout) ->
-      lastId: 0
-      messages: []
+module.factory "httpErrorsInterceptor", [
+  "$injector", "$q", "alerts", ($injector, $q, alerts) ->
+    (promise) ->
+      $http = $injector.get("$http")
 
-      # Returns a next id for the new message
-      nextId: ->
-        @lastId += 1
+      onError = (response) ->
+        errorMessage = response.data?.error || "Unexpected HTTP error"
+        alerts.error(errorMessage)
+        $q.reject(response)
 
-      push: (type, text) ->
-        id = @nextId()
-        $log.info("Alert [#{id}, #{type}]", text)
-
-        @messages.push(id: id, type: type, text: text)
-        @delayedDispose(id)
-
-        id
-
-      # Helper methods for various alerts types
-      info: (text) -> @push("info", text)
-      error: (text) -> @push("error", text)
-
-      # Disposes a message with the given id
-      dispose: (id) ->
-        at = @messages.map((message) -> message.id).indexOf(id)
-        @messages.splice(at, 1)
-
-      # Dispose the message after the given time in milliseconds
-      delayedDispose: (id, timeout = 3000) ->
-        disposeTheAlert = =>
-          $log.info("Disposing alert", id, "after", timeout, "milliseconds")
-          @dispose(id)
-        $timeout(disposeTheAlert, timeout)
-  ]
+      promise.then(null, onError)
+]

data/app/assets/javascripts/application.js.coffee

@@ -1,36 +1,64 @@
-#= require app
+#= require_tree ./app/modules
+#= require app/resources
+#= require app/directives
+#= require app/filters
+#= require app/services
+
+#= require_self
+
+#= require_tree ./app/controllers
 
 # App Module
-requires = [
-  "bootstrap", "ngSanitize",
-  "mb.controllers", "mb.directives", "mb.filters",
-  "mb.dialogs", "mb.pager", "mb.tableFilter"]
-
-angular.module("mb", requires)
-  .config [
-    "$routeProvider", "$locationProvider", (route, location) ->
-      route
-        # Main page, list of all available databases
-        .when "/",
-            templateUrl: "/ng/templates/databases.html",
-            controller: "databases"
-
-        # List of collections for the given database
-        .when "/databases/:dbName/collections",
-            templateUrl: "/ng/templates/collections.html",
-            controller: "collections"
-
-        # list of documents for the given collection
-        .when "/databases/:dbName/collections/:collectionName/documents",
-            templateUrl: "/ng/templates/documents.html",
-            controller: "documents"
-
-        # Information about the server
-        .when "/server_info",
-            templateUrl: "/ng/templates/server_info.html",
-            controller: "serverInfo"
-
-        .otherwise(redirectTo: "/")
-
-      location.html5Mode(true)
-  ]
+mb = angular.module "mb", [
+  "ngSanitize",
+  "mb.resources", "mb.directives", "mb.filters", "mb.services",
+  "mb.dialogs", "mb.pager", "mb.tableFilter", "mb.alerts", "mb.spinner"
+]
+
+mb.config [
+  "$provide", "$httpProvider", "$routeProvider", "$locationProvider",
+  ($provide, $httpProvider, $routeProvider, $locationProvider) ->
+    $provide.value("alertTimeout", 3000)
+
+    $httpProvider.responseInterceptors.push("httpErrorsInterceptor")
+
+    $routeProvider
+      # Main page, list of all available databases
+      .when "/",
+          templateUrl: "/ng/templates/databases/index.html",
+          controller: "databases.index"
+
+      # Database stats
+      .when "/databases/:dbName/stats",
+        templateUrl: "/ng/templates/databases/stats.html",
+        controller: "databases.stats"
+
+      # List of collections for the given database
+      .when "/databases/:dbName/collections",
+          templateUrl: "/ng/templates/collections/index.html",
+          controller: "collections.index"
+
+      # Collection stats
+      .when "/databases/:dbName/collections/:collectionName/stats",
+        templateUrl: "/ng/templates/collections/stats.html",
+        controller: "collections.stats",
+
+      # List of documents for the given collection
+      .when "/databases/:dbName/collections/:collectionName/documents",
+          templateUrl: "/ng/templates/documents/index.html",
+          controller: "documents.index",
+          reloadOnSearch: false
+
+      .when "/databases/:dbName/collections/:collectionName/documents/:id",
+        templateUrl: "/ng/templates/documents/show.html",
+        controller: "documents.show",
+
+      # Information about the server
+      .when "/server_info",
+          templateUrl: "/ng/templates/server/show.html",
+          controller: "servers.show"
+
+      .otherwise(redirectTo: "/")
+
+    $locationProvider.html5Mode(true)
+]

data/app/assets/javascripts/application.test.js.coffee

@@ -0,0 +1,5 @@
+angular.module("mb")
+  .config [
+    "$provide", ($provide) ->
+      $provide.value("alertTimeout", null)
+  ]

data/app/assets/javascripts/compiled_templates.js.coffee

@@ -0,0 +1 @@
+#= require_tree compiled_templates

data/app/assets/javascripts/vendor.js.coffee

@@ -3,6 +3,5 @@
 #= require bootstrap
 #= require bootbox
 #= require angular/angular
-#= require angular/angular-bootstrap
 #= require angular/angular-resource
 #= require angular/angular-sanitize

data/app/assets/stylesheets/application.css.scss

@@ -1,7 +1,5 @@
-/*
- *= require bootstrap
- *= require_self
- */
+//= require bootstrap
+//= require_self
 
 body {
   position: relative;
@@ -47,24 +45,40 @@ section.container {
 
 table.table {
   tr {
-    &.document td.data pre {
-      background: none;
-      border: 0px;
-      padding: 0px;
-      display: inline;
+    height: 47px;
 
-      // syntax higlight for json document
-      span {
-        &.string { color: green; }
-        &.number { color: darkorange; }
-        &.boolean { color: blue; }
-        &.null { color: magenta; }
-        &.key { color: red; }
+    td {
+      vertical-align: middle;
+      &:last-child {
+        width: 175px;
       }
     }
 
-    th.actions {
-      width: 90px;
+    &.document td.data {
+      .id {
+        font-size: large;
+        font-weight: bold;
+
+        a {
+          color: black;
+        }
+      }
+
+      pre {
+        background: none;
+        border: 0px;
+        padding: 0px;
+        display: inline;
+
+        // syntax higlight for json document
+        span {
+          &.string { color: green; }
+          &.number { color: darkorange; }
+          &.boolean { color: blue; }
+          &.null { color: magenta; }
+          &.key { color: red; }
+        }
+      }
     }
   }
 }
@@ -77,3 +91,7 @@ ul.nav.breadcrumbs {
     background-color: transparent;
   }
 }
+
+li.spinner {
+  width: 45px;
+}