initial commit
This commit is contained in:
commit
6e69d8370e
|
@ -0,0 +1,34 @@
|
||||||
|
module.exports = {
|
||||||
|
"env": {
|
||||||
|
"browser": true,
|
||||||
|
"es6": true,
|
||||||
|
"node": true
|
||||||
|
},
|
||||||
|
"extends": "eslint:recommended",
|
||||||
|
"globals": {
|
||||||
|
"Atomics": "readonly",
|
||||||
|
"SharedArrayBuffer": "readonly"
|
||||||
|
},
|
||||||
|
"parserOptions": {
|
||||||
|
"ecmaVersion": 2017,
|
||||||
|
"sourceType": "module"
|
||||||
|
},
|
||||||
|
"rules": {
|
||||||
|
"no-console": [
|
||||||
|
"warn"
|
||||||
|
],
|
||||||
|
"indent": [
|
||||||
|
"error",
|
||||||
|
4,
|
||||||
|
{"SwitchCase": 1}
|
||||||
|
],
|
||||||
|
"quotes": [
|
||||||
|
"error",
|
||||||
|
"single"
|
||||||
|
],
|
||||||
|
"semi": [
|
||||||
|
"error",
|
||||||
|
"always"
|
||||||
|
]
|
||||||
|
}
|
||||||
|
}
|
|
@ -0,0 +1 @@
|
||||||
|
node_modules/
|
|
@ -0,0 +1,72 @@
|
||||||
|
# Contributing
|
||||||
|
|
||||||
|
So you want to contribute, nice. **Thank you**.
|
||||||
|
|
||||||
|
Bug reports and code and documentation patches are all welcome. You can help this project also by using the development version and by reporting any bugs you might encounter.
|
||||||
|
|
||||||
|
You may contribute in several ways like:
|
||||||
|
|
||||||
|
* Creating new features
|
||||||
|
* Fixing bugs
|
||||||
|
* Improving documentation and examples
|
||||||
|
* Translating any document here to your language
|
||||||
|
|
||||||
|
## Table of contents
|
||||||
|
|
||||||
|
* [Contributing](#contributing)
|
||||||
|
* [Developing](#developing)
|
||||||
|
* [Running tests](#running-tests)
|
||||||
|
* [Reporting a bug](#reporting-a-bug)
|
||||||
|
* [Request a feature](#request-a-feature)
|
||||||
|
* [Commit message](#commit-message)
|
||||||
|
* [Code style](#code-style)
|
||||||
|
|
||||||
|
## Developing
|
||||||
|
|
||||||
|
There is only one main source file in the project. It is the [/src/index.js](/src/index.js).
|
||||||
|
The [test/index.spec.js](test/index.spec.js) is for now the only unit test file in the project.
|
||||||
|
|
||||||
|
The `dist` includes the minified version of the source code.
|
||||||
|
|
||||||
|
## Running tests
|
||||||
|
|
||||||
|
Run unit tests using this command:
|
||||||
|
|
||||||
|
```bash
|
||||||
|
npm run test
|
||||||
|
```
|
||||||
|
|
||||||
|
## Reporting a bug
|
||||||
|
|
||||||
|
Use the [GitHub issue tracker](https://github.com/n2geoff/js-lib/issues) to report any bug you find.
|
||||||
|
Bugs description should include:
|
||||||
|
|
||||||
|
* How to reproduce the bug;
|
||||||
|
* Easy to understand title;
|
||||||
|
|
||||||
|
Would be nice to have some code showing how to reproduce the code, you may use [gist](https://gist.github.com) or [Codepen](https://codepen.io) for uploading your example code.
|
||||||
|
|
||||||
|
## Request a feature
|
||||||
|
|
||||||
|
Use the [GitHub issue tracker](https://github.com/n2geoff/js-lib/issues) to request a new feature.
|
||||||
|
|
||||||
|
Keep in mind, this is a pure javascript library
|
||||||
|
|
||||||
|
Feel free to port it to your favorite framework, such as [RiotJS](http://riotjs.com), Angular or VueJs in a new repository.
|
||||||
|
|
||||||
|
## Commit message
|
||||||
|
|
||||||
|
Commit messages should includes GitHub number reference and a imperative easy to understand sentence.
|
||||||
|
|
||||||
|
## Coding style
|
||||||
|
|
||||||
|
If it is supported in all major browers without transpiling, then please use those JavaScript language features in your code, with one caveat -- readablity is king.
|
||||||
|
|
||||||
|
Currently all ES5 and ES6/ES2015 are available.
|
||||||
|
|
||||||
|
This project is linted agaist [ESLint](https://eslint.org/) and the [`.eslintrc.js`](.eslintrc.js) is dead-simple, and all you need to followed.
|
||||||
|
|
||||||
|
Thank you for reading this.
|
||||||
|
|
||||||
|
|
||||||
|
Hey, **star** this *repo* and/or share it with your friends.
|
|
@ -0,0 +1,19 @@
|
||||||
|
Copyright (c) 2021 Geoff Doty
|
||||||
|
|
||||||
|
Permission is hereby granted, free of charge, to any person obtaining a copy of
|
||||||
|
this software and associated documentation files (the "Software"), to deal in
|
||||||
|
the Software without restriction, including without limitation the rights to
|
||||||
|
use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies
|
||||||
|
of the Software, and to permit persons to whom the Software is furnished to do
|
||||||
|
so, subject to the following conditions:
|
||||||
|
|
||||||
|
The above copyright notice and this permission notice shall be included in all
|
||||||
|
copies or substantial portions of the Software.
|
||||||
|
|
||||||
|
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||||
|
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
||||||
|
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
||||||
|
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
||||||
|
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
||||||
|
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
||||||
|
SOFTWARE.
|
|
@ -0,0 +1,113 @@
|
||||||
|
# Anchor
|
||||||
|
|
||||||
|
> fasten your apps!
|
||||||
|
|
||||||
|
Tiny (1kb) utility library that creates a unique global application registry.
|
||||||
|
|
||||||
|
Useful for composing single-page-apps or developing a Micro-Frontend architecture
|
||||||
|
|
||||||
|
|
||||||
|
## API
|
||||||
|
|
||||||
|
Anchor(register = {}, [mix = []])
|
||||||
|
|
||||||
|
- `register` {Object} - initial object registry (optional)
|
||||||
|
- `mixin` {Array} - extend anchor directly (optional)
|
||||||
|
|
||||||
|
## Quick Start
|
||||||
|
|
||||||
|
`Anchor` is the superfood for your application entry file
|
||||||
|
|
||||||
|
```js
|
||||||
|
// app.js
|
||||||
|
|
||||||
|
import anchor from 'anchor.js';
|
||||||
|
|
||||||
|
let app = new Anchor();
|
||||||
|
|
||||||
|
app.register('version', '1.0.0');
|
||||||
|
app.register('log', console);
|
||||||
|
|
||||||
|
export app;
|
||||||
|
|
||||||
|
```
|
||||||
|
|
||||||
|
Now `app` can do
|
||||||
|
|
||||||
|
```js
|
||||||
|
// another.js
|
||||||
|
|
||||||
|
import app from 'app.js';
|
||||||
|
|
||||||
|
app.log.info('using app version', app.version); // using app version 1.0.0
|
||||||
|
```
|
||||||
|
|
||||||
|
You can also initialize `Anchor` with an object to front-load the registry instead of using `app.register()`
|
||||||
|
|
||||||
|
```js
|
||||||
|
let app = new Anchor({
|
||||||
|
'version': '1.0.0',
|
||||||
|
'log': console,
|
||||||
|
...
|
||||||
|
});
|
||||||
|
```
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
> TIP: Connect multiple spas together, on each spa use `app.register` to extend that spas functionality on its bootstrap file
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
The `Anchor mixin` option acts more like a *merge*, rather than a `registry` and is useful to `mixin` objects directly, for example:
|
||||||
|
|
||||||
|
```js
|
||||||
|
// app.js
|
||||||
|
|
||||||
|
import anchor from 'anchor.js';
|
||||||
|
import mitt from 'mitt.js'; // event library
|
||||||
|
|
||||||
|
let app = new Anchor({}, [mitt()]); // adds on, off, emit, all to app
|
||||||
|
|
||||||
|
```
|
||||||
|
|
||||||
|
`app` now has `on`, `off`, `emit`, and `all` event functions bolted on (unsafe), so you can do
|
||||||
|
|
||||||
|
```js
|
||||||
|
app.on('my-event', dostuff);
|
||||||
|
```
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
Of course we are only talking about not using a namespace vs not using a namespace. You can achieve the same thing with `app.register('events', mitt())` and it is safer, but a *tiny* bit more typing :)
|
||||||
|
|
||||||
|
```js
|
||||||
|
app.events.emit('my-event', " I'm your huckel berry");
|
||||||
|
```
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
> WARNING: `mixin` has no safe guards and will overwrite existing duplicate functionality
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
## Tests
|
||||||
|
|
||||||
|
npm test
|
||||||
|
|
||||||
|
> NOTE: requires `deno` to execute module-based client-side test runner
|
||||||
|
|
||||||
|
and lint via
|
||||||
|
|
||||||
|
npm run lint
|
||||||
|
|
||||||
|
## Support
|
||||||
|
|
||||||
|
Please open [an issue](https://github.com/n2geoff/anchor/issues/new) for support.
|
||||||
|
|
||||||
|
## Contributing
|
||||||
|
|
||||||
|
Anyone is welcome to contribute, however, if you decide to get involved, please take a moment to review the [guidelines](CONTRIBUTING.md), they're minimalistic;)
|
||||||
|
|
||||||
|
## License
|
||||||
|
|
||||||
|
[MIT](LICENSE) 2021 Geoff Doty
|
|
@ -0,0 +1,38 @@
|
||||||
|
|
||||||
|
class Anchor {
|
||||||
|
constructor(fasten = {}, mixins = [], debug = false) {
|
||||||
|
this.namespace = `_${Math.random().toString(36).slice(-6)}_`.toUpperCase();
|
||||||
|
|
||||||
|
this.global = window || global;
|
||||||
|
|
||||||
|
return this.build(fasten, mixins, debug);
|
||||||
|
}
|
||||||
|
|
||||||
|
register(key, value) {
|
||||||
|
if (this.global[this.namespace] && !this.global[this.namespace][key]) {
|
||||||
|
return this.global[this.namespace][key] = value;
|
||||||
|
}
|
||||||
|
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
|
||||||
|
build(fasten, merges, debug) {
|
||||||
|
if (this.global[this.namespace]) {
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
|
||||||
|
this.global[this.namespace] = fasten;
|
||||||
|
|
||||||
|
merges.forEach((merge) => Object.assign(this.global[this.namespace], merge));
|
||||||
|
|
||||||
|
this.register('register', this.register);
|
||||||
|
|
||||||
|
if (!!debug) {
|
||||||
|
console.log('ANCHOR:FASTEN', this.namespace, this.global[this.namespace]);
|
||||||
|
}
|
||||||
|
|
||||||
|
return this.global[this.namespace];
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
export default Anchor;
|
|
@ -0,0 +1 @@
|
||||||
|
class Anchor{constructor(s={},e=[],t=!1){return this.namespace=`_${Math.random().toString(36).slice(-6)}_`.toUpperCase(),this.global=window||global,this.build(s,e,t)}register(s,e){return!(!this.global[this.namespace]||this.global[this.namespace][s])&&(this.global[this.namespace][s]=e)}build(s,e,t){return!this.global[this.namespace]&&(this.global[this.namespace]=s,e.forEach(s=>Object.assign(this.global[this.namespace],s)),this.register("register",this.register),t&&console.log("ANCHOR:FASTEN",this.namespace,this.global[this.namespace]),this.global[this.namespace])}}export default Anchor;
|
|
@ -0,0 +1,47 @@
|
||||||
|
(function (global, factory) {
|
||||||
|
typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
|
||||||
|
typeof define === 'function' && define.amd ? define('umd', factory) :
|
||||||
|
(global = typeof globalThis !== 'undefined' ? globalThis : global || self, global.umd = factory());
|
||||||
|
}(this, (function () { 'use strict';
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
class Anchor {
|
||||||
|
constructor(fasten = {}, mixins = [], debug = false) {
|
||||||
|
this.namespace = `_${Math.random().toString(36).slice(-6)}_`.toUpperCase();
|
||||||
|
|
||||||
|
this.global = window || global;
|
||||||
|
|
||||||
|
return this.build(fasten, mixins, debug);
|
||||||
|
}
|
||||||
|
|
||||||
|
register(key, value) {
|
||||||
|
if (this.global[this.namespace] && !this.global[this.namespace][key]) {
|
||||||
|
return this.global[this.namespace][key] = value;
|
||||||
|
}
|
||||||
|
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
|
||||||
|
build(fasten, merges, debug) {
|
||||||
|
if (this.global[this.namespace]) {
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
|
||||||
|
this.global[this.namespace] = fasten;
|
||||||
|
|
||||||
|
merges.forEach((merge) => Object.assign(this.global[this.namespace], merge));
|
||||||
|
|
||||||
|
this.register('register', this.register);
|
||||||
|
|
||||||
|
if (!!debug) {
|
||||||
|
console.log('ANCHOR:FASTEN', this.namespace, this.global[this.namespace]);
|
||||||
|
}
|
||||||
|
|
||||||
|
return this.global[this.namespace];
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
return Anchor;
|
||||||
|
|
||||||
|
})));
|
|
@ -0,0 +1 @@
|
||||||
|
!function(e,s){"object"==typeof exports&&"undefined"!=typeof module?module.exports=s():"function"==typeof define&&define.amd?define("umd",s):(e="undefined"!=typeof globalThis?globalThis:e||self).umd=s()}(this,function(){"use strict";return class{constructor(e={},s=[],t=!1){return this.namespace=`_${Math.random().toString(36).slice(-6)}_`.toUpperCase(),this.global=window||global,this.build(e,s,t)}register(e,s){return!(!this.global[this.namespace]||this.global[this.namespace][e])&&(this.global[this.namespace][e]=s)}build(e,s,t){return!this.global[this.namespace]&&(this.global[this.namespace]=e,s.forEach(e=>Object.assign(this.global[this.namespace],e)),this.register("register",this.register),t&&console.log("ANCHOR:FASTEN",this.namespace,this.global[this.namespace]),this.global[this.namespace])}}});
|
|
@ -0,0 +1,25 @@
|
||||||
|
const gulp = require("gulp");
|
||||||
|
const minify = require("gulp-minify");
|
||||||
|
const strip = require("gulp-strip-comments");
|
||||||
|
const rollup = require("gulp-rollup-2").rollup;
|
||||||
|
|
||||||
|
gulp.task("default", function build() {
|
||||||
|
return gulp.src("./src/*.js")
|
||||||
|
.pipe(rollup({
|
||||||
|
output: [
|
||||||
|
{
|
||||||
|
file: "anchor.js",
|
||||||
|
name: "es",
|
||||||
|
format: "es"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
file: "anchor.umd.js",
|
||||||
|
name: "umd",
|
||||||
|
format: "umd"
|
||||||
|
},
|
||||||
|
]
|
||||||
|
}))
|
||||||
|
.pipe(strip({safe: true}))
|
||||||
|
.pipe(minify({ext: {min: ".min.js"}}))
|
||||||
|
.pipe(gulp.dest("dist"))
|
||||||
|
});
|
File diff suppressed because it is too large
Load Diff
|
@ -0,0 +1,30 @@
|
||||||
|
{
|
||||||
|
"name": "anchor",
|
||||||
|
"version": "1.0.0",
|
||||||
|
"description": "tiny global application registry",
|
||||||
|
"main": "src/index.js",
|
||||||
|
"directories": {
|
||||||
|
"test": "test"
|
||||||
|
},
|
||||||
|
"scripts": {
|
||||||
|
"build": "npx gulp default",
|
||||||
|
"test": "npm run build && npm run lint && deno run test/index.spec.js",
|
||||||
|
"lint": "npx eslint src/index.js"
|
||||||
|
},
|
||||||
|
"keywords": [
|
||||||
|
"utility",
|
||||||
|
"micro-frontend",
|
||||||
|
"spa"
|
||||||
|
],
|
||||||
|
"author": "Geoff Doty",
|
||||||
|
"license": "MIT",
|
||||||
|
"dependencies": {
|
||||||
|
},
|
||||||
|
"devDependencies": {
|
||||||
|
"eslint": "^7.16.0",
|
||||||
|
"gulp": "^4.0.2",
|
||||||
|
"gulp-minify": "^3.1.0",
|
||||||
|
"gulp-rollup-2": "^1.2.1",
|
||||||
|
"gulp-strip-comments": "^2.5.2"
|
||||||
|
}
|
||||||
|
}
|
|
@ -0,0 +1,65 @@
|
||||||
|
/* {Module} v{version} | MIT | https:// */
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Tiny global application registry
|
||||||
|
*/
|
||||||
|
class Anchor {
|
||||||
|
constructor(fasten = {}, mixins = [], debug = false) {
|
||||||
|
// create a unique namespace to avoid collisions
|
||||||
|
this.namespace = `_${Math.random().toString(36).slice(-6)}_`.toUpperCase();
|
||||||
|
|
||||||
|
// find environments global object
|
||||||
|
this.global = window || global;
|
||||||
|
|
||||||
|
// builds anchor instance
|
||||||
|
return this.build(fasten, mixins, debug);
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Register
|
||||||
|
*
|
||||||
|
* Helper to extend functionality without overriding existing
|
||||||
|
*
|
||||||
|
* @param {String} key
|
||||||
|
* @param {Any} value
|
||||||
|
*/
|
||||||
|
register(key, value) {
|
||||||
|
if (this.global[this.namespace] && !this.global[this.namespace][key]) {
|
||||||
|
return this.global[this.namespace][key] = value;
|
||||||
|
}
|
||||||
|
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Builds the Application Anchor
|
||||||
|
*
|
||||||
|
* @param {Object} fasten
|
||||||
|
* @param {Array} merges
|
||||||
|
* @param {Boolean} debug
|
||||||
|
*/
|
||||||
|
build(fasten, merges, debug) {
|
||||||
|
if (this.global[this.namespace]) {
|
||||||
|
// already initialized
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
|
||||||
|
// add to global instance
|
||||||
|
this.global[this.namespace] = fasten;
|
||||||
|
|
||||||
|
// merge with global instance
|
||||||
|
merges.forEach((merge) => Object.assign(this.global[this.namespace], merge));
|
||||||
|
|
||||||
|
// app global utils
|
||||||
|
this.register('register', this.register);
|
||||||
|
|
||||||
|
if (debug) {
|
||||||
|
// eslint-disable-next-line
|
||||||
|
console.log('ANCHOR:FASTEN', this.namespace, this.global[this.namespace]);
|
||||||
|
}
|
||||||
|
|
||||||
|
return this.global[this.namespace];
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
export default Anchor;
|
|
@ -0,0 +1,9 @@
|
||||||
|
import test from "../node_modules/testit/dist/testit.js";
|
||||||
|
import Anchor from "../src/index.js";
|
||||||
|
|
||||||
|
test.it({
|
||||||
|
"achor class exists": function () {
|
||||||
|
test.assert(Anchor);
|
||||||
|
}
|
||||||
|
}).run();
|
||||||
|
|
Loading…
Reference in New Issue