diff --git a/typo3/sysext/backend/Resources/Private/TypeScript/OnlineMedia.ts b/typo3/sysext/backend/Resources/Private/TypeScript/OnlineMedia.ts
new file mode 100644
index 000000000000..90b814bde0f5
--- /dev/null
+++ b/typo3/sysext/backend/Resources/Private/TypeScript/OnlineMedia.ts
@@ -0,0 +1,124 @@
+/*
+ * This file is part of the TYPO3 CMS project.
+ *
+ * It is free software; you can redistribute it and/or modify it under
+ * the terms of the GNU General Public License, either version 2
+ * of the License, or any later version.
+ *
+ * For the full copyright and license information, please read the
+ * LICENSE.txt file that was distributed with this source code.
+ *
+ * The TYPO3 project - inspiring people to share!
+ */
+
+import {KeyTypesEnum} from './Enum/KeyTypes';
+import * as $ from 'jquery';
+import NProgress = require('nprogress');
+import Modal = require('./Modal');
+import Severity = require('./Severity');
+
+interface Response {
+ file?: number;
+ error?: string;
+}
+
+/**
+ * Module: TYPO3/CMS/Backend/OnlineMedia
+ * Javascript for show the online media dialog
+ */
+class OnlineMedia {
+ constructor() {
+ $((): void => {
+ this.registerEvents();
+ });
+ }
+
+ private registerEvents(): void {
+ const me = this;
+ $(document).on('click', '.t3js-online-media-add-btn', (e: JQueryEventObject): void => {
+ me.triggerModal($(e.currentTarget));
+ });
+ }
+
+ /**
+ * @param {JQuery} $trigger
+ * @param {string} url
+ */
+ private addOnlineMedia($trigger: JQuery, url: string): void {
+ const target = $trigger.data('target-folder');
+ const allowed = $trigger.data('online-media-allowed');
+ const irreObjectUid = $trigger.data('file-irre-object');
+
+ NProgress.start();
+ $.post(
+ TYPO3.settings.ajaxUrls.online_media_create,
+ {
+ url: url,
+ targetFolder: target,
+ allowed: allowed
+ },
+ (data: Response): void => {
+ if (data.file) {
+ window.inline.delayedImportElement(irreObjectUid, 'sys_file', data.file, 'file');
+ } else {
+ const $confirm = Modal.confirm(
+ 'ERROR',
+ data.error,
+ Severity.error,
+ [{
+ text: TYPO3.lang['button.ok'] || 'OK',
+ btnClass: 'btn-' + Severity.getCssClass(Severity.error),
+ name: 'ok',
+ active: true
+ }]
+ ).on('confirm.button.ok', (): void => {
+ $confirm.modal('hide');
+ });
+ }
+ NProgress.done();
+ }
+ );
+ }
+
+ /**
+ * @param {JQuery} $currentTarget
+ */
+ private triggerModal($currentTarget: JQuery): void {
+ const btnSubmit = $currentTarget.data('data-btn-submit') || 'Add';
+ const placeholder = $currentTarget.data('placeholder') || 'Paste media url here...';
+ const allowedExtMarkup = $.map($currentTarget.data('online-media-allowed').split(','), (ext: string): string => {
+ return '' + ext.toUpperCase() + ' ';
+ });
+ const allowedHelpText = $currentTarget.data('online-media-allowed-help-text') || 'Allow to embed from sources:';
+ const $modal = Modal.show(
+ $currentTarget.attr('title'),
+ '
' +
+ ' ' +
+ '
' + allowedHelpText + ' ' + allowedExtMarkup.join(' ') + '
',
+ Severity.notice,
+ [{
+ text: btnSubmit,
+ btnClass: 'btn btn-primary',
+ name: 'ok',
+ trigger: (): void => {
+ const url = $modal.find('input.online-media-url').val();
+ if (url) {
+ $modal.modal('hide');
+ this.addOnlineMedia($currentTarget, url);
+ }
+ }
+ }]
+ );
+
+ $modal.on('shown.bs.modal', (e: JQueryEventObject): void => {
+ // focus the input field
+ $(e.currentTarget).find('input.online-media-url').first().focus().on('keydown', (kdEvt: JQueryEventObject): void => {
+ if (kdEvt.keyCode === KeyTypesEnum.ENTER) {
+ $modal.find('button[name="ok"]').trigger('click');
+ }
+ });
+ });
+ }
+}
+
+export = new OnlineMedia();
diff --git a/typo3/sysext/backend/Resources/Public/JavaScript/OnlineMedia.js b/typo3/sysext/backend/Resources/Public/JavaScript/OnlineMedia.js
index c9d305139116..0ed95dca9146 100644
--- a/typo3/sysext/backend/Resources/Public/JavaScript/OnlineMedia.js
+++ b/typo3/sysext/backend/Resources/Public/JavaScript/OnlineMedia.js
@@ -10,123 +10,4 @@
*
* The TYPO3 project - inspiring people to share!
*/
-
-/**
- * Module: TYPO3/CMS/Backend/OnlineMedia
- * Javascript for show the online media dialog
- */
-define(['jquery',
- 'nprogress',
- 'TYPO3/CMS/Backend/Modal',
- 'TYPO3/CMS/Backend/Severity',
- 'TYPO3/CMS/Lang/Lang'
-], function($, NProgress, Modal, Severity) {
- 'use strict';
-
- /**
- *
- * @param element
- * @constructor
- * @exports TYPO3/CMS/Backend/OnlineMedia
- */
- var OnlineMediaPlugin = function(element) {
- var me = this;
- me.$btn = $(element);
- me.target = me.$btn.data('target-folder');
- me.irreObjectUid = me.$btn.data('file-irre-object');
- me.allowed = me.$btn.data('online-media-allowed');
- me.allowedHelpText = me.$btn.data('online-media-allowed-help-text') || 'Allow to embed from sources:';
- me.btnSubmit = me.$btn.data('data-btn-submit') || 'Add';
- me.placeholder = me.$btn.data('placeholder') || 'Paste media url here...';
-
- /**
- *
- * @param {String} url
- */
- me.addOnlineMedia = function(url) {
- NProgress.start();
- $.post(TYPO3.settings.ajaxUrls['online_media_create'],
- {
- url: url,
- targetFolder: me.target,
- allowed: me.allowed
- },
- function(data) {
- if (data.file) {
- inline.delayedImportElement(
- me.irreObjectUid,
- 'sys_file',
- data.file,
- 'file'
- );
- } else {
- var $confirm = Modal.confirm(
- 'ERROR',
- data.error,
- Severity.error,
- [{
- text: TYPO3.lang['button.ok'] || 'OK',
- btnClass: 'btn-' + Severity.getCssClass(Severity.error),
- name: 'ok',
- active: true
- }]
- ).on('confirm.button.ok', function() {
- $confirm.modal('hide');
- });
- }
- NProgress.done();
- }
- );
- };
-
- /**
- * Trigger the modal
- */
- me.triggerModal = function() {
- var allowedExtMarkup = $.map(me.allowed.split(','), function(ext) {
- return '' + ext.toUpperCase() + ' ';
- });
- var $modal = Modal.show(
- me.$btn.attr('title'),
- '' +
- ' ' +
- '
' + me.allowedHelpText + ' ' + allowedExtMarkup.join(' ') + '
',
- Severity.notice,
- [{
- text: me.btnSubmit,
- btnClass: 'btn',
- name: 'ok',
- trigger: function() {
- var url = $modal.find('input.online-media-url').val();
- if (url) {
- $modal.modal('hide');
- me.addOnlineMedia(url);
- }
- }
- }]
- );
-
- $modal.on('shown.bs.modal', function() {
- // focus the input field
- $(this).find('input.online-media-url').first().focus().on('keydown', function(e) {
- if (e.keyCode === 13) {
- $modal.find('button[name="ok"]').trigger('click');
- }
- });
- });
- };
-
- return {triggerModal: me.triggerModal};
- };
-
- $(document).on('click', '.t3js-online-media-add-btn', function(evt) {
- evt.preventDefault();
- var $this = $(this),
- onlineMediaPlugin = $this.data('OnlineMediaPlugin');
- if (!onlineMediaPlugin) {
- $this.data('OnlineMediaPlugin', (onlineMediaPlugin = new OnlineMediaPlugin(this)));
- }
- onlineMediaPlugin.triggerModal();
- });
-
-});
+define(["require","exports","./Enum/KeyTypes","jquery","nprogress","./Modal","./Severity"],function(e,t,n,o,i,r,a){"use strict";return new(function(){function e(){var e=this;o(function(){e.registerEvents()})}return e.prototype.registerEvents=function(){var e=this;o(document).on("click",".t3js-online-media-add-btn",function(t){e.triggerModal(o(t.currentTarget))})},e.prototype.addOnlineMedia=function(e,t){var n=e.data("target-folder"),l=e.data("online-media-allowed"),d=e.data("file-irre-object");i.start(),o.post(TYPO3.settings.ajaxUrls.online_media_create,{url:t,targetFolder:n,allowed:l},function(e){if(e.file)window.inline.delayedImportElement(d,"sys_file",e.file,"file");else var t=r.confirm("ERROR",e.error,a.error,[{text:TYPO3.lang["button.ok"]||"OK",btnClass:"btn-"+a.getCssClass(a.error),name:"ok",active:!0}]).on("confirm.button.ok",function(){t.modal("hide")});i.done()})},e.prototype.triggerModal=function(e){var t=this,i=e.data("data-btn-submit")||"Add",l=e.data("placeholder")||"Paste media url here...",d=o.map(e.data("online-media-allowed").split(","),function(e){return''+e.toUpperCase()+" "}),s=e.data("online-media-allowed-help-text")||"Allow to embed from sources:",c=r.show(e.attr("title"),'
'+s+" "+d.join(" ")+"
",a.notice,[{text:i,btnClass:"btn btn-primary",name:"ok",trigger:function(){var n=c.find("input.online-media-url").val();n&&(c.modal("hide"),t.addOnlineMedia(e,n))}}]);c.on("shown.bs.modal",function(e){o(e.currentTarget).find("input.online-media-url").first().focus().on("keydown",function(e){e.keyCode===n.KeyTypesEnum.ENTER&&c.find('button[name="ok"]').trigger("click")})})},e}())});
\ No newline at end of file