-
+
@@ -31,7 +31,7 @@ export default function(render) {
applyMutation(qs($form, "component-icon"), "setAttribute"),
// STEP2: attempt to login
rxjs.map(() => ({ password: qs($form, `[name="password"]`).value })),
- AdminSessionManager.login(),
+ authenticate$(),
// STEP3: update the UI when authentication fails, happy path is handle at the middleware
// level one layer above as the login ctrl has no idea what to show after login
rxjs.filter((ok) => !ok),
diff --git a/public/pages/adminpage/decorator_admin_only.js b/public/pages/adminpage/decorator_admin_only.js
index a33953d6..0845b052 100644
--- a/public/pages/adminpage/decorator_admin_only.js
+++ b/public/pages/adminpage/decorator_admin_only.js
@@ -3,14 +3,14 @@ import rxjs, { effect } from "../../lib/rx.js";
import ctrlLogin from "./ctrl_login.js";
import ctrlError from "../ctrl_error.js";
-import AdminSessionManager from "./model_admin_session.js";
+import { isAdmin$ } from "./model_admin_session.js";
export default function AdminOnly(ctrlWrapped) {
return (render) => {
const loader$ = rxjs.timer(1000).subscribe(() => render(createElement(`
loading
`)));
onDestroy(() => loader$.unsubscribe());
- effect(AdminSessionManager.isAdmin().pipe(
+ effect(isAdmin$().pipe(
rxjs.map((isAdmin) => isAdmin ? ctrlWrapped : ctrlLogin),
rxjs.tap((ctrl) => ctrl(render)),
rxjs.catchError((err) => ctrlError(err)(render)),
diff --git a/public/pages/adminpage/model_admin_session.js b/public/pages/adminpage/model_admin_session.js
index 5f308c4e..fb1192b1 100644
--- a/public/pages/adminpage/model_admin_session.js
+++ b/public/pages/adminpage/model_admin_session.js
@@ -3,35 +3,32 @@ import ajax from "../../lib/ajax.js";
window.ajax = ajax;
-class AdminSessionManager {
- constructor() {
- this.subject = new rxjs.Subject();
- }
+const sessionSubject$ = new rxjs.Subject();
- isAdmin() {
- return rxjs.merge(
- this.subject,
- rxjs.interval(30000).pipe(
- rxjs.startWith(null),
- rxjs.mergeMap(() => ajax({ url: "/admin/api/session", responseType: "json" })),
- rxjs.map(({ responseJSON }) => responseJSON.result),
- rxjs.distinctUntilChanged(),
- ),
- );
- }
+const adminSession$ = rxjs.merge(
+ sessionSubject$,
+ rxjs.interval(30000).pipe(
+ rxjs.startWith(null),
+ rxjs.mergeMap(() => ajax({ url: "/admin/api/session", responseType: "json" })),
+ rxjs.map(({ responseJSON }) => responseJSON.result),
+ rxjs.distinctUntilChanged(),
+ rxjs.shareReplay(1),
+ ),
+);
- login() {
- return rxjs.pipe(
- rxjs.mergeMap((body) => ajax({
- url: "/admin/api/session",
- method: "POST", body, responseType: "json",
- }).pipe(
- rxjs.mapTo(true),
- rxjs.catchError(() => rxjs.of(false)),
- rxjs.tap((ok) => ok && this.subject.next(ok))
- )),
- );
- }
+export function isAdmin$() {
+ return adminSession$;
}
-export default new AdminSessionManager();
+export function authenticate$() {
+ return rxjs.pipe(
+ rxjs.mergeMap((body) => ajax({
+ url: "/admin/api/session",
+ method: "POST", body, responseType: "json",
+ }).pipe(
+ rxjs.mapTo(true),
+ rxjs.catchError(() => rxjs.of(false)),
+ rxjs.tap((ok) => ok && sessionSubject$.next(ok))
+ )),
+ );
+}
diff --git a/public/pages/boot/nyancat.js b/public/pages/boot/nyancat.js
deleted file mode 100644
index 13b427d5..00000000
--- a/public/pages/boot/nyancat.js
+++ /dev/null
@@ -1,164 +0,0 @@
-class NyanCat extends HTMLElement {
- constructor() {
- super();
- this.innerHTML = this.render();
- }
-
- render() {
- return `
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-`;
- }
-}
-
-customElements.define("data-nyancat", NyanCat);
-
-function CSS() {
- return `
- #n-lder{ max-width: 100%; overflow: hidden; }
- #n-lder #cat{ position: absolute; top: calc(50% + 45px); left: 0%; margin-left: -250px; margin-top: -125px; width: 100%; height: 150px; }
- #n-lder.loading #cat{ left: 20%; left: calc(50% + 125px); transition: left 4s ease-out; }
- #n-lder.loading.done #cat { left: 100%; left: calc(100% + 250px); transition: left 0.5s linear; }
- #n-lder #cat svg{ height: 160px; width: 250px; position: absolute; }
- #n-lder #cat #hide-behind{ position: absolute; top: 0; left: 55px; bottom: 0; right: -250px; }
-
- #n-lder #rbw{ position: absolute; top: calc(50% + 45px); left: 0; overflow: hidden; height: 145px; margin-top: -110px; width: 100%; }
- #n-lder #rbw .w{ width: 10000px; }
- #n-lder #rbw .rbw { z-index: -1; font-size: 16em; float: left; position: relative; }
- #n-lder #rbw .rbw .wv { height: 20px; width: 55px; }
- #n-lder #rbw .rbw .wv.wv-1 { background: #ff0000; }
- #n-lder #rbw .rbw .wv.wv-2 { background: #ff9900; }
- #n-lder #rbw .rbw .wv.wv-3 { background: #ffff00; }
- #n-lder #rbw .rbw .wv.wv-4 { background: #33ff00; }
- #n-lder #rbw .rbw .wv.wv-5 { background: #0099ff; }
- #n-lder #rbw .rbw .wv.wv-6 { background: #6633ff; }
-
- #n-lder #rbw .rbw{ top: 0px; animation: rbw .6s linear infinite; }
- #n-lder #rbw .rbw.f1{ animation-delay: 0s; }
- #n-lder #rbw .rbw.f2{ animation-delay: 0.1s; }
- #n-lder #rbw .rbw.f3{ animation-delay: 0.2s; }
- #n-lder #rbw .rbw.f4{ animation-delay: 0.3s; }
- #n-lder #rbw .rbw.f5{ animation-delay: 0.4s; }
- #n-lder #rbw .rbw.f6{ animation-delay: 0.5s; }
- @keyframes rbw {
- 0%{ top: 0px; }
- 50%{ top: 15px; }
- 100%{ top: 0px; }
- }
- @keyframes nyan_all {
- 0%{ transform: translateY(0px); }
- 33%{ transform: translateY(0px); }
- 34%{ transform: translateY(1px); }
- 100%{ transform: translateY(1px); }
- } #n-lder svg g#nyan_all{ animation: nyan_all 0.40s linear infinite; }
- @keyframes nyan_head {
- 0%{ transform: translateX(0px) translateY(0px); }
- 16%{ transform: translateX(0px) translateY(0px); }
- 17%{ transform: translateX(1px) translateY(0px); }
- 66%{ transform: translateX(1px) translateY(0px); }
- 67%{ transform: translateX(0px) translateY(0px); }
- 83%{ transform: translateX(0px) translateY(0px); }
- 84%{ transform: translateX(0px) translateY(-1px); }
- 100%{ transform: translateX(0px) translateY(-1px); }
- } #n-lder svg g#nyan_head{ animation: nyan_head 0.4s linear infinite; }
- @keyframes nyan_walk {
- 0%{ transform: translateX(0px); }
- 16%{ transform: translateX(0px); }
- 17%{ transform: translateX(1px); }
- 33%{ transform: translateX(1px); }
- 34%{ transform: translateX(2px); }
- 50%{ transform: translateX(2px); }
- 51%{ transform: translateX(1px); }
- 100%{ transform: translateX(0px); }
- } #n-lder svg g#nyan_feet{ animation: nyan_walk 0.5s linear infinite; }
- @keyframes nyan_tail {
- 0%{ transform: rotate(0); }
- 16%{ transform: rotate(0); }
- 17%{ transform: rotate(-5deg); }
- 33%{ transform: rotate(-5deg); }
- 34%{ transform: rotate(-10deg); }
- 49%{ transform: rotate(-10deg); }
- 50%{ transform: rotate(-20deg); }
- 66%{ transform: rotate(-20deg); }
- 67%{ transform: rotate(-10deg); }
- 83%{ transform: rotate(-10deg); }
- 84%{ transform: rotate(-5deg); }
- 99%{ transform: rotate(-5deg); }
- 100%{ transform: rotate(0deg); }
- } #n-lder svg g#nyan_tail{ animation: nyan_tail 0.5s linear infinite; transform-origin: 4px 8px; }
-`;
-};
diff --git a/public/pages/connectpage/ctrl_form.js b/public/pages/connectpage/ctrl_form.js
index 3e375843..084035eb 100644
--- a/public/pages/connectpage/ctrl_form.js
+++ b/public/pages/connectpage/ctrl_form.js
@@ -6,6 +6,7 @@ import { createForm, mutateForm } from "../../lib/form.js";
import { formTmpl } from "../../components/form.js";
import CSSLoader from "../../helpers/css.js";
+import { createSession } from "../../model/session.js";
import config$ from "./model_config.js";
import backend$ from "./model_backend.js";
@@ -95,6 +96,7 @@ export default function(render) {
}
return json;
}),
+ rxjs.mergeMap((creds) => createSession(creds)),
dbg("SUBMIT"),
));
diff --git a/public/pages/ctrl_boot.js b/public/pages/ctrl_boot.js
new file mode 100644
index 00000000..5da0c02b
--- /dev/null
+++ b/public/pages/ctrl_boot.js
@@ -0,0 +1,135 @@
+import rxjs, { ajax } from "../lib/rx.js";
+import { loadScript } from "../helpers/loader.js";
+// import { setup_cache } from "../helpers/cache.js";
+import { report } from "../helpers/log.js";
+
+function $error(msg) {
+ const $code = document.createElement("code");
+ $code.style.display = "block";
+ $code.style.margin = "20px 0";
+ $code.style.fontSize = "1.3rem";
+ $code.style.padding = "0 10% 0 10%";
+ $code.textContent = msg;
+
+ let $img = document.createElement("img");
+ $img.setAttribute("src", "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGAAAABQAQMAAADcLOLWAAAABlBMVEUAAABTU1OoaSf/AAAAAXRSTlMAQObYZgAAAFlJREFUeF69zrERgCAQBdElMqQEOtHSuNIohRIMjfjO6DDmB7jZy5YgySQVYDIakIHD1kBPC9Bra5G2Ans0N7iAcOLF+EHvXySpjSBWCDI/3nIdBDihr8m4AcKdbn96jpAHAAAAAElFTkSuQmCC");
+ $img.style.display = "block";
+ $img.style.padding = "20vh 10% 0 10%";
+
+ document.body.innerHTML = "";
+ document.body.appendChild($img);
+ document.body.appendChild($code);
+}
+
+try {
+ await Promise.all([ // procedure with no outside dependencies
+ setup_translation(),
+ setup_xdg_open(),
+ // setup_cache(), // TODO: dependency on session
+ setup_device(),
+ // setup_sw(), // TODO
+ setup_blue_death_screen(),
+ ]);
+ // await Config.refresh()
+
+ await Promise.all([ // procedure with dependency on config
+ // setup_chromecast() // TODO
+ ]);
+
+ window.dispatchEvent(new window.Event("pagechange"));
+} catch(err) {
+ console.error(err);
+ const msg = navigator.onLine === false ? "OFFLINE" : (err.message || "CAN'T LOAD");
+ report(msg + " - " + (err && err.message), location.href);
+ $error(msg);
+}
+
+////////////////////////////////////////////
+// boot steps helpers
+function setup_translation() {
+ let selectedLanguage = "en";
+ switch(navigator.language) {
+ case "zh-TW":
+ selectedLanguage = "zh_tw";
+ break;
+ default:
+ const userLanguage = navigator.language.split("-")[0];
+ const idx = [
+ "az", "be", "bg", "ca", "cs", "da", "de", "el", "es", "et",
+ "eu", "fi", "fr", "gl", "hr", "hu", "id", "is", "it", "ja",
+ "ka", "ko", "lt", "lv", "mn", "nb", "nl", "pl", "pt", "ro",
+ "ru", "sk", "sl", "sr", "sv", "th", "tr", "uk", "vi", "zh",
+ ].indexOf(navigator.language.split("-")[0]);
+ if(idx !== -1) {
+ selectedLanguage = userLanguage;
+ }
+ }
+
+ if (selectedLanguage === "en") {
+ return
+ }
+ return ajax({
+ url: "/assets/locales/"+selectedLanguage+".json",
+ responseType: "json",
+ }).pipe(
+ rxjs.tap(({ responseHeaders, response }) => {
+ const contentType = responseHeaders["content-type"].trim();
+ if (contentType !== "application/json") {
+ return report(`ctrl_boot.js - wrong content type '${contentType}'`);
+ }
+ window.LNG = response;
+ }),
+ ).toPromise();
+}
+
+async function setup_xdg_open() {
+ window.overrides = {};
+ await loadScript("/overrides/xdg-open.js");
+}
+
+async function setup_device() {
+ const className = "ontouchstart" in window ? "touch-yes" : "touch-no";
+ document.body.classList.add(className);
+
+ if (window.matchMedia && window.matchMedia("(prefers-color-scheme: dark)").matches) {
+ document.body.classList.add("dark-mode");
+ }
+ window.matchMedia("(prefers-color-scheme: dark)").addEventListener("change", function(e) {
+ e.matches ? document.body.classList.add("dark-mode") : document.body.classList.remove("dark-mode");
+ });
+}
+
+async function setup_sw() {
+ if (!("serviceWorker" in navigator)) return;
+
+ if (navigator.userAgent.indexOf("Mozilla/") !== -1 &&
+ navigator.userAgent.indexOf("Firefox/") !== -1 &&
+ navigator.userAgent.indexOf("Gecko/") !== -1) {
+ // Firefox was acting weird with service worker so we disabled it
+ // see: https://github.com/mickael-kerjean/filestash/issues/255
+ return;
+ }
+ try {
+ await navigator.serviceWorker.register("/sw_cache.js");
+ } catch(err) {
+ report("ServiceWorker registration failed", err)
+ }
+}
+
+async function setup_blue_death_screen() {
+ window.onerror = function(msg, url, lineNo, colNo, error) {
+ report(msg, url, lineNo, colNo, error);
+ $error(msg);
+ };
+}
+
+async function setup_chromecast() {
+ if (!CONFIG.enable_chromecast) {
+ return Promise.resolve();
+ } else if (!("chrome" in window)) {
+ return Promise.resolve();
+ } else if (location.hostname === "localhost" || location.hostname === "127.0.0.1") {
+ return Promise.resolve();
+ }
+ return Chromecast.init();
+}
diff --git a/public/pages/ctrl_filespage.js b/public/pages/ctrl_filespage.js
new file mode 100644
index 00000000..aae7d1c0
--- /dev/null
+++ b/public/pages/ctrl_filespage.js
@@ -0,0 +1,31 @@
+import { createElement, createRender } from "../lib/skeleton/index.js";
+import rxjs, { effect, applyMutation } from "../lib/rx.js";
+import { qs } from "../lib/dom.js";
+
+import { getState$ } from "./ctrl_filespage/state.js";
+import componentFilesystem from "./ctrl_filespage/filesystem.js";
+
+import "../components/breadcrumb.js";
+
+export default function(render) {
+ const $page = createElement(`
+
+ `);
+ render($page);
+
+ // feature1: make the breadcrumb reflect the current path
+ effect(getState$().pipe(
+ rxjs.filter(({ path }) => !!path),
+ rxjs.map(({ path }) => ["path", path]),
+ applyMutation(qs($page, `[is="component-breadcrumb"]`), "setAttribute"),
+ ));
+
+ componentFilesystem(createRender($page.querySelector("component-filesystem")));
+}
diff --git a/public/pages/ctrl_filespage/filesystem.js b/public/pages/ctrl_filespage/filesystem.js
new file mode 100644
index 00000000..721dc311
--- /dev/null
+++ b/public/pages/ctrl_filespage/filesystem.js
@@ -0,0 +1,15 @@
+import { createElement } from "../../lib/skeleton/index.js";
+import { effect } from "../../lib/rx.js";
+import { getState$, getFiles$ } from "./state.js";
+
+export default function(render) {
+ const $page = createElement(`
+
+ ...
+
+ `);
+ render($page);
+ effect(getFiles$().pipe(
+ dbg("FS"),
+ ));
+}
diff --git a/public/pages/ctrl_filespage/state.js b/public/pages/ctrl_filespage/state.js
new file mode 100644
index 00000000..868f5103
--- /dev/null
+++ b/public/pages/ctrl_filespage/state.js
@@ -0,0 +1,39 @@
+import rxjs from "../../lib/rx.js";
+
+const state$ = new rxjs.ReplaySubject();
+const files$ = new rxjs.BehaviorSubject([]);
+
+export const getState$ = () => state$.asObservable();
+export const getFiles$ = () => files$.asObservable();
+
+export const reset = () => {
+ state$.next({
+ search: null,
+ sort: null,
+ view: null,
+ acl: {},
+ loading: true,
+ path: "/test/",
+ });
+};
+reset();
+
+export const onNavigate = () => {
+ console.log("NAVIGATION ATTEMPT");
+};
+
+export const onNewFile = () => {
+ console.log("CLICK NEW FILE");
+};
+
+export const onNewDirectory = () => {
+ console.log("CLICK NEW DIRECTORY");
+};
+
+export const onSelectFileOrFolder = () => {
+ console.log("SELECT FILE / FOLDER");
+};
+
+export const onSearch = () => {
+ console.log("SEARCH")
+};
diff --git a/public/pages/ctrl_homepage.js b/public/pages/ctrl_homepage.js
new file mode 100644
index 00000000..d337533d
--- /dev/null
+++ b/public/pages/ctrl_homepage.js
@@ -0,0 +1,29 @@
+import { createElement, navigate } from "../../lib/skeleton/index.js";
+import rxjs, { effect } from "../../lib/rx.js";
+import { ApplicationError } from "../lib/error.js";
+import ctrlError from "./ctrl_error.js";
+
+import { getSession } from "../model/session.js";
+
+import "../components/loader.js";
+
+export default function(render) {
+ const GET = new URLSearchParams(location.search);
+ if (GET.get("error")) {
+ ctrlError(new ApplicationError(
+ GET.get("error"),
+ GET.get("trace") || "server error from URL",
+ ))(render);
+ return;
+ }
+
+ render(createElement(`
`));
+
+ effect(getSession().pipe(
+ rxjs.tap(({ is_authenticated, home = "" }) => {
+ if (is_authenticated !== true) return navigate("/login");
+ return navigate(`/files${home}`);
+ }),
+ rxjs.catchError(() => navigate("/login")),
+ ));
+};
diff --git a/public/pages/ctrl_logout.js b/public/pages/ctrl_logout.js
index 780642bc..f10af55e 100644
--- a/public/pages/ctrl_logout.js
+++ b/public/pages/ctrl_logout.js
@@ -3,14 +3,10 @@ import rxjs, { effect } from "../lib/rx.js";
import ajax from "../lib/ajax.js";
import ctrlError from "./ctrl_error.js";
-import "../components/icon.js";
+import "../components/loader.js";
export default function(render) {
- const $page = createElement(`
-
-
- `);
+ const $page = createElement(`
`);
render($page);
effect(ajax({
diff --git a/public/pages/home/index.js b/public/pages/home/index.js
deleted file mode 100644
index 4fd81860..00000000
--- a/public/pages/home/index.js
+++ /dev/null
@@ -1,5 +0,0 @@
-import { createElement } from "../../lib/skeleton/index.js";
-
-export default function(render) {
- render(createElement(`
HOMEPAGE `));
-};
diff --git a/public/pages/home/index.test.js b/public/pages/home/index.test.js
deleted file mode 100644
index e2727b47..00000000
--- a/public/pages/home/index.test.js
+++ /dev/null
@@ -1,7 +0,0 @@
-import home from "./index.js";
-
-test("home", () => {
- const render = jest.fn();
- home(render);
- expect(render).toBeCalledTimes(1);
-});
diff --git a/public/server.go b/public/server.go
index c904bd50..9d70c9ea 100644
--- a/public/server.go
+++ b/public/server.go
@@ -27,7 +27,11 @@ func main() {
}
func serveStatic(w http.ResponseWriter, r *http.Request) {
- if strings.HasPrefix(r.URL.Path, "/admin/api/") || strings.HasPrefix(r.URL.Path, "/api/") || strings.HasPrefix(r.URL.Path, "/about") {
+ if strings.HasPrefix(r.URL.Path, "/admin/api/") ||
+ strings.HasPrefix(r.URL.Path, "/api/") ||
+ strings.HasPrefix(r.URL.Path, "/about") ||
+ strings.HasPrefix(r.URL.Path, "/overrides/") ||
+ strings.HasPrefix(r.URL.Path, "/sw_cache.js") {
u, _ := url.Parse("http://127.0.0.1:8334")
httputil.NewSingleHostReverseProxy(u).ServeHTTP(w, r)
return
@@ -50,6 +54,9 @@ func serveStatic(w http.ResponseWriter, r *http.Request) {
http.FileServer(fs).ServeHTTP(w, r)
return
}
+ if r.URL.Path == "/" {
+ r.URL.Path = CHROOT + "index.html"
+ }
f, err = openFile(fs, r, w)
if err != nil {
r.URL.Path = CHROOT + "index.html"
+
+