WIP: Initial web gallery
parent
92218b0b7e
commit
0ad912fab4
GPG Key ID:
BC367D33F140B5C2
|
|
@ -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).
|
||||
|
||||
<!-- vim: set conceallevel=2 et ts=2 sw=2: -->
|
||||
|
|
|
|||
|
|
@ -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
|
||||
|
|
|
|||
|
|
@ -16,6 +16,7 @@ var funcs = template.FuncMap{
|
|||
|
||||
type IndexTemplateData struct {
|
||||
Assets string
|
||||
Bucket string
|
||||
Metadata lib.BucketMetadata
|
||||
Photos []Photo
|
||||
}
|
||||
|
|
|
|||
|
|
@ -85,6 +85,7 @@ func update(w http.ResponseWriter, req *http.Request) {
|
|||
|
||||
data := IndexTemplateData{
|
||||
Assets: endpoint + "/shared/",
|
||||
Bucket: bucket,
|
||||
Metadata: metadata,
|
||||
Photos: detailedPhotos,
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,4 +1,6 @@
|
|||
/node_modules/
|
||||
/public/build/
|
||||
|
||||
.DS_Store
|
||||
|
||||
/node_modules/
|
||||
/build/
|
||||
|
||||
.container
|
||||
|
|
|
|||
|
|
@ -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
|
||||
|
|
|
|||
|
|
@ -5,11 +5,10 @@
|
|||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>{{ .Metadata.Title }}</title>
|
||||
<link rel="stylesheet" href="{{ .Assets }}css/base.css">
|
||||
<link rel="stylesheet" href="{{if .Development}}{{ .Build }}{{else}}{{ .Assets }}css/{{end}}manage.css">
|
||||
<link rel="stylesheet" href="{{if .Development}}{{else}}{{ .Assets }}css/{{end}}manage.css">
|
||||
<!-- Svelte! -->
|
||||
<script src="{{if .Development}}{{ .Build }}{{else}}{{ .Assets }}js/{{end}}manage.js" defer async></script>
|
||||
<script src="{{if .Development}}{{else}}{{ .Assets }}js/{{end}}manage.js" defer async></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<body data-bucket="{{ .Bucket }}">
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -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)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -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",
|
||||
|
|
|
|||
|
|
@ -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
|
||||
|
|
|
|||
|
|
@ -1,30 +1,24 @@
|
|||
<script>
|
||||
export let name;
|
||||
export let bucket;
|
||||
|
||||
import Gallery from './Gallery.svelte';
|
||||
|
||||
let photos = [
|
||||
"photo/Screenshot from 2020-04-23 19-27-53.png",
|
||||
"photo/Screenshot_2020-04-13 Looking Glass - Hurricane Electric (AS6939).png",
|
||||
];
|
||||
</script>
|
||||
|
||||
<main>
|
||||
<h1>Hello {name}!</h1>
|
||||
<p>Visit the <a href="https://svelte.dev/tutorial">Svelte tutorial</a> to learn how to build Svelte apps.</p>
|
||||
</main>
|
||||
<div>
|
||||
<nav>
|
||||
<ul>
|
||||
<li><a href="..">Gallery</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
<header>
|
||||
<h1>{bucket}</h1>
|
||||
</header>
|
||||
<Gallery {photos} />
|
||||
</div>
|
||||
|
||||
<style>
|
||||
main {
|
||||
text-align: center;
|
||||
padding: 1em;
|
||||
max-width: 240px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
h1 {
|
||||
color: #ff3e00;
|
||||
text-transform: uppercase;
|
||||
font-size: 4em;
|
||||
font-weight: 100;
|
||||
}
|
||||
|
||||
@media (min-width: 640px) {
|
||||
main {
|
||||
max-width: none;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<!-- vim: set ft=html: -->
|
||||
|
|
|
|||
|
|
@ -0,0 +1,13 @@
|
|||
<script>
|
||||
export let photos;
|
||||
|
||||
import Photo from './Photo.svelte';
|
||||
</script>
|
||||
|
||||
<main>
|
||||
{#each photos as photo}
|
||||
<Photo {photo} />
|
||||
{/each}
|
||||
</main>
|
||||
|
||||
<!-- vim: set ft=html: -->
|
||||
|
|
@ -0,0 +1,33 @@
|
|||
<script>
|
||||
export let photo;
|
||||
|
||||
async function
|
||||
</script>
|
||||
|
||||
<div class="gallery-item preloaded-thumbnail" data-ar="{ar(photo)}">
|
||||
<a href="{photo}" data-enlarge="{photo}">
|
||||
<picture style="display: none;">
|
||||
<source srcset="{preview(photo, 320, 'image/webp', 70)} 2x, {preview(photo, 160, 'image/webp', 70)} 1x" type="image/webp" media="(max-width: 900px)">
|
||||
<source srcset="{preview(photo, 640, 'image/webp', 70)} 2x, {preview(photo, 320, 'image/webp', 70)} 1x" type="image/webp">
|
||||
<source srcset="{preview(photo, 320, 'image/jpeg', 70)} 2x, {preview(photo, 160, 'image/jpeg', 70)} 1x" media="(max-width: 900px)">
|
||||
<source srcset="{preview(photo, 640, 'image/jpeg', 70)} 2x, {preview(photo, 320, 'image/jpeg', 70)} 1x">
|
||||
<img src="{preview(photo, 320, 'image/jpeg', 70)}"
|
||||
alt=""
|
||||
width="{ar(photo) * 320}"
|
||||
height="320"
|
||||
loading="lazy"
|
||||
data-enlarge-preload-for="{photo}">
|
||||
</picture>
|
||||
<picture class="preloaded-thumbnail-image">
|
||||
<source srcset="{preview(photo, 30, 'image/webp', 34)} 1x" type="image/webp" media="(max-width: 900px)">
|
||||
<source srcset="{preview(photo, 60, 'image/webp', 34)} 1x" type="image/webp">
|
||||
<source srcset="{preview(photo, 30, 'image/jpeg', 34)} 1x" media="(max-width: 900px)">
|
||||
<source srcset="{preview(photo, 60, 'image/jpeg', 34)} 1x">
|
||||
<img src="{preview(photo, 30, 'image/jpeg', 34)}"
|
||||
alt=""
|
||||
width="{ar(photo) * 320}"
|
||||
height="320">
|
||||
</picture>
|
||||
</a>
|
||||
</div>
|
||||
<!-- vim: set ft=html: -->
|
||||
|
|
@ -3,7 +3,7 @@ import App from './App.svelte';
|
|||
const app = new App({
|
||||
target: document.body,
|
||||
props: {
|
||||
name: 'ambrose'
|
||||
bucket: document.body.dataset.bucket,
|
||||
}
|
||||
});
|
||||
|
||||
|
|
|
|||
|
|
@ -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 */
|
||||
|
|
@ -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(`<App> 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("<App> was created without expected prop 'bucket'");
|
||||
}
|
||||
}
|
||||
|
||||
get bucket() {
|
||||
throw new Error("<App>: Props cannot be read directly from the component instance unless compiling with 'accessors: true' or '<svelte:options accessors/>'");
|
||||
}
|
||||
|
||||
set bucket(value) {
|
||||
throw new Error("<App>: Props cannot be set directly on the component instance unless compiling with 'accessors: true' or '<svelte:options accessors/>'");
|
||||
}
|
||||
}
|
||||
|
||||
const app = new App({
|
||||
target: document.body,
|
||||
props: {
|
||||
bucket: document.body.dataset.bucket,
|
||||
}
|
||||
});
|
||||
|
||||
return app;
|
||||
|
||||
}());
|
||||
//# sourceMappingURL=manage.js.map
|
||||
Loading…
Reference in New Issue