[ Index ] |
PHP Cross Reference of Joomla 4.2.2 documentation |
[Summary view] [Print] [Text view]
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, '"')); 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, '"')); 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, '"')); 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 })();
title
Description
Body
title
Description
Body
title
Description
Body
title
Body
Generated: Wed Sep 7 05:41:13 2022 | Chilli.vc Blog - For Webmaster,Blog-Writer,System Admin and Domainer |