@lrnwebcomponents/micro-frontend-registry
Advanced tools
Comparing version 4.0.28 to 4.0.29
{ | ||
"schema_version": "1.0.0", | ||
"functions": [ | ||
{ | ||
"name": "enableServices", | ||
"description": "", | ||
"summary": "", | ||
"sourceRange": { | ||
"file": "lib/microServices.js", | ||
"start": { | ||
"line": 8, | ||
"column": 7 | ||
}, | ||
"end": { | ||
"line": 22, | ||
"column": 1 | ||
} | ||
}, | ||
"privacy": "public", | ||
"params": [], | ||
"return": { | ||
"type": "void" | ||
} | ||
}, | ||
{ | ||
"name": "enableCoreServices", | ||
"description": " core services", | ||
"summary": "", | ||
"sourceRange": { | ||
"file": "lib/microServices.js", | ||
"start": { | ||
"line": 25, | ||
"column": 7 | ||
}, | ||
"end": { | ||
"line": 147, | ||
"column": 1 | ||
} | ||
}, | ||
"privacy": "public", | ||
"params": [], | ||
"return": { | ||
"type": "void" | ||
} | ||
}, | ||
{ | ||
"name": "enableHAXcmsServices", | ||
"description": " HAXcms services", | ||
"summary": "", | ||
"sourceRange": { | ||
"file": "lib/microServices.js", | ||
"start": { | ||
"line": 150, | ||
"column": 7 | ||
}, | ||
"end": { | ||
"line": 199, | ||
"column": 1 | ||
} | ||
}, | ||
"privacy": "public", | ||
"params": [], | ||
"return": { | ||
"type": "void" | ||
} | ||
}, | ||
{ | ||
"name": "enableExperimentalServices", | ||
"description": " experimental service", | ||
"summary": "", | ||
"sourceRange": { | ||
"file": "lib/microServices.js", | ||
"start": { | ||
"line": 202, | ||
"column": 7 | ||
}, | ||
"end": { | ||
"line": 213, | ||
"column": 1 | ||
} | ||
}, | ||
"privacy": "public", | ||
"params": [], | ||
"return": { | ||
"type": "void" | ||
} | ||
} | ||
], | ||
"classes": [ | ||
@@ -19,3 +105,3 @@ { | ||
"end": { | ||
"line": 28, | ||
"line": 25, | ||
"column": 1 | ||
@@ -34,2 +120,27 @@ } | ||
{ | ||
"name": "add", | ||
"description": "Adding more or less alias for define", | ||
"privacy": "public", | ||
"sourceRange": { | ||
"start": { | ||
"line": 49, | ||
"column": 2 | ||
}, | ||
"end": { | ||
"line": 51, | ||
"column": 3 | ||
} | ||
}, | ||
"metadata": {}, | ||
"params": [ | ||
{ | ||
"name": "params", | ||
"type": "Object" | ||
} | ||
], | ||
"return": { | ||
"type": "void" | ||
} | ||
}, | ||
{ | ||
"name": "define", | ||
@@ -40,7 +151,7 @@ "description": "define a new micro frontend", | ||
"start": { | ||
"line": 54, | ||
"line": 59, | ||
"column": 2 | ||
}, | ||
"end": { | ||
"line": 86, | ||
"line": 103, | ||
"column": 3 | ||
@@ -68,7 +179,7 @@ } | ||
"start": { | ||
"line": 94, | ||
"line": 111, | ||
"column": 2 | ||
}, | ||
"end": { | ||
"line": 102, | ||
"line": 122, | ||
"column": 3 | ||
@@ -83,2 +194,6 @@ } | ||
"description": "machine name of the micro record requested" | ||
}, | ||
{ | ||
"name": "testOnly", | ||
"defaultValue": "false" | ||
} | ||
@@ -92,2 +207,29 @@ ], | ||
{ | ||
"name": "has", | ||
"description": "boolean for having the definition for a machine named micro", | ||
"privacy": "public", | ||
"sourceRange": { | ||
"start": { | ||
"line": 130, | ||
"column": 2 | ||
}, | ||
"end": { | ||
"line": 132, | ||
"column": 3 | ||
} | ||
}, | ||
"metadata": {}, | ||
"params": [ | ||
{ | ||
"name": "name", | ||
"type": "String", | ||
"description": "machine name of the micro record requested" | ||
} | ||
], | ||
"return": { | ||
"type": "Boolean", | ||
"desc": "if we have this micro" | ||
} | ||
}, | ||
{ | ||
"name": "set", | ||
@@ -98,7 +240,7 @@ "description": "set the definition for a machine named micro that was already registered", | ||
"start": { | ||
"line": 111, | ||
"line": 141, | ||
"column": 3 | ||
}, | ||
"end": { | ||
"line": 117, | ||
"line": 147, | ||
"column": 3 | ||
@@ -132,7 +274,7 @@ } | ||
"start": { | ||
"line": 127, | ||
"line": 157, | ||
"column": 2 | ||
}, | ||
"end": { | ||
"line": 144, | ||
"line": 180, | ||
"column": 3 | ||
@@ -176,7 +318,7 @@ } | ||
"start": { | ||
"line": 153, | ||
"line": 189, | ||
"column": 2 | ||
}, | ||
"end": { | ||
"line": 165, | ||
"line": 204, | ||
"column": 3 | ||
@@ -219,7 +361,7 @@ } | ||
"start": { | ||
"line": 37, | ||
"line": 34, | ||
"column": 0 | ||
}, | ||
"end": { | ||
"line": 166, | ||
"line": 205, | ||
"column": 1 | ||
@@ -244,7 +386,7 @@ } | ||
"start": { | ||
"line": 106, | ||
"line": 41, | ||
"column": 2 | ||
}, | ||
"end": { | ||
"line": 166, | ||
"line": 111, | ||
"column": 3 | ||
@@ -262,7 +404,7 @@ } | ||
"start": { | ||
"line": 168, | ||
"line": 113, | ||
"column": 2 | ||
}, | ||
"end": { | ||
"line": 170, | ||
"line": 115, | ||
"column": 3 | ||
@@ -287,7 +429,7 @@ } | ||
"start": { | ||
"line": 171, | ||
"line": 116, | ||
"column": 2 | ||
}, | ||
"end": { | ||
"line": 173, | ||
"line": 118, | ||
"column": 3 | ||
@@ -312,7 +454,7 @@ } | ||
"start": { | ||
"line": 174, | ||
"line": 119, | ||
"column": 2 | ||
}, | ||
"end": { | ||
"line": 176, | ||
"line": 121, | ||
"column": 3 | ||
@@ -337,7 +479,7 @@ } | ||
"start": { | ||
"line": 177, | ||
"line": 122, | ||
"column": 2 | ||
}, | ||
"end": { | ||
"line": 179, | ||
"line": 124, | ||
"column": 3 | ||
@@ -362,7 +504,7 @@ } | ||
"start": { | ||
"line": 180, | ||
"line": 125, | ||
"column": 2 | ||
}, | ||
"end": { | ||
"line": 183, | ||
"line": 128, | ||
"column": 3 | ||
@@ -387,7 +529,7 @@ } | ||
"start": { | ||
"line": 184, | ||
"line": 129, | ||
"column": 2 | ||
}, | ||
"end": { | ||
"line": 186, | ||
"line": 135, | ||
"column": 3 | ||
@@ -412,7 +554,7 @@ } | ||
"start": { | ||
"line": 188, | ||
"line": 137, | ||
"column": 2 | ||
}, | ||
"end": { | ||
"line": 259, | ||
"line": 226, | ||
"column": 3 | ||
@@ -437,7 +579,7 @@ } | ||
"start": { | ||
"line": 7, | ||
"line": 5, | ||
"column": 7 | ||
}, | ||
"end": { | ||
"line": 260, | ||
"line": 227, | ||
"column": 1 | ||
@@ -449,4 +591,305 @@ } | ||
"name": "MfHtmlExample" | ||
}, | ||
{ | ||
"description": "", | ||
"summary": "", | ||
"path": "demo/docx-example.js", | ||
"properties": [], | ||
"methods": [ | ||
{ | ||
"name": "asciiImgRender", | ||
"description": "ascii to image", | ||
"privacy": "public", | ||
"sourceRange": { | ||
"start": { | ||
"line": 45, | ||
"column": 2 | ||
}, | ||
"end": { | ||
"line": 53, | ||
"column": 3 | ||
} | ||
}, | ||
"metadata": {}, | ||
"params": [] | ||
}, | ||
{ | ||
"name": "asciiImgUpload", | ||
"description": "", | ||
"privacy": "public", | ||
"sourceRange": { | ||
"start": { | ||
"line": 55, | ||
"column": 2 | ||
}, | ||
"end": { | ||
"line": 60, | ||
"column": 3 | ||
} | ||
}, | ||
"metadata": {}, | ||
"params": [ | ||
{ | ||
"name": "event" | ||
} | ||
], | ||
"return": { | ||
"type": "void" | ||
} | ||
}, | ||
{ | ||
"name": "toAsciiResponse", | ||
"description": "", | ||
"privacy": "public", | ||
"sourceRange": { | ||
"start": { | ||
"line": 62, | ||
"column": 2 | ||
}, | ||
"end": { | ||
"line": 65, | ||
"column": 3 | ||
} | ||
}, | ||
"metadata": {}, | ||
"params": [ | ||
{ | ||
"name": "data" | ||
} | ||
], | ||
"return": { | ||
"type": "void" | ||
} | ||
}, | ||
{ | ||
"name": "docxToHtmlRender", | ||
"description": "docx to html", | ||
"privacy": "public", | ||
"sourceRange": { | ||
"start": { | ||
"line": 68, | ||
"column": 2 | ||
}, | ||
"end": { | ||
"line": 76, | ||
"column": 3 | ||
} | ||
}, | ||
"metadata": {}, | ||
"params": [] | ||
}, | ||
{ | ||
"name": "docxToHtmlUpload", | ||
"description": "", | ||
"privacy": "public", | ||
"sourceRange": { | ||
"start": { | ||
"line": 78, | ||
"column": 2 | ||
}, | ||
"end": { | ||
"line": 83, | ||
"column": 3 | ||
} | ||
}, | ||
"metadata": {}, | ||
"params": [ | ||
{ | ||
"name": "event" | ||
} | ||
], | ||
"return": { | ||
"type": "void" | ||
} | ||
}, | ||
{ | ||
"name": "docxToHtmlResponse", | ||
"description": "", | ||
"privacy": "public", | ||
"sourceRange": { | ||
"start": { | ||
"line": 85, | ||
"column": 2 | ||
}, | ||
"end": { | ||
"line": 88, | ||
"column": 3 | ||
} | ||
}, | ||
"metadata": {}, | ||
"params": [ | ||
{ | ||
"name": "data" | ||
} | ||
], | ||
"return": { | ||
"type": "void" | ||
} | ||
}, | ||
{ | ||
"name": "docxToPdfRender", | ||
"description": "docx to pdf file", | ||
"privacy": "public", | ||
"sourceRange": { | ||
"start": { | ||
"line": 91, | ||
"column": 2 | ||
}, | ||
"end": { | ||
"line": 98, | ||
"column": 3 | ||
} | ||
}, | ||
"metadata": {}, | ||
"params": [] | ||
}, | ||
{ | ||
"name": "docxToPdfUpload", | ||
"description": "", | ||
"privacy": "public", | ||
"sourceRange": { | ||
"start": { | ||
"line": 100, | ||
"column": 2 | ||
}, | ||
"end": { | ||
"line": 105, | ||
"column": 3 | ||
} | ||
}, | ||
"metadata": {}, | ||
"params": [ | ||
{ | ||
"name": "event" | ||
} | ||
], | ||
"return": { | ||
"type": "void" | ||
} | ||
}, | ||
{ | ||
"name": "docxToPdfResponse", | ||
"description": "", | ||
"privacy": "public", | ||
"sourceRange": { | ||
"start": { | ||
"line": 107, | ||
"column": 2 | ||
}, | ||
"end": { | ||
"line": 111, | ||
"column": 3 | ||
} | ||
}, | ||
"metadata": {}, | ||
"params": [ | ||
{ | ||
"name": "data" | ||
} | ||
], | ||
"return": { | ||
"type": "void" | ||
} | ||
}, | ||
{ | ||
"name": "screenshotUrlRender", | ||
"description": "", | ||
"privacy": "public", | ||
"sourceRange": { | ||
"start": { | ||
"line": 113, | ||
"column": 2 | ||
}, | ||
"end": { | ||
"line": 121, | ||
"column": 3 | ||
} | ||
}, | ||
"metadata": {}, | ||
"params": [] | ||
}, | ||
{ | ||
"name": "screenshotUrlLink", | ||
"description": "", | ||
"privacy": "public", | ||
"sourceRange": { | ||
"start": { | ||
"line": 123, | ||
"column": 2 | ||
}, | ||
"end": { | ||
"line": 126, | ||
"column": 3 | ||
} | ||
}, | ||
"metadata": {}, | ||
"params": [ | ||
{ | ||
"name": "event" | ||
} | ||
], | ||
"return": { | ||
"type": "void" | ||
} | ||
}, | ||
{ | ||
"name": "screenshotUrlResponse", | ||
"description": "", | ||
"privacy": "public", | ||
"sourceRange": { | ||
"start": { | ||
"line": 128, | ||
"column": 2 | ||
}, | ||
"end": { | ||
"line": 131, | ||
"column": 3 | ||
} | ||
}, | ||
"metadata": {}, | ||
"params": [ | ||
{ | ||
"name": "data" | ||
} | ||
], | ||
"return": { | ||
"type": "void" | ||
} | ||
}, | ||
{ | ||
"name": "render", | ||
"description": "", | ||
"privacy": "public", | ||
"sourceRange": { | ||
"start": { | ||
"line": 133, | ||
"column": 2 | ||
}, | ||
"end": { | ||
"line": 140, | ||
"column": 3 | ||
} | ||
}, | ||
"metadata": {}, | ||
"params": [] | ||
} | ||
], | ||
"staticMethods": [], | ||
"demos": [], | ||
"metadata": {}, | ||
"sourceRange": { | ||
"start": { | ||
"line": 4, | ||
"column": 7 | ||
}, | ||
"end": { | ||
"line": 141, | ||
"column": 1 | ||
} | ||
}, | ||
"privacy": "public", | ||
"superclass": "LitElement", | ||
"name": "DocxExample" | ||
} | ||
] | ||
} |
import { LitElement, css, html } from "lit"; | ||
import { | ||
MicroFrontend, | ||
MicroFrontendRegistry, | ||
} from "../micro-frontend-registry.js"; | ||
import { MicroFrontendRegistry } from "../micro-frontend-registry.js"; | ||
import { enableServices } from '../lib/microServices.js'; | ||
import "@lrnwebcomponents/simple-img/simple-img.js"; | ||
@@ -27,84 +25,21 @@ | ||
super(); | ||
// MARKDOWN | ||
// CONVERTED | ||
// TO | ||
// HTML | ||
const mdToHtml = new MicroFrontend(); | ||
mdToHtml.endpoint = "/api/services/media/format/mdToHtml"; | ||
mdToHtml.name = "md-to-html"; | ||
mdToHtml.title = "Markdown to HTML"; | ||
mdToHtml.description = "Convert Markdown string (or file) to HTML"; | ||
mdToHtml.params = { | ||
md: "MD or link to be converted", | ||
type: "link for processing as link otherwise unused", | ||
}; | ||
MicroFrontendRegistry.define(mdToHtml); | ||
this.img = false; | ||
this.ddg = false; | ||
this.haxcms = false; | ||
this.mdhtml = false; | ||
// enable these services | ||
enableServices(['haxcms', 'experimental', 'core']); | ||
} | ||
// HTML | ||
// CONVERTED | ||
// TO | ||
// MARKDOWN | ||
const htmlToMd = new MicroFrontend(); | ||
htmlToMd.endpoint = "/api/services/media/format/htmlToMd"; | ||
htmlToMd.name = "html-to-md"; | ||
htmlToMd.title = "Markdown to HTML"; | ||
htmlToMd.description = "Convert Markdown string (or file) to HTML"; | ||
htmlToMd.params = { | ||
html: "HTML or link to be converted", | ||
type: "link for processing as link otherwise unused", | ||
}; | ||
MicroFrontendRegistry.define(htmlToMd); | ||
// HTML | ||
// HYDRATED | ||
const hydrate = new MicroFrontend(); | ||
hydrate.endpoint = "/api/experiments/hydrateFromAutoloader"; | ||
hydrate.name = "hydrate-ssr"; | ||
hydrate.title = ""; | ||
hydrate.description = "Server side hydrate web components from CDN"; | ||
hydrate.params = { | ||
html: "Link to SSR", | ||
type: "link", | ||
}; | ||
MicroFrontendRegistry.define(hydrate); | ||
// HAXCMS | ||
// LOAD ENTIRE SITE CONTENT | ||
const haxcms = new MicroFrontend(); | ||
haxcms.endpoint = "/api/apps/haxcms/site/html"; | ||
haxcms.name = "haxcms-site-html"; | ||
haxcms.title = "HAXcms Site HTML"; | ||
haxcms.description = "Load entire HAXcms site via URL"; | ||
haxcms.params = { | ||
url: "location of the HAXcms site", | ||
}; | ||
MicroFrontendRegistry.define(haxcms); | ||
// HAXCMS | ||
// EPUB ENTIRE SITE CONTENT | ||
const epub = new MicroFrontend(); | ||
epub.endpoint = "/api/apps/haxcms/site/epub"; | ||
epub.name = "haxcms-site-epub"; | ||
epub.title = "HAXcms site EPUB"; | ||
epub.description = "EPUB entire HAXcms site via URL"; | ||
epub.params = { | ||
url: "location of the HAXcms site", | ||
}; | ||
MicroFrontendRegistry.define(epub); | ||
// DUCKDUCKGO | ||
// Example endpoint | ||
const ddg = new MicroFrontend(); | ||
ddg.endpoint = "/api/services/search/duckduckgo"; | ||
ddg.name = "ddg"; | ||
ddg.title = "Duck duck go"; | ||
ddg.description = "Search duck duck go"; | ||
ddg.params = { | ||
q: "query param to search on", | ||
}; | ||
MicroFrontendRegistry.define(ddg); | ||
static get properties() { | ||
return { | ||
img: { type: Boolean}, | ||
ddg: { type: Boolean}, | ||
haxcms: { type: Boolean}, | ||
mdhtml: { type: Boolean}, | ||
} | ||
} | ||
render() { | ||
return html` <div> | ||
return html`${this.img ? html`<div> | ||
<label for="src">source url</label> | ||
@@ -131,11 +66,19 @@ <input | ||
</div> | ||
<simple-img></simple-img> | ||
<div> | ||
<simple-img></simple-img>` : ``} | ||
${this.ddg ? html`<div> | ||
<label>Duck duck go</label> | ||
<input type="text" id="search" /> | ||
<button id="searchbtn">Search</button> | ||
</div> | ||
<div id="ddgresult"></div> | ||
</div>` : ``} | ||
${this.haxcms ? html` | ||
<div> | ||
<label>URL of HAXcms site</label> | ||
<label style="display:block;">URL of HAXcms site</label> | ||
<input type="url" id="haxcmsurl" /> | ||
<label style="display:block;">Parent ID</label> | ||
<input type="text" id="haxcmsparentid" /> | ||
<label style="display:block;">magic</label> | ||
<input type="text" id="haxcmsmagic" /> | ||
<label style="display:block;">base URL</label> | ||
<input type="text" id="haxcmsbase" /> | ||
<button id="haxcms">HTML entire site</button> | ||
@@ -145,2 +88,4 @@ <button id="epub">EPUB entire site</button> | ||
</div> | ||
` : ``} | ||
${this.mdhtml ? html` | ||
<div class="wrap"> | ||
@@ -169,3 +114,3 @@ <div> | ||
</div> | ||
</div>`; | ||
</div>` : ``}`; | ||
} | ||
@@ -180,3 +125,3 @@ | ||
hydrateCallback(data) { | ||
this.shadowRoot.querySelector("#html").value = data.data; | ||
this.shadowRoot.querySelector("#haxcmssite").innerHTML = data.data; | ||
} | ||
@@ -191,3 +136,7 @@ haxcmsCallback(data) { | ||
ddgCallback(data) { | ||
console.log(data); | ||
console.log(data.data.RelatedTopics); | ||
this.shadowRoot.querySelector("#ddgresult").innerHTML = | ||
`<code><pre> | ||
${JSON.stringify(data.data.RelatedTopics, null, 4)} | ||
</pre></code>`; | ||
} | ||
@@ -199,68 +148,86 @@ | ||
} | ||
this.shadowRoot.querySelector("#mdtohtml").addEventListener("click", () => { | ||
const params = { | ||
md: this.shadowRoot.querySelector("#md").value, | ||
type: this.shadowRoot.querySelector("#link").checked ? "link" : "", | ||
}; | ||
MicroFrontendRegistry.call( | ||
"md-to-html", | ||
params, | ||
this.mdToHtmlCallback.bind(this) | ||
); | ||
}); | ||
this.shadowRoot.querySelector("#htmltomd").addEventListener("click", () => { | ||
const params = { | ||
html: this.shadowRoot.querySelector("#html").value, | ||
type: this.shadowRoot.querySelector("#link").checked ? "link" : "", | ||
}; | ||
MicroFrontendRegistry.call( | ||
"html-to-md", | ||
params, | ||
this.htmlToMdCallback.bind(this) | ||
); | ||
}); | ||
this.shadowRoot.querySelector("#hydrate").addEventListener("click", () => { | ||
const params = { | ||
html: this.shadowRoot.querySelector("#md").value, | ||
type: "link", | ||
}; | ||
MicroFrontendRegistry.call( | ||
"hydrate-ssr", | ||
params, | ||
this.hydrateCallback.bind(this) | ||
); | ||
}); | ||
this.shadowRoot.querySelector("#haxcms").addEventListener("click", () => { | ||
const params = { | ||
url: this.shadowRoot.querySelector("#haxcmsurl").value, | ||
}; | ||
MicroFrontendRegistry.call( | ||
"haxcms-site-html", | ||
params, | ||
this.haxcmsCallback.bind(this) | ||
); | ||
}); | ||
this.shadowRoot.querySelector("#epub").addEventListener("click", () => { | ||
const params = { | ||
url: this.shadowRoot.querySelector("#haxcmsurl").value, | ||
}; | ||
MicroFrontendRegistry.call( | ||
"haxcms-site-epub", | ||
params, | ||
this.haxcmsepubCallback.bind(this) | ||
); | ||
}); | ||
this.shadowRoot | ||
.querySelector("#searchbtn") | ||
.addEventListener("click", () => { | ||
if (this.shadowRoot.querySelector("#mdtohtml")) { | ||
this.shadowRoot.querySelector("#mdtohtml").addEventListener("click", () => { | ||
const params = { | ||
q: this.shadowRoot.querySelector("#search").value, | ||
md: this.shadowRoot.querySelector("#md").value, | ||
type: this.shadowRoot.querySelector("#link").checked ? "link" : "", | ||
}; | ||
MicroFrontendRegistry.call("ddg", params, this.ddgCallback.bind(this)); | ||
MicroFrontendRegistry.call( | ||
"@core/mdToHtml", | ||
params, | ||
this.mdToHtmlCallback.bind(this) | ||
); | ||
}); | ||
} | ||
if (this.shadowRoot.querySelector("#htmltomd")) { | ||
this.shadowRoot.querySelector("#htmltomd").addEventListener("click", () => { | ||
const params = { | ||
html: this.shadowRoot.querySelector("#html").value, | ||
type: this.shadowRoot.querySelector("#link").checked ? "link" : "", | ||
}; | ||
MicroFrontendRegistry.call( | ||
"@core/htmlToMd", | ||
params, | ||
this.htmlToMdCallback.bind(this) | ||
); | ||
}); | ||
} | ||
if (this.shadowRoot.querySelector("#hydrate")) { | ||
this.shadowRoot.querySelector("#hydrate").addEventListener("click", () => { | ||
const params = { | ||
html: this.shadowRoot.querySelector("#html").value, | ||
type: this.shadowRoot.querySelector("#link").checked ? "link" : "", | ||
}; | ||
MicroFrontendRegistry.call( | ||
"@experiments/hydrateSsr", | ||
params, | ||
this.hydrateCallback.bind(this) | ||
); | ||
}); | ||
} | ||
if (this.shadowRoot.querySelector("#haxcms")) { | ||
this.shadowRoot.querySelector("#haxcms").addEventListener("click", () => { | ||
const params = { | ||
site: this.shadowRoot.querySelector("#haxcmsurl").value, | ||
base: this.shadowRoot.querySelector("#haxcmsbase").value, | ||
magic: this.shadowRoot.querySelector("#haxcmsmagic").value, | ||
ancestor: this.shadowRoot.querySelector("#haxcmsparentid").value || null, | ||
type: 'link', | ||
}; | ||
MicroFrontendRegistry.call( | ||
"@haxcms/siteToHtml", | ||
params, | ||
this.haxcmsCallback.bind(this) | ||
); | ||
}); | ||
} | ||
if (this.shadowRoot.querySelector("#epub")) { | ||
this.shadowRoot.querySelector("#epub").addEventListener("click", () => { | ||
const params = { | ||
url: this.shadowRoot.querySelector("#haxcmsurl").value, | ||
}; | ||
MicroFrontendRegistry.call( | ||
"@haxcms/siteToEpub", | ||
params, | ||
this.haxcmsepubCallback.bind(this) | ||
); | ||
}); | ||
} | ||
if (this.shadowRoot.querySelector("#searchbtn")) { | ||
this.shadowRoot | ||
.querySelector("#searchbtn") | ||
.addEventListener("click", () => { | ||
const params = { | ||
q: this.shadowRoot.querySelector("#search").value, | ||
}; | ||
MicroFrontendRegistry.call("@core/duckDuckGo", params, this.ddgCallback.bind(this)); | ||
}); | ||
} | ||
["src", "width", "height", "quality"].forEach((key) => { | ||
this.shadowRoot.querySelector(`#${key}`).addEventListener("input", () => { | ||
this.shadowRoot.querySelector("simple-img")[key] = | ||
this.shadowRoot.querySelector(`#${key}`).value; | ||
}); | ||
if (this.shadowRoot.querySelector(`#${key}`)) { | ||
this.shadowRoot.querySelector(`#${key}`).addEventListener("input", () => { | ||
this.shadowRoot.querySelector("simple-img")[key] = | ||
this.shadowRoot.querySelector(`#${key}`).value; | ||
}); | ||
} | ||
}); | ||
@@ -267,0 +234,0 @@ } |
@@ -18,3 +18,3 @@ /** | ||
export class MicroFrontend { | ||
constructor(values = {}, define = false) { | ||
constructor(values = {}) { | ||
// set defaults for each key expected | ||
@@ -26,5 +26,2 @@ MicroFrontendKeys.map((key) => | ||
); | ||
if (define) { | ||
MicroFrontendRegistry.define(this); | ||
} | ||
} | ||
@@ -52,2 +49,10 @@ } | ||
/** | ||
* Adding more or less alias for define | ||
* @param {Object} params | ||
*/ | ||
add(params) { | ||
this.define(new MicroFrontend(params)); | ||
} | ||
/** | ||
* define a new micro frontend | ||
@@ -70,6 +75,18 @@ * | ||
if (item.endpoint.startsWith("/api/")) { | ||
const base = window.location.origin.replace( | ||
/localhost:8(.*)/, | ||
"localhost:3000" | ||
); | ||
var base = ''; | ||
// support base rewrite | ||
if (window.MicroFrontendRegistryConfig.base) { | ||
base = window.MicroFrontendRegistryConfig.base; | ||
} | ||
// keep local based if we're local, otherwise we need to leverage deployed address | ||
else if (window.location.origin.startsWith('http://localhost')) { | ||
base = window.location.origin.replace( | ||
/localhost:8(.*)/, | ||
"localhost:3000" | ||
); | ||
} | ||
// most common case, hit vercel address | ||
else { | ||
base = 'https://haxapi.vercel.app'; | ||
} | ||
item.endpoint = `${base}${item.endpoint}`; | ||
@@ -84,3 +101,3 @@ } | ||
if (!this.get(item.name)) { | ||
if (!this.has(item.name)) { | ||
this.list.push(item); | ||
@@ -100,3 +117,3 @@ return true; | ||
*/ | ||
get(name) { | ||
get(name, testOnly = false) { | ||
if (name && this.list.length > 0) { | ||
@@ -108,2 +125,5 @@ const found = this.list.find((item) => item.name === name); | ||
} | ||
if (!testOnly) { | ||
console.error(`call for ${name} but not found in micro-frontend-registry`); | ||
} | ||
return null; | ||
@@ -113,2 +133,12 @@ } | ||
/** | ||
* boolean for having the definition for a machine named micro | ||
* | ||
* @param {String} name - machine name of the micro record requested | ||
* @returns {Boolean} if we have this micro | ||
*/ | ||
has(name) { | ||
return this.get(name, true) !== null; | ||
} | ||
/** | ||
* set the definition for a machine named micro that was already registered | ||
@@ -121,3 +151,3 @@ * | ||
set(name, item = {}) { | ||
if (name && this.list.length > 0 && this.get(name)) { | ||
if (name && this.list.length > 0 && this.has(name)) { | ||
const index = this.list.findIndex((item) => item.name === name); | ||
@@ -138,8 +168,14 @@ this.list[index] = item; | ||
async call(name, params = {}, callback = null, caller = null) { | ||
const item = this.get(name); | ||
if (item) { | ||
if (this.has(name)) { | ||
const item = this.get(name); | ||
// support for formdata which is already encoded | ||
const data = await fetch(item.endpoint, { | ||
method: "POST", | ||
body: JSON.stringify(params), | ||
}).then((d) => (d.ok ? d.json() : null)); | ||
body: params instanceof FormData ? params : JSON.stringify(params), | ||
}).then((d) => { | ||
return (d.ok ? d.json() : { status: d.status, data: null }) | ||
}).catch((e, d) => { | ||
// this is endpoint completely failed to respond | ||
return { status: 500, data: null }; | ||
}); | ||
// endpoints can require a callback be hit every time | ||
@@ -165,13 +201,16 @@ if (item.callback) { | ||
url(name, params = {}) { | ||
const item = this.get(name); | ||
// no null submissions | ||
for (var key in params) { | ||
if (params.hasOwnProperty(key)) { | ||
if (params[key] == null) delete params[key]; | ||
if (this.has(name)) { | ||
const item = this.get(name); | ||
// no null submissions | ||
for (var key in params) { | ||
if (params.hasOwnProperty(key)) { | ||
if (params[key] == null) delete params[key]; | ||
} | ||
} | ||
return ( | ||
new URL(item.endpoint).toString() + | ||
`?${new URLSearchParams(params).toString()}` | ||
); | ||
} | ||
return ( | ||
new URL(item.endpoint).toString() + | ||
`?${new URLSearchParams(params).toString()}` | ||
); | ||
return ''; | ||
} | ||
@@ -178,0 +217,0 @@ } |
@@ -6,6 +6,7 @@ import { html } from "lit-html"; | ||
import "./demo/mf-htmlmd-example.js"; | ||
import "./demo/docx-example.js"; | ||
// need to account for polymer goofiness when webpack rolls this up | ||
export default { | ||
title: "Micro-frontends|Registry", | ||
title: "Micro-frontends|Core Services", | ||
component: "micro-frontend-registry", | ||
@@ -17,5 +18,2 @@ decorators: [withKnobs], | ||
}; | ||
const utils = new StorybookUtilities(), | ||
demostyle = | ||
"margin:0 -8px 40px;padding:0;box-shadow:none;border-bottom:1px solid #e0e0e0;"; | ||
@@ -39,3 +37,3 @@ export const usage = () => { | ||
}; | ||
export const example = () => { | ||
export const mdToHtml = () => { | ||
return getRenderString(html` | ||
@@ -54,5 +52,51 @@ <h3>Basic micro-frontend-registry demo</h3> | ||
</p> | ||
<mf-htmlmd-example></mf-htmlmd-example> | ||
<mf-htmlmd-example mdhtml></mf-htmlmd-example> | ||
`); | ||
}; | ||
export const duckDuckGo = () => { | ||
return getRenderString(html` | ||
<h3>Duck duck go search</h3> | ||
<p>Check console after search | ||
</p> | ||
<mf-htmlmd-example ddg></mf-htmlmd-example> | ||
`); | ||
}; | ||
export const haxcmsFullSite = () => { | ||
return getRenderString(html` | ||
<h3>Enter a HAXcms site URL</h3> | ||
<p> | ||
You'll be given the full HTML source of the entire site | ||
</p> | ||
<mf-htmlmd-example haxcms></mf-htmlmd-example> | ||
`); | ||
}; | ||
export const simpleImgRemixer = () => { | ||
return getRenderString(html` | ||
<h3>Tweak values and live update an image</h3> | ||
<p> | ||
This also has its own story but this is some specific operations in real time | ||
</p> | ||
<mf-htmlmd-example img></mf-htmlmd-example> | ||
`); | ||
}; | ||
export const imageToAscii = () => { | ||
return getRenderString(html`<docx-example ascii></docx-example>`); | ||
}; | ||
export const screenshotUrl = () => { | ||
return getRenderString(html`<docx-example screenshot></docx-example>`); | ||
}; | ||
export const docxToPdf = () => { | ||
return getRenderString(html`<docx-example pdf></docx-example>`); | ||
}; | ||
export const docxToHtml = () => { | ||
return getRenderString(html`<docx-example html></docx-example>`); | ||
}; | ||
// via https://stackoverflow.com/questions/70657298/render-lit-lit-html-templateresult-as-string | ||
@@ -59,0 +103,0 @@ const getRenderString = (data) => { |
@@ -23,3 +23,3 @@ { | ||
}, | ||
"version": "4.0.28", | ||
"version": "4.0.29", | ||
"description": "A singleton for registration and managing access to leverage microservices for web components", | ||
@@ -70,3 +70,3 @@ "repository": { | ||
], | ||
"gitHead": "f1a5d9a5be212a25723ce8651b0f28f714d07a33" | ||
"gitHead": "1c2b9fb55d09a8c07c955a663f507f8e17efa3fc" | ||
} |
@@ -18,3 +18,3 @@ /** | ||
export class MicroFrontend { | ||
constructor(values = {}, define = false) { | ||
constructor(values = {}) { | ||
// set defaults for each key expected | ||
@@ -26,5 +26,2 @@ MicroFrontendKeys.map((key) => | ||
); | ||
if (define) { | ||
MicroFrontendRegistry.define(this); | ||
} | ||
} | ||
@@ -52,2 +49,10 @@ } | ||
/** | ||
* Adding more or less alias for define | ||
* @param {Object} params | ||
*/ | ||
add(params) { | ||
this.define(new MicroFrontend(params)); | ||
} | ||
/** | ||
* define a new micro frontend | ||
@@ -70,6 +75,18 @@ * | ||
if (item.endpoint.startsWith("/api/")) { | ||
const base = window.location.origin.replace( | ||
/localhost:8(.*)/, | ||
"localhost:3000" | ||
); | ||
var base = ''; | ||
// support base rewrite | ||
if (window.MicroFrontendRegistryConfig.base) { | ||
base = window.MicroFrontendRegistryConfig.base; | ||
} | ||
// keep local based if we're local, otherwise we need to leverage deployed address | ||
else if (window.location.origin.startsWith('http://localhost')) { | ||
base = window.location.origin.replace( | ||
/localhost:8(.*)/, | ||
"localhost:3000" | ||
); | ||
} | ||
// most common case, hit vercel address | ||
else { | ||
base = 'https://haxapi.vercel.app'; | ||
} | ||
item.endpoint = `${base}${item.endpoint}`; | ||
@@ -84,3 +101,3 @@ } | ||
if (!this.get(item.name)) { | ||
if (!this.has(item.name)) { | ||
this.list.push(item); | ||
@@ -100,3 +117,3 @@ return true; | ||
*/ | ||
get(name) { | ||
get(name, testOnly = false) { | ||
if (name && this.list.length > 0) { | ||
@@ -108,2 +125,5 @@ const found = this.list.find((item) => item.name === name); | ||
} | ||
if (!testOnly) { | ||
console.error(`call for ${name} but not found in micro-frontend-registry`); | ||
} | ||
return null; | ||
@@ -113,2 +133,12 @@ } | ||
/** | ||
* boolean for having the definition for a machine named micro | ||
* | ||
* @param {String} name - machine name of the micro record requested | ||
* @returns {Boolean} if we have this micro | ||
*/ | ||
has(name) { | ||
return this.get(name, true) !== null; | ||
} | ||
/** | ||
* set the definition for a machine named micro that was already registered | ||
@@ -121,3 +151,3 @@ * | ||
set(name, item = {}) { | ||
if (name && this.list.length > 0 && this.get(name)) { | ||
if (name && this.list.length > 0 && this.has(name)) { | ||
const index = this.list.findIndex((item) => item.name === name); | ||
@@ -138,8 +168,14 @@ this.list[index] = item; | ||
async call(name, params = {}, callback = null, caller = null) { | ||
const item = this.get(name); | ||
if (item) { | ||
if (this.has(name)) { | ||
const item = this.get(name); | ||
// support for formdata which is already encoded | ||
const data = await fetch(item.endpoint, { | ||
method: "POST", | ||
body: JSON.stringify(params), | ||
}).then((d) => (d.ok ? d.json() : null)); | ||
body: params instanceof FormData ? params : JSON.stringify(params), | ||
}).then((d) => { | ||
return (d.ok ? d.json() : { status: d.status, data: null }) | ||
}).catch((e, d) => { | ||
// this is endpoint completely failed to respond | ||
return { status: 500, data: null }; | ||
}); | ||
// endpoints can require a callback be hit every time | ||
@@ -165,13 +201,16 @@ if (item.callback) { | ||
url(name, params = {}) { | ||
const item = this.get(name); | ||
// no null submissions | ||
for (var key in params) { | ||
if (params.hasOwnProperty(key)) { | ||
if (params[key] == null) delete params[key]; | ||
if (this.has(name)) { | ||
const item = this.get(name); | ||
// no null submissions | ||
for (var key in params) { | ||
if (params.hasOwnProperty(key)) { | ||
if (params[key] == null) delete params[key]; | ||
} | ||
} | ||
return ( | ||
new URL(item.endpoint).toString() + | ||
`?${new URLSearchParams(params).toString()}` | ||
); | ||
} | ||
return ( | ||
new URL(item.endpoint).toString() + | ||
`?${new URLSearchParams(params).toString()}` | ||
); | ||
return ''; | ||
} | ||
@@ -178,0 +217,0 @@ } |
Sorry, the diff of this file is not supported yet
88867
22
2253