[Summary view] [Print] [Text view]

   1  (function () {
   2    'use strict';
   3  
   4    function _defineProperties(target, props) {
   5      for (var i = 0; i < props.length; i++) {
   6        var descriptor = props[i];
   7        descriptor.enumerable = descriptor.enumerable || false;
   8        descriptor.configurable = true;
   9        if ("value" in descriptor) descriptor.writable = true;
  10        Object.defineProperty(target, descriptor.key, descriptor);
  11      }
  12    }
  13  
  14    function _createClass(Constructor, protoProps, staticProps) {
  15      if (protoProps) _defineProperties(Constructor.prototype, protoProps);
  16      if (staticProps) _defineProperties(Constructor, staticProps);
  17      Object.defineProperty(Constructor, "prototype", {
  18        writable: false
  19      });
  20      return Constructor;
  21    }
  22  
  23    function _inheritsLoose(subClass, superClass) {
  24      subClass.prototype = Object.create(superClass.prototype);
  25      subClass.prototype.constructor = subClass;
  26  
  27      _setPrototypeOf(subClass, superClass);
  28    }
  29  
  30    function _getPrototypeOf(o) {
  31      _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) {
  32        return o.__proto__ || Object.getPrototypeOf(o);
  33      };
  34      return _getPrototypeOf(o);
  35    }
  36  
  37    function _setPrototypeOf(o, p) {
  38      _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) {
  39        o.__proto__ = p;
  40        return o;
  41      };
  42  
  43      return _setPrototypeOf(o, p);
  44    }
  45  
  46    function _isNativeReflectConstruct() {
  47      if (typeof Reflect === "undefined" || !Reflect.construct) return false;
  48      if (Reflect.construct.sham) return false;
  49      if (typeof Proxy === "function") return true;
  50  
  51      try {
  52        Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {}));
  53        return true;
  54      } catch (e) {
  55        return false;
  56      }
  57    }
  58  
  59    function _construct(Parent, args, Class) {
  60      if (_isNativeReflectConstruct()) {
  61        _construct = Reflect.construct;
  62      } else {
  63        _construct = function _construct(Parent, args, Class) {
  64          var a = [null];
  65          a.push.apply(a, args);
  66          var Constructor = Function.bind.apply(Parent, a);
  67          var instance = new Constructor();
  68          if (Class) _setPrototypeOf(instance, Class.prototype);
  69          return instance;
  70        };
  71      }
  72  
  73      return _construct.apply(null, arguments);
  74    }
  75  
  76    function _isNativeFunction(fn) {
  77      return Function.toString.call(fn).indexOf("[native code]") !== -1;
  78    }
  79  
  80    function _wrapNativeSuper(Class) {
  81      var _cache = typeof Map === "function" ? new Map() : undefined;
  82  
  83      _wrapNativeSuper = function _wrapNativeSuper(Class) {
  84        if (Class === null || !_isNativeFunction(Class)) return Class;
  85  
  86        if (typeof Class !== "function") {
  87          throw new TypeError("Super expression must either be null or a function");
  88        }
  89  
  90        if (typeof _cache !== "undefined") {
  91          if (_cache.has(Class)) return _cache.get(Class);
  92  
  93          _cache.set(Class, Wrapper);
  94        }
  95  
  96        function Wrapper() {
  97          return _construct(Class, arguments, _getPrototypeOf(this).constructor);
  98        }
  99  
 100        Wrapper.prototype = Object.create(Class.prototype, {
 101          constructor: {
 102            value: Wrapper,
 103            enumerable: false,
 104            writable: true,
 105            configurable: true
 106          }
 107        });
 108        return _setPrototypeOf(Wrapper, Class);
 109      };
 110  
 111      return _wrapNativeSuper(Class);
 112    }
 113  
 114    function _assertThisInitialized(self) {
 115      if (self === void 0) {
 116        throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
 117      }
 118  
 119      return self;
 120    }
 121  
 122    (function (customElements, Joomla) {
 123      var JoomlaFieldUser = /*#__PURE__*/function (_HTMLElement) {
 124        _inheritsLoose(JoomlaFieldUser, _HTMLElement);
 125  
 126        function JoomlaFieldUser() {
 127          var _this;
 128  
 129          _this = _HTMLElement.call(this) || this;
 130          _this.onUserSelect = '';
 131          _this.onchangeStr = ''; // Bind events
 132  
 133          _this.buttonClick = _this.buttonClick.bind(_assertThisInitialized(_this));
 134          _this.iframeLoad = _this.iframeLoad.bind(_assertThisInitialized(_this));
 135          _this.modalClose = _this.modalClose.bind(_assertThisInitialized(_this));
 136          _this.setValue = _this.setValue.bind(_assertThisInitialized(_this));
 137          return _this;
 138        }
 139  
 140        var _proto = JoomlaFieldUser.prototype;
 141  
 142        _proto.connectedCallback = function connectedCallback() {
 143          // Set up elements
 144          this.modal = this.querySelector(this.modalClass);
 145          this.modalBody = this.querySelector('.modal-body');
 146          this.input = this.querySelector(this.inputId);
 147          this.inputName = this.querySelector(this.inputNameClass);
 148          this.buttonSelect = this.querySelector(this.buttonSelectClass); // Bootstrap modal init
 149  
 150          if (this.modal && window.bootstrap && window.bootstrap.Modal && !window.bootstrap.Modal.getInstance(this.modal)) {
 151            Joomla.initialiseModal(this.modal, {
 152              isJoomla: true
 153            });
 154          }
 155  
 156          if (this.buttonSelect) {
 157            this.buttonSelect.addEventListener('click', this.modalOpen.bind(this));
 158            this.modal.addEventListener('hide', this.removeIframe.bind(this)); // Check for onchange callback,
 159  
 160            this.onchangeStr = this.input.getAttribute('data-onchange');
 161  
 162            if (this.onchangeStr) {
 163              /* eslint-disable */
 164              this.onUserSelect = new Function(this.onchangeStr);
 165              this.input.addEventListener('change', this.onUserSelect);
 166              /* eslint-enable */
 167            }
 168          }
 169        };
 170  
 171        _proto.disconnectedCallback = function disconnectedCallback() {
 172          if (this.onchangeStr && this.input) {
 173            this.input.removeEventListener('change', this.onUserSelect);
 174          }
 175  
 176          if (this.buttonSelect) {
 177            this.buttonSelect.removeEventListener('click', this);
 178          }
 179  
 180          if (this.modal) {
 181            this.modal.removeEventListener('hide', this);
 182          }
 183        };
 184  
 185        _proto.buttonClick = function buttonClick(_ref) {
 186          var target = _ref.target;
 187          this.setValue(target.getAttribute('data-user-value'), target.getAttribute('data-user-name'));
 188          this.modalClose();
 189        };
 190  
 191        _proto.iframeLoad = function iframeLoad() {
 192          var _this2 = this;
 193  
 194          var iframeDoc = this.iframeEl.contentWindow.document;
 195          var buttons = [].slice.call(iframeDoc.querySelectorAll('.button-select'));
 196          buttons.forEach(function (button) {
 197            button.addEventListener('click', _this2.buttonClick);
 198          });
 199        } // Opens the modal
 200        ;
 201  
 202        _proto.modalOpen = function modalOpen() {
 203          // Reconstruct the iframe
 204          this.removeIframe();
 205          var iframe = document.createElement('iframe');
 206          iframe.setAttribute('name', 'field-user-modal');
 207          iframe.src = this.url.replace('{field-user-id}', this.input.getAttribute('id'));
 208          iframe.setAttribute('width', this.modalWidth);
 209          iframe.setAttribute('height', this.modalHeight);
 210          this.modalBody.appendChild(iframe);
 211          this.modal.open();
 212          this.iframeEl = this.modalBody.querySelector('iframe'); // handle the selection on the iframe
 213  
 214          this.iframeEl.addEventListener('load', this.iframeLoad);
 215        } // Closes the modal
 216        ;
 217  
 218        _proto.modalClose = function modalClose() {
 219          Joomla.Modal.getCurrent().close();
 220          this.modalBody.innerHTML = '';
 221        } // Remove the iframe
 222        ;
 223  
 224        _proto.removeIframe = function removeIframe() {
 225          this.modalBody.innerHTML = '';
 226        } // Sets the value
 227        ;
 228  
 229        _proto.setValue = function setValue(value, name) {
 230          this.input.setAttribute('value', value);
 231          this.inputName.setAttribute('value', name || value); // trigger change event both on the input and on the custom element
 232  
 233          this.input.dispatchEvent(new Event('change'));
 234          this.dispatchEvent(new CustomEvent('change', {
 235            detail: {
 236              value: value,
 237              name: name
 238            },
 239            bubbles: true
 240          }));
 241        };
 242  
 243        _createClass(JoomlaFieldUser, [{
 244          key: "url",
 245          get: function get() {
 246            return this.getAttribute('url');
 247          },
 248          set: function set(value) {
 249            this.setAttribute('url', value);
 250          }
 251        }, {
 252          key: "modalClass",
 253          get: function get() {
 254            return this.getAttribute('modal');
 255          },
 256          set: function set(value) {
 257            this.setAttribute('modal', value);
 258          }
 259        }, {
 260          key: "modalWidth",
 261          get: function get() {
 262            return this.getAttribute('modal-width');
 263          },
 264          set: function set(value) {
 265            this.setAttribute('modal-width', value);
 266          }
 267        }, {
 268          key: "modalHeight",
 269          get: function get() {
 270            return this.getAttribute('modal-height');
 271          },
 272          set: function set(value) {
 273            this.setAttribute('modal-height', value);
 274          }
 275        }, {
 276          key: "inputId",
 277          get: function get() {
 278            return this.getAttribute('input');
 279          },
 280          set: function set(value) {
 281            this.setAttribute('input', value);
 282          }
 283        }, {
 284          key: "inputNameClass",
 285          get: function get() {
 286            return this.getAttribute('input-name');
 287          },
 288          set: function set(value) {
 289            this.setAttribute('input-name', value);
 290          }
 291        }, {
 292          key: "buttonSelectClass",
 293          get: function get() {
 294            return this.getAttribute('button-select');
 295          },
 296          set: function set(value) {
 297            this.setAttribute('button-select', value);
 298          }
 299        }], [{
 300          key: "observedAttributes",
 301          get: function get() {
 302            return ['url', 'modal', 'modal-width', 'modal-height', 'input', 'input-name', 'button-select'];
 303          }
 304        }]);
 305  
 306        return JoomlaFieldUser;
 307      }( /*#__PURE__*/_wrapNativeSuper(HTMLElement));
 308  
 309      customElements.define('joomla-field-user', JoomlaFieldUser);
 310    })(customElements, Joomla);
 311  
 312  })();