cronapp-framework-mobile-js 2.8.8 → 2.9.0

package/js/directives.js

@@ -615,87 +615,85 @@ window.addEventListener('message', function(event) {
               }
           }
       }
-  })
-
-  .directive('crnAllowNullValues', [function () {
-    return {
-      restrict: 'A',
-      require: '?ngModel',
-      link: function (scope, el, attrs, ctrl) {
-        ctrl.$formatters = [];
-        ctrl.$parsers = [];
-        let falseValue = attrs.ngFalseValue ? attrs.ngFalseValue.split("'").join("") : "false";
-        let trueValue = attrs.ngTrueValue ? attrs.ngTrueValue.split("'").join("") : "true";
-
-        if (attrs.crnAllowNullValues == 'true') {
-          ctrl.$render = function () {
-            let viewValue = ctrl.$viewValue;
-            el.data('checked', viewValue);
-            switch (viewValue) {
-              case true:
-              case trueValue:
-                el.removeAttr('indeterminate');
-                el.prop('checked', true);
-                break;
-              case false:
-              case falseValue:
-                el.removeAttr('indeterminate');
-                el.prop('checked', false);
-                break;
-              default:
-                el.attr('indeterminate', true);
-            }
-          };
-          el.bind('click', function () {
-            let checked;
-            switch (el.data('checked')) {
-              case false:
-              case falseValue:
-                checked = attrs.ngTrueValue ? trueValue : true;
-                break;
-              default:
-                checked = attrs.ngFalseValue ? falseValue : false;
-            }
-            ctrl.$setViewValue(checked);
-            scope.$apply(ctrl.$render);
-          });
-        } else if (attrs.crnAllowNullValues == 'false'){
-          ctrl.$render = function () {
-            let viewValue = ctrl.$viewValue;
-            if(viewValue === undefined || viewValue === null){
-              ctrl.$setViewValue(false);
-              viewValue = false;
-            }
-            el.data('checked', viewValue);
-            switch (viewValue) {
-              case true:
-              case trueValue:
-                el.removeAttr('indeterminate');
-                el.prop('checked', true);
-                break;
-              default:
-                el.removeAttr('indeterminate');
-                el.prop('checked', false);
-                break;
-            }
-          };
-          el.bind('click', function () {
-            let checked;
-            switch (el.data('checked')) {
-              case false:
-              case falseValue:
-                checked = attrs.ngTrueValue ? trueValue : true;
-                break;
-              default:
-                checked = attrs.ngFalseValue ? falseValue : false;
-            }
-            ctrl.$setViewValue(checked);
-            scope.$apply(ctrl.$render);
-          });
-        }
-      }
-    };
-  }])
+          })
+
+          .directive('crnAllowNullValues', [function () {
+              return {
+                restrict: 'A',
+                require: '?ngModel',
+                link: function (scope, el, attrs, ctrl) {
+                  ctrl.$formatters = [];
+                  ctrl.$parsers = [];
+                  let falseValue = attrs.ngFalseValue ? attrs.ngFalseValue.split("'").join("") : false;
+                  let trueValue = attrs.ngTrueValue ? attrs.ngTrueValue.split("'").join("") : true;
+
+                  if (attrs.crnAllowNullValues == 'false') {
+                    ctrl.$render = function () {
+                      let viewValue = ctrl.$viewValue;
+                      if (ctrl.$viewValue === undefined || ctrl.$viewValue === null) {
+                        ctrl.$setViewValue(false);
+                        viewValue = false;
+                      }
+                      if (viewValue === falseValue) {
+                        let modelForEval = `${el.attr('ng-model')}=${attrs.ngFalseValue}`;
+                        scope.$eval(modelForEval);
+                      }
+                      el.data('checked', viewValue);
+                      switch (viewValue) {
+                        case true:
+                        case trueValue:
+                          el.removeAttr('indeterminate');
+                          el.prop('checked', true);
+                          viewValue = trueValue;
+                          break;
+                        default:
+                          el.removeAttr('indeterminate');
+                          el.prop('checked', false);
+                          viewValue = falseValue;
+                          break;
+                      }
+                      setTimeout(() => ctrl.$setViewValue(viewValue));
+                    };
+                  } else { // true é o padrão
+                    ctrl.$render = function () {
+                      let viewValue = ctrl.$viewValue;
+                      el.data('checked', viewValue);
+                      switch (viewValue) {
+                        case true:
+                        case trueValue:
+                          el.removeAttr('indeterminate');
+                          el.prop('checked', true);
+                          viewValue = trueValue;
+                          break;
+                        case false:
+                        case falseValue:
+                          el.removeAttr('indeterminate');
+                          el.prop('checked', false);
+                          viewValue = falseValue;
+                          break;
+                        default:
+                          viewValue = null;
+                          el.attr('indeterminate', true);
+                      }
+                      setTimeout(() => ctrl.$setViewValue(viewValue));
+                    };
+                  }
+                  el.bind('click', function () {
+                    let checked;
+                    switch (el.data('checked')) {
+                      case false:
+                      case falseValue:
+                        checked = attrs.ngTrueValue ? trueValue : true;
+                        break;
+                      default:
+                        checked = attrs.ngFalseValue ? falseValue : false;
+                    }
+                    ctrl.$setViewValue(checked);
+                    scope.$apply(ctrl.$render);
+                  });
+                }
+              };
+            }])
 
       .directive('cronappFilter', function($compile) {
     var setFilterInButton = function($element, bindedFilter, operator) {
@@ -1042,23 +1040,23 @@ window.addEventListener('message', function(event) {
     'use strict';
 
     const defaultAdvancedTemplate =
-    "<ion-list type=\"\" can-swipe=\"listCanSwipe\">\n" +
-    "   <ion-item ng-class=\"{'cron-list-selected' : isChecked(rowData)}\" class=\"item {{options.editableButtonClass}} {{options.iconClassPosition}} {{options.imageClassPosition}}\" ng-repeat=\"rowData in datasource\">\n" +
-    "     <ul ng-if=\"options.allowMultiselect\" class=\"checkbox-group component-holder {{'cron-list-multiselect-' + options.imageType}}\" data-component=\"crn-checkbox\"><label class=\"checkbox\"><input ng-checked=\"isChecked(rowData);\" type=\"checkbox\"></label></ul>\n" +
-    "	    <img alt='Thumbnail' ng-if=\"options.imageType !== 'do-not-show' && rowData[options.fields.image]\" \n" +
-    "          ng-src=\"{{options.isImageFromDropbox ? '' : 'data:image/png;base64,'}}{{rowData[options.fields.image]}}\" class=\"{{options.imageToClassPosition}}\">\n" +
-    "		<div class=\"{{options.xattrTextPosition}} {{options.textToClassPosition}}\">\n" +
-    "			<h2 ng-if=\"rowData[options.fields.field0]\">{{rowData[options.fields.field0]|mask:options.fields.mask0:options.fields.type0}}</h2>\n" +
-    "			<p class=\"dark\" ng-if=\"rowData[options.fields.field1]\">{{rowData[options.fields.field1]|mask:options.fields.mask1:options.fields.type1}}</p>\n" +
-    "			<p class=\"dark\" ng-if=\"rowData[options.fields.field2]\">{{rowData[options.fields.field2]|mask:options.fields.mask2:options.fields.type2}}</p>\n" +
-    "			<p class=\"dark\" ng-if=\"rowData[options.fields.field3]\">{{rowData[options.fields.field3]|mask:options.fields.mask3:options.fields.type3}}</p>\n" +
-    "			<p class=\"dark\" ng-if=\"rowData[options.fields.field4]\">{{rowData[options.fields.field4]|mask:options.fields.mask4:options.fields.type4}}</p>\n" +
-    "			<p class=\"dark\" ng-if=\"rowData[options.fields.field5]\">{{rowData[options.fields.field5]|mask:options.fields.mask5:options.fields.type5}}</p>\n" +
-    "			<i ng-if=\"options.icon\" class=\"{{options.icon}}\" xattr-theme=\"dark\"></i>\n" +
-    "		</div>\n" +
-    "   </ion-item>\n" +
-    "</ion-list>\n" +
-    "<ion-infinite-scroll></ion-infinite-scroll>\n";
+    `<ion-list type="" can-swipe="listCanSwipe">
+       <ion-item ng-class="{'cron-list-selected' : isChecked(rowData)}" class="item {{options.editableButtonClass}} {{options.iconClassPosition}} {{options.imageClassPosition}}" ng-repeat="rowData in datasource">
+         <ul ng-if="options.allowMultiselect" class="checkbox-group component-holder {{'cron-list-multiselect-' + options.imageType}}" data-component="crn-checkbox"><label class="checkbox"><input ng-checked="isChecked(rowData);" type="checkbox"></label></ul>
+    	    <img alt='Thumbnail' ng-if="options.imageType !== 'do-not-show' && rowData[options.fields.image]" 
+              ng-src="{{options.isImageFromDropbox ? '' : 'data:image/png;base64,'}}{{rowData[options.fields.image]}}" class="{{options.imageToClassPosition}}">
+    		<div class="{{options.xattrTextPosition}} {{options.textToClassPosition}}">
+    			<h2 ng-if="rowData[options.fields.field0]">{{rowData[options.fields.field0]|mask:options.fields.mask0:options.fields.type0}}</h2>
+    			<p class="dark" ng-if="hasValue(rowData[options.fields.field1])">{{rowData[options.fields.field1]|mask:options.fields.mask1:options.fields.type1}}</p>
+    			<p class="dark" ng-if="hasValue(rowData[options.fields.field2])">{{rowData[options.fields.field2]|mask:options.fields.mask2:options.fields.type2}}</p>
+    			<p class="dark" ng-if="hasValue(rowData[options.fields.field3])">{{rowData[options.fields.field3]|mask:options.fields.mask3:options.fields.type3}}</p>
+    			<p class="dark" ng-if="hasValue(rowData[options.fields.field4])">{{rowData[options.fields.field4]|mask:options.fields.mask4:options.fields.type4}}</p>
+    			<p class="dark" ng-if="hasValue(rowData[options.fields.field5])">{{rowData[options.fields.field5]|mask:options.fields.mask5:options.fields.type5}}</p>
+    			<i ng-if="options.icon" class="{{options.icon}}" xattr-theme="dark"></i>
+    		</div>
+       </ion-item>
+    </ion-list>
+    <ion-infinite-scroll></ion-infinite-scroll>`;
 
     const defaultSearchTemplate =
       "<div class=\"item item-input-inset\">\n" +
@@ -1179,6 +1177,7 @@ window.addEventListener('message', function(event) {
       terminal: true,
       link: function(scope, element, attrs, ngModelCtrl) {
 
+        scope.hasValue = value => value !== null && value !== undefined;
         var optionsList = {};
         var dataSourceName = '';
         var buttons = '';
@@ -1735,34 +1734,129 @@ window.addEventListener('message', function(event) {
 
         element.html($templateDyn);
         $compile($templateDyn)(element.scope());
-      }
     }
-  })
-  
-  .directive('cronVideo', function ($compile) {
-    return {
-      restrict: 'AE',
+  }
+})
+
+.directive('signaturePad', function($compile, $window) {
+  'use strict';
+
+  var signaturePad, canvas, element, EMPTY_IMAGE = null;
+  return {
+      restrict: 'E',
+      require: "ngModel",
+      scope: true,
       replace: true,
-      link: function (scope, element, attrs) {
-  
-        var component = element.find('.cronVideo')[0];
-        $compile(component)(element.scope());
-  
-        var componentOptions = element.find('.cronVideoIframe')[0];
-        $compile(componentOptions)(element.scope());
-  
-        var $templateDyn = "";
-        var src = attrs.src;
-        var width = attrs.width;
-        var height = attrs.height;
-        var title = attrs.title;
-        $templateDyn = `<iframe class="cronVideoIframe" src="${src}" width="${width}" height="${height}" title="${title}" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen> </iframe>`;
-  
-        element.html($templateDyn);
-        $compile($templateDyn)(element.scope());
+      template: '<div>' +
+          '<canvas style="width:100%" ng-click="mouseup()" ng-mouseup="mouseup()"></canvas>' +
+          '<div>' +
+          '<button type="button" style="margin-right:5px;margin-bottom:5px;" ng-click="clear()">{{"clear"|translate}}</button>' +
+          '</div>' +
+          '</div>',
+      scope: {
+          clear: '=',
+          dataurl: '=',
+          height: '@',
+          width: '@',
+          ngClick: '@',
+          ngModel: '='
+      },
+      controller: [
+          '$scope',
+          function($scope) {
+
+              $scope.mouseup = function() {
+
+                  var signature = {};
+
+                  if (!$scope.signaturePad.isEmpty()) {
+                      signature.dataUrl = $scope.signaturePad.toDataURL();
+                      signature.isEmpty = false;
+
+                  } else {
+                      signature.dataUrl = EMPTY_IMAGE;
+                      signature.isEmpty = true;
+                  }
+
+                  if (signature.dataUrl == null) {
+                      return;
+                  }
+                  var binary = signature.dataUrl.split(',')[1];
+                  $scope.ngModel = binary;
+              };
+
+              $scope.$watch('ngModel', function(value, old) {
+
+                  var signature = $scope.signaturePad;
+                  var data = $scope.ngModel;
+
+                  if (value !== old) {
+
+                      signature.fromDataURL("data:image/png;base64," + value, {
+                          ratio: 1
+                      });
+                      $scope.ngModel = value;
+                      signature.clear();
+                  }
+              }, true);
+
+              $scope.clear = function() {
+                  $scope.signaturePad.clear();
+                  $scope.ngModel = null;
+              };
+
+          }
+      ],
+      link: function(scope, element, attrs, ngModelCtrl) {
+
+          canvas = element.find('canvas')[0];
+
+          scope.onResize = function() {
+
+              var canvas = element.find('canvas')[0];
+              var ratio = Math.max($window.devicePixelRatio || 1, 1);
+              canvas.width = canvas.offsetWidth * ratio;
+              canvas.height = canvas.offsetHeight * ratio;
+              canvas.getContext("2d").scale(ratio, ratio);
+          }
+
+          scope.onResize();
+
+          scope.signaturePad = new SignaturePad(canvas);
+
+          angular.element($window).bind('resize', function() {
+              scope.onResize();
+          });
+
+          $compile(element)(element.scope());                  
       }
+  };
+})
+
+.directive('cronVideo', function ($compile) {
+  return {
+    restrict: 'AE',
+    replace: true,
+    link: function (scope, element, attrs) {
+
+      var component = element.find('.cronVideo')[0];
+      $compile(component)(element.scope());
+
+      var componentOptions = element.find('.cronVideoIframe')[0];
+      $compile(componentOptions)(element.scope());
+
+      var $templateDyn = "";
+      var src = attrs.src;
+      var width = attrs.width;
+      var height = attrs.height;
+      var title = attrs.title;
+      $templateDyn = `<iframe class="cronVideoIframe" src="${src}" width="${width}" height="${height}" title="${title}" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen> </iframe>`;
+
+      element.html($templateDyn);
+      $compile($templateDyn)(element.scope());
     }
-  });
+  }
+});
 
   app.directive("kendoChat", function ($compile, $timeout) {
     return {

package/js/reports/reports.service.js

@@ -50,31 +50,7 @@
     
     // open report
     this.openURLContent = function(url) {
-      var include = function() {
-        var frame = $('<iframe/>');
-        frame.attr('frameborder', 0);
-        var h = parseInt($(window).height());
-        
-        frame.attr('height', h - 200);
-        frame.attr('width', '100%');
-        frame.attr('src', url + "?download=false");
-        var m = $('#reportView .modal-body');
-        if(m.get(0)) {
-          m.html(frame);
-          $('#reportViewContext .modal-dialog').css('width', '95%');
-          setTimeout(function() {
-            console.log('open[#reportViewContext]');
-            $('body').append(context);
-            $('#reportView').modal();
-          }, 100);
-        }
-        else {
-          console.log('wait[#reportViewContext]');
-          setTimeout(include, 200);
-        }
-      }
-      
-      setTimeout(include, 200);
+      openReportOnMobile(url)
     };
     
     this.initializeStimulsoft = function(language) {
@@ -461,6 +437,10 @@
         }
       }.bind(this));
     };
-    
+
+    function openReportOnMobile(url) {
+      window.open(url, '_system');
+    }
+
   });
 }(app));

package/lib/ionic/js/ionic.bundle.js

@@ -27,6 +27,8 @@ window.ionic = window.ionic || {};
 window.ionic.views = {};
 window.ionic.version = '1.3.1';
 
+const isRunningOnIonic = document.URL.startsWith('http://localhost');
+
 (function (ionic) {
 
   ionic.DelegateService = function(methodNames) {
@@ -2968,7 +2970,7 @@ function tapClickGateKeeper(e) {
 
     if (!ionic.tap.isLabelWithTextInput(e.target)) {
       // labels clicks from native should not preventDefault othersize keyboard will not show on input focus
-      e.preventDefault();
+      isRunningOnIonic && e.preventDefault();
     }
     return false;
   }
@@ -3069,7 +3071,7 @@ function tapTouchEnd(e) {
     tapClick(e);
 
     if (isSelectOrOption(e.target.tagName)) {
-      e.preventDefault();
+      isRunningOnIonic && e.preventDefault();
     }
   }
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "cronapp-framework-mobile-js",
-  "version": "2.8.8",
+  "version": "2.9.0",
   "description": "Javascript library for CronApp's projects",
   "main": "cronapp.framework.mobile.js",
   "scripts": {
@@ -57,6 +57,8 @@
     "ng-file-upload": "12.2.13",
     "angular-moment": "1.2.0",
     "pace": "HubSpot/pace#v1.0.2",
-    "moment": "2.24.0"
+    "moment": "2.24.0",
+    "cronapp-ion-tab-badge": "1.0.0",
+    "signature_pad": "^3.0.0-beta.4"
   }
 }

package/postupdate.json

@@ -171,6 +171,11 @@
       "file": "index.html",
       "script": "node_modules/cronapp-framework-mobile-js/js/reports/reports.service.js",
       "type": "script"
+    },
+    {
+      "file": "index.html",
+      "script": "node_modules/cronapp-ion-tab-badge/dist/index.js",
+      "type": "script"
     }
   ],
   "removes": [
@@ -208,6 +213,12 @@
       "file": "index.html",
       "script": "plugins/angular-translate/angular-translate.min.js",
       "type": "script"
+    },
+    {
+      "file": "index.html",
+      "script": "node_modules/signature_pad/dist/signature_pad.umd.min.js",
+      "type": "script",
+      "onTop": true
     }
   ],
   "replaces": [