Use bootstrap visual labels for tokenizer tokens

polyfractal · Mar 3, 2013 · c1d6538 · c1d6538
1 parent a9dbed5
commit c1d6538
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 7 deletions.
diff --git a/_site/js/controllers/TokenizerCtrl.js b/_site/js/controllers/TokenizerCtrl.js
@@ -4,8 +4,6 @@ function TokenizerCtrl($scope, $http, Tokenizer, Data){
     $scope.tokenizer = Tokenizer;
     $scope.data = Data;
 
-    $scope.ttext = [];
-
     $scope.$watch('tokenizer.query', function(value){
         for (i in $scope.tokenizer.tokenizers){
             $scope.analyze($scope.tokenizer.tokenizers[i]);
@@ -17,11 +15,16 @@ function TokenizerCtrl($scope, $http, Tokenizer, Data){
 
         $http.post(path, $scope.tokenizer.query)
             .success(function(response){
-                var ret = '';
+                var tokens = [];
                 for(i in response.tokens){
-                    ret += '[' + response.tokens[i].token + '] ';
+                    var token = response.tokens[i].token;
+
+                    //bootstrap labels do silly things with only a single space
+                    if (token === ' ') {token = "&nbsp;";}
+
+                    tokens.push(token);
                 }
-                $scope.tokenizer.ttext[tokenizer] = ret;
+                $scope.tokenizer.ttext[tokenizer] = tokens;
 
             })
             .error(function(data, status, headers, config){

diff --git a/_site/views/tokenizers.html b/_site/views/tokenizers.html
@@ -18,9 +18,11 @@
                 </tr>
                 </thead>
                 <tbody >
-                <tr  ng-repeat="t in tokenizer.tokenizers">
+                <tr ng-repeat="t in tokenizer.tokenizers">
                     <td>{{t}}</td>
-                    <td>{{$parent.tokenizer.ttext[t]}}</td>
+                    <td>
+                        <span class="label" style="margin-right: 0.25em" ng-repeat="token in tokenizer.ttext[t]" ng-bind-html="token"> </span>
+                    </td>
                 </tr>
                 </tbody>
             </table>