[ Index ]

PHP Cross Reference of Joomla 4.2.2 documentation

title

Body

[close]

/media/system/js/fields/ -> joomla-media-select-es5.js (source)

   1  (function () {
   2    'use strict';
   3  
   4    function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) {
   5      try {
   6        var info = gen[key](arg);
   7        var value = info.value;
   8      } catch (error) {
   9        reject(error);
  10        return;
  11      }
  12  
  13      if (info.done) {
  14        resolve(value);
  15      } else {
  16        Promise.resolve(value).then(_next, _throw);
  17      }
  18    }
  19  
  20    function _asyncToGenerator(fn) {
  21      return function () {
  22        var self = this,
  23            args = arguments;
  24        return new Promise(function (resolve, reject) {
  25          var gen = fn.apply(self, args);
  26  
  27          function _next(value) {
  28            asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value);
  29          }
  30  
  31          function _throw(err) {
  32            asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err);
  33          }
  34  
  35          _next(undefined);
  36        });
  37      };
  38    }
  39  
  40    function _defineProperties(target, props) {
  41      for (var i = 0; i < props.length; i++) {
  42        var descriptor = props[i];
  43        descriptor.enumerable = descriptor.enumerable || false;
  44        descriptor.configurable = true;
  45        if ("value" in descriptor) descriptor.writable = true;
  46        Object.defineProperty(target, descriptor.key, descriptor);
  47      }
  48    }
  49  
  50    function _createClass(Constructor, protoProps, staticProps) {
  51      if (protoProps) _defineProperties(Constructor.prototype, protoProps);
  52      if (staticProps) _defineProperties(Constructor, staticProps);
  53      Object.defineProperty(Constructor, "prototype", {
  54        writable: false
  55      });
  56      return Constructor;
  57    }
  58  
  59    function _inheritsLoose(subClass, superClass) {
  60      subClass.prototype = Object.create(superClass.prototype);
  61      subClass.prototype.constructor = subClass;
  62  
  63      _setPrototypeOf(subClass, superClass);
  64    }
  65  
  66    function _getPrototypeOf(o) {
  67      _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) {
  68        return o.__proto__ || Object.getPrototypeOf(o);
  69      };
  70      return _getPrototypeOf(o);
  71    }
  72  
  73    function _setPrototypeOf(o, p) {
  74      _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) {
  75        o.__proto__ = p;
  76        return o;
  77      };
  78  
  79      return _setPrototypeOf(o, p);
  80    }
  81  
  82    function _isNativeReflectConstruct() {
  83      if (typeof Reflect === "undefined" || !Reflect.construct) return false;
  84      if (Reflect.construct.sham) return false;
  85      if (typeof Proxy === "function") return true;
  86  
  87      try {
  88        Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {}));
  89        return true;
  90      } catch (e) {
  91        return false;
  92      }
  93    }
  94  
  95    function _construct(Parent, args, Class) {
  96      if (_isNativeReflectConstruct()) {
  97        _construct = Reflect.construct;
  98      } else {
  99        _construct = function _construct(Parent, args, Class) {
 100          var a = [null];
 101          a.push.apply(a, args);
 102          var Constructor = Function.bind.apply(Parent, a);
 103          var instance = new Constructor();
 104          if (Class) _setPrototypeOf(instance, Class.prototype);
 105          return instance;
 106        };
 107      }
 108  
 109      return _construct.apply(null, arguments);
 110    }
 111  
 112    function _isNativeFunction(fn) {
 113      return Function.toString.call(fn).indexOf("[native code]") !== -1;
 114    }
 115  
 116    function _wrapNativeSuper(Class) {
 117      var _cache = typeof Map === "function" ? new Map() : undefined;
 118  
 119      _wrapNativeSuper = function _wrapNativeSuper(Class) {
 120        if (Class === null || !_isNativeFunction(Class)) return Class;
 121  
 122        if (typeof Class !== "function") {
 123          throw new TypeError("Super expression must either be null or a function");
 124        }
 125  
 126        if (typeof _cache !== "undefined") {
 127          if (_cache.has(Class)) return _cache.get(Class);
 128  
 129          _cache.set(Class, Wrapper);
 130        }
 131  
 132        function Wrapper() {
 133          return _construct(Class, arguments, _getPrototypeOf(this).constructor);
 134        }
 135  
 136        Wrapper.prototype = Object.create(Class.prototype, {
 137          constructor: {
 138            value: Wrapper,
 139            enumerable: false,
 140            writable: true,
 141            configurable: true
 142          }
 143        });
 144        return _setPrototypeOf(Wrapper, Class);
 145      };
 146  
 147      return _wrapNativeSuper(Class);
 148    }
 149  
 150    /**
 151     * @copyright   (C) 2021 Open Source Matters, Inc. <https://www.joomla.org>
 152     * @license     GNU General Public License version 2 or later; see LICENSE.txt
 153     */
 154    if (!Joomla) {
 155      throw new Error('Joomla API is not properly initiated');
 156    }
 157    /**
 158     * An object holding all the information of the selected image in media manager
 159     * eg:
 160     * {
 161     *   extension: "png"
 162     *   fileType: "image/png"
 163     *   height: 44
 164     *   path: "local-images:/powered_by.png"
 165     *   thumb: undefined
 166     *   width: 294
 167     * }
 168     */
 169  
 170  
 171    Joomla.selectedMediaFile = {};
 172    var supportedExtensions = Joomla.getOptions('media-picker', {});
 173  
 174    if (!Object.keys(supportedExtensions).length) {
 175      throw new Error('No supported extensions provided');
 176    }
 177    /**
 178     * Event Listener that updates the Joomla.selectedMediaFile
 179     * to the selected file in the media manager
 180     */
 181  
 182  
 183    document.addEventListener('onMediaFileSelected', /*#__PURE__*/function () {
 184      var _ref = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee(e) {
 185        var currentModal, container, optionsEl, images, audios, videos, documents, type;
 186        return regeneratorRuntime.wrap(function _callee$(_context) {
 187          while (1) {
 188            switch (_context.prev = _context.next) {
 189              case 0:
 190                Joomla.selectedMediaFile = e.detail;
 191                currentModal = Joomla.Modal.getCurrent();
 192                container = currentModal.querySelector('.modal-body');
 193  
 194                if (container) {
 195                  _context.next = 5;
 196                  break;
 197                }
 198  
 199                return _context.abrupt("return");
 200  
 201              case 5:
 202                optionsEl = container.querySelector('joomla-field-mediamore');
 203  
 204                if (optionsEl) {
 205                  optionsEl.parentNode.removeChild(optionsEl);
 206                } // No extra attributes (lazy, alt) for fields
 207  
 208  
 209                if (!container.closest('joomla-field-media')) {
 210                  _context.next = 9;
 211                  break;
 212                }
 213  
 214                return _context.abrupt("return");
 215  
 216              case 9:
 217                images = supportedExtensions.images, audios = supportedExtensions.audios, videos = supportedExtensions.videos, documents = supportedExtensions.documents;
 218  
 219                if (Joomla.selectedMediaFile.path) {
 220                  if (images.includes(Joomla.selectedMediaFile.extension.toLowerCase())) {
 221                    type = 'images';
 222                  } else if (audios.includes(Joomla.selectedMediaFile.extension.toLowerCase())) {
 223                    type = 'audios';
 224                  } else if (videos.includes(Joomla.selectedMediaFile.extension.toLowerCase())) {
 225                    type = 'videos';
 226                  } else if (documents.includes(Joomla.selectedMediaFile.extension.toLowerCase())) {
 227                    type = 'documents';
 228                  }
 229  
 230                  if (type) {
 231                    container.insertAdjacentHTML('afterbegin', "<joomla-field-mediamore\n  parent-id=\"" + currentModal.id + "\"\n  type=\"" + type + "\"\n  summary-label=\"" + Joomla.Text._('JFIELD_MEDIA_SUMMARY_LABEL') + "\"\n  lazy-label=\"" + Joomla.Text._('JFIELD_MEDIA_LAZY_LABEL') + "\"\n  alt-label=\"" + Joomla.Text._('JFIELD_MEDIA_ALT_LABEL') + "\"\n  alt-check-label=\"" + Joomla.Text._('JFIELD_MEDIA_ALT_CHECK_LABEL') + "\"\n  alt-check-desc-label=\"" + Joomla.Text._('JFIELD_MEDIA_ALT_CHECK_DESC_LABEL') + "\"\n  classes-label=\"" + Joomla.Text._('JFIELD_MEDIA_CLASS_LABEL') + "\"\n  figure-classes-label=\"" + Joomla.Text._('JFIELD_MEDIA_FIGURE_CLASS_LABEL') + "\"\n  figure-caption-label=\"" + Joomla.Text._('JFIELD_MEDIA_FIGURE_CAPTION_LABEL') + "\"\n  embed-check-label=\"" + Joomla.Text._('JFIELD_MEDIA_EMBED_CHECK_LABEL') + "\"\n  embed-check-desc-label=\"" + Joomla.Text._('JFIELD_MEDIA_EMBED_CHECK_DESC_LABEL') + "\"\n  download-check-label=\"" + Joomla.Text._('JFIELD_MEDIA_DOWNLOAD_CHECK_LABEL') + "\"\n  download-check-desc-label=\"" + Joomla.Text._('JFIELD_MEDIA_DOWNLOAD_CHECK_DESC_LABEL') + "\"\n  title-label=\"" + Joomla.Text._('JFIELD_MEDIA_TITLE_LABEL') + "\"\n  width-label=\"" + Joomla.Text._('JFIELD_MEDIA_WIDTH_LABEL') + "\"\n  height-label=\"" + Joomla.Text._('JFIELD_MEDIA_HEIGHT_LABEL') + "\"\n></joomla-field-mediamore>\n");
 232                  }
 233                }
 234  
 235              case 11:
 236              case "end":
 237                return _context.stop();
 238            }
 239          }
 240        }, _callee);
 241      }));
 242  
 243      return function (_x) {
 244        return _ref.apply(this, arguments);
 245      };
 246    }());
 247    /**
 248     * Method to check if passed param is HTMLElement
 249     *
 250     * @param o {string|HTMLElement}  Element to be checked
 251     *
 252     * @returns {boolean}
 253     */
 254  
 255    var isElement = function isElement(o) {
 256      return typeof HTMLElement === 'object' ? o instanceof HTMLElement : o && typeof o === 'object' && o.nodeType === 1 && typeof o.nodeName === 'string';
 257    };
 258    /**
 259     * Method to return the image size
 260     *
 261     * @param url {string}
 262     *
 263     * @returns {bool}
 264     */
 265  
 266  
 267    var getImageSize = function getImageSize(url) {
 268      return new Promise(function (resolve, reject) {
 269        var img = new Image();
 270        img.src = url;
 271  
 272        img.onload = function () {
 273          Joomla.selectedMediaFile.width = img.width;
 274          Joomla.selectedMediaFile.height = img.height;
 275          resolve(true);
 276        };
 277  
 278        img.onerror = function () {
 279          // eslint-disable-next-line prefer-promise-reject-errors
 280          reject(false);
 281        };
 282      });
 283    };
 284  
 285    var insertAsImage = /*#__PURE__*/function () {
 286      var _ref2 = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee2(media, editor, fieldClass) {
 287        var _Joomla$getOptions, rootFull, parts, attribs, isLazy, alt, appendAlt, classes, figClasses, figCaption, imageElement, currentModal;
 288  
 289        return regeneratorRuntime.wrap(function _callee2$(_context2) {
 290          while (1) {
 291            switch (_context2.prev = _context2.next) {
 292              case 0:
 293                if (media.url) {
 294                  _Joomla$getOptions = Joomla.getOptions('system.paths'), rootFull = _Joomla$getOptions.rootFull;
 295                  parts = media.url.split(rootFull);
 296  
 297                  if (parts.length > 1) {
 298                    // eslint-disable-next-line prefer-destructuring
 299                    Joomla.selectedMediaFile.url = parts[1];
 300  
 301                    if (media.thumb_path) {
 302                      Joomla.selectedMediaFile.thumb = media.thumb_path;
 303                    } else {
 304                      Joomla.selectedMediaFile.thumb = false;
 305                    }
 306                  } else if (media.thumb_path) {
 307                    Joomla.selectedMediaFile.url = media.url;
 308                    Joomla.selectedMediaFile.thumb = media.thumb_path;
 309                  }
 310                } else {
 311                  Joomla.selectedMediaFile.url = false;
 312                }
 313  
 314                if (!Joomla.selectedMediaFile.url) {
 315                  _context2.next = 47;
 316                  break;
 317                }
 318  
 319                isLazy = '';
 320                alt = '';
 321                appendAlt = '';
 322                classes = '';
 323                figClasses = '';
 324                figCaption = '';
 325                imageElement = '';
 326  
 327                if (isElement(editor)) {
 328                  _context2.next = 35;
 329                  break;
 330                }
 331  
 332                currentModal = fieldClass.closest('.modal-content');
 333                attribs = currentModal.querySelector('joomla-field-mediamore');
 334  
 335                if (!attribs) {
 336                  _context2.next = 30;
 337                  break;
 338                }
 339  
 340                if (attribs.getAttribute('alt-check') === 'true') {
 341                  appendAlt = ' alt=""';
 342                }
 343  
 344                alt = attribs.getAttribute('alt-value') ? " alt=\"" + attribs.getAttribute('alt-value') + "\"" : appendAlt;
 345                classes = attribs.getAttribute('img-classes') ? " class=\"" + attribs.getAttribute('img-classes') + "\"" : '';
 346                figClasses = attribs.getAttribute('fig-classes') ? " class=\"image " + attribs.getAttribute('fig-classes') + "\"" : ' class="image"';
 347                figCaption = attribs.getAttribute('fig-caption') ? "" + attribs.getAttribute('fig-caption') : '';
 348  
 349                if (!(attribs.getAttribute('is-lazy') === 'true')) {
 350                  _context2.next = 30;
 351                  break;
 352                }
 353  
 354                isLazy = " loading=\"lazy\" width=\"" + Joomla.selectedMediaFile.width + "\" height=\"" + Joomla.selectedMediaFile.height + "\"";
 355  
 356                if (!(Joomla.selectedMediaFile.width === 0 || Joomla.selectedMediaFile.height === 0)) {
 357                  _context2.next = 30;
 358                  break;
 359                }
 360  
 361                _context2.prev = 21;
 362                _context2.next = 24;
 363                return getImageSize(Joomla.selectedMediaFile.url);
 364  
 365              case 24:
 366                isLazy = " loading=\"lazy\" width=\"" + Joomla.selectedMediaFile.width + "\" height=\"" + Joomla.selectedMediaFile.height + "\"";
 367                _context2.next = 30;
 368                break;
 369  
 370              case 27:
 371                _context2.prev = 27;
 372                _context2.t0 = _context2["catch"](21);
 373                isLazy = '';
 374  
 375              case 30:
 376                if (figCaption) {
 377                  imageElement = "<figure" + figClasses + "><img src=\"" + Joomla.selectedMediaFile.url + "\"" + classes + isLazy + alt + " data-path=\"" + Joomla.selectedMediaFile.path + "\"/><figcaption>" + figCaption + "</figcaption></figure>";
 378                } else {
 379                  imageElement = "<img src=\"" + Joomla.selectedMediaFile.url + "\"" + classes + isLazy + alt + " data-path=\"" + Joomla.selectedMediaFile.path + "\"/>";
 380                }
 381  
 382                if (attribs) {
 383                  attribs.parentNode.removeChild(attribs);
 384                }
 385  
 386                Joomla.editors.instances[editor].replaceSelection(imageElement);
 387                _context2.next = 47;
 388                break;
 389  
 390              case 35:
 391                if (!(Joomla.selectedMediaFile.width === 0 || Joomla.selectedMediaFile.height === 0)) {
 392                  _context2.next = 45;
 393                  break;
 394                }
 395  
 396                _context2.prev = 36;
 397                _context2.next = 39;
 398                return getImageSize(Joomla.selectedMediaFile.url);
 399  
 400              case 39:
 401                _context2.next = 45;
 402                break;
 403  
 404              case 41:
 405                _context2.prev = 41;
 406                _context2.t1 = _context2["catch"](36);
 407                Joomla.selectedMediaFile.height = 0;
 408                Joomla.selectedMediaFile.width = 0;
 409  
 410              case 45:
 411                fieldClass.markValid();
 412                fieldClass.setValue(Joomla.selectedMediaFile.url + "#joomlaImage://" + media.path.replace(':', '') + "?width=" + Joomla.selectedMediaFile.width + "&height=" + Joomla.selectedMediaFile.height);
 413  
 414              case 47:
 415              case "end":
 416                return _context2.stop();
 417            }
 418          }
 419        }, _callee2, null, [[21, 27], [36, 41]]);
 420      }));
 421  
 422      return function insertAsImage(_x2, _x3, _x4) {
 423        return _ref2.apply(this, arguments);
 424      };
 425    }();
 426  
 427    var insertAsOther = function insertAsOther(media, editor, fieldClass, type) {
 428      if (media.url) {
 429        var _Joomla$getOptions2 = Joomla.getOptions('system.paths'),
 430            rootFull = _Joomla$getOptions2.rootFull;
 431  
 432        var parts = media.url.split(rootFull);
 433  
 434        if (parts.length > 1) {
 435          // eslint-disable-next-line prefer-destructuring
 436          Joomla.selectedMediaFile.url = parts[1];
 437        } else {
 438          Joomla.selectedMediaFile.url = media.url;
 439        }
 440      } else {
 441        Joomla.selectedMediaFile.url = false;
 442      }
 443  
 444      var attribs;
 445  
 446      if (Joomla.selectedMediaFile.url) {
 447        // Available Only inside an editor
 448        if (!isElement(editor)) {
 449          var outputText;
 450          var currentModal = fieldClass.closest('.modal-content');
 451          attribs = currentModal.querySelector('joomla-field-mediamore');
 452  
 453          if (attribs) {
 454            var embedable = attribs.getAttribute('embed-it');
 455  
 456            if (embedable && embedable === 'true') {
 457              if (type === 'audios') {
 458                outputText = "<audio controls src=\"" + Joomla.selectedMediaFile.url + "\"></audio>";
 459              }
 460  
 461              if (type === 'documents') {
 462                // @todo use ${Joomla.selectedMediaFile.filetype} in type
 463                var title = attribs.getAttribute('title');
 464                outputText = "<object type=\"application/" + Joomla.selectedMediaFile.extension + "\" data=\"" + Joomla.selectedMediaFile.url + "\" " + (title ? "title=\"" + title + "\"" : '') + " width=\"" + attribs.getAttribute('width') + "\" height=\"" + attribs.getAttribute('height') + "\">\n  " + Joomla.Text._('JFIELD_MEDIA_UNSUPPORTED').replace('{tag}', "<a download href=\"" + Joomla.selectedMediaFile.url + "\">").replace(/{extension}/g, Joomla.selectedMediaFile.extension) + "\n</object>";
 465              }
 466  
 467              if (type === 'videos') {
 468                outputText = "<video controls width=\"" + attribs.getAttribute('width') + "\" height=\"" + attribs.getAttribute('height') + "\">\n  <source src=\"" + Joomla.selectedMediaFile.url + "\" type=\"" + Joomla.selectedMediaFile.fileType + "\">\n</video>";
 469              }
 470            } else if (Joomla.editors.instances[editor].getSelection() !== '') {
 471              outputText = "<a download href=\"" + Joomla.selectedMediaFile.url + "\">" + Joomla.editors.instances[editor].getSelection() + "</a>";
 472            } else {
 473              var name = /([\w-]+)\./.exec(Joomla.selectedMediaFile.url);
 474              outputText = "<a download href=\"" + Joomla.selectedMediaFile.url + "\">" + Joomla.Text._('JFIELD_MEDIA_DOWNLOAD_FILE').replace('{file}', name[1]) + "</a>";
 475            }
 476          }
 477  
 478          if (attribs) {
 479            attribs.parentNode.removeChild(attribs);
 480          }
 481  
 482          Joomla.editors.instances[editor].replaceSelection(outputText);
 483        } else {
 484          fieldClass.markValid();
 485          fieldClass.givenType = type;
 486          fieldClass.setValue(Joomla.selectedMediaFile.url);
 487        }
 488      }
 489    };
 490    /**
 491     * Method to append the image in an editor or a field
 492     *
 493     * @param {{}} resp
 494     * @param {string|HTMLElement} editor
 495     * @param {string} fieldClass
 496     */
 497  
 498  
 499    var execTransform = /*#__PURE__*/function () {
 500      var _ref3 = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee3(resp, editor, fieldClass) {
 501        var media, images, audios, videos, documents;
 502        return regeneratorRuntime.wrap(function _callee3$(_context3) {
 503          while (1) {
 504            switch (_context3.prev = _context3.next) {
 505              case 0:
 506                if (!(resp.success === true)) {
 507                  _context3.next = 12;
 508                  break;
 509                }
 510  
 511                media = resp.data[0];
 512                images = supportedExtensions.images, audios = supportedExtensions.audios, videos = supportedExtensions.videos, documents = supportedExtensions.documents;
 513  
 514                if (!(Joomla.selectedMediaFile.extension && images.includes(media.extension.toLowerCase()))) {
 515                  _context3.next = 5;
 516                  break;
 517                }
 518  
 519                return _context3.abrupt("return", insertAsImage(media, editor, fieldClass));
 520  
 521              case 5:
 522                if (!(Joomla.selectedMediaFile.extension && audios.includes(media.extension.toLowerCase()))) {
 523                  _context3.next = 7;
 524                  break;
 525                }
 526  
 527                return _context3.abrupt("return", insertAsOther(media, editor, fieldClass, 'audios'));
 528  
 529              case 7:
 530                if (!(Joomla.selectedMediaFile.extension && documents.includes(media.extension.toLowerCase()))) {
 531                  _context3.next = 9;
 532                  break;
 533                }
 534  
 535                return _context3.abrupt("return", insertAsOther(media, editor, fieldClass, 'documents'));
 536  
 537              case 9:
 538                if (!(Joomla.selectedMediaFile.extension && videos.includes(media.extension.toLowerCase()))) {
 539                  _context3.next = 11;
 540                  break;
 541                }
 542  
 543                return _context3.abrupt("return", insertAsOther(media, editor, fieldClass, 'videos'));
 544  
 545              case 11:
 546                return _context3.abrupt("return", '');
 547  
 548              case 12:
 549                return _context3.abrupt("return", '');
 550  
 551              case 13:
 552              case "end":
 553                return _context3.stop();
 554            }
 555          }
 556        }, _callee3);
 557      }));
 558  
 559      return function execTransform(_x5, _x6, _x7) {
 560        return _ref3.apply(this, arguments);
 561      };
 562    }();
 563    /**
 564     * Method that resolves the real url for the selected media file
 565     *
 566     * @param data        {object}         The data for the detail
 567     * @param editor      {string|object}  The data for the detail
 568     * @param fieldClass  {HTMLElement}    The fieldClass for the detail
 569     *
 570     * @returns {void}
 571     */
 572  
 573  
 574    Joomla.getMedia = function (data, editor, fieldClass) {
 575      return new Promise(function (resolve, reject) {
 576        if (!data || typeof data === 'object' && (!data.path || data.path === '')) {
 577          Joomla.selectedMediaFile = {};
 578          resolve({
 579            resp: {
 580              success: false
 581            }
 582          });
 583          return;
 584        }
 585  
 586        var url = Joomla.getOptions('system.paths').baseFull + "index.php?option=com_media&task=api.files&url=true&path=" + data.path + "&mediatypes=0,1,2,3&" + Joomla.getOptions('csrf.token') + "=1&format=json";
 587        fetch(url, {
 588          method: 'GET',
 589          headers: {
 590            'Content-Type': 'application/json'
 591          }
 592        }).then(function (response) {
 593          return response.json();
 594        }).then( /*#__PURE__*/function () {
 595          var _ref4 = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee4(response) {
 596            return regeneratorRuntime.wrap(function _callee4$(_context4) {
 597              while (1) {
 598                switch (_context4.prev = _context4.next) {
 599                  case 0:
 600                    _context4.t0 = resolve;
 601                    _context4.next = 3;
 602                    return execTransform(response, editor, fieldClass);
 603  
 604                  case 3:
 605                    _context4.t1 = _context4.sent;
 606                    return _context4.abrupt("return", (0, _context4.t0)(_context4.t1));
 607  
 608                  case 5:
 609                  case "end":
 610                    return _context4.stop();
 611                }
 612              }
 613            }, _callee4);
 614          }));
 615  
 616          return function (_x8) {
 617            return _ref4.apply(this, arguments);
 618          };
 619        }()).catch(function (error) {
 620          return reject(error);
 621        });
 622      });
 623    }; // For B/C purposes
 624  
 625  
 626    Joomla.getImage = Joomla.getMedia;
 627    /**
 628     * A simple Custom Element for adding alt text and controlling
 629     * the lazy loading on a selected image
 630     *
 631     * Will be rendered only for editor content images
 632     * Attributes:
 633     * - parent-id: the id of the parent media field {string}
 634     * - lazy-label: The text for the checkbox label {string}
 635     * - alt-label: The text for the alt label {string}
 636     * - is-lazy: The value for the lazyloading (calculated, defaults to 'true') {string}
 637     * - alt-value: The value for the alt text (calculated, defaults to '') {string}
 638     */
 639  
 640    var JoomlaFieldMediaOptions = /*#__PURE__*/function (_HTMLElement) {
 641      _inheritsLoose(JoomlaFieldMediaOptions, _HTMLElement);
 642  
 643      function JoomlaFieldMediaOptions() {
 644        return _HTMLElement.apply(this, arguments) || this;
 645      }
 646  
 647      var _proto = JoomlaFieldMediaOptions.prototype;
 648  
 649      _proto.connectedCallback = function connectedCallback() {
 650        var _this = this;
 651  
 652        if (this.type === 'images') {
 653          this.innerHTML = "<details open>\n<summary>" + this.summarytext + "</summary>\n<div class=\"\">\n  <div class=\"form-group\">\n    <div class=\"input-group\">\n      <label class=\"input-group-text\" for=\"" + this.parentId + "-alt\">" + this.alttext + "</label>\n      <input class=\"form-control\" type=\"text\" id=\"" + this.parentId + "-alt\" data-is=\"alt-value\" />\n    </div>\n  </div>\n  <div class=\"form-group\">\n    <div class=\"form-check\">\n      <input class=\"form-check-input\" type=\"checkbox\" id=\"" + this.parentId + "-alt-check\">\n      <label class=\"form-check-label\" for=\"" + this.parentId + "-alt-check\">" + this.altchecktext + "</label>\n      <div><small class=\"form-text\">" + this.altcheckdesctext + "</small></div>\n    </div>\n  </div>\n  <div class=\"form-group\">\n    <div class=\"form-check\">\n      <input class=\"form-check-input\" type=\"checkbox\" id=\"" + this.parentId + "-lazy\" checked>\n      <label class=\"form-check-label\" for=\"" + this.parentId + "-lazy\">" + this.lazytext + "</label>\n    </div>\n  </div>\n  <div class=\"form-group\">\n    <div class=\"input-group\">\n      <label class=\"input-group-text\" for=\"" + this.parentId + "-classes\">" + this.classestext + "</label>\n      <input class=\"form-control\" type=\"text\" id=\"" + this.parentId + "-classes\" data-is=\"img-classes\"/>\n    </div>\n  </div>\n  <div class=\"form-group\">\n    <div class=\"input-group\">\n      <label class=\"input-group-text\" for=\"" + this.parentId + "-figclasses\">" + this.figclassestext + "</label>\n      <input class=\"form-control\" type=\"text\" id=\"" + this.parentId + "-figclasses\" data-is=\"fig-classes\"/>\n    </div>\n  </div>\n  <div class=\"form-group\">\n    <div class=\"input-group\">\n      <label class=\"input-group-text\" for=\"" + this.parentId + "-figcaption\">" + this.figcaptiontext + "</label>\n      <input class=\"form-control\" type=\"text\" id=\"" + this.parentId + "-figcaption\" data-is=\"fig-caption\"/>\n    </div>\n  </div>\n</div>\n</details>";
 654          this.lazyInputFn = this.lazyInputFn.bind(this);
 655          this.altCheckFn = this.altCheckFn.bind(this);
 656          this.inputFn = this.inputFn.bind(this); // Add event listeners
 657  
 658          this.lazyInput = this.querySelector("#" + this.parentId + "-lazy");
 659          this.lazyInput.addEventListener('change', this.lazyInputFn);
 660          this.altCheck = this.querySelector("#" + this.parentId + "-alt-check");
 661          this.altCheck.addEventListener('input', this.altCheckFn);
 662          [].slice.call(this.querySelectorAll('input[type="text"]')).map(function (el) {
 663            el.addEventListener('input', _this.inputFn);
 664            var is = el.dataset.is;
 665  
 666            if (is) {
 667              _this.setAttribute(is, el.value.replace(/"/g, '&quot;'));
 668            }
 669  
 670            return el;
 671          }); // Set initial values
 672  
 673          this.setAttribute('is-lazy', !!this.lazyInput.checked);
 674          this.setAttribute('alt-check', false);
 675        } else if (['audios', 'videos', 'documents'].includes(this.type)) {
 676          this.innerHTML = "<details open>\n<summary>" + this.summarytext + "</summary>\n<div class=\"\">\n  <div class=\"form-group\">\n    <div class=\"form-check\">\n      <input class=\"form-check-input radio\" type=\"radio\" name=\"flexRadioDefault\" id=\"" + this.parentId + "-embed-check-2\" value=\"0\" checked>\n      <label class=\"form-check-label\" for=\"" + this.parentId + "-embed-check-2\">\n        " + this.downloadchecktext + "\n        <div><small class=\"form-text\">" + this.downloadcheckdesctext + "</small></div>\n      </label>\n    </div>\n    <div class=\"form-check\">\n      <input class=\"form-check-input radio\" type=\"radio\" name=\"flexRadioDefault\" id=\"" + this.parentId + "-embed-check-1\" value=\"1\">\n      <label class=\"form-check-label\" for=\"" + this.parentId + "-embed-check-1\">\n        " + this.embedchecktext + "\n        <div><small class=\"form-text\">" + this.embedcheckdesctext + "</small></div>\n      </label>\n    </div>\n  </div>\n  <div class=\"toggable-parts\" style=\"display: none\">\n    <div style=\"display: " + (this.type === 'audios' ? 'none' : 'block') + "\">\n      <div class=\"form-group\">\n        <div class=\"input-group\">\n          <label class=\"input-group-text\" for=\"" + this.parentId + "-width\">" + this.widthtext + "</label>\n          <input class=\"form-control\" type=\"text\" id=\"" + this.parentId + "-width\" value=\"800\" data-is=\"width\"/>\n        </div>\n      </div>\n      <div class=\"form-group\">\n        <div class=\"input-group\">\n          <label class=\"input-group-text\" for=\"" + this.parentId + "-height\">" + this.heighttext + "</label>\n          <input class=\"form-control\" type=\"text\" id=\"" + this.parentId + "-height\" value=\"600\" data-is=\"height\"/>\n        </div>\n      </div>\n      <div style=\"display: " + (this.type === 'document' ? 'block' : 'none') + "\">\n        <div class=\"form-group\">\n          <div class=\"input-group\">\n            <label class=\"input-group-text\" for=\"" + this.parentId + "-title\">" + this.titletext + "</label>\n            <input class=\"form-control\" type=\"text\" id=\"" + this.parentId + "-title\" value=\"\" data-is=\"title\"/>\n          </div>\n        </div>\n    </div>\n  </div>\n</div>\n</details>";
 677          this.embedInputFn = this.embedInputFn.bind(this);
 678          this.inputFn = this.inputFn.bind(this);
 679          [].slice.call(this.querySelectorAll('.form-check-input.radio')).map(function (el) {
 680            return el.addEventListener('input', _this.embedInputFn);
 681          });
 682          this.setAttribute('embed-it', false);
 683          [].slice.call(this.querySelectorAll('input[type="text"]')).map(function (el) {
 684            el.addEventListener('input', _this.inputFn);
 685            var is = el.dataset.is;
 686  
 687            if (is) {
 688              _this.setAttribute(is, el.value.replace(/"/g, '&quot;'));
 689            }
 690  
 691            return el;
 692          });
 693        }
 694      };
 695  
 696      _proto.disconnectedCallback = function disconnectedCallback() {
 697        var _this2 = this;
 698  
 699        if (this.type === 'image') {
 700          this.lazyInput.removeEventListener('input', this.lazyInputFn);
 701          this.altInput.removeEventListener('input', this.inputFn);
 702          this.altCheck.removeEventListener('input', this.altCheckFn);
 703        }
 704  
 705        if (['audio', 'video', 'document'].includes(this.type)) {
 706          [].slice.call(this.querySelectorAll('.form-check-input.radio')).map(function (el) {
 707            return el.removeEventListener('input', _this2.embedInputFn);
 708          });
 709          [].slice.call(this.querySelectorAll('input[type="text"]')).map(function (el) {
 710            return el.removeEventListener('input', _this2.embedInputFn);
 711          });
 712        }
 713  
 714        this.innerHTML = '';
 715      };
 716  
 717      _proto.lazyInputFn = function lazyInputFn(e) {
 718        this.setAttribute('is-lazy', !!e.target.checked);
 719      };
 720  
 721      _proto.altCheckFn = function altCheckFn(e) {
 722        this.setAttribute('alt-check', !!e.target.checked);
 723      };
 724  
 725      _proto.inputFn = function inputFn(e) {
 726        var is = e.target.dataset.is;
 727  
 728        if (is) {
 729          this.setAttribute(is, e.target.value.replace(/"/g, '&quot;'));
 730        }
 731      };
 732  
 733      _proto.embedInputFn = function embedInputFn(e) {
 734        var value = e.target.value;
 735        this.setAttribute('embed-it', value !== '0');
 736        var toggable = this.querySelector('.toggable-parts');
 737  
 738        if (toggable) {
 739          if (toggable.style.display !== 'block') {
 740            toggable.style.display = 'block';
 741          } else {
 742            toggable.style.display = 'none';
 743          }
 744        }
 745      };
 746  
 747      _createClass(JoomlaFieldMediaOptions, [{
 748        key: "type",
 749        get: function get() {
 750          return this.getAttribute('type');
 751        }
 752      }, {
 753        key: "parentId",
 754        get: function get() {
 755          return this.getAttribute('parent-id');
 756        }
 757      }, {
 758        key: "lazytext",
 759        get: function get() {
 760          return this.getAttribute('lazy-label');
 761        }
 762      }, {
 763        key: "alttext",
 764        get: function get() {
 765          return this.getAttribute('alt-label');
 766        }
 767      }, {
 768        key: "altchecktext",
 769        get: function get() {
 770          return this.getAttribute('alt-check-label');
 771        }
 772      }, {
 773        key: "altcheckdesctext",
 774        get: function get() {
 775          return this.getAttribute('alt-check-desc-label');
 776        }
 777      }, {
 778        key: "embedchecktext",
 779        get: function get() {
 780          return this.getAttribute('embed-check-label');
 781        }
 782      }, {
 783        key: "embedcheckdesctext",
 784        get: function get() {
 785          return this.getAttribute('embed-check-desc-label');
 786        }
 787      }, {
 788        key: "downloadchecktext",
 789        get: function get() {
 790          return this.getAttribute('download-check-label');
 791        }
 792      }, {
 793        key: "downloadcheckdesctext",
 794        get: function get() {
 795          return this.getAttribute('download-check-desc-label');
 796        }
 797      }, {
 798        key: "classestext",
 799        get: function get() {
 800          return this.getAttribute('classes-label');
 801        }
 802      }, {
 803        key: "figclassestext",
 804        get: function get() {
 805          return this.getAttribute('figure-classes-label');
 806        }
 807      }, {
 808        key: "figcaptiontext",
 809        get: function get() {
 810          return this.getAttribute('figure-caption-label');
 811        }
 812      }, {
 813        key: "summarytext",
 814        get: function get() {
 815          return this.getAttribute('summary-label');
 816        }
 817      }, {
 818        key: "widthtext",
 819        get: function get() {
 820          return this.getAttribute('width-label');
 821        }
 822      }, {
 823        key: "heighttext",
 824        get: function get() {
 825          return this.getAttribute('height-label');
 826        }
 827      }, {
 828        key: "titletext",
 829        get: function get() {
 830          return this.getAttribute('title-label');
 831        }
 832      }]);
 833  
 834      return JoomlaFieldMediaOptions;
 835    }( /*#__PURE__*/_wrapNativeSuper(HTMLElement));
 836  
 837    customElements.define('joomla-field-mediamore', JoomlaFieldMediaOptions);
 838  
 839  })();


Generated: Wed Sep 7 05:41:13 2022 Chilli.vc Blog - For Webmaster,Blog-Writer,System Admin and Domainer