update to svelte 3
This commit is contained in:
parent
0f13f3bd29
commit
1d57bb23c3
|
@ -162,7 +162,7 @@ import {known_load, known_save} from './known_instances.js'
|
||||||
if(viewer.last_delete){
|
if(viewer.last_delete){
|
||||||
viewer.last_delete = new Date(viewer.last_delete);
|
viewer.last_delete = new Date(viewer.last_delete);
|
||||||
}
|
}
|
||||||
banner.set(viewer);
|
banner.$set(viewer);
|
||||||
}
|
}
|
||||||
|
|
||||||
let viewer_from_dom = JSON.parse(document.querySelector('script[data-viewer]').textContent)
|
let viewer_from_dom = JSON.parse(document.querySelector('script[data-viewer]').textContent)
|
||||||
|
@ -175,7 +175,8 @@ import {known_load, known_save} from './known_instances.js'
|
||||||
}
|
}
|
||||||
set_viewer_timeout();
|
set_viewer_timeout();
|
||||||
|
|
||||||
banner.on('toggle', enabled => {
|
banner.$on('toggle', event => {
|
||||||
|
let enabled = event.detail;
|
||||||
send_settings({policy_enabled: enabled}).then(fetch_viewer).then(update_viewer);
|
send_settings({policy_enabled: enabled}).then(fetch_viewer).then(update_viewer);
|
||||||
// TODO show error or spinner if it takes over a second
|
// TODO show error or spinner if it takes over a second
|
||||||
})
|
})
|
||||||
|
|
|
@ -11,12 +11,14 @@
|
||||||
</div>
|
</div>
|
||||||
{/if}
|
{/if}
|
||||||
<input type="file" name="file" accept="application/zip,.zip"
|
<input type="file" name="file" accept="application/zip,.zip"
|
||||||
on:change="take_file(this.files)">
|
on:change={take_file(this.files)}>
|
||||||
<input type="submit" value="Upload">
|
<input type="submit" value="Upload">
|
||||||
<input type='hidden' name='csrf-token' value={csrf_token}>
|
<input type='hidden' name='csrf-token' value={csrf_token}>
|
||||||
</form>
|
</form>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
|
export let csrf_token, action;
|
||||||
|
|
||||||
function get_file_size(file_list){
|
function get_file_size(file_list){
|
||||||
/* returns size of selected file given an <input type="file">
|
/* returns size of selected file given an <input type="file">
|
||||||
or 0 if no file is selected */
|
or 0 if no file is selected */
|
||||||
|
@ -27,23 +29,10 @@ function get_file_size(file_list){
|
||||||
return size;
|
return size;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function take_file(file_list){
|
||||||
export default {
|
file_size: get_file_size(file_list);
|
||||||
data(){
|
|
||||||
return { file_size: 0 }
|
|
||||||
},
|
|
||||||
|
|
||||||
oncreate(){
|
|
||||||
},
|
|
||||||
|
|
||||||
methods: {
|
|
||||||
take_file(file_list){
|
|
||||||
this.set({file_size: get_file_size(file_list)});
|
|
||||||
},
|
|
||||||
},
|
|
||||||
|
|
||||||
computed: {
|
|
||||||
file_too_big: ({file_size}) => file_size > 10000000, // 10 MB
|
|
||||||
},
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
let file_size = 0;
|
||||||
|
$: file_too_big = file_size > 10000000; // 10 MB
|
||||||
</script>
|
</script>
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
<div class='banner {policy_enabled?'enabled':'disabled'}'>
|
<div class='banner {policy_enabled?'enabled':'disabled'}'>
|
||||||
<div class='btn-group right'>
|
<div class='btn-group right'>
|
||||||
<button class='btn {policy_enabled?"secondary":"primary"}' on:click='toggle(policy_enabled)'>{policy_enabled?'Disable':'Enable'}</button>
|
<button class='btn {policy_enabled?"secondary":"primary"}' on:click={toggle}>{policy_enabled?'Disable':'Enable'}</button>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
Forget is currently
|
Forget is currently
|
||||||
|
@ -12,12 +12,13 @@
|
||||||
on your account.
|
on your account.
|
||||||
</div>
|
</div>
|
||||||
<div class='timers'>
|
<div class='timers'>
|
||||||
<span class='last-delete {(!last_delete)?'hidden':''}' title={last_delete}>
|
<span class='last-delete' class:hidden={!last_delete} title={last_delete}>
|
||||||
{#if last_delete }
|
{#if last_delete }
|
||||||
Last delete {rel_past(now - last_delete)}.
|
Last delete {rel_past(now - last_delete)}.
|
||||||
{/if }
|
{/if }
|
||||||
</span>
|
</span>
|
||||||
<span class='next-delete {(!policy_enabled || !next_delete || !eligible_for_delete_estimate)?'hidden':''}' title={next_delete}>
|
<span class='next-delete'
|
||||||
|
class:hidden={!policy_enabled || !next_delete || !eligible_for_delete_estimate} title={next_delete}>
|
||||||
Next delete {rel_future(next_delete - now)}.
|
Next delete {rel_future(next_delete - now)}.
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
|
@ -47,6 +48,7 @@
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
function absmod(n, x){
|
function absmod(n, x){
|
||||||
|
// it's like modulo but never negative
|
||||||
n = n % x;
|
n = n % x;
|
||||||
if(n < 0){
|
if(n < 0){
|
||||||
n += x
|
n += x
|
||||||
|
@ -61,6 +63,7 @@ function s(n){
|
||||||
return '';
|
return '';
|
||||||
}
|
}
|
||||||
function rel(millis){
|
function rel(millis){
|
||||||
|
// returns human-readable duration from duration in millis
|
||||||
let secs = Math.round(millis/1000)
|
let secs = Math.round(millis/1000)
|
||||||
if(secs <= 120){
|
if(secs <= 120){
|
||||||
return `${secs} seconds`;
|
return `${secs} seconds`;
|
||||||
|
@ -81,58 +84,50 @@ function rel(millis){
|
||||||
return `${days} days`;
|
return `${days} days`;
|
||||||
}
|
}
|
||||||
|
|
||||||
export default {
|
function rel_future(millis){
|
||||||
data(){
|
// returns relative time from timestamp, assuming time is in the future
|
||||||
return {
|
if(millis < 2000){
|
||||||
policy_enabled: false,
|
let secs = Math.floor(millis/1000)
|
||||||
next_delete: null,
|
let ndots = absmod(-secs, 3);
|
||||||
last_delete: null,
|
let out = 'anytime now';
|
||||||
now: +(new Date()),
|
for(; ndots > 0; ndots--){
|
||||||
|
out += '.';
|
||||||
}
|
}
|
||||||
},
|
return out;
|
||||||
|
}
|
||||||
|
return `in ${rel(millis)}`;
|
||||||
|
}
|
||||||
|
|
||||||
helpers: {
|
function rel_past(millis){
|
||||||
rel_future(millis){
|
// returns relative time from timestamp, assuming time is in the past
|
||||||
if(millis < 2000){
|
if(millis < 2000){
|
||||||
let secs = Math.floor(millis/1000)
|
return 'just now';
|
||||||
let ndots = absmod(-secs, 3);
|
}
|
||||||
let out = 'anytime now';
|
return `${rel(millis)} ago`;
|
||||||
for(; ndots > 0; ndots--){
|
}
|
||||||
out += '.';
|
|
||||||
}
|
|
||||||
return out;
|
|
||||||
}
|
|
||||||
return `in ${rel(millis)}`;
|
|
||||||
},
|
|
||||||
rel_past(millis){
|
|
||||||
if(millis < 2000){
|
|
||||||
return 'just now';
|
|
||||||
}
|
|
||||||
return `${rel(millis)} ago`;
|
|
||||||
},
|
|
||||||
},
|
|
||||||
|
|
||||||
methods: {
|
import { onDestroy, createEventDispatcher } from 'svelte';
|
||||||
toggle(policy_enabled){
|
|
||||||
policy_enabled = !policy_enabled;
|
|
||||||
let obj = {policy_enabled}
|
|
||||||
if(policy_enabled){
|
|
||||||
obj.next_delete = null;
|
|
||||||
}
|
|
||||||
this.set(obj);
|
|
||||||
this.fire('toggle', policy_enabled);
|
|
||||||
}
|
|
||||||
},
|
|
||||||
|
|
||||||
oncreate () {
|
const dispatch = createEventDispatcher();
|
||||||
this.interval = setInterval( () => {
|
|
||||||
this.set({ now: +(new Date()) });
|
|
||||||
}, 1000 );
|
|
||||||
},
|
|
||||||
|
|
||||||
ondestroy () {
|
function toggle(){
|
||||||
clearInterval( this.interval );
|
console.log(policy_enabled);
|
||||||
},
|
policy_enabled = !policy_enabled;
|
||||||
|
if(policy_enabled){
|
||||||
|
next_delete = null;
|
||||||
|
}
|
||||||
|
dispatch('toggle', policy_enabled);
|
||||||
|
}
|
||||||
|
|
||||||
};
|
|
||||||
|
export let next_delete, last_delete, eligible_for_delete_estimate;
|
||||||
|
export let policy_enabled = false;
|
||||||
|
|
||||||
|
let now = +(new Date());
|
||||||
|
|
||||||
|
let interval = setInterval(() =>
|
||||||
|
now = +(new Date())
|
||||||
|
, 1000 );
|
||||||
|
|
||||||
|
onDestroy(()=> clearInterval(interval));
|
||||||
</script>
|
</script>
|
||||||
|
|
|
@ -140,6 +140,12 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"builtin-modules": {
|
||||||
|
"version": "2.0.0",
|
||||||
|
"resolved": "https://registry.npmjs.org/builtin-modules/-/builtin-modules-2.0.0.tgz",
|
||||||
|
"integrity": "sha512-3U5kUA5VPsRUA3nofm/BXX7GVHKfxz0hOBAPxXrIvHzlDRkQVqEn6yi8QJegxl4LzOHLdvb7XF5dVawa/VVYBg==",
|
||||||
|
"dev": true
|
||||||
|
},
|
||||||
"cache-base": {
|
"cache-base": {
|
||||||
"version": "1.0.1",
|
"version": "1.0.1",
|
||||||
"resolved": "https://registry.npmjs.org/cache-base/-/cache-base-1.0.1.tgz",
|
"resolved": "https://registry.npmjs.org/cache-base/-/cache-base-1.0.1.tgz",
|
||||||
|
@ -532,6 +538,12 @@
|
||||||
"integrity": "sha1-YrEQ4omkcUGOPsNqYX1HLjAd/Ik=",
|
"integrity": "sha1-YrEQ4omkcUGOPsNqYX1HLjAd/Ik=",
|
||||||
"dev": true
|
"dev": true
|
||||||
},
|
},
|
||||||
|
"is-module": {
|
||||||
|
"version": "1.0.0",
|
||||||
|
"resolved": "https://registry.npmjs.org/is-module/-/is-module-1.0.0.tgz",
|
||||||
|
"integrity": "sha1-Mlj7afeMFNW4FdZkM2tM/7ZEFZE=",
|
||||||
|
"dev": true
|
||||||
|
},
|
||||||
"is-number": {
|
"is-number": {
|
||||||
"version": "3.0.0",
|
"version": "3.0.0",
|
||||||
"resolved": "https://registry.npmjs.org/is-number/-/is-number-3.0.0.tgz",
|
"resolved": "https://registry.npmjs.org/is-number/-/is-number-3.0.0.tgz",
|
||||||
|
@ -722,6 +734,12 @@
|
||||||
"integrity": "sha1-s2PlXoAGym/iF4TS2yK9FdeRfxQ=",
|
"integrity": "sha1-s2PlXoAGym/iF4TS2yK9FdeRfxQ=",
|
||||||
"dev": true
|
"dev": true
|
||||||
},
|
},
|
||||||
|
"path-parse": {
|
||||||
|
"version": "1.0.6",
|
||||||
|
"resolved": "https://registry.npmjs.org/path-parse/-/path-parse-1.0.6.tgz",
|
||||||
|
"integrity": "sha512-GSmOT2EbHrINBf9SR7CDELwlJ8AENk3Qn7OikK4nFYAu3Ote2+JYNVvkpAEQm3/TLNEJFD/xZJjzyxg3KBWOzw==",
|
||||||
|
"dev": true
|
||||||
|
},
|
||||||
"posix-character-classes": {
|
"posix-character-classes": {
|
||||||
"version": "0.1.1",
|
"version": "0.1.1",
|
||||||
"resolved": "https://registry.npmjs.org/posix-character-classes/-/posix-character-classes-0.1.1.tgz",
|
"resolved": "https://registry.npmjs.org/posix-character-classes/-/posix-character-classes-0.1.1.tgz",
|
||||||
|
@ -756,6 +774,15 @@
|
||||||
"integrity": "sha1-eZlTn8ngR6N5KPoZb44VY9q9Nt4=",
|
"integrity": "sha1-eZlTn8ngR6N5KPoZb44VY9q9Nt4=",
|
||||||
"dev": true
|
"dev": true
|
||||||
},
|
},
|
||||||
|
"resolve": {
|
||||||
|
"version": "1.10.1",
|
||||||
|
"resolved": "https://registry.npmjs.org/resolve/-/resolve-1.10.1.tgz",
|
||||||
|
"integrity": "sha512-KuIe4mf++td/eFb6wkaPbMDnP6kObCaEtIDuHOUED6MNUo4K670KZUHuuvYPZDxNF0WVLw49n06M2m2dXphEzA==",
|
||||||
|
"dev": true,
|
||||||
|
"requires": {
|
||||||
|
"path-parse": "^1.0.6"
|
||||||
|
}
|
||||||
|
},
|
||||||
"resolve-url": {
|
"resolve-url": {
|
||||||
"version": "0.2.1",
|
"version": "0.2.1",
|
||||||
"resolved": "https://registry.npmjs.org/resolve-url/-/resolve-url-0.2.1.tgz",
|
"resolved": "https://registry.npmjs.org/resolve-url/-/resolve-url-0.2.1.tgz",
|
||||||
|
@ -779,6 +806,17 @@
|
||||||
"acorn": "^6.1.1"
|
"acorn": "^6.1.1"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"rollup-plugin-node-resolve": {
|
||||||
|
"version": "3.4.0",
|
||||||
|
"resolved": "https://registry.npmjs.org/rollup-plugin-node-resolve/-/rollup-plugin-node-resolve-3.4.0.tgz",
|
||||||
|
"integrity": "sha512-PJcd85dxfSBWih84ozRtBkB731OjXk0KnzN0oGp7WOWcarAFkVa71cV5hTJg2qpVsV2U8EUwrzHP3tvy9vS3qg==",
|
||||||
|
"dev": true,
|
||||||
|
"requires": {
|
||||||
|
"builtin-modules": "^2.0.0",
|
||||||
|
"is-module": "^1.0.0",
|
||||||
|
"resolve": "^1.1.6"
|
||||||
|
}
|
||||||
|
},
|
||||||
"rollup-plugin-svelte": {
|
"rollup-plugin-svelte": {
|
||||||
"version": "5.0.3",
|
"version": "5.0.3",
|
||||||
"resolved": "https://registry.npmjs.org/rollup-plugin-svelte/-/rollup-plugin-svelte-5.0.3.tgz",
|
"resolved": "https://registry.npmjs.org/rollup-plugin-svelte/-/rollup-plugin-svelte-5.0.3.tgz",
|
||||||
|
@ -1001,9 +1039,9 @@
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"svelte": {
|
"svelte": {
|
||||||
"version": "2.16.1",
|
"version": "3.1.0",
|
||||||
"resolved": "https://registry.npmjs.org/svelte/-/svelte-2.16.1.tgz",
|
"resolved": "https://registry.npmjs.org/svelte/-/svelte-3.1.0.tgz",
|
||||||
"integrity": "sha512-TpXdfukSkmWkMnH6PPVm7FRW8SSFcTyqBiP+6VN8rtZJ7Lp1Xbf/e3oz73eQBxF0UPZw1aAn1b91lX2XTeD3zg==",
|
"integrity": "sha512-b5TyzV7Dx1ijN4QPNarhKq5rX98QHDmi18nF0G8KV3d5KX3Jj98Yu4+tzM97ktnXcfoVJmvONvPaX1ZI0mr8Dw==",
|
||||||
"dev": true
|
"dev": true
|
||||||
},
|
},
|
||||||
"to-object-path": {
|
"to-object-path": {
|
||||||
|
|
|
@ -1,7 +1,8 @@
|
||||||
{
|
{
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
"rollup": "^1.3.3",
|
"rollup": "^1.3.3",
|
||||||
|
"rollup-plugin-node-resolve": "^3.4.0",
|
||||||
"rollup-plugin-svelte": "^5.0.3",
|
"rollup-plugin-svelte": "^5.0.3",
|
||||||
"svelte": "^2.16.1"
|
"svelte": "^3.1.0"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,4 +1,5 @@
|
||||||
import svelte from 'rollup-plugin-svelte';
|
import svelte from 'rollup-plugin-svelte';
|
||||||
|
import node_resolve from 'rollup-plugin-node-resolve';
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
output: {
|
output: {
|
||||||
|
@ -9,5 +10,6 @@ export default {
|
||||||
include: 'components/**/*.html',
|
include: 'components/**/*.html',
|
||||||
hydratable: true,
|
hydratable: true,
|
||||||
}),
|
}),
|
||||||
|
node_resolve(),
|
||||||
]
|
]
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue