diff --git a/Build/Sources/TypeScript/dashboard/dashboard-modal.ts b/Build/Sources/TypeScript/dashboard/dashboard-modal.ts index 87d76c6221a42b107a8481b22f1e60ffb841273a..895a06ff30179aa55042a37c74b038e5efac8231 100644 --- a/Build/Sources/TypeScript/dashboard/dashboard-modal.ts +++ b/Build/Sources/TypeScript/dashboard/dashboard-modal.ts @@ -11,7 +11,6 @@ * The TYPO3 project - inspiring people to share! */ -import $ from 'jquery'; import Modal from '@typo3/backend/modal'; import {SeverityEnum} from '@typo3/backend/enum/severity'; import RegularEvent from '@typo3/core/event/regular-event'; @@ -32,7 +31,7 @@ class DashboardModal { title: this.dataset.modalTitle, size: Modal.sizes.medium, severity: SeverityEnum.notice, - content: $(document.getElementById(`dashboardModal-${this.dataset.modalIdentifier}`).innerHTML), + content: (document.getElementById(`dashboardModal-${this.dataset.modalIdentifier}`) as HTMLTemplateElement).content.cloneNode(true), additionalCssClasses: ['dashboard-modal'], callback: (currentModal: any): void => { currentModal.on('submit', '.dashboardModal-form', (e: JQueryEventObject): void => { diff --git a/Build/Sources/TypeScript/dashboard/widget-selector.ts b/Build/Sources/TypeScript/dashboard/widget-selector.ts index be60a0fe0d8cb86f81a31e3174355c483ec8c505..8828d83f615cb3449b9149bf8d19c0bdd6f2bd5e 100644 --- a/Build/Sources/TypeScript/dashboard/widget-selector.ts +++ b/Build/Sources/TypeScript/dashboard/widget-selector.ts @@ -11,7 +11,6 @@ * The TYPO3 project - inspiring people to share! */ -import $ from 'jquery'; import Modal from '@typo3/backend/modal'; import {SeverityEnum} from '@typo3/backend/enum/severity'; import RegularEvent from '@typo3/core/event/regular-event'; @@ -32,7 +31,7 @@ class WidgetSelector { title: this.dataset.modalTitle, size: Modal.sizes.medium, severity: SeverityEnum.notice, - content: $(document.getElementById('widgetSelector').innerHTML), + content: (document.getElementById('widgetSelector') as HTMLTemplateElement).content.cloneNode(true), additionalCssClasses: ['dashboard-modal'], callback: (currentModal: JQuery): void => { currentModal.on('click', 'a.dashboard-modal-item-block', (e: JQueryEventObject): void => { diff --git a/typo3/sysext/dashboard/Resources/Private/Templates/Dashboard/Main.html b/typo3/sysext/dashboard/Resources/Private/Templates/Dashboard/Main.html index 2192566da148dfb606019c55d433d70186ea7d0d..96ac457ae4da3ea726b4231836e3acc736f0ab30 100644 --- a/typo3/sysext/dashboard/Resources/Private/Templates/Dashboard/Main.html +++ b/typo3/sysext/dashboard/Resources/Private/Templates/Dashboard/Main.html @@ -88,7 +88,7 @@ </button> </div> - <div id="widgetSelector" class="hide"> + <template id="widgetSelector"> <div class="dashboard-modal-tabpanel" role="tabpanel"> <ul class="nav nav-tabs t3js-tabs" id="widget-selector" role="tablist"> <f:variable name="firstGroupActive" value="false" /> @@ -148,9 +148,9 @@ </f:for> </div> </div> - </div> + </template> - <div id="dashboardModal-add" class="hide"> + <template id="dashboardModal-add"> <form action="{addDashboardUri}" id="formAddDashboard" class="dashboardModal-form" target="list_frame" method="post"> <div class="form-group"> <label for="dashboardModalAdd-title"><f:translate key="LLL:EXT:dashboard/Resources/Private/Language/locallang.xlf:dashboard.title" /></label> @@ -194,9 +194,9 @@ </f:for> </div> </form> - </div> + </template> - <div id="dashboardModal-configure" class="hide"> + <template id="dashboardModal-configure"> <form action="{configureDashboardUri}" id="configureDashboardForm" class="dashboardModal-form" target="list_frame" method="post"> <input type="hidden" name="currentDashboard" value="{currentDashboard.identifier}"> <div class="form-group"> @@ -204,7 +204,7 @@ <input class="form-control" id="dashboardModalConfigure-title" type="text" name="dashboard[title]" value="{currentDashboard.title}" required="required"> </div> </form> - </div> + </template> </f:section> diff --git a/typo3/sysext/dashboard/Resources/Public/JavaScript/dashboard-modal.js b/typo3/sysext/dashboard/Resources/Public/JavaScript/dashboard-modal.js index 75daacf3a82a221e74adb9ee6715cd4941720bae..3ae63b28523077f106f15fa840589e1a5b1a7334 100644 --- a/typo3/sysext/dashboard/Resources/Public/JavaScript/dashboard-modal.js +++ b/typo3/sysext/dashboard/Resources/Public/JavaScript/dashboard-modal.js @@ -10,4 +10,4 @@ * * The TYPO3 project - inspiring people to share! */ -import $ from"jquery";import Modal from"@typo3/backend/modal.js";import{SeverityEnum}from"@typo3/backend/enum/severity.js";import RegularEvent from"@typo3/core/event/regular-event.js";class DashboardModal{constructor(){this.selector=".js-dashboard-modal",this.initialize()}initialize(){new RegularEvent("click",(function(t){t.preventDefault();const e={type:Modal.types.default,title:this.dataset.modalTitle,size:Modal.sizes.medium,severity:SeverityEnum.notice,content:$(document.getElementById("dashboardModal-"+this.dataset.modalIdentifier).innerHTML),additionalCssClasses:["dashboard-modal"],callback:t=>{t.on("submit",".dashboardModal-form",e=>{t.trigger("modal-dismiss")}),t.on("button.clicked",e=>{if("save"===e.target.getAttribute("name")){t.find("form").trigger("submit")}else t.trigger("modal-dismiss")})},buttons:[{text:this.dataset.buttonCloseText,btnClass:"btn-default",name:"cancel"},{text:this.dataset.buttonOkText,active:!0,btnClass:"btn-info",name:"save"}]};Modal.advanced(e)})).delegateTo(document,this.selector)}}export default new DashboardModal; \ No newline at end of file +import Modal from"@typo3/backend/modal.js";import{SeverityEnum}from"@typo3/backend/enum/severity.js";import RegularEvent from"@typo3/core/event/regular-event.js";class DashboardModal{constructor(){this.selector=".js-dashboard-modal",this.initialize()}initialize(){new RegularEvent("click",(function(t){t.preventDefault();const e={type:Modal.types.default,title:this.dataset.modalTitle,size:Modal.sizes.medium,severity:SeverityEnum.notice,content:document.getElementById("dashboardModal-"+this.dataset.modalIdentifier).content.cloneNode(!0),additionalCssClasses:["dashboard-modal"],callback:t=>{t.on("submit",".dashboardModal-form",e=>{t.trigger("modal-dismiss")}),t.on("button.clicked",e=>{if("save"===e.target.getAttribute("name")){t.find("form").trigger("submit")}else t.trigger("modal-dismiss")})},buttons:[{text:this.dataset.buttonCloseText,btnClass:"btn-default",name:"cancel"},{text:this.dataset.buttonOkText,active:!0,btnClass:"btn-info",name:"save"}]};Modal.advanced(e)})).delegateTo(document,this.selector)}}export default new DashboardModal; \ No newline at end of file diff --git a/typo3/sysext/dashboard/Resources/Public/JavaScript/widget-selector.js b/typo3/sysext/dashboard/Resources/Public/JavaScript/widget-selector.js index 47e73176768d5fdcd5586737515da0acfd6f01ba..826b15d7ef67bb16cb0deb4977147b533f772f5e 100644 --- a/typo3/sysext/dashboard/Resources/Public/JavaScript/widget-selector.js +++ b/typo3/sysext/dashboard/Resources/Public/JavaScript/widget-selector.js @@ -10,4 +10,4 @@ * * The TYPO3 project - inspiring people to share! */ -import $ from"jquery";import Modal from"@typo3/backend/modal.js";import{SeverityEnum}from"@typo3/backend/enum/severity.js";import RegularEvent from"@typo3/core/event/regular-event.js";class WidgetSelector{constructor(){this.selector=".js-dashboard-addWidget",this.initialize()}initialize(){new RegularEvent("click",(function(e){e.preventDefault();const t={type:Modal.types.default,title:this.dataset.modalTitle,size:Modal.sizes.medium,severity:SeverityEnum.notice,content:$(document.getElementById("widgetSelector").innerHTML),additionalCssClasses:["dashboard-modal"],callback:e=>{e.on("click","a.dashboard-modal-item-block",t=>{e.trigger("modal-dismiss")})}};Modal.advanced(t)})).delegateTo(document,this.selector),document.querySelectorAll(this.selector).forEach(e=>{e.classList.remove("hide")})}}export default new WidgetSelector; \ No newline at end of file +import Modal from"@typo3/backend/modal.js";import{SeverityEnum}from"@typo3/backend/enum/severity.js";import RegularEvent from"@typo3/core/event/regular-event.js";class WidgetSelector{constructor(){this.selector=".js-dashboard-addWidget",this.initialize()}initialize(){new RegularEvent("click",(function(e){e.preventDefault();const t={type:Modal.types.default,title:this.dataset.modalTitle,size:Modal.sizes.medium,severity:SeverityEnum.notice,content:document.getElementById("widgetSelector").content.cloneNode(!0),additionalCssClasses:["dashboard-modal"],callback:e=>{e.on("click","a.dashboard-modal-item-block",t=>{e.trigger("modal-dismiss")})}};Modal.advanced(t)})).delegateTo(document,this.selector),document.querySelectorAll(this.selector).forEach(e=>{e.classList.remove("hide")})}}export default new WidgetSelector; \ No newline at end of file