Commit 26c7e3ce authored by Andreas Fernandez's avatar Andreas Fernandez Committed by Frank Nägler
Browse files

[TASK] Migrate ContextHelp to TypeScript

Resolves: #82579
Releases: master
Change-Id: Ic2d44d8567c2b144f9250f9011b6106fe73358e9
Reviewed-on: https://review.typo3.org/55169

Tested-by: default avatarTYPO3com <no-reply@typo3.com>
Reviewed-by: Andreas Wolf's avatarAndreas Wolf <andreas.wolf@typo3.org>
Tested-by: Andreas Wolf's avatarAndreas Wolf <andreas.wolf@typo3.org>
Reviewed-by: Frank Nägler's avatarFrank Naegler <frank.naegler@typo3.org>
Tested-by: Frank Nägler's avatarFrank Naegler <frank.naegler@typo3.org>
parent 8ffbb93f
......@@ -7,6 +7,7 @@
declare namespace TYPO3 {
export let DebugConsole: any;
export let Popover: any;
export let ShortcutMenu: any;
export let Storage: any;
export let Utility: any;
export const lang: any;
......
/*
* 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 'bootstrap';
import * as $ from 'jquery';
import Popover = require('./Popover');
interface HelpData {
title: string;
content: string;
}
/**
* Module: TYPO3/CMS/Backend/ContextHelp
* API for context help.
* @exports TYPO3/CMS/Backend/ContextHelp
*/
class ContextHelp {
private ajaxUrl: string = TYPO3.settings.ajaxUrls.context_help;
private helpModuleUrl: string;
private trigger: string = 'click';
private placement: string = 'auto';
private selector: string = '.t3-help-link';
/**
* @return {Window}
*/
private static resolveBackend(): Window {
if (typeof window.opener !== 'undefined' && window.opener !== null) {
return window.opener.top;
} else {
return top;
}
}
constructor() {
this.initialize();
}
public initialize(): void {
const backendWindow = ContextHelp.resolveBackend();
if (typeof backendWindow.TYPO3.settings.ContextHelp !== 'undefined') {
this.helpModuleUrl = backendWindow.TYPO3.settings.ContextHelp.moduleUrl;
}
if (typeof TYPO3.ShortcutMenu === 'undefined' && typeof backendWindow.TYPO3.ShortcutMenu === 'undefined') {
// @FIXME: if we are in the popup... remove the bookmark / shortcut button
// @TODO: make it possible to use the bookmark button also in popup mode
$('.icon-actions-system-shortcut-new').closest('.btn').hide();
}
let title = '&nbsp;';
if (typeof backendWindow.TYPO3.lang !== 'undefined') {
title = backendWindow.TYPO3.lang.csh_tooltip_loading;
}
const $element = $(this.selector);
$element
.attr('data-loaded', 'false')
.attr('data-html', 'true')
.attr('data-original-title', title)
.attr('data-placement', this.placement)
.attr('data-trigger', this.trigger);
Popover.popover($element);
$(document).on('show.bs.popover', this.selector, (e: Event): void => {
const $me = $(e.currentTarget);
const description = $me.data('description');
if (typeof description !== 'undefined' && description !== '') {
Popover.setOptions($me, {
title: $me.data('title'),
content: description
});
} else if ($me.attr('data-loaded') === 'false' && $me.data('table')) {
this.loadHelp($me);
}
// if help icon is in DocHeader, force open to bottom
if ($me.closest('.t3js-module-docheader').length) {
Popover.setOption($me, 'placement', 'bottom');
}
}).on('shown.bs.popover', this.selector, (e: Event): void => {
const $popover = $(e.target).data('bs.popover').$tip;
if (!$popover.find('.popover-title').is(':visible')) {
$popover.addClass('no-title');
}
}).on('click', '.tipIsLinked', (e: any): void => {
$('.popover').each((index: number, popover: Element): void => {
const $popover = $(popover);
if ($popover.has(e.target).length) {
console.log($popover.data('bs.popover'));
this.showHelpPopup($popover.data('bs.popover').$element);
}
});
}).on('click', 'body', (e: any): void => {
$(this.selector).each((index: number, triggerElement: Element): void => {
const $triggerElement = $(triggerElement);
// the 'is' for buttons that trigger popups
// the 'has' for icons within a button that triggers a popup
if (!$triggerElement.is(e.target)
&& $triggerElement.has(e.target).length === 0
&& $('.popover').has(e.target).length === 0
) {
Popover.hide($triggerElement);
}
});
});
}
/**
* Open the help popup
*
* @param {JQuery} $trigger
*/
private showHelpPopup($trigger: JQuery): any {
try {
const cshWindow = window.open(
this.helpModuleUrl +
'&tx_documentation_help_documentationcshmanual[table]=' + $trigger.data('table') +
'&tx_documentation_help_documentationcshmanual[field]=' + $trigger.data('field'),
'ContextHelpWindow',
'height=400,width=600,status=0,menubar=0,scrollbars=1'
);
cshWindow.focus();
Popover.hide($trigger);
return cshWindow;
} catch (e) {
// do nothing
}
}
/**
* Load help data
*
* @param {JQuery} $trigger
*/
private loadHelp($trigger: JQuery): void {
const table = $trigger.data('table');
const field = $trigger.data('field');
// If a table is defined, use ajax call to get the tooltip's content
if (table) {
// Load content
$.getJSON(this.ajaxUrl, {
params: {
action: 'getContextHelp',
table: table,
field: field
}
}).done((data: HelpData): void => {
const title = data.title || '';
const content = data.content || '<p></p>';
Popover.setOptions($trigger, {
title: title,
content: content
});
$trigger
.attr('data-loaded', 'true')
.one('hidden.bs.popover', (): void => {
Popover.show($trigger);
});
Popover.hide($trigger);
});
}
}
}
export = new ContextHelp();
......@@ -10,169 +10,149 @@
*
* The TYPO3 project - inspiring people to share!
*/
/**
* Module: TYPO3/CMS/Backend/ContextHelp
* API for context help.
*/
define(['jquery', 'TYPO3/CMS/Backend/Popover', 'bootstrap'], function($, Popover) {
/**
* The main ContextHelp object
*
* @type {{ajaxUrl: *, localCache: {}, helpModuleUrl: string, trigger: string, placement: string, selector: string}}
* @exports TYPO3/CMS/Backend/ContextHelp
*/
var ContextHelp = {
ajaxUrl: TYPO3.settings.ajaxUrls['context_help'],
localCache: {},
helpModuleUrl: '',
trigger: 'click',
placement: 'auto',
selector: '.t3-help-link'
};
/**
* Initialize context help trigger
*/
ContextHelp.initialize = function() {
var backendWindow = ContextHelp.resolveBackend();
ContextHelp.helpModuleUrl = null;
if (typeof backendWindow.TYPO3.settings.ContextHelp !== 'undefined') {
ContextHelp.helpModuleUrl = backendWindow.TYPO3.settings.ContextHelp.moduleUrl;
}
if (TYPO3.ShortcutMenu === undefined && backendWindow.TYPO3.ShortcutMenu === undefined) {
// @FIXME: if we are in the popup... remove the bookmark / shortcut button
// @TODO: make it possible to use the bookmark button also in popup mode
$('.icon-actions-system-shortcut-new').closest('.btn').hide();
}
var title = '&nbsp;';
if (typeof backendWindow.TYPO3.lang !== 'undefined') {
title = backendWindow.TYPO3.lang['csh_tooltip_loading'];
}
var $element = $(this.selector);
$element
.attr('data-loaded', 'false')
.attr('data-html', true)
.attr('data-original-title', title)
.attr('data-placement', this.placement)
.attr('data-trigger', this.trigger);
Popover.popover($element);
$(document).on('show.bs.popover', ContextHelp.selector, function(evt) {
var $me = $(this),
description = $me.data('description');
if (typeof description !== 'undefined' && description !== '') {
Popover.setOptions($me, {
title: $me.data('title'),
content: description
});
} else if ($me.attr('data-loaded') === 'false' && $me.data('table')) {
ContextHelp.loadHelp($me);
}
// if help icon is in DocHeader, force open to bottom
if ($me.closest('.t3js-module-docheader').length) {
Popover.setOption($me, 'placement', 'bottom');
}
});
$(document).on('shown.bs.popover', ContextHelp.selector, function(evt) {
var $popover = $(evt.target).data('bs.popover').$tip;
if (!$popover.find('.popover-title').is(':visible')) {
$popover.addClass('no-title');
}
});
$(document).on('click', '.tipIsLinked', function(e) {
$('.popover').each(function() {
var $popover = $(this);
if ($popover.has(e.target).length) {
ContextHelp.showHelpPopup($popover.data('bs.popover').$element);
}
});
});
$(document).on('click', 'body', function (e) {
$(ContextHelp.selector).each(function () {
var $triggerElement = $(this);
// the 'is' for buttons that trigger popups
// the 'has' for icons within a button that triggers a popup
if (!$triggerElement.is(e.target) && $triggerElement.has(e.target).length === 0 && $('.popover').has(e.target).length === 0) {
Popover.hide($triggerElement);
}
});
});
};
/**
* Open the help popup
*
* @param {Object} $trigger
*/
ContextHelp.showHelpPopup = function($trigger) {
try {
var cshWindow = window.open(
ContextHelp.helpModuleUrl +
'&tx_documentation_help_documentationcshmanual[table]=' + $trigger.data('table') +
'&tx_documentation_help_documentationcshmanual[field]=' + $trigger.data('field'),
'ContextHelpWindow',
'height=400,width=600,status=0,menubar=0,scrollbars=1'
);
cshWindow.focus();
Popover.hide($trigger);
return cshWindow;
} catch(e) {
// do nothing
}
};
/**
* Load help data
*
* @param {Object} $trigger
*/
ContextHelp.loadHelp = function($trigger) {
var table = $trigger.data('table');
var field = $trigger.data('field');
// If a table is defined, use ajax call to get the tooltip's content
if (table) {
// Load content
$.getJSON(ContextHelp.ajaxUrl, {
params: {
action: 'getContextHelp',
table: table,
field: field
}
}).done(function(data) {
var title = data.title || '';
var content = data.content || '<p></p>';
Popover.setOptions($trigger, {
title: title,
content: content
});
$trigger
.attr('data-loaded', 'true')
.one('hidden.bs.popover', function() {
Popover.show($trigger);
});
Popover.hide($trigger);
});
}
};
/**
* @return {Window}
*/
ContextHelp.resolveBackend = function () {
var windowReference;
if (typeof window.opener !== 'undefined' && window.opener !== null) {
windowReference = window.opener.top;
} else {
windowReference = top;
}
return windowReference;
};
ContextHelp.initialize();
TYPO3.ContextHelp = ContextHelp;
return ContextHelp;
define(["require", "exports", "jquery", "./Popover", "bootstrap"], function (require, exports, $, Popover) {
"use strict";
/**
* Module: TYPO3/CMS/Backend/ContextHelp
* API for context help.
* @exports TYPO3/CMS/Backend/ContextHelp
*/
var ContextHelp = (function () {
function ContextHelp() {
this.ajaxUrl = TYPO3.settings.ajaxUrls.context_help;
this.trigger = 'click';
this.placement = 'auto';
this.selector = '.t3-help-link';
this.initialize();
}
/**
* @return {Window}
*/
ContextHelp.resolveBackend = function () {
if (typeof window.opener !== 'undefined' && window.opener !== null) {
return window.opener.top;
}
else {
return top;
}
};
ContextHelp.prototype.initialize = function () {
var _this = this;
var backendWindow = ContextHelp.resolveBackend();
if (typeof backendWindow.TYPO3.settings.ContextHelp !== 'undefined') {
this.helpModuleUrl = backendWindow.TYPO3.settings.ContextHelp.moduleUrl;
}
if (typeof TYPO3.ShortcutMenu === 'undefined' && typeof backendWindow.TYPO3.ShortcutMenu === 'undefined') {
// @FIXME: if we are in the popup... remove the bookmark / shortcut button
// @TODO: make it possible to use the bookmark button also in popup mode
$('.icon-actions-system-shortcut-new').closest('.btn').hide();
}
var title = '&nbsp;';
if (typeof backendWindow.TYPO3.lang !== 'undefined') {
title = backendWindow.TYPO3.lang.csh_tooltip_loading;
}
var $element = $(this.selector);
$element
.attr('data-loaded', 'false')
.attr('data-html', 'true')
.attr('data-original-title', title)
.attr('data-placement', this.placement)
.attr('data-trigger', this.trigger);
Popover.popover($element);
$(document).on('show.bs.popover', this.selector, function (e) {
var $me = $(e.currentTarget);
var description = $me.data('description');
if (typeof description !== 'undefined' && description !== '') {
Popover.setOptions($me, {
title: $me.data('title'),
content: description
});
}
else if ($me.attr('data-loaded') === 'false' && $me.data('table')) {
_this.loadHelp($me);
}
// if help icon is in DocHeader, force open to bottom
if ($me.closest('.t3js-module-docheader').length) {
Popover.setOption($me, 'placement', 'bottom');
}
}).on('shown.bs.popover', this.selector, function (e) {
var $popover = $(e.target).data('bs.popover').$tip;
if (!$popover.find('.popover-title').is(':visible')) {
$popover.addClass('no-title');
}
}).on('click', '.tipIsLinked', function (e) {
$('.popover').each(function (index, popover) {
var $popover = $(popover);
if ($popover.has(e.target).length) {
console.log($popover.data('bs.popover'));
_this.showHelpPopup($popover.data('bs.popover').$element);
}
});
}).on('click', 'body', function (e) {
$(_this.selector).each(function (index, triggerElement) {
var $triggerElement = $(triggerElement);
// the 'is' for buttons that trigger popups
// the 'has' for icons within a button that triggers a popup
if (!$triggerElement.is(e.target)
&& $triggerElement.has(e.target).length === 0
&& $('.popover').has(e.target).length === 0) {
Popover.hide($triggerElement);
}
});
});
};
/**
* Open the help popup
*
* @param {JQuery} $trigger
*/
ContextHelp.prototype.showHelpPopup = function ($trigger) {
try {
var cshWindow = window.open(this.helpModuleUrl +
'&tx_documentation_help_documentationcshmanual[table]=' + $trigger.data('table') +
'&tx_documentation_help_documentationcshmanual[field]=' + $trigger.data('field'), 'ContextHelpWindow', 'height=400,width=600,status=0,menubar=0,scrollbars=1');
cshWindow.focus();
Popover.hide($trigger);
return cshWindow;
}
catch (e) {
// do nothing
}
};
/**
* Load help data
*
* @param {JQuery} $trigger
*/
ContextHelp.prototype.loadHelp = function ($trigger) {
var table = $trigger.data('table');
var field = $trigger.data('field');
// If a table is defined, use ajax call to get the tooltip's content
if (table) {
// Load content
$.getJSON(this.ajaxUrl, {
params: {
action: 'getContextHelp',
table: table,
field: field
}
}).done(function (data) {
var title = data.title || '';
var content = data.content || '<p></p>';
Popover.setOptions($trigger, {
title: title,
content: content
});
$trigger
.attr('data-loaded', 'true')
.one('hidden.bs.popover', function () {
Popover.show($trigger);
});
Popover.hide($trigger);
});
}
};
return ContextHelp;
}());
return new ContextHelp();
});
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment