Skip to content

Commit

Permalink
TMS: Implemented context option
Browse files Browse the repository at this point in the history
  • Loading branch information
@themitosan
themitosan committed Sep 27, 2023
1 parent 7ee913f commit ee23b82
Showing 1 changed file with 84 additions and 50 deletions.
134 changes: 84 additions & 50 deletions src/TMS.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -35,7 +35,7 @@ interface getCoordsData {
*/

// Log warning
var logWarnings = !0;
const logWarnings = !0;

/**
* Warn if something go wrong
Expand All @@ -56,12 +56,13 @@ function tmsWarn(warnText:string){
/**
* Get element DOM
* @param elementId DOM ID target
* @param context where it will look for DOM. By default, is document. You dont need to change this option if your current application / website does't have external windows.
* @returns HTML DOM elemenet or null
*/
export function getElement(elementId:string):any {
var res:any = document.getElementById(elementId);
export function getElement(elementId:string, context:any = document):any {
var res:any = context.getElementById(elementId);
if (res === null){
res = document.getElementsByTagName(elementId)[0];
res = context.getElementsByTagName(elementId)[0];
}
if (res === void 0){
res = null;
Expand All @@ -73,14 +74,15 @@ export function getElement(elementId:string):any {
* Append custom class
* @param name class name
* @param css class content
* @param context window context. if not using external windows (like nwjs nw.Window.open), leave it alone.
*/
export function appendCustomClass(name:string, css:any = {}){
export function appendCustomClass(name:string, css:any = {}, context:object = document){

// Check if can add custom class
if (Object.keys(css).length !== 0){

// Check if document has the class holder
if (getElement('TMS_JS_CLASS_LIST') === null){
if (getElement('TMS_JS_CLASS_LIST', context) === null){
append('body', '<div style="display:none !important;" id="TMS_JS_CLASS_LIST"></div>');
}

Expand All @@ -92,8 +94,8 @@ export function appendCustomClass(name:string, css:any = {}){
finalHtml = `${finalHtml.slice(0, (finalHtml.length - 1))} }`;

// Append class
if (getElement(`TMS_JS_CLASS_${name}`) !== null){
document.getElementById(`TMS_JS_CLASS_${name}`)!.innerHTML = finalHtml;
if (getElement(`TMS_JS_CLASS_${name}`, context) !== null){
getElement(`TMS_JS_CLASS_${name}`, context).innerHTML = finalHtml;
} else {
append('TMS_JS_CLASS_LIST', `<style id="TMS_JS_CLASS_${name}">${finalHtml}</style>`);
}
Expand All @@ -106,21 +108,23 @@ export function appendCustomClass(name:string, css:any = {}){

/**
* Remove custom class
* @param name custom class name
* @param name custom class name
* @param context window context. if not using external windows (like nwjs nw.Window.open), leave it alone.
*/
export function removeCustomClass(name:string){
if (getElement(`TMS_JS_CLASS_${name}`) !== null){
removeDOM(`TMS_JS_CLASS_${name}`);
export function removeCustomClass(name:string, context:object = document){
if (getElement(`TMS_JS_CLASS_${name}`, context) !== null){
removeDOM(`TMS_JS_CLASS_${name}`, context);
}
}

/**
* Apply element CSS
* @param elementId DOM ID target
* @param cssChanges Object with new CSS data
* @param context window context. if not using external windows (like nwjs nw.Window.open), leave it alone.
*/
export function css(elementId:string, cssChanges:object){
var elId = getElement(elementId);
export function css(elementId:string, cssChanges:object, context:object = document){
var elId = getElement(elementId, context);
if (elId !== null){
Object.keys(cssChanges).forEach(function(cItem:string){
elId.style[cItem] = (cssChanges as any)[cItem];
Expand All @@ -134,9 +138,10 @@ export function css(elementId:string, cssChanges:object){
* Focus element
* @param elementId DOM ID target
* @param sTimeout focus timeout (default: 0)
* @param context window context. if not using external windows (like nwjs nw.Window.open), leave it alone.
*/
export function focus(elementId:string, sTimeout:number = 0){
const elId = getElement(elementId);
export function focus(elementId:string, sTimeout:number = 0, context:object = document){
const elId = getElement(elementId, context);
if (elId !== null){
setTimeout(function(){
elId.focus();
Expand All @@ -151,45 +156,47 @@ export function focus(elementId:string, sTimeout:number = 0){
* @param elementId DOM ID target
* @param cssAttrName CSS attribute name
* @returns String with css data or undentified
* @param context window context. if not using external windows (like nwjs nw.Window.open), leave it alone.
*/
export function getCssData(elementId:string, cssAttrName:any):string | undefined {
export function getCssData(elementId:string, cssAttrName:any, context:object = document):string | undefined {

// Variables
var result = '',
elId = getElement(elementId);
var res = '',
elId = getElement(elementId, context);

// Check if DOM exists
if (elId !== null){

// Get style
result = elId.style[cssAttrName];
res = elId.style[cssAttrName];

// Get computed style
if (result === ''){
result = window.getComputedStyle(elId)[cssAttrName];
if (res === ''){
res = window.getComputedStyle(elId)[cssAttrName];
}

// Get from DOM
if (result === void 0){
result = elId[cssAttrName];
if (res === void 0){
res = elId[cssAttrName];
}

} else {
tmsWarn(`Unable to get element data because it does not exist! (${elementId})`);
}

// Return data
return result;
return res;

}

/**
* Append data
* @param elementId DOM ID target
* @param newData HTML (or text) to be inserted
* @param context window context. if not using external windows (like nwjs nw.Window.open), leave it alone.
*/
export function append(elementId:string, newData:string){
var elId = getElement(elementId);
export function append(elementId:string, newData:string, context:object = document){
var elId = getElement(elementId, context);
if (elId !== null){
elId.insertAdjacentHTML('beforeend', newData);
} else {
Expand All @@ -201,9 +208,10 @@ export function append(elementId:string, newData:string){
* Add class
* @param elementId DOM ID target
* @param className CSS class name to be added
* @param context window context. if not using external windows (like nwjs nw.Window.open), leave it alone.
*/
export function addClass(elementId:string, className:string){
const elId = getElement(elementId);
export function addClass(elementId:string, className:string, context:object = document){
const elId = getElement(elementId, context);
if (elId !== null){
elId.classList.add(className);
} else {
Expand All @@ -215,9 +223,10 @@ export function addClass(elementId:string, className:string){
* Remove class
* @param elementId DOM ID target
* @param className CSS class name to be removed
* @param context window context. if not using external windows (like nwjs nw.Window.open), leave it alone.
*/
export function removeClass(elementId:string, className:string){
const elId = getElement(elementId);
export function removeClass(elementId:string, className:string, context:object = document){
const elId = getElement(elementId, context);
if (elId !== null){
elId.classList.remove(className);
} else {
Expand All @@ -228,31 +237,41 @@ export function removeClass(elementId:string, className:string){
/**
* Trigger mouse click action on DOM element
* @param elementId DOM ID target
* @param context window context. if not using external windows (like nwjs nw.Window.open), leave it alone.
*/
export function triggerClick(elementId:string){
const elId = getElement(elementId);
export function triggerClick(elementId:string, context:object = document){
const elId = getElement(elementId, context);
if (elId !== null){
elId.click();
} else {
tmsWarn(`Unable to trigger click action because DOM does not exist! (${elementId})`);
}

}

/**
* Scroll view with focus on specific elements
* @param elementId DOM ID target
* @param timeout timeout before focus (default: 0)
* @param context window context. if not using external windows (like nwjs nw.Window.open), leave it alone.
*/
export function scrollCenter(elementId:string, timeout:number = 0){
const elId = getElement(elementId);
export function scrollCenter(elementId:string, timeout:number = 0, context:object = document){

const elId = getElement(elementId, context);

// Check if element exists
if (elId !== null){
var parentDom = elId.parentElement,

// Set variables
const
parentDom = elId.parentElement,
parentHeight = parentDom.offsetHeight,
elHeight = parseFloat(window.getComputedStyle(elId).height.replace('px', ''));

// Scroll center
setTimeout(function(){
parentDom.scrollTo(0, (elId.offsetTop - ((parentHeight / 2) - (elHeight / 2))));
}, timeout);

} else {
tmsWarn(`Unable to scroll because DOM does not exist! (${elementId})`);
}
Expand All @@ -262,9 +281,10 @@ export function scrollCenter(elementId:string, timeout:number = 0){
* Set data inside DOM
* @param elementId DOM ID target
* @param htmlData HTML string to be inserted
* @param context window context. if not using external windows (like nwjs nw.Window.open), leave it alone.
*/
export function setInnerHtml(elementId:string, htmlData:string){
const elId = getElement(elementId);
export function setInnerHtml(elementId:string, htmlData:string, context:object = document){
const elId = getElement(elementId, context);
if (elId !== null && elId.innerHTML !== htmlData){
elId.innerHTML = htmlData;
} else {
Expand All @@ -275,9 +295,10 @@ export function setInnerHtml(elementId:string, htmlData:string){
/**
* Remove HTML DOM
* @param elementId DOM ID target
* @param context window context. if not using external windows (like nwjs nw.Window.open), leave it alone.
*/
export function removeDOM(elementId:string){
const elId = getElement(elementId);
export function removeDOM(elementId:string, context:object = document){
const elId = getElement(elementId, context);
if (elId !== null){
elId.remove();
} else {
Expand All @@ -288,9 +309,10 @@ export function removeDOM(elementId:string){
/**
* Take out focus from HTML DOM (blur)
* @param elementId DOM ID target
* @param context window context. if not using external windows (like nwjs nw.Window.open), leave it alone.
*/
export function blur(elementId:string){
const elId = getElement(elementId);
export function blur(elementId:string, context:object = document){
const elId = getElement(elementId, context);
if (elId !== null){
elId.blur();
} else {
Expand All @@ -301,17 +323,23 @@ export function blur(elementId:string){
/**
* Get number of DOM elements inside
* @param elementId DOM ID target
* @returns Number of elements inside or undentified
* @param context window context. if not using external windows (like nwjs nw.Window.open), leave it alone.
* @returns Number of elements inside or undefined
*/
export function getChildCount(elementId:string):number | undefined {
export function getChildCount(elementId:string, context:object = document):number | undefined {

var res = 0,
elId = getElement(elementId);
elId = getElement(elementId, context);

if (elId !== null){

res = elId.childElementCount;
if (res < 0){
res = 0;
}

return res;

} else {
tmsWarn(`Unable to get HTML collection because DOM does not exist! (${elementId})`);
}
Expand All @@ -320,27 +348,33 @@ export function getChildCount(elementId:string):number | undefined {
/**
* Get element bounding client rect
* @param elementId DOM ID target
* @param context window context. if not using external windows (like nwjs nw.Window.open), leave it alone.
*/
export function getRect(elementId:string){
export function getRect(elementId:string, context:object = document){

var res,
elId = getElement(elementId);
elId = getElement(elementId, context);

if (elId !== null){
res = elId.getBoundingClientRect();
} else {
tmsWarn(`Unable to get rect because DOM does not exist! (${elementId})`);
}

return res;

}

/**
* Get element coords based on parent element
* @param elementId DOM ID target
* @param context window context. if not using external windows (like nwjs nw.Window.open), leave it alone.
* @returns Object - T: Y, L: X, W: Width, H: Height, WL: X Pos. + It's own width, TH: Y Pos. + It's own height
*/
export function getCoords(elementId:string):getCoordsData {
export function getCoords(elementId:string, context:object = document):getCoordsData {

// Variables
var elId = getElement(elementId),
var elId = getElement(elementId, context),
res:getCoordsData = {
T: 0,
L: 0,
Expand Down

0 comments on commit ee23b82

Please sign in to comment.