From b9e3a095b5cc3568f5b9d739e0f77e513a1b16af Mon Sep 17 00:00:00 2001 From: wenjunche Date: Fri, 1 Oct 2021 13:38:31 -0400 Subject: [PATCH 1/2] OC-2305: created examples/deployment-health-check --- examples/deployment-health-check/LICENSE | 21 ++++ examples/deployment-health-check/README.md | 14 +++ examples/deployment-health-check/favicon.ico | Bin 0 -> 15086 bytes examples/deployment-health-check/index.html | 106 +++++++++++++++++++ examples/deployment-health-check/pinger.js | 86 +++++++++++++++ examples/deployment-health-check/styles.css | 102 ++++++++++++++++++ examples/deployment-health-check/urls.json | 37 +++++++ 7 files changed, 366 insertions(+) create mode 100644 examples/deployment-health-check/LICENSE create mode 100644 examples/deployment-health-check/README.md create mode 100644 examples/deployment-health-check/favicon.ico create mode 100644 examples/deployment-health-check/index.html create mode 100644 examples/deployment-health-check/pinger.js create mode 100644 examples/deployment-health-check/styles.css create mode 100644 examples/deployment-health-check/urls.json diff --git a/examples/deployment-health-check/LICENSE b/examples/deployment-health-check/LICENSE new file mode 100644 index 0000000..4e03396 --- /dev/null +++ b/examples/deployment-health-check/LICENSE @@ -0,0 +1,21 @@ +MIT License + +Copyright (c) 2021 Wenjun Che + +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. diff --git a/examples/deployment-health-check/README.md b/examples/deployment-health-check/README.md new file mode 100644 index 0000000..22eff5d --- /dev/null +++ b/examples/deployment-health-check/README.md @@ -0,0 +1,14 @@ +# OpenFin Service Deployment Health Check + +A sample page to show health of some webservices deployed at OpenFin. + +## Files + +* urls.json: metadata for webservices, including URLs. CORS needs to be enabled for any endpoint in order for health check to work properly. +* pinger.js: performs health checks with ```fetch``` API for all URLs listed in urls.json. +* styles.css: CSS styles +* index.html: main page. + +An example of this page is available [here](https://cdn.openfin.co/health/deployment/index.html). + +This page can also be used to check health of manifest URLs by passing ```?manifest=manifest_url```. Here is an [example](https://cdn.openfin.co/health/deployment/index.html?manifest=https://cdn.openfin.co/process-manager/app.json) for checking health of the manifest for OpenFin process manager. \ No newline at end of file diff --git a/examples/deployment-health-check/favicon.ico b/examples/deployment-health-check/favicon.ico new file mode 100644 index 0000000000000000000000000000000000000000..5ec2ca0e025c35c321af4b65c79ab905d2de697f GIT binary patch literal 15086 zcmd6uPmEnv9mmh>fU|+Npnwo@ro<9g%0^6}W{?F6%(T;i1Y*LUurkFmvoj=MUt;2p z*3_~PYpjW=32bnu33aTP;6~J)mEzL`G*QX`3!Y@`_49e}o$=1~-uLdm>GUPvIp?1H z`}6&s|M%QGA#}o2xaF2WIvakvH-uY52(z=J>)j!|LD_Cn?|=2O5Wa=Lr;$M=JPIry z{5~~Iw(4)PusEH}FWwD)0{#X*9KpP0cP9%6r?<*~6T9%b9)8Ecd5{#qd&iY+;;U_4 z>Rs+H6>!drr^pQyk+#&bg5IzHRff%l!@of`brxwB0!b!@?*PTg;` zK^>oM>CpbW;Qwlkx{v%{)ka%#=UCjf>U>$$j^C z@V5m1(E|4vv$mGBy_M}iJ70w#`+S?+(=n{*qiGD-*a2LdoZp=zooD22e=pN#{)5~a zaNjJ9QkAu_T-yq5trTWsRzUAN={~d6L9P{F!+&!>+8SARZ?znP&9l}oGe!zRk z7{^;ReaP)u?A(x!VZ^=4{yiIq+~?Ca$K{dT59-FC@1Moz2U7R%$3d1;*=zg5p>cfk z?xABll<7-FJa~>oa-WEkkEFJ{=E}>=)ht7rI{tKW<<{+m-7+ z#)PhIP{glH`Sa-iwSf)ClgA;oe&~K4)SWMkPwr*r^P;+NZojD(d6d)z+9+y)3W$&+JEH!qXztsrukIOoCZEWe2)0{;QQkP|MQdmr@2(kdUoYS)Kw(iUDERtDH+q;xcGkHQu_vC@C;--jO$D1xqr!hzY)g;b?SMf z&(qI?c(&yJ#y#|wd_R*U{h1_T9!YxB!*q3On07mxQ)MdPLI_8ckLh{{b6)pDm@(~z zFiqMI)4ebg0)NPcuo~vp`P?aV!;uSoxU`WDJzG<^x|h_qODnZE|q%ezS}HanGCH>n4lszpupZ9`HKI#+|)ZW>3?0 z&gx_HUXWMsS^vu1o7Hc6jm<|unP)j=9%!-8&O|J2~8?09FuWSpW zojK{ieI0BqgEDO&>qFUPbsNU*T%+%CYj5}k_GbIP38y5J4qx@;fL+KShI;NAn^qu7}mg8Z<| zc{s{tQ*GKV=YYNj^Cam`a1xB0*P<q^N`gYyOtK+P$_4`1P z?^uq^gCMUhvi9_;?=pPVwT(X({S>9jjAXO^@~(f6Y?;{AebKfq@*B$s{b6`!pXV=I zrth-;pNl@mr8WG&28S%Kyz3{%`HlCmRi*y*{REiQU;d2D&C$oW6uAdW*fTzT;@k81 z#qWZm@pqnk4~_E~?;%%q{H+gt4&PCdcYSe=GEV!0_umJe?=Oz)ccb=p{xR-J^N+Um zp|4Hr6Ly?`XMo=x+z1kKB=!*XI0WstPf%1 zbuey@wtYRj<=lR;_IuzgH*76}GHapp{NZGOv-LOaAA47UGazqlX3KtwT&Z<8?PFXX zd$)u4O8Reg|0OT{+9w?s*;upJ_KSzd#Zu=UHtoBPpRB*^wQau@`|la-o-N_uvC;bT z$EXdS!gkR-X+3yvOP;?*{+%bCtMl5ydS_3wHP4^1&#+$X#Lr>izC|ATb>3Y8mB(DN zK9?kGyEvxc_#g|97R2DtBOF*LT@bFQ%4lS{u`3Sc6>u>;q4Nynbkz_jd9QbmRGJa6OFohvfC) z{=>P-_0jj@!n|ePQ$|_qNPpi3>AI4y@*Dr}Wqwo^V=+}n-FHE{-2CI|*vwm&Bd2aw z-#G87pnnwkbbbAt>rMN4uJib-qpp4JQSg264KO?6dkuM?>*SrTKle^Q0P5uSNy=xz zFTjT&){XwY4svzU@ggISs25Ye4=FVdAosl-{Zq+-a^FOtYizb}^liS>_!-rmb!y$Z ku8$qR>vJK9{>=aIt8a!dwaR&KZv^sxp==!)p={LqFE34J2LJ#7 literal 0 HcmV?d00001 diff --git a/examples/deployment-health-check/index.html b/examples/deployment-health-check/index.html new file mode 100644 index 0000000..9ff33eb --- /dev/null +++ b/examples/deployment-health-check/index.html @@ -0,0 +1,106 @@ + + + OpenFin Deployment Health Check + + + + + + + +
+ + Deployment Health Check +
+ +
    +
      +
      • +
      • +
    +     +
    + +
    +     + + + diff --git a/examples/deployment-health-check/pinger.js b/examples/deployment-health-check/pinger.js new file mode 100644 index 0000000..6e10441 --- /dev/null +++ b/examples/deployment-health-check/pinger.js @@ -0,0 +1,86 @@ +const OpenFinPinger = { + loadURLs: async () => { + const resp = await fetch('urls.json'); + const urlList = await resp.json(); + return urlList.urls; + }, + phoneHome: async (addItem, itemStatusHandler) => { + const urls = await OpenFinPinger.loadURLs(); + urls.forEach((urlInfo, idx) => { + addItem(idx, urlInfo) + OpenFinPinger.ping(idx, urlInfo, itemStatusHandler); + }); + + }, + ping: async (idx, urlInfo, urlHandler) => { + try { + const resp = await fetch(urlInfo.href); + if (!resp.ok) { + urlHandler(idx, false, `${resp.statusText} - ${resp.statusText$}`); + return; + } + + let v = ''; + const ct = resp.headers.get("content-type"); + if (ct && ct.indexOf("application/json") !== -1) { + const j = await resp.json(); + if (j.private) { + v = `${j.private.version} (${j.private.sha})`; + } else if (j.projectVersion) { + v = j.projectVersion; + } else if (j.revision) { + v = `${j.version} (${j.revision})` + } else { + v = j.version; + } + } else { + v = await resp.text(); + } + urlHandler(idx, true, Object.assign(urlInfo, { version: v })); + } catch(e) { + urlHandler(idx, false, e); + } + }, + pingManifest: async (manifest, manifestHandler, appHandler) => { + try { + const purl = new URL(manifest); + const resp = await fetch(purl.href); + if (!resp.ok) { + manifestHandler({ status: 'error', msg: `error loading manifest, response: ${resp.status}`, url: purl.href}); + return; + } + + const j = await resp.json(); + let appURL = '', appName = '', msg = ''; + if (j.startup_app && j.startup_app.url) { + appURL = j.startup_app.url; + appName = j.startup_app.name || j.startup_app.uuid; + msg = `manifest ${appName} OK`; + } else if (j.platform) { + appURL = j.platform.url; + appName = j.platform.name; + msg = `manifest ${appName} OK`; + } else { + manifestHandler({ status: 'error', msg: `manifest error, unable to locate app url`, url: purl.href}); + } + manifestHandler({ status: 'ok', msg: msg, url: purl.href}); + OpenFinPinger.pingAppURL(appName, appURL, appHandler) + } catch(e) { + manifestHandler({ status: 'error', msg: `error loading manifest, response: ${e}`, url: manifest}); + } + }, + pingAppURL: async (appName, appURL, appHandler) => { + try { + const surl = new URL(appURL); + const resp = await fetch(surl.href, {mode: 'no-cors'}); + if (resp.ok) { + appHandler({ status: 'ok', msg: `app ${appName} OK`, url: surl.href }); + return; + } + } catch(e) { + appHandler({ status: 'error', msg: `app ${appName} ERROR: ${e}`, url: appURL }); + return; + } + appHandler({ status: 'error', msg: `app ${appName} ERROR`, url: appURL }); + } +} \ No newline at end of file diff --git a/examples/deployment-health-check/styles.css b/examples/deployment-health-check/styles.css new file mode 100644 index 0000000..763e675 --- /dev/null +++ b/examples/deployment-health-check/styles.css @@ -0,0 +1,102 @@ +:root { + --font-family: Inter, Arial, "Helvetica Neue", sans-serif; + --logo-url: url("//cdn.openfin.co/ofbadge.png"); + --color-btn: #504cff; + --color-btn-text: #fff; + + --color-bg: #333; + --color-text: #f7f7f7; + --color-box-bg: #444; + --color-box-border: #666; + + --color-good: lightgreen; + --color-bad: red; +} +@media (prefers-color-scheme: dark) { + :root { + --color-bg: #333; + --color-text: #f7f7f7; + --color-box-bg: #444; + --color-box-border: #666; + + --color-good: lightgreen; + } +} +body { + background: var(--color-bg); + color: var(--color-text); + font-family: var(--font-family); + font-weight: 400; + font-size: 18px; + display:flex; +} +panel { + margin: auto; +} +title { + display: block; + text-align: center; + margin: 10px 0 30px 0; + font-size: 20px; + font-weight: 600; +} +content { + display: block; + padding: 50px 100px 25px 100px; + border-radius: 10px; + border: 1px solid var(--color-box-border); + background-color: var(--color-box-bg); +} +footer { + display: block; + text-align: center; + margin-top: 30px; +} +button { + border: none; + border-radius: 5px; + padding: 15px 30px; + color: var(--color-btn-text); + background-color: var(--color-btn); + font-size: 18px; +} +ul { + list-style-type: none; + background: none; + padding:0; + margin:0; +} +li { + padding: 0px 0px 28px 0px; + margin:0; +} +li.good led { + background-color: var(--color-good) +} +li.bad led { + background-color: var(--color-bad) +} +li span { + margin-top: 5px; +} +led { + border-radius: 7px; + height: 14px; + width: 14px; + display: inline-block; + margin: 10px 20px 0 0; +} +logo { + margin: 0 auto; + width:70px; + height:70px; + background-image: var(--logo-url); + background-repeat: no-repeat; + background-size: 240px; + background-position-y: center; + display: block; +} + +.noshow { + display: none; +} \ No newline at end of file diff --git a/examples/deployment-health-check/urls.json b/examples/deployment-health-check/urls.json new file mode 100644 index 0000000..9668a74 --- /dev/null +++ b/examples/deployment-health-check/urls.json @@ -0,0 +1,37 @@ +{ + "description" : "OpenFin health check URL metadata", + "urls" : [ + { + "href" : "https://dl.openfin.co/version", + "description" : "OpenFin Licensing Server" + }, + { + "href" : "https://install.openfin.co/version", + "description" : "OpenFin Installer Generator" + }, + { + "href" : "https://start.openfin.co/api/version", + "description" : "OpenFin Application Runner" + }, + { + "href" : "https://auth.os.openfin.co/api/version", + "description" : "OpenFin ID Service" + }, + { + "href" : "https://of.os.openfin.co/api/version", + "description" : "OpenFin API Service" + }, + { + "href" : "https://app-directory.openfin.co/version", + "description" : "OpenFin Application Directory" + }, + { + "href" : "https://ingest.openfin.co/desktop-analytics/version", + "description" : "OpenFin Diagnostics" + }, + { + "href" : "https://cdn.openfin.co/health/index.html", + "description" : "OpenFin CDN" + } + ] +} From 5123b721ceb43ab11a3be53ef0081709a84c5bed Mon Sep 17 00:00:00 2001 From: wenjunche Date: Mon, 4 Oct 2021 11:08:16 -0400 Subject: [PATCH 2/2] CORE-28: added examples/css-customization --- examples/css-customization/README.md | 11 +++++++++++ examples/css-customization/custom-styles.css | 11 +++++++++++ 2 files changed, 22 insertions(+) create mode 100644 examples/css-customization/README.md create mode 100644 examples/css-customization/custom-styles.css diff --git a/examples/css-customization/README.md b/examples/css-customization/README.md new file mode 100644 index 0000000..c285529 --- /dev/null +++ b/examples/css-customization/README.md @@ -0,0 +1,11 @@ +# Sample CSS Customization for platform + +A [stylesheet](https://developers.openfin.co/docs/platform-api#section-standard-window-customization) is linked in the [platform-window.html](platform-window.html) file, and allows for [visual customization](styles/frame-styles.css). For a complete view of all properties, please refer to the [example stylesheet](https://github.com/openfin/layouts-v2-style-examples) + +## Files + +* custom-styles.css: sample custom styles. + +## Testing the styles +* append content of custom-styles.css to styles/frame-styles.css. +* launch the application: `npm start` \ No newline at end of file diff --git a/examples/css-customization/custom-styles.css b/examples/css-customization/custom-styles.css new file mode 100644 index 0000000..c1af444 --- /dev/null +++ b/examples/css-customization/custom-styles.css @@ -0,0 +1,11 @@ +/* copy the following sample custom styles to styles/frame-styles.css */ + +#layout-container { + background-color: indigo; +} + +#of-frame-main { + height: 99.25%; + width: 99.25%; + border: solid red; +} \ No newline at end of file