X-Git-Url: https://vcs.fsf.org/?a=blobdiff_plain;f=ang%2FcrmUi.js;h=20ee8b1a8f10af7da538e118becc24499a43b7ee;hb=4279d7d7f541da61e218985d6152743788901a2c;hp=7482999091b9081a4681a8403c107f59ee9f3056;hpb=6871137ee4dda24f7ae671d73d128e97ce8e0cfa;p=civicrm-core.git

diff --git a/ang/crmUi.js b/ang/crmUi.js
index 7482999091..20ee8b1a8f 100644
--- a/ang/crmUi.js
+++ b/ang/crmUi.js
@@ -106,7 +106,11 @@
         },
         template: function() {
           var args = $location.search();
-          return (args && args.angularDebug) ? '<div crm-ui-accordion=\'{title: ts("Debug (%1)", {1: crmUiDebug}), collapsed: true}\'><pre>{{data|json}}</pre></div>' : '';
+          if (args && args.angularDebug) {
+            var jsonTpl = (CRM.angular.modules.indexOf('jsonFormatter') < 0) ? '<pre>{{data|json}}</pre>' : '<json-formatter json="data" open="1"></json-formatter>';
+            return '<div crm-ui-accordion=\'{title: ts("Debug (%1)", {1: crmUiDebug}), collapsed: true}\'>' + jsonTpl + '</div>';
+          }
+          return '';
         },
         link: function(scope, element, attrs) {
           var args = $location.search();
@@ -484,7 +488,6 @@
     //         $scope.myOrder.setDir('field2', '');
     //   HTML: <tr ng-repeat="... | order:myOrder.get()">...</tr>
     .service('CrmUiOrderCtrl', function(){
-      //
       function CrmUiOrderCtrl(defaults){
         this.values = defaults;
       }
@@ -909,7 +912,7 @@
     })
 
     // Example for Font Awesome: <button crm-icon="fa-check">Save</button>
-    // Example for jQuery UI (deprecated): <button crm-icon="check">Save</button>
+    // Example for jQuery UI (deprecated): <button crm-icon="fa-check">Save</button>
     .directive('crmIcon', function() {
       return {
         restrict: 'EA',
@@ -1080,13 +1083,60 @@
       };
     })
 
+    // Editable text using ngModel & html5 contenteditable
+    // Usage: <span crm-ui-editable ng-model="my.data">{{ my.data }}</span>
+    .directive("crmUiEditable", function() {
+      return {
+        restrict: "A",
+        require: "ngModel",
+        scope: {
+          defaultValue: '='
+        },
+        link: function(scope, element, attrs, ngModel) {
+          var ts = CRM.ts();
+
+          function read() {
+            var htmlVal = element.html();
+            if (!htmlVal) {
+              htmlVal = scope.defaultValue || '';
+              element.text(htmlVal);
+            }
+            ngModel.$setViewValue(htmlVal);
+          }
+
+          ngModel.$render = function() {
+            element.text(ngModel.$viewValue || scope.defaultValue || '');
+          };
+
+          // Special handling for enter and escape keys
+          element.on('keydown', function(e) {
+            // Enter: prevent line break and save
+            if (e.which === 13) {
+              e.preventDefault();
+              element.blur();
+            }
+            // Escape: undo
+            if (e.which === 27) {
+              element.text(ngModel.$viewValue || scope.defaultValue || '');
+              element.blur();
+            }
+          });
+
+          element.on("blur change", function() {
+            scope.$apply(read);
+          });
+
+          element.attr('contenteditable', 'true').addClass('crm-editable-enabled');
+        }
+      };
+    })
+
     .run(function($rootScope, $location) {
       /// Example: <button ng-click="goto('home')">Go home!</button>
       $rootScope.goto = function(path) {
         $location.path(path);
       };
       // useful for debugging: $rootScope.log = console.log || function() {};
-    })
-  ;
+    });
 
 })(angular, CRM.$, CRM._);