diff --git a/README.md b/README.md
index 4de087d..6e824a1 100644
--- a/README.md
+++ b/README.md
@@ -88,4 +88,6 @@ Generate previews from photo buckets. Registers webhooks.
Reverse proxies buckets to the minio endpoint, as a substitute for the AWS S3 website hosting features. Serves up `index.html` when URLs end in a slash.
+In production, [replace this with Nginx](https://docs.min.io/docs/setup-nginx-proxy-with-minio).
+
diff --git a/cmd/proxy/proxy.go b/cmd/proxy/proxy.go
index 3f1a754..c468d7c 100644
--- a/cmd/proxy/proxy.go
+++ b/cmd/proxy/proxy.go
@@ -62,7 +62,7 @@ func director(req *http.Request) {
} else {
// If we are using subdomains, set the host header
req.URL.Path = mapPath(*req)
- //req.Header.Set("Host", host)
+ req.Header.Set("Host", host)
}
// Prevent MINIO from issuing redirects
diff --git a/cmd/web/templates.go b/cmd/web/templates.go
index 4ee7830..1b105d1 100644
--- a/cmd/web/templates.go
+++ b/cmd/web/templates.go
@@ -16,6 +16,7 @@ var funcs = template.FuncMap{
type IndexTemplateData struct {
Assets string
+ Bucket string
Metadata lib.BucketMetadata
Photos []Photo
}
diff --git a/cmd/web/web.go b/cmd/web/web.go
index 91de486..d0e5d86 100644
--- a/cmd/web/web.go
+++ b/cmd/web/web.go
@@ -85,6 +85,7 @@ func update(w http.ResponseWriter, req *http.Request) {
data := IndexTemplateData{
Assets: endpoint + "/shared/",
+ Bucket: bucket,
Metadata: metadata,
Photos: detailedPhotos,
}
diff --git a/web/manage/.gitignore b/web/manage/.gitignore
index da93220..3ea2be4 100644
--- a/web/manage/.gitignore
+++ b/web/manage/.gitignore
@@ -1,4 +1,6 @@
-/node_modules/
-/public/build/
-
.DS_Store
+
+/node_modules/
+/build/
+
+.container
diff --git a/web/manage/Makefile b/web/manage/Makefile
index 8d2999f..ec7be76 100644
--- a/web/manage/Makefile
+++ b/web/manage/Makefile
@@ -1,64 +1,71 @@
-DOCKER ?= podman
-
NAME ?= photos-web-manage
-OUTPUT ?= public/build
-SOURCE ?= src
-ARG_PUBLISH ?= --publish 5000:5000
+DOCKER ?= podman
+GO ?= go
+OUTPUT ?= build
+SOURCE ?= src
+
+DEV_PORT ?= 5000
SHARED ?= ../shared
-shared_copy = public/shared
+SHARED_COPY ?= $(OUTPUT)/shared
current_dir = $(shell pwd)
-shared_source = $(wildcard $(SHARED)/*/*)
-shared_target = $(foreach path,$(shared_source),$(subst $(SHARED),$(shared_copy),$(path)))
+shared_files = $(wildcard $(SHARED)/*/*)
+shared_copy_files = $(foreach path,$(shared_files),$(subst $(SHARED)/,$(SHARED_COPY)/,$(path)))
+container_name = $(NAME)-builder
container_workdir = /working
arg_base = \
--rm --interactive --tty \
--workdir $(container_workdir) \
--security-opt label=disable
+arg_publish = \
+ --publish $(DEV_PORT):$(DEV_PORT)
arg_volume = \
- -v $(current_dir)/public:$(container_workdir)/public \
- -v $(current_dir)/src:$(container_workdir)/src \
+ -v $(current_dir)/$(OUTPUT):$(container_workdir)/$(OUTPUT) \
+ -v $(current_dir)/$(SOURCE):$(container_workdir)/$(SOURCE) \
.PHONY: default
default: build install
.PHONY: clean
clean:
- $(RM) -r $(shared_copy) $(OUTPUT) public/ .container
+ $(RM) -r $(OUTPUT) .container
.PHONY: container .containertest
container: .containertest .container
.containertest:
- $(DOCKER) image inspect $(NAME)-build 2>&1 >/dev/null || rm .container || exit 0
+ $(DOCKER) image inspect $(container_name) 2>&1 >/dev/null || rm .container || exit 0
.container: Dockerfile package.json rollup.config.js
- $(DOCKER) build --tag $(NAME)-build --no-cache .
+ $(DOCKER) build --tag $(container_name) --no-cache .
touch $@
+DEV_BUCKET ?= test.ambrose.photos
.PHONY: dev
# Start a development server
-dev: public/index.html $(shared_target) | container
- $(DOCKER) run $(arg_base) $(ARG_PUBLISH) $(arg_volume) \
- $(NAME)-build
+dev: $(SOURCE)/* $(OUTPUT)/index.html $(shared_copy_files) | container
+ echo "$(shared_copy_files)"
+ $(DOCKER) run $(arg_base) $(arg_publish) $(arg_volume) \
+ $(container_name)
-public/index.html: index.tmpl
+$(OUTPUT)/index.html: index.tmpl indextmpl.go
mkdir -p $(@D)
- go run indextmpl.go -t $? -o $@ -a $(subst public/,,$(shared_copy))/ -b $(subst public/,,$(OUTPUT))/ -mt "[dev] Manage"
+ $(GO) run indextmpl.go -t $< -o $@ -b $(DEV_BUCKET) -a $(subst $(OUTPUT)/,,$(SHARED_COPY))/ -mt "[dev] Manage"
.SECONDEXPANSION:
-$(shared_target): $$(subst $$(shared_copy),$$(SHARED),$$@)
+$(shared_copy_files): $$(subst $$(SHARED_COPY)/,$$(SHARED)/,$$@)
mkdir -p $(@D) && cp $? $@
.PHONY: build install
-# Build with rollup
+# Build with rollup
build: $(OUTPUT)/manage.js
-$(OUTPUT)/manage.js: src/* | container
+$(OUTPUT)/manage.js: $(SOURCE)/* | container
+ mkdir -p $(@D)
$(DOCKER) run $(arg_base) $(arg_volume) \
- $(NAME)-build npm run build
+ $(container_name) npm run build
install: build
cp $(OUTPUT)/manage.js $(SHARED)/js/manage.js
cp $(OUTPUT)/manage.css $(SHARED)/css/manage.css
diff --git a/web/manage/index.tmpl b/web/manage/index.tmpl
index 86f91e4..ad5e509 100644
--- a/web/manage/index.tmpl
+++ b/web/manage/index.tmpl
@@ -5,11 +5,10 @@
{{ .Metadata.Title }}
-
+
-
+
-
-
+
diff --git a/web/manage/indextmpl.go b/web/manage/indextmpl.go
index 00d155d..1df77b7 100644
--- a/web/manage/indextmpl.go
+++ b/web/manage/indextmpl.go
@@ -10,8 +10,8 @@ import (
type IndexData struct {
Assets string
+ Bucket string
Development bool
- Build string
Metadata Metadata
}
@@ -28,8 +28,8 @@ var out string
func main() {
flag.StringVar(&tmpl, "t", "", "template file")
flag.StringVar(&out, "o", "", "output file")
+ flag.StringVar(&data.Bucket, "b", "", ".Bucket")
flag.StringVar(&data.Assets, "a", "", ".Assets")
- flag.StringVar(&data.Build, "b", "", ".Build")
flag.StringVar(&data.Metadata.Title, "mt", "", ".Metadata.Title")
flag.Parse()
@@ -52,7 +52,7 @@ func main() {
panic(err)
}
- of, err := os.OpenFile(out, os.O_WRONLY|os.O_CREATE, 0644)
+ of, err := os.OpenFile(out, os.O_WRONLY|os.O_CREATE|os.O_TRUNC, 0644)
if err != nil {
panic(err)
}
diff --git a/web/manage/package.json b/web/manage/package.json
index d945b6e..3c73e16 100644
--- a/web/manage/package.json
+++ b/web/manage/package.json
@@ -4,7 +4,7 @@
"scripts": {
"build": "rollup -c",
"dev": "rollup -c -w",
- "start": "sirv public --host 0.0.0.0"
+ "start": "sirv build --host 0.0.0.0"
},
"devDependencies": {
"@rollup/plugin-commonjs": "^12.0.0",
diff --git a/web/manage/rollup.config.js b/web/manage/rollup.config.js
index 3649681..64d12e9 100644
--- a/web/manage/rollup.config.js
+++ b/web/manage/rollup.config.js
@@ -12,7 +12,7 @@ export default {
sourcemap: true,
format: 'iife',
name: 'app',
- file: 'public/build/manage.js'
+ file: 'build/manage.js'
},
plugins: [
svelte({
@@ -21,7 +21,7 @@ export default {
// we'll extract any component CSS out into
// a separate file - better for performance
css: css => {
- css.write('public/build/manage.css');
+ css.write('build/manage.css');
}
}),
@@ -42,7 +42,7 @@ export default {
// Watch the `public` directory and refresh the
// browser on changes when not in production
- !production && livereload('public'),
+ !production && livereload('build'),
// If we're building for production (npm run build
// instead of npm run dev), minify
diff --git a/web/manage/src/App.svelte b/web/manage/src/App.svelte
index 10faec7..a8e864e 100644
--- a/web/manage/src/App.svelte
+++ b/web/manage/src/App.svelte
@@ -1,30 +1,24 @@
-
- Hello {name}!
- Visit the Svelte tutorial to learn how to build Svelte apps.
-
+
-
\ No newline at end of file
+
diff --git a/web/manage/src/Gallery.svelte b/web/manage/src/Gallery.svelte
new file mode 100644
index 0000000..fc2ffd3
--- /dev/null
+++ b/web/manage/src/Gallery.svelte
@@ -0,0 +1,13 @@
+
+
+
+ {#each photos as photo}
+
+ {/each}
+
+
+
diff --git a/web/manage/src/Photo.svelte b/web/manage/src/Photo.svelte
new file mode 100644
index 0000000..ba49c3d
--- /dev/null
+++ b/web/manage/src/Photo.svelte
@@ -0,0 +1,33 @@
+
+
+
+
diff --git a/web/manage/src/main.js b/web/manage/src/main.js
index 1fe1b22..7850902 100644
--- a/web/manage/src/main.js
+++ b/web/manage/src/main.js
@@ -3,7 +3,7 @@ import App from './App.svelte';
const app = new App({
target: document.body,
props: {
- name: 'ambrose'
+ bucket: document.body.dataset.bucket,
}
});
diff --git a/web/shared/css/manage.css b/web/shared/css/manage.css
new file mode 100644
index 0000000..9a464b4
--- /dev/null
+++ b/web/shared/css/manage.css
@@ -0,0 +1,3 @@
+main.svelte-1tky8bj{text-align:center;padding:1em;max-width:240px;margin:0 auto}h1.svelte-1tky8bj{color:#ff3e00;text-transform:uppercase;font-size:4em;font-weight:100}@media(min-width: 640px){main.svelte-1tky8bj{max-width:none}}
+
+/*# sourceMappingURL=manage.css.map */
\ No newline at end of file
diff --git a/web/shared/js/manage.js b/web/shared/js/manage.js
new file mode 100644
index 0000000..4c2f8d0
--- /dev/null
+++ b/web/shared/js/manage.js
@@ -0,0 +1,442 @@
+
+(function(l, r) { if (l.getElementById('livereloadscript')) return; r = l.createElement('script'); r.async = 1; r.src = '//' + (window.location.host || 'localhost').split(':')[0] + ':35729/livereload.js?snipver=1'; r.id = 'livereloadscript'; l.getElementsByTagName('head')[0].appendChild(r) })(window.document);
+var app = (function () {
+ 'use strict';
+
+ function noop() { }
+ function add_location(element, file, line, column, char) {
+ element.__svelte_meta = {
+ loc: { file, line, column, char }
+ };
+ }
+ function run(fn) {
+ return fn();
+ }
+ function blank_object() {
+ return Object.create(null);
+ }
+ function run_all(fns) {
+ fns.forEach(run);
+ }
+ function is_function(thing) {
+ return typeof thing === 'function';
+ }
+ function safe_not_equal(a, b) {
+ return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function');
+ }
+
+ function append(target, node) {
+ target.appendChild(node);
+ }
+ function insert(target, node, anchor) {
+ target.insertBefore(node, anchor || null);
+ }
+ function detach(node) {
+ node.parentNode.removeChild(node);
+ }
+ function element(name) {
+ return document.createElement(name);
+ }
+ function text(data) {
+ return document.createTextNode(data);
+ }
+ function space() {
+ return text(' ');
+ }
+ function attr(node, attribute, value) {
+ if (value == null)
+ node.removeAttribute(attribute);
+ else if (node.getAttribute(attribute) !== value)
+ node.setAttribute(attribute, value);
+ }
+ function children(element) {
+ return Array.from(element.childNodes);
+ }
+ function custom_event(type, detail) {
+ const e = document.createEvent('CustomEvent');
+ e.initCustomEvent(type, false, false, detail);
+ return e;
+ }
+
+ let current_component;
+ function set_current_component(component) {
+ current_component = component;
+ }
+
+ const dirty_components = [];
+ const binding_callbacks = [];
+ const render_callbacks = [];
+ const flush_callbacks = [];
+ const resolved_promise = Promise.resolve();
+ let update_scheduled = false;
+ function schedule_update() {
+ if (!update_scheduled) {
+ update_scheduled = true;
+ resolved_promise.then(flush);
+ }
+ }
+ function add_render_callback(fn) {
+ render_callbacks.push(fn);
+ }
+ let flushing = false;
+ const seen_callbacks = new Set();
+ function flush() {
+ if (flushing)
+ return;
+ flushing = true;
+ do {
+ // first, call beforeUpdate functions
+ // and update components
+ for (let i = 0; i < dirty_components.length; i += 1) {
+ const component = dirty_components[i];
+ set_current_component(component);
+ update(component.$$);
+ }
+ dirty_components.length = 0;
+ while (binding_callbacks.length)
+ binding_callbacks.pop()();
+ // then, once components are updated, call
+ // afterUpdate functions. This may cause
+ // subsequent updates...
+ for (let i = 0; i < render_callbacks.length; i += 1) {
+ const callback = render_callbacks[i];
+ if (!seen_callbacks.has(callback)) {
+ // ...so guard against infinite loops
+ seen_callbacks.add(callback);
+ callback();
+ }
+ }
+ render_callbacks.length = 0;
+ } while (dirty_components.length);
+ while (flush_callbacks.length) {
+ flush_callbacks.pop()();
+ }
+ update_scheduled = false;
+ flushing = false;
+ seen_callbacks.clear();
+ }
+ function update($$) {
+ if ($$.fragment !== null) {
+ $$.update();
+ run_all($$.before_update);
+ const dirty = $$.dirty;
+ $$.dirty = [-1];
+ $$.fragment && $$.fragment.p($$.ctx, dirty);
+ $$.after_update.forEach(add_render_callback);
+ }
+ }
+ const outroing = new Set();
+ function transition_in(block, local) {
+ if (block && block.i) {
+ outroing.delete(block);
+ block.i(local);
+ }
+ }
+ function mount_component(component, target, anchor) {
+ const { fragment, on_mount, on_destroy, after_update } = component.$$;
+ fragment && fragment.m(target, anchor);
+ // onMount happens before the initial afterUpdate
+ add_render_callback(() => {
+ const new_on_destroy = on_mount.map(run).filter(is_function);
+ if (on_destroy) {
+ on_destroy.push(...new_on_destroy);
+ }
+ else {
+ // Edge case - component was destroyed immediately,
+ // most likely as a result of a binding initialising
+ run_all(new_on_destroy);
+ }
+ component.$$.on_mount = [];
+ });
+ after_update.forEach(add_render_callback);
+ }
+ function destroy_component(component, detaching) {
+ const $$ = component.$$;
+ if ($$.fragment !== null) {
+ run_all($$.on_destroy);
+ $$.fragment && $$.fragment.d(detaching);
+ // TODO null out other refs, including component.$$ (but need to
+ // preserve final state?)
+ $$.on_destroy = $$.fragment = null;
+ $$.ctx = [];
+ }
+ }
+ function make_dirty(component, i) {
+ if (component.$$.dirty[0] === -1) {
+ dirty_components.push(component);
+ schedule_update();
+ component.$$.dirty.fill(0);
+ }
+ component.$$.dirty[(i / 31) | 0] |= (1 << (i % 31));
+ }
+ function init(component, options, instance, create_fragment, not_equal, props, dirty = [-1]) {
+ const parent_component = current_component;
+ set_current_component(component);
+ const prop_values = options.props || {};
+ const $$ = component.$$ = {
+ fragment: null,
+ ctx: null,
+ // state
+ props,
+ update: noop,
+ not_equal,
+ bound: blank_object(),
+ // lifecycle
+ on_mount: [],
+ on_destroy: [],
+ before_update: [],
+ after_update: [],
+ context: new Map(parent_component ? parent_component.$$.context : []),
+ // everything else
+ callbacks: blank_object(),
+ dirty
+ };
+ let ready = false;
+ $$.ctx = instance
+ ? instance(component, prop_values, (i, ret, ...rest) => {
+ const value = rest.length ? rest[0] : ret;
+ if ($$.ctx && not_equal($$.ctx[i], $$.ctx[i] = value)) {
+ if ($$.bound[i])
+ $$.bound[i](value);
+ if (ready)
+ make_dirty(component, i);
+ }
+ return ret;
+ })
+ : [];
+ $$.update();
+ ready = true;
+ run_all($$.before_update);
+ // `false` as a special case of no DOM component
+ $$.fragment = create_fragment ? create_fragment($$.ctx) : false;
+ if (options.target) {
+ if (options.hydrate) {
+ const nodes = children(options.target);
+ // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+ $$.fragment && $$.fragment.l(nodes);
+ nodes.forEach(detach);
+ }
+ else {
+ // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+ $$.fragment && $$.fragment.c();
+ }
+ if (options.intro)
+ transition_in(component.$$.fragment);
+ mount_component(component, options.target, options.anchor);
+ flush();
+ }
+ set_current_component(parent_component);
+ }
+ class SvelteComponent {
+ $destroy() {
+ destroy_component(this, 1);
+ this.$destroy = noop;
+ }
+ $on(type, callback) {
+ const callbacks = (this.$$.callbacks[type] || (this.$$.callbacks[type] = []));
+ callbacks.push(callback);
+ return () => {
+ const index = callbacks.indexOf(callback);
+ if (index !== -1)
+ callbacks.splice(index, 1);
+ };
+ }
+ $set() {
+ // overridden by instance, if it has props
+ }
+ }
+
+ function dispatch_dev(type, detail) {
+ document.dispatchEvent(custom_event(type, Object.assign({ version: '3.23.1' }, detail)));
+ }
+ function append_dev(target, node) {
+ dispatch_dev("SvelteDOMInsert", { target, node });
+ append(target, node);
+ }
+ function insert_dev(target, node, anchor) {
+ dispatch_dev("SvelteDOMInsert", { target, node, anchor });
+ insert(target, node, anchor);
+ }
+ function detach_dev(node) {
+ dispatch_dev("SvelteDOMRemove", { node });
+ detach(node);
+ }
+ function attr_dev(node, attribute, value) {
+ attr(node, attribute, value);
+ if (value == null)
+ dispatch_dev("SvelteDOMRemoveAttribute", { node, attribute });
+ else
+ dispatch_dev("SvelteDOMSetAttribute", { node, attribute, value });
+ }
+ function set_data_dev(text, data) {
+ data = '' + data;
+ if (text.data === data)
+ return;
+ dispatch_dev("SvelteDOMSetData", { node: text, data });
+ text.data = data;
+ }
+ function validate_slots(name, slot, keys) {
+ for (const slot_key of Object.keys(slot)) {
+ if (!~keys.indexOf(slot_key)) {
+ console.warn(`<${name}> received an unexpected slot "${slot_key}".`);
+ }
+ }
+ }
+ class SvelteComponentDev extends SvelteComponent {
+ constructor(options) {
+ if (!options || (!options.target && !options.$$inline)) {
+ throw new Error(`'target' is a required option`);
+ }
+ super();
+ }
+ $destroy() {
+ super.$destroy();
+ this.$destroy = () => {
+ console.warn(`Component was already destroyed`); // eslint-disable-line no-console
+ };
+ }
+ $capture_state() { }
+ $inject_state() { }
+ }
+
+ /* src/App.svelte generated by Svelte v3.23.1 */
+
+ const file = "src/App.svelte";
+
+ function create_fragment(ctx) {
+ let main;
+ let h1;
+ let t0;
+ let t1;
+ let t2;
+ let t3;
+ let p;
+ let t4;
+ let a;
+ let t6;
+
+ const block = {
+ c: function create() {
+ main = element("main");
+ h1 = element("h1");
+ t0 = text("Hello ");
+ t1 = text(/*bucket*/ ctx[0]);
+ t2 = text("!");
+ t3 = space();
+ p = element("p");
+ t4 = text("Visit the ");
+ a = element("a");
+ a.textContent = "Svelte tutorial";
+ t6 = text(" to learn how to build Svelte apps.");
+ attr_dev(h1, "class", "svelte-1tky8bj");
+ add_location(h1, file, 5, 1, 48);
+ attr_dev(a, "href", "https://svelte.dev/tutorial");
+ add_location(a, file, 6, 14, 87);
+ add_location(p, file, 6, 1, 74);
+ attr_dev(main, "class", "svelte-1tky8bj");
+ add_location(main, file, 4, 0, 40);
+ },
+ l: function claim(nodes) {
+ throw new Error("options.hydrate only works if the component was compiled with the `hydratable: true` option");
+ },
+ m: function mount(target, anchor) {
+ insert_dev(target, main, anchor);
+ append_dev(main, h1);
+ append_dev(h1, t0);
+ append_dev(h1, t1);
+ append_dev(h1, t2);
+ append_dev(main, t3);
+ append_dev(main, p);
+ append_dev(p, t4);
+ append_dev(p, a);
+ append_dev(p, t6);
+ },
+ p: function update(ctx, [dirty]) {
+ if (dirty & /*bucket*/ 1) set_data_dev(t1, /*bucket*/ ctx[0]);
+ },
+ i: noop,
+ o: noop,
+ d: function destroy(detaching) {
+ if (detaching) detach_dev(main);
+ }
+ };
+
+ dispatch_dev("SvelteRegisterBlock", {
+ block,
+ id: create_fragment.name,
+ type: "component",
+ source: "",
+ ctx
+ });
+
+ return block;
+ }
+
+ function instance($$self, $$props, $$invalidate) {
+ let { bucket } = $$props;
+ const writable_props = ["bucket"];
+
+ Object.keys($$props).forEach(key => {
+ if (!~writable_props.indexOf(key) && key.slice(0, 2) !== "$$") console.warn(` was created with unknown prop '${key}'`);
+ });
+
+ let { $$slots = {}, $$scope } = $$props;
+ validate_slots("App", $$slots, []);
+
+ $$self.$set = $$props => {
+ if ("bucket" in $$props) $$invalidate(0, bucket = $$props.bucket);
+ };
+
+ $$self.$capture_state = () => ({ bucket });
+
+ $$self.$inject_state = $$props => {
+ if ("bucket" in $$props) $$invalidate(0, bucket = $$props.bucket);
+ };
+
+ if ($$props && "$$inject" in $$props) {
+ $$self.$inject_state($$props.$$inject);
+ }
+
+ return [bucket];
+ }
+
+ class App extends SvelteComponentDev {
+ constructor(options) {
+ super(options);
+ init(this, options, instance, create_fragment, safe_not_equal, { bucket: 0 });
+
+ dispatch_dev("SvelteRegisterComponent", {
+ component: this,
+ tagName: "App",
+ options,
+ id: create_fragment.name
+ });
+
+ const { ctx } = this.$$;
+ const props = options.props || {};
+
+ if (/*bucket*/ ctx[0] === undefined && !("bucket" in props)) {
+ console.warn(" was created without expected prop 'bucket'");
+ }
+ }
+
+ get bucket() {
+ throw new Error(": Props cannot be read directly from the component instance unless compiling with 'accessors: true' or ''");
+ }
+
+ set bucket(value) {
+ throw new Error(": Props cannot be set directly on the component instance unless compiling with 'accessors: true' or ''");
+ }
+ }
+
+ const app = new App({
+ target: document.body,
+ props: {
+ bucket: document.body.dataset.bucket,
+ }
+ });
+
+ return app;
+
+}());
+//# sourceMappingURL=manage.js.map