implab/implabjs-djx Files · src/main/ts/dom-inject.ts

Added tag v1.1.0 for changeset

cin - - Load All Authors

File last commit:

r52:0b9593714536 default


                r64:3f27d1084ced

default

Download file

             dom-inject.ts
        
                    100 lines
            
             | 2.7 KiB
            
                | video/mp2t
            
             |
                TypeScriptLexer
            
             / src / main / ts / dom-inject.ts
          
                    History
                
                 |
                  Source
                 | Raw
                 |Copy content
                 |Copy permalink

        cin
    
added 'dom-inject' and 'css' modules

              r6
            
      import { id as mid } from "module";

      import { TraceSource } from "@implab/core-amd/log/TraceSource";

      import { MapOf } from "@implab/core-amd/interfaces";

      import { mixin } from "@implab/core-amd/safe";

      const trace = TraceSource.get(mid);

      function on<T extends keyof HTMLElementEventMap>(node: HTMLElement, eventName: T, handler: (this: HTMLElement, ev: HTMLElementEventMap[T]) => any): () => void {

          // Add an event listener to a DOM node

          node.addEventListener(eventName, handler, false);

          return () => node.removeEventListener(eventName, handler, false);

      }

      interface NodeLoadResult {

          node: HTMLElement;

      }

      class DomInject {

        cin
    
fixes to css, nls to support requirejs optimizer

              r36
            
          injectionPoint?: HTMLElement;

        cin
    
Fixes in WidgetContex, added _Container.addChild support

              r38
            
          injectAfter?: HTMLElement;

        cin
    
added 'dom-inject' and 'css' modules

              r6
            
          _map: MapOf<Promise<NodeLoadResult>> = {};

          _inject<T extends keyof HTMLElementTagNameMap>(name: T, attr: Partial<HTMLElementTagNameMap[T]>) {

              const node = document.createElement(name);

              return new Promise<NodeLoadResult>((ok, fail) => {

                  const cleanup = () => {

                      noerr();

                      noload();

                  };

                  const noload = on(node, "load", () => {

                      ok({ node });

                      cleanup();

                  });

                  const noerr = on(node, "error", e => {

                      fail({

        cin
    
Fixed startup of DjxWidgetBase to start inner widgets...

              r52
            
                          error: e,

        cin
    
added 'dom-inject' and 'css' modules

              r6
            
                          node

                      });

                      cleanup();

                  });

                  mixin(node, attr);

        cin
    
fixes to css, nls to support requirejs optimizer

              r36
            
                  const _injectionPoint = this.injectionPoint || document.head;

        cin
    
Fixes in WidgetContex, added _Container.addChild support

              r38
            
                  const _injectBefore = this.injectAfter ? this.injectAfter.nextSibling : null;

        cin
    
fixes to css, nls to support requirejs optimizer

              r36
            
                  _injectionPoint.insertBefore(node, _injectBefore);

        cin
    
added 'dom-inject' and 'css' modules

              r6
            
              });

          }

          async injectScript(url: string) {

              let d = this._map[url];

              if (!d) {

                  trace.log("js {0}", url);

                  d = this._inject("script", {

                      type: "text/javascript",

                      charset: "utf-8",

                      src: url

                  });

                  this._map[url] = d;

              }

              try {

                  await d;

                  trace.log("done {0}", url);

              } catch (e) {

                  trace.error("failed {0}: {1}", url, e);

        cin
    
Added DjxFragment...

              r19
            
                  throw e;

        cin
    
added 'dom-inject' and 'css' modules

              r6
            
              }

          }

          async injectStylesheet(url: string) {

              let d = this._map[url];

              if (!d) {

                  trace.log("js {0}", url);

                  d = this._inject("link", {

                      type: "text/css",

                      rel: "stylesheet",

                      href: url

                  });

                  this._map[url] = d;

              }

              try {

                  await d;

                  trace.log("done {0}", url);

              } catch (e) {

                  trace.error("failed {0}: {1}", url, e);

        cin
    
Added DjxFragment...

              r19
            
                  throw e;

        cin
    
added 'dom-inject' and 'css' modules

              r6
            
              }

          }

      };

      const instance = new DomInject();

        cin
    
fixes to css, nls to support requirejs optimizer

              r36
            
      export default instance;

	Site-wide shortcuts
/	Use quick search box
g h	Goto home page
g g	Goto my private gists page
g G	Goto my public gists page
g 0-9	Goto bookmarked items from 0-9
n r	New repository page
n g	New gist page

	Repositories
g s	Goto summary page
g c	Goto changelog page
g f	Goto files page
g F	Goto files page with file search activated
g p	Goto pull requests page
g o	Goto repository settings
g O	Goto repository access permissions settings
t s	Toggle sidebar on some pages

cin added 'dom-inject' and 'css' modules	r6	import { id as mid } from "module";
		import { TraceSource } from "@implab/core-amd/log/TraceSource";
		import { MapOf } from "@implab/core-amd/interfaces";
		import { mixin } from "@implab/core-amd/safe";

		const trace = TraceSource.get(mid);


		function on<T extends keyof HTMLElementEventMap>(node: HTMLElement, eventName: T, handler: (this: HTMLElement, ev: HTMLElementEventMap[T]) => any): () => void {
		// Add an event listener to a DOM node
		node.addEventListener(eventName, handler, false);

		return () => node.removeEventListener(eventName, handler, false);
		}

		interface NodeLoadResult {
		node: HTMLElement;
		}

		class DomInject {
cin fixes to css, nls to support requirejs optimizer	r36	injectionPoint?: HTMLElement;
cin Fixes in WidgetContex, added _Container.addChild support	r38	injectAfter?: HTMLElement;
cin added 'dom-inject' and 'css' modules	r6
		_map: MapOf<Promise<NodeLoadResult>> = {};

		_inject<T extends keyof HTMLElementTagNameMap>(name: T, attr: Partial<HTMLElementTagNameMap[T]>) {
		const node = document.createElement(name);

		return new Promise<NodeLoadResult>((ok, fail) => {

		const cleanup = () => {
		noerr();
		noload();
		};

		const noload = on(node, "load", () => {
		ok({ node });
		cleanup();
		});

		const noerr = on(node, "error", e => {
		fail({
cin Fixed startup of DjxWidgetBase to start inner widgets...	r52	error: e,
cin added 'dom-inject' and 'css' modules	r6	node
		});
		cleanup();
		});

		mixin(node, attr);

cin fixes to css, nls to support requirejs optimizer	r36	const _injectionPoint = this.injectionPoint \|\| document.head;
cin Fixes in WidgetContex, added _Container.addChild support	r38	const _injectBefore = this.injectAfter ? this.injectAfter.nextSibling : null;
cin fixes to css, nls to support requirejs optimizer	r36
		_injectionPoint.insertBefore(node, _injectBefore);
cin added 'dom-inject' and 'css' modules	r6	});
		}

		async injectScript(url: string) {
		let d = this._map[url];
		if (!d) {
		trace.log("js {0}", url);
		d = this._inject("script", {
		type: "text/javascript",
		charset: "utf-8",
		src: url
		});
		this._map[url] = d;
		}
		try {
		await d;
		trace.log("done {0}", url);
		} catch (e) {
		trace.error("failed {0}: {1}", url, e);
cin Added DjxFragment...	r19	throw e;
cin added 'dom-inject' and 'css' modules	r6	}
		}

		async injectStylesheet(url: string) {
		let d = this._map[url];
		if (!d) {
		trace.log("js {0}", url);
		d = this._inject("link", {
		type: "text/css",
		rel: "stylesheet",
		href: url
		});
		this._map[url] = d;
		}
		try {
		await d;
		trace.log("done {0}", url);
		} catch (e) {
		trace.error("failed {0}: {1}", url, e);
cin Added DjxFragment...	r19	throw e;
cin added 'dom-inject' and 'css' modules	r6	}
		}
		};

		const instance = new DomInject();
cin fixes to css, nls to support requirejs optimizer	r36	export default instance;