From 275ce2041e0418097c8a7516b28e0ffdef845fa7 Mon Sep 17 00:00:00 2001 From: Federico Gratti Date: Wed, 8 Jun 2022 11:31:37 +0200 Subject: [PATCH] Added HTMLUtilities --- .version | 2 +- package.json | 2 +- src/index.js | 2 + src/utilities/HTMLUtilities.js | 44 ++++++++++++++++++++++ src/utilities/ObjectUtilities.js | 31 +++++++++++++-- src/view_components/ApplicationView.js | 25 ++---------- src/view_components/ViewComponent.js | 11 ++++++ types/utilities/HTMLUtilities.d.ts | 10 +++++ types/utilities/ObjectUtilities.d.ts | 17 +++++++-- types/view_components/ApplicationView.d.ts | 9 +++++ types/view_components/ViewComponent.d.ts | 2 + 11 files changed, 125 insertions(+), 30 deletions(-) create mode 100644 src/utilities/HTMLUtilities.js create mode 100644 types/utilities/HTMLUtilities.d.ts diff --git a/.version b/.version index e5d3eeb..7a981d6 100644 --- a/.version +++ b/.version @@ -1 +1 @@ -v6.12.1 +v6.13.0 diff --git a/package.json b/package.json index 35bfa94..7b19d7d 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "ohzi-core", - "version": "6.12.1", + "version": "6.13.0", "description": "OHZI Core Library", "source": "src/index.js", "module": "build/index.module.js", diff --git a/src/index.js b/src/index.js index efd1c14..b0274e2 100644 --- a/src/index.js +++ b/src/index.js @@ -48,6 +48,7 @@ import CameraUtilities from './utilities/CameraUtilities'; import EasingFunctions from './utilities/EasingFunctions'; import FrustumPointFitter from './utilities/FrustumPointFitter'; import GeometryUtilities from './utilities/GeometryUtilities'; +import HTMLUtilities from './utilities/HTMLUtilities'; import ImageUtilities from './utilities/ImageUtilities'; import OMath from './utilities/OMath'; import MeshSampler from './utilities/MeshSampler'; @@ -146,6 +147,7 @@ export { EasingFunctions, FrustumPointFitter, GeometryUtilities, + HTMLUtilities, ImageUtilities, OMath, MeshSampler, diff --git a/src/utilities/HTMLUtilities.js b/src/utilities/HTMLUtilities.js new file mode 100644 index 0000000..ad635fa --- /dev/null +++ b/src/utilities/HTMLUtilities.js @@ -0,0 +1,44 @@ +export default class HTMLUtilities +{ + static load_images(container) + { + const images = container.querySelectorAll('img'); + + for (let i = 0; i < images.length; i++) + { + const image = images[i]; + + if (image.dataset.src) + { + image.src = image.dataset.src; + } + } + + const image_objects = container.querySelectorAll('object'); + + for (let i = 0; i < image_objects.length; i++) + { + const image_object = image_objects[i]; + + if (image_object.dataset.src) + { + image_object.data = image_object.dataset.src; + } + } + } + + static load_videos(container) + { + const videos = container.querySelectorAll('video'); + + for (let i = 0; i < videos.length; i++) + { + const video = videos[i]; + + if (video.dataset.src) + { + video.src = video.dataset.src; + } + } + } +} diff --git a/src/utilities/ObjectUtilities.js b/src/utilities/ObjectUtilities.js index e873826..bb3b695 100644 --- a/src/utilities/ObjectUtilities.js +++ b/src/utilities/ObjectUtilities.js @@ -1,9 +1,34 @@ export default class ObjectUtilities { - constructor() - {} + static is_object(item) + { + return (item && typeof item === 'object' && !Array.isArray(item)); + } + + static merge_deep(target, ...sources) + { + if (!sources.length) return target; + const source = sources.shift(); + + if (ObjectUtilities.is_object(target) && ObjectUtilities.is_object(source)) + { + for (const key in source) + { + if (ObjectUtilities.is_object(source[key])) + { + if (!target[key]) Object.assign(target, { [key]: {} }); + ObjectUtilities.merge_deep(target[key], source[key]); + } + else + { + Object.assign(target, { [key]: source[key] }); + } + } + } + + return ObjectUtilities.merge_deep(target, ...sources); + } - // Changes XML to JSON static xml_to_json(xml) { // Create the return object diff --git a/src/view_components/ApplicationView.js b/src/view_components/ApplicationView.js index 5d88d6f..de6f2c7 100644 --- a/src/view_components/ApplicationView.js +++ b/src/view_components/ApplicationView.js @@ -1,4 +1,5 @@ import ResourceContainer from '../ResourceContainer'; +import HTMLUtilities from '../utilities/HTMLUtilities'; import ViewManager from './ViewManager'; import ViewState from './ViewState'; @@ -59,32 +60,12 @@ export default class ApplicationView extends ViewState load_html_images() { - const images = this.container.querySelectorAll('img'); - - for (let i = 0; i < images.length; i++) - { - const image = images[i]; - - if (image.dataset.src) - { - image.src = image.dataset.src; - } - } + HTMLUtilities.load_images(this.container); } load_html_videos() { - const videos = this.container.querySelectorAll('video'); - - for (let i = 0; i < videos.length; i++) - { - const video = videos[i]; - - if (video.dataset.src) - { - video.src = video.dataset.src; - } - } + HTMLUtilities.load_videos(this.container); } set_opacity(current_state_data) diff --git a/src/view_components/ViewComponent.js b/src/view_components/ViewComponent.js index d6436d4..2fd767e 100644 --- a/src/view_components/ViewComponent.js +++ b/src/view_components/ViewComponent.js @@ -1,3 +1,4 @@ +import HTMLUtilities from '../utilities/HTMLUtilities'; import ViewComponentManager from './ViewComponentManager'; export default class ViewComponent @@ -58,4 +59,14 @@ export default class ViewComponent } } } + + load_html_images() + { + HTMLUtilities.load_images(this.container); + } + + load_html_videos() + { + HTMLUtilities.load_videos(this.container); + } } diff --git a/types/utilities/HTMLUtilities.d.ts b/types/utilities/HTMLUtilities.d.ts new file mode 100644 index 0000000..bb4cc98 --- /dev/null +++ b/types/utilities/HTMLUtilities.d.ts @@ -0,0 +1,10 @@ +export class HTMLUtilities { + /** + * Load Images defined in data-src. + */ + static load_images(container: HTMLElement): void; + /** + * Load Videos defined in data-src. + */ + static load_videos(container: HTMLElement): void; +} diff --git a/types/utilities/ObjectUtilities.d.ts b/types/utilities/ObjectUtilities.d.ts index 476e5ed..309d4e2 100644 --- a/types/utilities/ObjectUtilities.d.ts +++ b/types/utilities/ObjectUtilities.d.ts @@ -1,5 +1,16 @@ export class ObjectUtilities { - static xml_to_json(xml: any): { - '@attributes': {}; - }; + /** + * Simple object check. + */ + static is_object(item: any): boolean; + + /** + * Deep merge two objects. + */ + static merge_deep(target: any, ...sources: any): void; + + /** + * Convert XML to JSON + */ + static xml_to_json(xml: any): object; } diff --git a/types/view_components/ApplicationView.d.ts b/types/view_components/ApplicationView.d.ts index e61785d..540886b 100644 --- a/types/view_components/ApplicationView.d.ts +++ b/types/view_components/ApplicationView.d.ts @@ -6,6 +6,15 @@ export class ApplicationView extends ViewState { }); container: any; url: any; + start(): void; + show(): void; + before_enter(): void; + on_enter(): void; + before_exit(): void; + on_exit(): void; + update(): void; set_opacity(opacity: any): void; + load_html_images(): void; + load_html_videos(): void; } import ViewState from "./ViewState"; diff --git a/types/view_components/ViewComponent.d.ts b/types/view_components/ViewComponent.d.ts index 56830d2..a7db5f6 100644 --- a/types/view_components/ViewComponent.d.ts +++ b/types/view_components/ViewComponent.d.ts @@ -10,4 +10,6 @@ export class ViewComponent { update(): void; on_exit(): void; set_opacity(opacity: any): void; + load_html_images(): void; + load_html_videos(): void; }