i should stop working on that.

client/coffee/controllers/keyStatCtrl.coffee

@@ -26,6 +26,7 @@ root.controllers.controller('keyStatCtrl', ['$scope', '$routeParams', 'util', ($
     base_url  = "/api/#{ $routeParams.server }/#{ $routeParams.database }/#{ $routeParams.collection }"
     stat_url = "#{ base_url }/stats/#{$routeParams.key}"
 
+    $scope.alert=alert
     
     $scope.chartConfig =
         options:
@@ -58,7 +59,7 @@ root.controllers.controller('keyStatCtrl', ['$scope', '$routeParams', 'util', ($
         return util.get(histogram_url)
     ).then((res) ->
         $scope.chartConfig.series[0].data = res.data.values
-        $scope.chartConfig.xAxis.categories = getAxisLabel(res.data.min, res.data.step_size, res.values.length)
+        $scope.chartConfig.xAxis.categories = getAxisLabel(res.data.min, res.data.step_size, res.data.values.length)
     )
     
 ])

client/coffee/directives/searchBar.coffee

@@ -0,0 +1,101 @@
+
+mongoJsToMongoJSON = (queryString) ->
+    ObjectId = (id) ->
+        return {"$oid": id}
+    
+    DBRef = (name, id) ->
+        return {"$ref": name, "$id": id}
+    
+    Timestamp = (t, i) ->
+        return {"t": t, "i": i}
+    NumberLong = (number) ->
+        return { "$numberLong": String(number)}
+    MaxKey = { "$maxKey": 1 }
+    MinKey = { "$minKey": 1 }
+    
+    query = ""
+    eval("query = " + queryString)
+    fixQuery = (query) ->
+        if _.isArray(query)
+            for v, i in query
+                query[i] = fixQuery(v)
+            return query
+        if _.isRegExp(query)
+            options = ""
+            for k, option of {multiline: "m", global: "g", ignoreCase: "i"}
+                if query[k]
+                    options += option
+            return { "$regex": query.source, "$options": options }
+        if _.isDate(query)
+            return { "$date": query.getTime()}
+        if query == undefined
+            return { "$undefined": true }
+        if _.isObject(query)
+            for k, v of query
+                query[k] = fixQuery(v)
+            return query
+        return query
+    
+    return fixQuery(query)
+
+testmongoJsToMongoJSON = () ->
+    assertEqual = (a, b) ->
+        if not _.isEqual(a, b)
+            console.log("error! ", a, " != ", b)
+    s = """{a: 89}"""
+    assertEqual(mongoJsToMongoJSON(s), {a : 89})
+    s = """{a: [1,3,{reg: /allo/gim}]}"""
+    assertEqual(mongoJsToMongoJSON(s), {a: [1,3, {reg: { "$regex":"allo", "$options": "mgi" }}]})
+    s = """{a: [
+                1,
+                3,
+                {reg:
+                    [/allo/gim,
+                     new Date("2014-05-08T21:52:24.320Z")
+                     ]
+                }
+                ]
+            }"""
+    assertEqual(mongoJsToMongoJSON(s), {a: [1,3, {reg: [{ "$regex":"allo", "$options": "mgi" }, {"$date": 1399585944320}]}]})
+    
+
+testmongoJsToMongoJSON()
+
+directive = () ->
+    directive = 
+        templateUrl: "/partials/directives/searchBar.html"
+        replace: true,
+        transclude: false,
+        restrict: 'E',
+        scope:
+            query: "="
+            callback: "="
+        controller:["$scope", "$routeParams", ($scope, $routeParams) ->
+                $scope.bigInput = false
+                $scope.codeMirrorOptions =
+                    lineWrapping : true
+                    lineNumbers: true
+                    mode: 'text/typescript'
+                
+                $scope.parseQueryToJSON = (query) ->
+                    try
+                        query = mongoJsToMongoJSON(query)
+                        ret = JSON.stringify(query)
+                        $scope.error = ""
+                        return ret
+                    catch error
+                        $scope.error
+                        return ""
+                
+                $scope.isValidEntry = ()->
+                    query = $scope.parseQueryToJSON($scope.newQuery)
+                    return query != ""
+                
+                $scope.callCallback = () ->
+                    query = $scope.parseQueryToJSON($scope.newQuery)
+                    if query != ""
+                        $scope.$eval($scope.callback, query)
+            ]
+    return directive
+                        
+directives.directive( "vulSearchBar", [directive])

client/index.html

@@ -75,6 +75,7 @@
     
     <script src="js/directives/key.js"></script>
     <script src="js/directives/value.js"></script>
+    <script src="js/directives/searchBar.js"></script>
     
     
     <script src="js/controllers/aboutCtrl.js"></script>

client/partials/directives/searchBar.html

@@ -0,0 +1,31 @@
+<div>
+    <div class="row">
+        <div class="large-9 columns">
+            <input type="text" ng-model="newQuery" style="font-family: monospace;font-size: 1.2em;">
+        </div>
+        <div class="large-3 columns right">
+            <ul class="button-group">
+                <li>
+                    <a class="button tiny" ng-click="callCallback()" ng-class="{disabled: !isValidEntry() }">
+                        Query <i class="fa fa-thumbs-o-down" style="color:red;" ng-show="getQueryPath()=='' && newQuery != ''"></i>
+                    </a>
+                </li>
+                <li>
+                    <a class="button tiny" ng-click="newQuery=''" ng-class="{disabled: newQuery=='' }">Clear</a>
+                </li>
+                <li>
+                    <a class="button tiny" ng-click="bigInput = !bigInput" >
+                        <i class="fa fa-pencil-square-o" ng-show="!bigInput"></i>
+                        <i class="fa fa-minus-square-o" ng-show="bigInput"></i>
+                    </a>
+                </li>
+            </ul>
+        </div>
+    </div>
+    
+    <div class="row" ng-show="bigInput">
+        <div class="large-12 columns">
+            <ui-codemirror ng-model="newQuery" ui-codemirror="codeMirrorOptions"  ></ui-codemirror>
+        </div>
+    </div>
+</div>

client/partials/keyStat.html

@@ -1,4 +1,6 @@
 
+<vul-search-bar query="queryObject" callback="alert"></vul-search-bar>
+
 <div class="row">
     <div class="columns large-12">
         <ul class="pricing-table">