git ssb

1+

Daan Patchwork / patchwork



Commit 1006d0c4dde00ee503cde396de716125b96524c1

Dep-eject progress.html.render

Daan Wynen committed on 2/6/2021, 11:22:53 PM
Parent: b7ed2fc2b4e4dfe51c8192c55195656ab4eb46ca

Files changed

lib/depject/app/html/progress-notifier.jschanged
lib/depject/index.jschanged
lib/depject/progress/html/peer.jschanged
lib/depject/progress/html/render.jsdeleted
lib/progress/html/render.jsadded
lib/depject/app/html/progress-notifier.jsView
@@ -6,9 +6,8 @@
66 exports.gives = nest('app.html.progressNotifier')
77
88 exports.needs = nest({
99 'sbot.pull.stream': 'first',
10- 'progress.html.render': 'first',
1110 'progress.obs': {
1211 indexes: 'first',
1312 replicate: 'first',
1413 migration: 'first'
lib/depject/index.jsView
@@ -166,10 +166,9 @@
166166 }
167167 },
168168 progress: {
169169 html: {
170- peer: require('./progress/html/peer.js'),
171- render: require('./progress/html/render.js')
170 + peer: require('./progress/html/peer.js')
172171 },
173172 obs: require('./progress/obs.js')
174173 },
175174 sbot: require('./sbot.js'),
lib/depject/progress/html/peer.jsView
@@ -1,11 +1,11 @@
11 const { computed, when } = require('mutant')
22 const nest = require('depnest')
3 +const renderProgress = require('../../../progress/html/render')
34
45 exports.gives = nest('progress.html.peer')
56
67 exports.needs = nest({
7- 'progress.html.render': 'first',
88 'progress.obs.peer': 'first',
99 'progress.obs.replicate': 'first'
1010 })
1111
@@ -16,7 +16,7 @@
1616 const value = computed([progress, feeds], (pending, feeds) => {
1717 return (feeds - pending) / feeds
1818 })
1919
20- return api.progress.html.render(value, when(progress, '-pending'))
20 + return renderProgress(value, when(progress, '-pending'))
2121 })
2222 }
lib/depject/progress/html/render.jsView
@@ -1,37 +1,0 @@
1-const svg = require('mutant/svg-element')
2-const computed = require('mutant/computed')
3-const when = require('mutant/when')
4-const nest = require('depnest')
5-
6-exports.gives = nest('progress.html.render')
7-
8-exports.create = function () {
9- return nest('progress.html.render', function (pos, classList) {
10- const pending = computed(pos, x => x > 0 && x < 1)
11- return svg('svg RadialProgress', {
12- viewBox: '-20 -20 240 240',
13- classList
14- }, [
15- svg('path', {
16- d: 'M100,0 a100,100 0 0 1 0,200 a100,100 0 0 1 0,-200',
17- 'stroke-width': 40,
18- stroke: '#CEC',
19- fill: 'none'
20- }),
21- svg('path', {
22- d: 'M100,0 a100,100 0 0 1 0,200 a100,100 0 0 1 0,-200',
23- 'stroke-dashoffset': computed(pos, (pos) => {
24- pos = Math.min(Math.max(pos, 0), 1)
25- return (1 - pos) * 629
26- }),
27- style: {
28- transition: when(pending, 'stroke-dashoffset 0.1s', 'stroke-dashoffset 0')
29- },
30- 'stroke-width': 40,
31- 'stroke-dasharray': 629,
32- stroke: '#33DA33',
33- fill: 'none'
34- })
35- ])
36- })
37-}
lib/progress/html/render.jsView
@@ -1,0 +1,32 @@
1 +const svg = require('mutant/svg-element')
2 +const computed = require('mutant/computed')
3 +const when = require('mutant/when')
4 +
5 +module.exports = function (pos, classList) {
6 + const pending = computed(pos, x => x > 0 && x < 1)
7 + return svg('svg RadialProgress', {
8 + viewBox: '-20 -20 240 240',
9 + classList
10 + }, [
11 + svg('path', {
12 + d: 'M100,0 a100,100 0 0 1 0,200 a100,100 0 0 1 0,-200',
13 + 'stroke-width': 40,
14 + stroke: '#CEC',
15 + fill: 'none'
16 + }),
17 + svg('path', {
18 + d: 'M100,0 a100,100 0 0 1 0,200 a100,100 0 0 1 0,-200',
19 + 'stroke-dashoffset': computed(pos, (pos) => {
20 + pos = Math.min(Math.max(pos, 0), 1)
21 + return (1 - pos) * 629
22 + }),
23 + style: {
24 + transition: when(pending, 'stroke-dashoffset 0.1s', 'stroke-dashoffset 0')
25 + },
26 + 'stroke-width': 40,
27 + 'stroke-dasharray': 629,
28 + stroke: '#33DA33',
29 + fill: 'none'
30 + })
31 + ])
32 +}

Built with git-ssb-web