Commit 1006d0c4dde00ee503cde396de716125b96524c1
Dep-eject progress.html.render
Daan Wynen committed on 2/6/2021, 11:22:53 PMParent: b7ed2fc2b4e4dfe51c8192c55195656ab4eb46ca
Files changed
lib/depject/app/html/progress-notifier.js | changed |
lib/depject/index.js | changed |
lib/depject/progress/html/peer.js | changed |
lib/depject/progress/html/render.js | deleted |
lib/progress/html/render.js | added |
lib/depject/app/html/progress-notifier.js | ||
---|---|---|
@@ -6,9 +6,8 @@ | ||
6 | 6 … | exports.gives = nest('app.html.progressNotifier') |
7 | 7 … | |
8 | 8 … | exports.needs = nest({ |
9 | 9 … | 'sbot.pull.stream': 'first', |
10 | - 'progress.html.render': 'first', | |
11 | 10 … | 'progress.obs': { |
12 | 11 … | indexes: 'first', |
13 | 12 … | replicate: 'first', |
14 | 13 … | migration: 'first' |
lib/depject/index.js | ||
---|---|---|
@@ -166,10 +166,9 @@ | ||
166 | 166 … | } |
167 | 167 … | }, |
168 | 168 … | progress: { |
169 | 169 … | html: { |
170 | - peer: require('./progress/html/peer.js'), | |
171 | - render: require('./progress/html/render.js') | |
170 … | + peer: require('./progress/html/peer.js') | |
172 | 171 … | }, |
173 | 172 … | obs: require('./progress/obs.js') |
174 | 173 … | }, |
175 | 174 … | sbot: require('./sbot.js'), |
lib/depject/progress/html/peer.js | ||
---|---|---|
@@ -1,11 +1,11 @@ | ||
1 | 1 … | const { computed, when } = require('mutant') |
2 | 2 … | const nest = require('depnest') |
3 … | +const renderProgress = require('../../../progress/html/render') | |
3 | 4 … | |
4 | 5 … | exports.gives = nest('progress.html.peer') |
5 | 6 … | |
6 | 7 … | exports.needs = nest({ |
7 | - 'progress.html.render': 'first', | |
8 | 8 … | 'progress.obs.peer': 'first', |
9 | 9 … | 'progress.obs.replicate': 'first' |
10 | 10 … | }) |
11 | 11 … | |
@@ -16,7 +16,7 @@ | ||
16 | 16 … | const value = computed([progress, feeds], (pending, feeds) => { |
17 | 17 … | return (feeds - pending) / feeds |
18 | 18 … | }) |
19 | 19 … | |
20 | - return api.progress.html.render(value, when(progress, '-pending')) | |
20 … | + return renderProgress(value, when(progress, '-pending')) | |
21 | 21 … | }) |
22 | 22 … | } |
lib/depject/progress/html/render.js | ||
---|---|---|
@@ -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.js | ||
---|---|---|
@@ -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