formiojs-eorion 0.1.39 → 0.1.41

package/components/file_china_grid/File.unit.js

@@ -0,0 +1,175 @@
+"use strict";
+
+require("core-js/modules/es.object.to-string.js");
+require("core-js/modules/web.dom-collections.for-each.js");
+require("core-js/modules/es.array.concat.js");
+require("core-js/modules/es.function.name.js");
+require("core-js/modules/es.string.trim.js");
+var _powerAssert = _interopRequireDefault(require("power-assert"));
+var _harness = _interopRequireDefault(require("../../../test/harness"));
+var _File = _interopRequireDefault(require("./File"));
+var _fixtures = require("./fixtures");
+var _Formio = _interopRequireDefault(require("./../../Formio"));
+var _lodash = _interopRequireDefault(require("lodash"));
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+describe('File Component', function () {
+  it('Should create a File Component', function () {
+    return _harness.default.testCreate(_File.default, _fixtures.comp1).then(function (component) {
+      var parentNode = document.createElement('div');
+      var element = document.createElement('div');
+      parentNode.appendChild(element);
+      component.build(element);
+      _harness.default.testElements(component, 'ul.list-group-striped li.list-group-header', 1);
+      _harness.default.testElements(component, 'ul.list-group-striped li.list-group-item', 1);
+      _harness.default.testElements(component, 'a.browse', 1);
+      (0, _powerAssert.default)(component.checkValidity(component.getValue()), 'Item should be valid');
+      component.setValue([{
+        storage: 'base64',
+        name: 'IMG_5235-ce0abe18-5d3e-4ab4-84ca-b3e06684bc86.jpg',
+        url: 'data:image/jpg;base64,AAAAIGZ0eXBoZWljAAAAAG1pZjF',
+        size: 1159732,
+        type: 'image/jpeg',
+        originalName: 'IMG_5235.jpg'
+      }, {
+        storage: 'base64',
+        name: 'IMG_5235-ce0abe18-5d3e-4ab4-84ca-b3e06684bc86.png',
+        url: 'data:image/jpg;base64,AAAAIGZ0eXBoZWljAAAAAG1pZjF',
+        size: 34533,
+        type: 'image/png',
+        originalName: 'IMG_5235.png'
+      }]);
+      _harness.default.testElements(component, 'ul.list-group-striped li.list-group-header', 1);
+      _harness.default.testElements(component, 'ul.list-group-striped li.list-group-item', 3);
+      _harness.default.testElements(component, 'a.browse', 0);
+      (0, _powerAssert.default)(component.checkValidity(component.getValue()), 'Item should be valid');
+    });
+  });
+  it('Should hide loader after loading process', function () {
+    return _harness.default.testCreate(_File.default, _fixtures.comp1).then(function (component) {
+      var parentNode = document.createElement('div');
+      var element = document.createElement('div');
+      parentNode.appendChild(element);
+      component.build(element);
+      _harness.default.testElements(component, 'div.loader-wrapper', 1);
+      component.setValue([{
+        storage: 'base64',
+        name: 'IMG_5235-ce0abe18-5d3e-4ab4-84ca-b3e06684bc86.jpg',
+        url: 'data:image/jpg;base64,AAAAIGZ0eXBoZWljAAAAAG1pZjF',
+        size: 1159732,
+        type: 'image/jpeg',
+        originalName: 'IMG_5235.jpg'
+      }]);
+      _harness.default.testElements(component, 'div.loader-wrapper', 0);
+    });
+  });
+  it('Should create a multiple File Component', function () {
+    _fixtures.comp1.multiple = true;
+    return _harness.default.testCreate(_File.default, _fixtures.comp1).then(function (component) {
+      var parentNode = document.createElement('div');
+      var element = document.createElement('div');
+      parentNode.appendChild(element);
+      component.build(element);
+      _harness.default.testElements(component, 'ul.list-group-striped li.list-group-header', 1);
+      _harness.default.testElements(component, 'ul.list-group-striped li.list-group-item', 1);
+      _harness.default.testElements(component, 'a.browse', 1);
+      (0, _powerAssert.default)(component.checkValidity(component.getValue()), 'Item should be valid');
+      component.setValue([{
+        storage: 'base64',
+        name: 'IMG_5235-ce0abe18-5d3e-4ab4-84ca-b3e06684bc86.jpg',
+        url: 'data:image/jpg;base64,AAAAIGZ0eXBoZWljAAAAAG1pZjF',
+        size: 1159732,
+        type: 'image/jpeg',
+        originalName: 'IMG_5235.jpg'
+      }, {
+        storage: 'base64',
+        name: 'IMG_5235-ce0abe18-5d3e-4ab4-84ca-b3e06684bc86.png',
+        url: 'data:image/jpg;base64,AAAAIGZ0eXBoZWljAAAAAG1pZjF',
+        size: 34533,
+        type: 'image/png',
+        originalName: 'IMG_5235.png'
+      }]);
+      _harness.default.testElements(component, 'ul.list-group-striped li.list-group-header', 1);
+      _harness.default.testElements(component, 'ul.list-group-striped li.list-group-item', 3);
+      _harness.default.testElements(component, 'a.browse', 1);
+      (0, _powerAssert.default)(component.checkValidity(component.getValue()), 'Item should be valid');
+    });
+  });
+  it('Should validate uploaded file according to the pattern', function (done) {
+    _harness.default.testCreate(_File.default, _fixtures.comp1).then(function (component) {
+      var validFiles = [{
+        name: 'test.jpg',
+        size: 27401,
+        type: 'image/jpeg'
+      }, {
+        name: 'TypeScript.pdf',
+        size: 203123,
+        type: 'application/pdf'
+      }, {
+        name: 'build with dist.png',
+        size: 137321,
+        type: 'image/png'
+      }];
+      var invalidFiles = [{
+        name: 'eventsList.xlsx',
+        size: 16022,
+        type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'
+      }, {
+        name: 'lazy load.mp4',
+        size: 9083622,
+        type: 'video/mp4'
+      }];
+      var pattern = '  .jpg,     .png,    .exe,     .pdf ';
+      var checkValidatePattern = function checkValidatePattern(files, valid) {
+        files.forEach(function (file) {
+          _powerAssert.default.equal(component.validatePattern(file, pattern), valid, "File ".concat(file.name, " should ").concat(valid ? '' : 'not', " correspond to the pattern"));
+        });
+      };
+      checkValidatePattern(validFiles, true);
+      checkValidatePattern(invalidFiles, false);
+      done();
+    });
+  });
+  it('Should display uploaded file in file component only after saving', function (done) {
+    var form = _lodash.default.cloneDeep(_fixtures.comp2);
+    var element = document.createElement('div');
+    _Formio.default.createForm(element, form).then(function (form) {
+      var value = [{
+        storage: 'base64',
+        name: '33-0ae897b9-c808-4832-a5e1-4e5d0c725f1b.jpg',
+        url: 'data:image/jpeg;base64,/9j/4AAQSkZJRgABAQEAYABgAAD…CiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooA//2Q==',
+        size: 102691,
+        type: 'image/jpeg',
+        originalName: '33.jpg'
+      }];
+      var file = form.getComponent('file');
+      var openModalButton = file.componentModal.refs.openModal;
+      var clickEvent = new Event('click');
+      openModalButton.dispatchEvent(clickEvent);
+      setTimeout(function () {
+        _powerAssert.default.equal(file.componentModal.isOpened, true);
+        file.dataValue = value;
+        file.redraw();
+        setTimeout(function () {
+          _powerAssert.default.equal(file.refs.fileLink.length, 1);
+          var modalOverlayButton = file.componentModal.refs.modalOverlay;
+          modalOverlayButton.dispatchEvent(clickEvent);
+          setTimeout(function () {
+            _powerAssert.default.equal(!!file.componentModal.dialogElement, true);
+            var dialogYesButton = file.componentModal.dialogElement.refs.dialogYesButton;
+            dialogYesButton.dispatchEvent(clickEvent);
+            setTimeout(function () {
+              _powerAssert.default.equal(!!file.componentModal.dialogElement, false);
+              file.componentModal.closeModal();
+              setTimeout(function () {
+                _powerAssert.default.equal(file.componentModal.isOpened, false);
+                _powerAssert.default.equal(file.refs.fileLink.length, 0);
+                _powerAssert.default.equal(file.componentModal.refs.openModal.textContent.trim(), 'Click to set value');
+                done();
+              }, 200);
+            }, 200);
+          }, 200);
+        }, 200);
+      }, 200);
+    }).catch(done);
+  });
+});

package/components/file_china_grid/editForm/File.edit.data.js

@@ -0,0 +1,11 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _default = [{
+  key: 'defaultValue',
+  ignore: true
+}];
+exports.default = _default;

package/components/file_china_grid/editForm/File.edit.display.js

@@ -0,0 +1,11 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _default = [{
+  key: 'placeholder',
+  ignore: true
+}];
+exports.default = _default;

package/components/file_china_grid/editForm/File.edit.file.js

@@ -0,0 +1,257 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+require("core-js/modules/es.array.filter.js");
+require("core-js/modules/es.object.to-string.js");
+require("core-js/modules/es.array.map.js");
+var _Formio = require("../../../Formio");
+var _lodash = _interopRequireDefault(require("lodash"));
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+var _default = [{
+  type: 'select',
+  input: true,
+  key: 'storage',
+  label: 'Storage',
+  defaultValue: 'url',
+  placeholder: 'Select your file storage provider',
+  weight: 0,
+  tooltip: 'Which storage to save the files in.',
+  valueProperty: 'value',
+  dataSrc: 'custom',
+  data: {
+    custom: function custom() {
+      return _lodash.default.map(_Formio.GlobalFormio.Providers.getProviders('storage'), function (storage, key) {
+        return {
+          label: storage.title,
+          value: key
+        };
+      }).filter(function (provider) {
+        return provider.value === 'url';
+      });
+    }
+  }
+}, {
+  type: 'textfield',
+  input: true,
+  key: 'url',
+  label: 'Url',
+  weight: 10,
+  placeholder: 'Enter the url to post the files to.',
+  tooltip: "See <a href='https://github.com/danialfarid/ng-file-upload#server-side' target='_blank'>https://github.com/danialfarid/ng-file-upload#server-side</a> for how to set up the server.",
+  conditional: {
+    json: {
+      '===': [{
+        var: 'data.storage'
+      }, 'url']
+    }
+  }
+}, {
+  type: 'textfield',
+  input: true,
+  key: 'options.indexeddb',
+  label: 'Database',
+  weight: 10,
+  placeholder: 'Enter the indexeddb database name',
+  conditional: {
+    json: {
+      in: [{
+        var: 'data.storage'
+      }, ['indexeddb']]
+    }
+  }
+}, {
+  type: 'textfield',
+  input: true,
+  label: 'Table',
+  key: 'options.indexeddbTable',
+  weight: 10,
+  placeholder: 'Enter the name for indexeddb table',
+  conditional: {
+    json: {
+      in: [{
+        var: 'data.storage'
+      }, ['indexeddb']]
+    }
+  }
+}, {
+  type: 'textarea',
+  key: 'options',
+  label: 'Custom request options',
+  tooltip: 'Pass your custom xhr options(optional)',
+  rows: 5,
+  editor: 'ace',
+  input: true,
+  weight: 15,
+  placeholder: "{\n  \"withCredentials\": true\n}",
+  conditional: {
+    json: {
+      '===': [{
+        var: 'data.storage'
+      }, 'url']
+    }
+  }
+}, {
+  type: 'textfield',
+  input: true,
+  key: 'fileKey',
+  label: 'File form-data key',
+  weight: 17,
+  placeholder: 'Enter the key name of a file for form data.',
+  tooltip: 'Key name that you would like to modify for the file while calling API request.',
+  conditional: {
+    json: {
+      '===': [{
+        var: 'data.storage'
+      }, 'url']
+    }
+  }
+}, {
+  type: 'textfield',
+  input: true,
+  key: 'dir',
+  label: 'Directory',
+  placeholder: '(optional) Enter a directory for the files',
+  tooltip: 'This will place all the files uploaded in this field in the directory',
+  weight: 20,
+  conditional: {
+    json: {
+      '!==': [{
+        var: 'data.storage'
+      }, 'googledrive']
+    }
+  }
+}, {
+  type: 'textfield',
+  input: true,
+  key: 'dir',
+  label: 'Folder ID',
+  placeholder: '(optional) Enter an ID of the folder for the files',
+  tooltip: 'This will place all the files uploaded in this field in the folder',
+  weight: 20,
+  conditional: {
+    json: {
+      '===': [{
+        var: 'data.storage'
+      }, 'googledrive']
+    }
+  }
+}, {
+  type: 'textfield',
+  input: true,
+  key: 'fileNameTemplate',
+  label: 'File Name Template',
+  placeholder: '(optional) { {name} }-{ {guid} }"',
+  tooltip: 'Specify template for name of uploaded file(s). Regular template variables are available (`data`, `component`, `user`, `value`, `moment` etc.), also `fileName`, `guid` variables are available. `guid` part must be present, if not found in template, will be added at the end.',
+  weight: 25
+}, {
+  type: 'checkbox',
+  input: true,
+  key: 'image',
+  label: 'Display as image(s)',
+  tooltip: 'Instead of a list of linked files, images will be rendered in the view.',
+  weight: 30
+}, {
+  type: 'checkbox',
+  input: true,
+  key: 'uploadOnly',
+  label: 'Upload Only',
+  tooltip: 'When this is checked, will only allow you to upload file(s) and consequently the download, in this component, will be unavailable.',
+  weight: 33
+}, {
+  type: 'checkbox',
+  input: true,
+  key: 'privateDownload',
+  label: 'Private Download',
+  tooltip: 'When this is checked, the file download will send a POST request to the download URL with the x-jwt-token header. This will allow your endpoint to create a Private download system.',
+  weight: 31,
+  conditional: {
+    json: {
+      '===': [{
+        var: 'data.storage'
+      }, 'url']
+    }
+  }
+}, {
+  type: 'textfield',
+  input: true,
+  key: 'imageSize',
+  label: 'Image Size',
+  placeholder: '100',
+  tooltip: 'The image size for previewing images.',
+  weight: 40,
+  conditional: {
+    json: {
+      '==': [{
+        var: 'data.image'
+      }, true]
+    }
+  }
+}, {
+  type: 'checkbox',
+  input: true,
+  key: 'webcam',
+  label: 'Enable web camera',
+  tooltip: 'This will allow using an attached camera to directly take a picture instead of uploading an existing file.',
+  weight: 32
+}, {
+  type: 'textfield',
+  input: true,
+  key: 'webcamSize',
+  label: 'Webcam Width',
+  placeholder: '320',
+  tooltip: 'The webcam size for taking pictures.',
+  weight: 38,
+  conditional: {
+    json: {
+      '==': [{
+        var: 'data.webcam'
+      }, true]
+    }
+  }
+}, {
+  type: 'datagrid',
+  input: true,
+  label: 'File Types',
+  key: 'fileTypes',
+  tooltip: 'Specify file types to classify the uploads. This is useful if you allow multiple types of uploads but want to allow the user to specify which type of file each is.',
+  weight: 11,
+  components: [{
+    label: 'Label',
+    key: 'label',
+    input: true,
+    type: 'textfield'
+  }, {
+    label: 'Value',
+    key: 'value',
+    input: true,
+    type: 'textfield'
+  }]
+}, {
+  type: 'textfield',
+  input: true,
+  key: 'filePattern',
+  label: 'File Pattern',
+  placeholder: '.jpg,video/*,application/pdf',
+  tooltip: 'See <a href=\'https://github.com/danialfarid/ng-file-upload#full-reference\' target=\'_blank\'>https://github.com/danialfarid/ng-file-upload#full-reference</a> for how to specify file patterns.',
+  weight: 50
+}, {
+  type: 'textfield',
+  input: true,
+  key: 'fileMinSize',
+  label: 'File Minimum Size',
+  placeholder: '1MB',
+  tooltip: 'See <a href=\'https://github.com/danialfarid/ng-file-upload#full-reference\' target=\'_blank\'>https://github.com/danialfarid/ng-file-upload#full-reference</a> for how to specify file sizes.',
+  weight: 60
+}, {
+  type: 'textfield',
+  input: true,
+  key: 'fileMaxSize',
+  label: 'File Maximum Size',
+  placeholder: '10MB',
+  tooltip: 'See <a href=\'https://github.com/danialfarid/ng-file-upload#full-reference\' target=\'_blank\'>https://github.com/danialfarid/ng-file-upload#full-reference</a> for how to specify file sizes.',
+  weight: 70
+}];
+exports.default = _default;

package/components/file_china_grid/editForm/File.edit.validation.js

@@ -0,0 +1,14 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _default = [{
+  key: 'unique',
+  ignore: true
+}, {
+  key: 'validateOn',
+  ignore: true
+}];
+exports.default = _default;

package/components/file_china_grid/fixtures/comp1.js

@@ -0,0 +1,21 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _default = {
+  'label': 'Upload',
+  'tableView': false,
+  'storage': 'base64',
+  'webcam': false,
+  'fileTypes': [{
+    'label': '',
+    'value': ''
+  }],
+  'calculateServer': false,
+  'key': 'upload',
+  'type': 'file',
+  'input': true
+};
+exports.default = _default;

package/components/file_china_grid/fixtures/comp2.js

@@ -0,0 +1,36 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _default = {
+  _id: '6108f1dac7e55d5cabe2627f',
+  type: 'form',
+  components: [{
+    label: 'Upload',
+    tableView: false,
+    modalEdit: true,
+    storage: 'base64',
+    webcam: false,
+    fileTypes: [{
+      label: '',
+      value: ''
+    }],
+    key: 'file',
+    type: 'file',
+    input: true
+  }, {
+    type: 'button',
+    label: 'Submit',
+    key: 'submit',
+    disableOnInvalid: true,
+    input: true,
+    tableView: false
+  }],
+  title: 'testFileForm',
+  display: 'form',
+  name: 'testFileForm',
+  path: 'testfileform'
+};
+exports.default = _default;

package/components/file_china_grid/fixtures/index.js

@@ -0,0 +1,20 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "comp1", {
+  enumerable: true,
+  get: function get() {
+    return _comp.default;
+  }
+});
+Object.defineProperty(exports, "comp2", {
+  enumerable: true,
+  get: function get() {
+    return _comp2.default;
+  }
+});
+var _comp = _interopRequireDefault(require("./comp1"));
+var _comp2 = _interopRequireDefault(require("./comp2"));
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }