@dereekb/browser 0.0.1 → 1.0.0

package/CHANGELOG.md

@@ -0,0 +1,15 @@
+# Changelog
+
+This file was generated using [@jscutlery/semver](https://github.com/jscutlery/semver).
+
+# 1.0.0 (2022-02-23)
+
+
+### Features
+
+* added vh100 functionality ([10b86b4](https://github.com/dereekb/dbcomponents/commit/10b86b42fb6653c338212b32d7f3555109747787))
+* segment analytics ([b81d5a6](https://github.com/dereekb/dbcomponents/commit/b81d5a6a70ecf3bc35852d441cfd79e91e5dcb51))
+
+
+
+# 0.1.0 (2022-01-29)

package/README.md

@@ -1,11 +1,6 @@
-# browser
+@dereekb/browser
+=======
 
-This library was generated with [Nx](https://nx.dev).
+The sources for this package are in the main [@dereekb/dbcomponents](https://github.com/dereekb/dbcomponents) repo. Please file issues and pull requests against that repo.
 
-## Building
-
-Run `nx build browser` to build the library.
-
-## Running unit tests
-
-Run `nx test browser` to execute the unit tests via [Jest](https://jestjs.io).
+License: MIT

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dereekb/browser",
-  "version": "0.0.1",
+  "version": "1.0.0",
   "type": "commonjs",
   "main": "./src/index.js",
   "typings": "./src/index.d.ts"

package/src/index.d.ts

@@ -1 +1 @@
-export * from './lib/window';
+export * from './lib';

package/src/index.js

@@ -1,5 +1,5 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const tslib_1 = require("tslib");
-(0, tslib_1.__exportStar)(require("./lib/window"), exports);
+(0, tslib_1.__exportStar)(require("./lib"), exports);
 //# sourceMappingURL=index.js.map

package/src/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../packages/browser/src/index.ts"],"names":[],"mappings":";;;AAAA,4DAA6B"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../packages/browser/src/index.ts"],"names":[],"mappings":";;;AAAA,qDAAsB"}

package/src/lib/index.d.ts

@@ -0,0 +1,3 @@
+export * from './service';
+export * from './vh100';
+export * from './window';

package/src/lib/index.js

@@ -0,0 +1,7 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+(0, tslib_1.__exportStar)(require("./service"), exports);
+(0, tslib_1.__exportStar)(require("./vh100"), exports);
+(0, tslib_1.__exportStar)(require("./window"), exports);
+//# sourceMappingURL=index.js.map

package/src/lib/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../packages/browser/src/lib/index.ts"],"names":[],"mappings":";;;AAAA,yDAA0B;AAC1B,uDAAwB;AACxB,wDAAyB"}

package/src/lib/service.d.ts

@@ -0,0 +1,23 @@
+import { Observable } from 'rxjs';
+/**
+ * Used for loading services in the browser that are imported from other scripts, such as Facebook, Segment, Stripe, etc.
+ */
+export declare abstract class AbstractAsyncWindowLoadedService<T> {
+    private _windowKey;
+    private _callbackKey?;
+    private _serviceName;
+    private _loading;
+    readonly loading$: Observable<Promise<T>>;
+    readonly service$: Observable<T>;
+    /**
+     * @param _windowKey Key that is attached to the window for the object that is the service when finished loading.
+     * @param _callbackKey Optional key attached to window that is a function that is executed when the setup is complete.
+     */
+    constructor(_windowKey: string, _callbackKey?: string | undefined, _serviceName?: string, preload?: boolean);
+    getService(): Promise<T>;
+    protected loadService(): Promise<T>;
+    protected _onLoadServiceFailure(): Promise<T> | void;
+    private completeLoadingService;
+    protected _prepareCompleteLoadingService(): Promise<any>;
+    protected _initService(service: T): Promise<T | void>;
+}

package/src/lib/service.js

@@ -0,0 +1,93 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.AbstractAsyncWindowLoadedService = void 0;
+const tslib_1 = require("tslib");
+const rxjs_1 = require("@dereekb/rxjs");
+const rxjs_2 = require("rxjs");
+/**
+ * Used for loading services in the browser that are imported from other scripts, such as Facebook, Segment, Stripe, etc.
+ */
+class AbstractAsyncWindowLoadedService {
+    /**
+     * @param _windowKey Key that is attached to the window for the object that is the service when finished loading.
+     * @param _callbackKey Optional key attached to window that is a function that is executed when the setup is complete.
+     */
+    constructor(_windowKey, _callbackKey, _serviceName = _windowKey, preload = true) {
+        this._windowKey = _windowKey;
+        this._callbackKey = _callbackKey;
+        this._serviceName = _serviceName;
+        this._loading = new rxjs_2.BehaviorSubject(undefined);
+        this.loading$ = this._loading.pipe((0, rxjs_1.tapFirst)(() => this.loadService()), (0, rxjs_1.filterMaybe)(), (0, rxjs_2.shareReplay)(1));
+        this.service$ = this.loading$.pipe((0, rxjs_2.switchMap)(x => (0, rxjs_2.from)(x)), (0, rxjs_2.shareReplay)(1));
+        if (preload) {
+            // Begin loading the service immediately.
+            setTimeout(() => this.loadService().catch());
+        }
+    }
+    getService() {
+        return (0, rxjs_2.firstValueFrom)(this.service$);
+    }
+    // MARK: Loading
+    loadService() {
+        if (!this._loading.value) {
+            const loadingPromise = new Promise((resolve, reject) => {
+                let loadTry = 0;
+                const rejectWithError = () => {
+                    reject(new Error(`Service "${this._serviceName}" failed loading with windowKey "${this._windowKey}"`));
+                };
+                const tryLoad = () => {
+                    const windowRef = window;
+                    // Loaded before the promise.
+                    if (windowRef[this._windowKey]) {
+                        // Not yet finished loading async. Intercept the function.
+                        // console.log('Window key.');
+                        return resolve(this.completeLoadingService());
+                    }
+                    else if (this._callbackKey && windowRef[this._callbackKey]) {
+                        // console.log('Callback key.');
+                        windowRef[this._callbackKey] = () => resolve(this.completeLoadingService());
+                    }
+                    else if (loadTry < 10) {
+                        loadTry += 1;
+                        // console.log('Try reload...');
+                        setTimeout(() => tryLoad(), 1000);
+                    }
+                    else {
+                        const retry = this._onLoadServiceFailure();
+                        if (retry) {
+                            retry.then(x => resolve(x)).catch(() => rejectWithError());
+                        }
+                        else {
+                            rejectWithError();
+                        }
+                    }
+                };
+                tryLoad();
+            });
+            this._loading.next(loadingPromise);
+        }
+        return this._loading.value;
+    }
+    _onLoadServiceFailure() {
+    }
+    completeLoadingService() {
+        return (0, tslib_1.__awaiter)(this, void 0, void 0, function* () {
+            yield this._prepareCompleteLoadingService();
+            const service = window[this._windowKey];
+            if (!service) {
+                throw new Error(`Service "${this._serviceName}" could not complete loading.`);
+            }
+            // Init the API
+            const initializedService = yield this._initService(service);
+            return initializedService !== null && initializedService !== void 0 ? initializedService : service;
+        });
+    }
+    _prepareCompleteLoadingService() {
+        return Promise.resolve();
+    }
+    _initService(service) {
+        return Promise.resolve(service);
+    }
+}
+exports.AbstractAsyncWindowLoadedService = AbstractAsyncWindowLoadedService;
+//# sourceMappingURL=service.js.map

package/src/lib/service.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"service.js","sourceRoot":"","sources":["../../../../../packages/browser/src/lib/service.ts"],"names":[],"mappings":"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"}

package/src/lib/vh100.d.ts

@@ -0,0 +1,6 @@
+export declare const DEFAULT_VH100_VARIABLE_NAME = "vh100";
+export declare function refreshVh100Function(cssVariableName?: string): () => void;
+/**
+ * Adds window event listeners to populate the css variable `vh100`, or another input variable name, with the current window height.
+ */
+export declare function watchWindowAndUpdateVh100StyleProperty(cssVariableName?: string): void;

package/src/lib/vh100.js

@@ -0,0 +1,25 @@
+"use strict";
+// https://dev.to/maciejtrzcinski/100vh-problem-with-ios-safari-3ge9
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.watchWindowAndUpdateVh100StyleProperty = exports.refreshVh100Function = exports.DEFAULT_VH100_VARIABLE_NAME = void 0;
+exports.DEFAULT_VH100_VARIABLE_NAME = 'vh100';
+function refreshVh100Function(cssVariableName = exports.DEFAULT_VH100_VARIABLE_NAME) {
+    const cssProperty = `--${cssVariableName}`;
+    return () => {
+        const doc = document.documentElement;
+        doc.style.setProperty(cssProperty, `${window.innerHeight}px`);
+    };
+}
+exports.refreshVh100Function = refreshVh100Function;
+;
+/**
+ * Adds window event listeners to populate the css variable `vh100`, or another input variable name, with the current window height.
+ */
+function watchWindowAndUpdateVh100StyleProperty(cssVariableName) {
+    const refreshPropertyValue = refreshVh100Function(cssVariableName);
+    window.addEventListener('resize', refreshPropertyValue);
+    window.addEventListener('orientationchange', refreshPropertyValue);
+    refreshPropertyValue();
+}
+exports.watchWindowAndUpdateVh100StyleProperty = watchWindowAndUpdateVh100StyleProperty;
+//# sourceMappingURL=vh100.js.map

package/src/lib/vh100.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"vh100.js","sourceRoot":"","sources":["../../../../../packages/browser/src/lib/vh100.ts"],"names":[],"mappings":";AAAA,oEAAoE;;;AAEvD,QAAA,2BAA2B,GAAG,OAAO,CAAC;AAEnD,SAAgB,oBAAoB,CAAC,eAAe,GAAG,mCAA2B;IAChF,MAAM,WAAW,GAAG,KAAK,eAAe,EAAE,CAAC;IAC3C,OAAO,GAAG,EAAE;QACV,MAAM,GAAG,GAAG,QAAQ,CAAC,eAAe,CAAC;QACrC,GAAG,CAAC,KAAK,CAAC,WAAW,CAAC,WAAW,EAAE,GAAG,MAAM,CAAC,WAAW,IAAI,CAAC,CAAC;IAChE,CAAC,CAAA;AACH,CAAC;AAND,oDAMC;AAAA,CAAC;AAEF;;GAEG;AACH,SAAgB,sCAAsC,CAAC,eAAwB;IAC7E,MAAM,oBAAoB,GAAG,oBAAoB,CAAC,eAAe,CAAC,CAAC;IAEnE,MAAM,CAAC,gBAAgB,CAAC,QAAQ,EAAE,oBAAoB,CAAC,CAAC;IACxD,MAAM,CAAC,gBAAgB,CAAC,mBAAmB,EAAE,oBAAoB,CAAC,CAAC;IACnE,oBAAoB,EAAE,CAAC;AAEzB,CAAC;AAPD,wFAOC"}