nitweb/angular: show code in definition cards

Signed-off-by: Alexandre Terrasa <alexandre@moz-code.org>

diff --git a/share/nitweb/directives/entity/defcard.html b/share/nitweb/directives/entity/defcard.html
index 2c0b9c8..5a024fe 100644 (file)
--- a/share/nitweb/directives/entity/defcard.html
+++ b/share/nitweb/directives/entity/defcard.html
@@ -20,7 +20,18 @@
                        <span ng-if='!definition.mclassdef'>
                                in <entity-link mentity='definition.mmodule' />
                        </span>
+                       <div class='btn-bar'>
+                               <button class='btn btn-link' aria-expanded='false'
+                                       data-target='#{{codeId}}' ng-click='loadCardCode()'
+                                       aria-controls='{{codeId}}'>
+                                       <span class='glyphicon glyphicon-console'
+                                       title='Show code' />
+                               </button>
+                       </div>
                </h5>
+               <div id='{{codeId}}' class='collapse'>
+                       <pre ng-bind-html='code' />
+               </div>
                <entity-location mentity='definition' />
        </div>
 </div>

diff --git a/share/nitweb/javascripts/entities.js b/share/nitweb/javascripts/entities.js
index 4428c89..e5b6407 100644 (file)
--- a/share/nitweb/javascripts/entities.js
+++ b/share/nitweb/javascripts/entities.js
@@ -155,23 +155,29 @@
                                        definition: '=',
                                        focus: '='
                                },
+                               templateUrl: '/directives/entity/defcard.html',
                                link: function ($scope, element, attrs) {
-                                       $scope.$watch("definition", function() {
-                                               /*.loadEntityDefs($scope.definition.full_name,
-                                                       function(data) {
-                                                               $scope.mentity = data;
-                                                       }, function(err) {
-                                                               $scope.error = err;
-                                                       });
-                                               Model.loadEntityCode($scope.definition.full_name,
-                                                       function(data) {
-                                                               $scope.code = data;
-                                                       }, function(err) {
-                                                               $scope.error = err;
-                                                       });*/
-                                       });
-                               },
-                               templateUrl: '/directives/entity/defcard.html'
+                                       $scope.codeId = 'code_' + $scope.definition.full_name.replace(/[^a-zA-Z0-9]/g, '_');
+                                       $scope.loadCardCode = function() {
+                                               if(!$scope.code) {
+                                                       Model.loadEntityCode($scope.definition.full_name,
+                                                               function(data) {
+                                                                       $scope.code = data;
+                                                                       setTimeout(function() { // smooth collapse
+                                                                               $('#' + $scope.codeId).collapse('show')
+                                                                       }, 1);
+                                                               }, function(err) {
+                                                                       $scope.code = err;
+                                                               });
+                                               } else {
+                                                       if($('#' + $scope.codeId).hasClass('in')) {
+                                                               $('#' + $scope.codeId).collapse('hide');
+                                                       } else {
+                                                               $('#' + $scope.codeId).collapse('show');
+                                                       }
+                                               }
+                                       };
+                               }
                        };
                }])
 })();

diff --git a/share/nitweb/stylesheets/nitweb.css b/share/nitweb/stylesheets/nitweb.css
index eb82ee6..941b5a4 100644 (file)
--- a/share/nitweb/stylesheets/nitweb.css
+++ b/share/nitweb/stylesheets/nitweb.css
@@ -77,6 +77,9 @@ a {
 
 /* ui */
 
+.btn-bar { margin-top: -5px; float: right }
+.btn-bar .btn { padding: 5px 10px; }
+
 entity-list .btn-filter {
        visibility: hidden;
 }