Migrate link editor to typescript

This commit is contained in:
Paulo Gustavo Veiga 2022-06-23 21:01:00 -07:00
parent f3170dd11e
commit bd4656c227
2 changed files with 24 additions and 21 deletions

View File

@ -20,14 +20,17 @@ import { $assert } from '@wisemapping/core-js';
import { $msg } from '../Messages';
import BootstrapDialog from './bootstrap/BootstrapDialog';
interface LinkEditorModel {
getValue(): string;
setValue(value: string): void;
}
class LinkEditor extends BootstrapDialog {
/**
* @constructs
* @param model
* @throws will throw an error if model is null or undefined
* @extends BootstrapDialog
*/
constructor(model) {
private form: JQuery<HTMLElement>;
private formSubmitted: boolean;
constructor(model: LinkEditorModel) {
$assert(model, 'model can not be null');
super($msg('LINK'), {
cancelButton: true,
@ -37,13 +40,12 @@ class LinkEditor extends BootstrapDialog {
errorMessage: true,
onEventData: { model },
});
this._model = model;
this.css({ margin: '150px auto' });
const panel = this._buildPanel(model);
this.setContent(panel);
}
_buildPanel(model) {
protected _buildPanel(model: LinkEditorModel) {
const result = $('<div></div>').css('padding-top', '5px');
this.form = $('<form></form>').attr({
action: 'none',
@ -80,8 +82,9 @@ class LinkEditor extends BootstrapDialog {
});
openButton.html($msg('OPEN_LINK')).css('margin-left', '0px');
openButton.click(() => {
window.open(input.val(), '_blank', 'status=1,width=700,height=450,resize=1');
openButton.on('click', () => {
const value = input.val() as string;
window.open(value, '_blank', 'status=1,width=700,height=450,resize=1');
});
const spanControl = $('<span class="input-group-btn"></span>').append(openButton);
@ -90,13 +93,13 @@ class LinkEditor extends BootstrapDialog {
this.form.append(section);
const me = this;
this.form.unbind('submit').submit((event) => {
this.form.off('submit').on('submit', (event) => {
event.preventDefault();
let inputValue = input.val();
let inputValue = input.val() as string;
inputValue = this.hasProtocol(inputValue) ? inputValue : `https://${inputValue}`;
if (me.checkURL(inputValue)) {
me.cleanError();
if (inputValue != null && $.trim(inputValue) !== '') {
if (inputValue !== null && inputValue.trim() !== '') {
model.setValue(inputValue);
}
me.close();
@ -115,7 +118,7 @@ class LinkEditor extends BootstrapDialog {
* checks whether the input is a valid url
* @return {Boolean} true if the url is valid
*/
checkURL(url) {
private checkURL(url: string): boolean {
const regex = /^(http|https):\/\/[a-z0-9]+([-.]{1}[a-z0-9]+)*\.[a-z]{2,5}(:[0-9]{1,5})?(\/.*)?$/i;
return (regex.test(url));
}
@ -124,7 +127,7 @@ class LinkEditor extends BootstrapDialog {
* checks whether the input is a valid url
* @return {Boolean} true if the url is valid
*/
hasProtocol(url) {
private hasProtocol(url: string): boolean {
const regex = /^(http|https):\/\//i;
return (regex.test(url));
}
@ -134,7 +137,7 @@ class LinkEditor extends BootstrapDialog {
* triggered when the user clicks the accept button - submits the url input
* @param event
*/
onAcceptClick(event) {
onAcceptClick(event: Event): void {
this.formSubmitted = false;
$('#linkFormId').trigger('submit');
if (!this.formSubmitted) {
@ -146,7 +149,7 @@ class LinkEditor extends BootstrapDialog {
* overrides parent method
* sets the url input on focus
*/
onDialogShown() {
onDialogShown(): void {
$(this).find('#inputUrl').focus();
}

View File

@ -114,15 +114,15 @@ class BootstrapDialog extends Options {
return header;
}
onAcceptClick() {
onAcceptClick(event) {
throw new Error('Unsupported operation');
}
onDialogShown() {
onDialogShown(event) {
// Overwrite default behaviour ...
}
onRemoveClick() {
onRemoveClick(event) {
throw new Error('Unsupported operation');
}