CIT/Vmeda.Online
3
0
Fork 1
forked from EVOgeek/Vmeda.Online
Code Pull Requests Activity

MOBILE-2436 format-text: Stop propagating clicks in certain elements

Browse Source
This commit is contained in:
Dani Palou 2018-08-21 12:41:24 +02:00
parent bce1afd586
commit 7d4ccceb20
1 changed files with 23 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
src/directives/format-text.ts
View File

@ -56,7 +56,6 @@ export class CoreFormatTextDirective implements OnChanges {
@Input() fullTitle?: string; // Title to use in full view. Defaults to "Description". @Input() fullTitle?: string; // Title to use in full view. Defaults to "Description".
@Output() afterRender?: EventEmitter<any>; // Called when the data is rendered. @Output() afterRender?: EventEmitter<any>; // Called when the data is rendered.
protected tagsToIgnore = ['AUDIO', 'VIDEO', 'BUTTON', 'INPUT', 'SELECT', 'TEXTAREA', 'A'];
protected element: HTMLElement; protected element: HTMLElement;
protected clickListener; protected clickListener;
@ -215,22 +214,17 @@ export class CoreFormatTextDirective implements OnChanges {
e.preventDefault(); e.preventDefault();
e.stopPropagation(); e.stopPropagation();
const target = <HTMLElement> e.target;
if (this.tagsToIgnore.indexOf(target.tagName) === -1 || (target.tagName === 'A' &&
!target.getAttribute('href'))) {
if (!expandInFullview) { if (!expandInFullview) {
// Change class. // Change class.
this.element.classList.toggle('core-shortened'); this.element.classList.toggle('core-shortened');
return; return;
} } else {
}
// Open a new state with the contents. // Open a new state with the contents.
this.textUtils.expandText(this.fullTitle || this.translate.instant('core.description'), this.text, this.textUtils.expandText(this.fullTitle || this.translate.instant('core.description'), this.text,
this.component, this.componentId); this.component, this.componentId);
} }
}
/** /**
* Finish the rendering, displaying the element again and calling afterRender. * Finish the rendering, displaying the element again and calling afterRender.
@ -315,7 +309,8 @@ export class CoreFormatTextDirective implements OnChanges {
videos, videos,
iframes, iframes,
buttons, buttons,
elementsWithInlineStyles; elementsWithInlineStyles,
stopClicksElements;
div.innerHTML = formatted; div.innerHTML = formatted;
images = Array.from(div.querySelectorAll('img')); images = Array.from(div.querySelectorAll('img'));
@ -325,6 +320,7 @@ export class CoreFormatTextDirective implements OnChanges {
iframes = Array.from(div.querySelectorAll('iframe')); iframes = Array.from(div.querySelectorAll('iframe'));
buttons = Array.from(div.querySelectorAll('.button')); buttons = Array.from(div.querySelectorAll('.button'));
elementsWithInlineStyles = Array.from(div.querySelectorAll('*[style]')); elementsWithInlineStyles = Array.from(div.querySelectorAll('*[style]'));
stopClicksElements = Array.from(div.querySelectorAll('button,input,select,textarea'));
// Walk through the content to find the links and add our directive to it. // Walk through the content to find the links and add our directive to it.
// Important: We need to look for links first because in 'img' we add new links without core-link. // Important: We need to look for links first because in 'img' we add new links without core-link.
@ -382,6 +378,13 @@ export class CoreFormatTextDirective implements OnChanges {
} }
}); });
// Stop propagating click events.
stopClicksElements.forEach((element: HTMLElement) => {
element.addEventListener('click', (e) => {
e.stopPropagation();
});
});
return div; return div;
}); });
} }
@ -496,6 +499,11 @@ export class CoreFormatTextDirective implements OnChanges {
tracks.forEach((track) => { tracks.forEach((track) => {
this.addExternalContent(track); this.addExternalContent(track);
}); });
// Stop propagating click events.
element.addEventListener('click', (e) => {
e.stopPropagation();
});
} }
/** /**