tranfi 0.0.2 → 0.1.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +395 -0
- package/app/assets/index-6quYZ5Ap.css +5 -0
- package/app/assets/index-pDFMluyz.js +160 -0
- package/app/assets/materialdesignicons-webfont-B7mPwVP_.ttf +0 -0
- package/app/assets/materialdesignicons-webfont-CSr8KVlo.eot +0 -0
- package/app/assets/materialdesignicons-webfont-Dp5v-WZN.woff2 +0 -0
- package/app/assets/materialdesignicons-webfont-PXm3-2wK.woff +0 -0
- package/app/index.html +13 -0
- package/binding.gyp +69 -0
- package/csrc/arena.c +91 -0
- package/csrc/batch.c +229 -0
- package/csrc/buffer.c +78 -0
- package/csrc/cJSON.c +3143 -0
- package/csrc/cJSON.h +300 -0
- package/csrc/codec_csv.c +1058 -0
- package/csrc/codec_jsonl.c +374 -0
- package/csrc/codec_table.c +218 -0
- package/csrc/codec_text.c +229 -0
- package/csrc/compiler.c +102 -0
- package/csrc/date_utils.h +94 -0
- package/csrc/dsl.c +1180 -0
- package/csrc/dsl.h +22 -0
- package/csrc/expr.c +1245 -0
- package/csrc/expr.h +56 -0
- package/csrc/internal.h +250 -0
- package/csrc/ir.c +119 -0
- package/csrc/ir.h +167 -0
- package/csrc/ir_schema.c +60 -0
- package/csrc/ir_serialize.c +104 -0
- package/csrc/ir_sql.c +1211 -0
- package/csrc/ir_validate.c +120 -0
- package/csrc/main.c +392 -0
- package/csrc/op_acf.c +133 -0
- package/csrc/op_anomaly.c +120 -0
- package/csrc/op_bin.c +109 -0
- package/csrc/op_cast.c +195 -0
- package/csrc/op_clip.c +88 -0
- package/csrc/op_date_trunc.c +181 -0
- package/csrc/op_datetime.c +212 -0
- package/csrc/op_derive.c +248 -0
- package/csrc/op_diff.c +134 -0
- package/csrc/op_ewma.c +103 -0
- package/csrc/op_explode.c +108 -0
- package/csrc/op_fill_down.c +163 -0
- package/csrc/op_fill_null.c +123 -0
- package/csrc/op_filter.c +132 -0
- package/csrc/op_frequency.c +193 -0
- package/csrc/op_grep.c +163 -0
- package/csrc/op_group_agg.c +285 -0
- package/csrc/op_hash.c +126 -0
- package/csrc/op_head.c +149 -0
- package/csrc/op_interpolate.c +239 -0
- package/csrc/op_join.c +384 -0
- package/csrc/op_label_encode.c +144 -0
- package/csrc/op_lead.c +190 -0
- package/csrc/op_normalize.c +226 -0
- package/csrc/op_onehot.c +185 -0
- package/csrc/op_pivot.c +370 -0
- package/csrc/op_registry.c +1148 -0
- package/csrc/op_rename.c +138 -0
- package/csrc/op_replace.c +202 -0
- package/csrc/op_sample.c +101 -0
- package/csrc/op_select.c +140 -0
- package/csrc/op_skip.c +152 -0
- package/csrc/op_sort.c +273 -0
- package/csrc/op_split.c +114 -0
- package/csrc/op_split_data.c +87 -0
- package/csrc/op_stack.c +315 -0
- package/csrc/op_stats.c +779 -0
- package/csrc/op_step.c +171 -0
- package/csrc/op_tail.c +96 -0
- package/csrc/op_top.c +150 -0
- package/csrc/op_trim.c +109 -0
- package/csrc/op_unique.c +300 -0
- package/csrc/op_unpivot.c +159 -0
- package/csrc/op_validate.c +71 -0
- package/csrc/op_window.c +150 -0
- package/csrc/pipeline.c +315 -0
- package/csrc/plan.c +206 -0
- package/csrc/recipes.c +102 -0
- package/csrc/recipes.h +27 -0
- package/csrc/report.c +463 -0
- package/csrc/report.h +22 -0
- package/csrc/tranfi.h +123 -0
- package/csrc/wasm_api.c +157 -0
- package/napi_api.c +326 -0
- package/package.json +46 -57
- package/src/cli.js +193 -0
- package/src/engines/duckdb.js +109 -0
- package/src/index.js +306 -0
- package/src/native.js +22 -0
- package/src/pipeline.js +286 -0
- package/src/server.js +277 -0
- package/src/wasm.js +19 -0
- package/wasm/index.js +244 -0
- package/wasm/package.json +1 -0
- package/wasm/tranfi_core.js +0 -0
- package/LICENSE +0 -21
- package/dist/bundle.js +0 -1
- package/index.html +0 -18
- package/src/app.css +0 -169
- package/src/app.js +0 -203
- package/src/app.vue +0 -250
- package/src/bulma-input.vue +0 -110
- package/src/common-inputs.js +0 -28
- package/src/main.js +0 -20
- package/src/transforms.js +0 -166
- package/webpack.config.js +0 -108
package/index.html
DELETED
|
@@ -1,18 +0,0 @@
|
|
|
1
|
-
<!DOCTYPE html>
|
|
2
|
-
<html>
|
|
3
|
-
<head>
|
|
4
|
-
<meta charset="utf-8" />
|
|
5
|
-
<meta name="viewport" content="width=device-width" />
|
|
6
|
-
<title>Tranfi</title>
|
|
7
|
-
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bulma@0.9.3/css/bulma.min.css">
|
|
8
|
-
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Material+Icons|Material+Icons+Outlined">
|
|
9
|
-
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@mdi/font@6.5.95/css/materialdesignicons.min.css">
|
|
10
|
-
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@5.15.4/css/fontawesome.min.css">
|
|
11
|
-
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;900&display=swap" rel="stylesheet">
|
|
12
|
-
</head>
|
|
13
|
-
<body>
|
|
14
|
-
<div id="progress"></div>
|
|
15
|
-
<div id="tranfi-container"></div>
|
|
16
|
-
<script src="dist/bundle.js"></script>
|
|
17
|
-
</body>
|
|
18
|
-
</html>
|
package/src/app.css
DELETED
|
@@ -1,169 +0,0 @@
|
|
|
1
|
-
html, body {
|
|
2
|
-
font-family: sans-serif;
|
|
3
|
-
overflow-x: auto;
|
|
4
|
-
overflow-y: auto;
|
|
5
|
-
}
|
|
6
|
-
|
|
7
|
-
.navbar-brand {
|
|
8
|
-
align-items: center;
|
|
9
|
-
justify-content: space-between;
|
|
10
|
-
}
|
|
11
|
-
|
|
12
|
-
.logo {
|
|
13
|
-
color: white;
|
|
14
|
-
border-bottom: 1.5px solid white;
|
|
15
|
-
border-top: 1.5px solid white;
|
|
16
|
-
padding-left: 55px;
|
|
17
|
-
font-weight: 500;
|
|
18
|
-
text-transform: uppercase;
|
|
19
|
-
}
|
|
20
|
-
|
|
21
|
-
.pipeline {
|
|
22
|
-
min-height: calc(100vh - 77px);
|
|
23
|
-
background: #f2f2f2;
|
|
24
|
-
}
|
|
25
|
-
|
|
26
|
-
.pipeline .card.active .card-content, .card.active .card-footer {
|
|
27
|
-
display: flex;
|
|
28
|
-
}
|
|
29
|
-
|
|
30
|
-
.pipeline .card .card-content, .card .card-footer {
|
|
31
|
-
display: none;
|
|
32
|
-
}
|
|
33
|
-
|
|
34
|
-
.pipeline .card .card-header-title {
|
|
35
|
-
cursor: move;
|
|
36
|
-
cursor: grab;
|
|
37
|
-
cursor: -moz-grab;
|
|
38
|
-
cursor: -webkit-grab;
|
|
39
|
-
}
|
|
40
|
-
|
|
41
|
-
.pipeline .card .card-header-title:active {
|
|
42
|
-
cursor: grabbing;
|
|
43
|
-
cursor: -moz-grabbing;
|
|
44
|
-
cursor: -webkit-grabbing;
|
|
45
|
-
}
|
|
46
|
-
|
|
47
|
-
.columns {
|
|
48
|
-
margin: 0;
|
|
49
|
-
}
|
|
50
|
-
|
|
51
|
-
.columns:last-child {
|
|
52
|
-
margin-bottom: 0;
|
|
53
|
-
}
|
|
54
|
-
|
|
55
|
-
.column {
|
|
56
|
-
padding: 10px;
|
|
57
|
-
}
|
|
58
|
-
|
|
59
|
-
.it-drawer-body--left {
|
|
60
|
-
top: 100px !important;
|
|
61
|
-
height: calc(100% - 120px) !important;
|
|
62
|
-
}
|
|
63
|
-
|
|
64
|
-
.mainbar-left {
|
|
65
|
-
padding-top: 12px;
|
|
66
|
-
background-color: #222326;
|
|
67
|
-
}
|
|
68
|
-
|
|
69
|
-
.mainbar-right {
|
|
70
|
-
background-color: #2b2e35;
|
|
71
|
-
align-items: stretch;
|
|
72
|
-
display: flex;
|
|
73
|
-
}
|
|
74
|
-
|
|
75
|
-
.mainbar-right .navbar-start{
|
|
76
|
-
justify-content: flex-start;
|
|
77
|
-
margin-right: auto;
|
|
78
|
-
align-items: stretch;
|
|
79
|
-
display: flex;
|
|
80
|
-
}
|
|
81
|
-
|
|
82
|
-
.mainbar-right .navbar-item {
|
|
83
|
-
align-items: center;
|
|
84
|
-
display: flex;
|
|
85
|
-
color: white;
|
|
86
|
-
}
|
|
87
|
-
|
|
88
|
-
.mainbar-right input {
|
|
89
|
-
background: #222326;
|
|
90
|
-
border: none;
|
|
91
|
-
color: #c3c6ce;
|
|
92
|
-
}
|
|
93
|
-
|
|
94
|
-
.mainbar-right input::placeholder {
|
|
95
|
-
color: #6b6f79;
|
|
96
|
-
}
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
.mainbar-title {
|
|
100
|
-
font-weight: 500;
|
|
101
|
-
font-size: 16px;
|
|
102
|
-
}
|
|
103
|
-
|
|
104
|
-
.navbar-item {
|
|
105
|
-
padding: .5rem 0.4rem;
|
|
106
|
-
}
|
|
107
|
-
|
|
108
|
-
.breadcrumb {
|
|
109
|
-
margin: 6px auto 13px !important;
|
|
110
|
-
opacity: 0.5;
|
|
111
|
-
font-size: 12px;
|
|
112
|
-
}
|
|
113
|
-
|
|
114
|
-
.preview-panel {
|
|
115
|
-
max-width: 400px;
|
|
116
|
-
margin: 25px auto;
|
|
117
|
-
}
|
|
118
|
-
|
|
119
|
-
/*
|
|
120
|
-
.mainbar-title:before {
|
|
121
|
-
content: '> ';
|
|
122
|
-
opacity: 0.4;
|
|
123
|
-
margin-right: 10px;
|
|
124
|
-
display: inline-block;
|
|
125
|
-
font-weight: 200;
|
|
126
|
-
}
|
|
127
|
-
*/
|
|
128
|
-
|
|
129
|
-
hr {
|
|
130
|
-
height: 1px;
|
|
131
|
-
margin: 0.2rem 0;
|
|
132
|
-
}
|
|
133
|
-
|
|
134
|
-
.preview-button {
|
|
135
|
-
min-width: 100px;
|
|
136
|
-
}
|
|
137
|
-
|
|
138
|
-
.preview-content pre {
|
|
139
|
-
background: none;
|
|
140
|
-
font-size: 12px;
|
|
141
|
-
}
|
|
142
|
-
|
|
143
|
-
#progress {
|
|
144
|
-
background: #00d1b2;
|
|
145
|
-
position: fixed;
|
|
146
|
-
top: 0;
|
|
147
|
-
left: 0;
|
|
148
|
-
height: 3px;
|
|
149
|
-
z-index: 1000;
|
|
150
|
-
}
|
|
151
|
-
|
|
152
|
-
@media screen and (max-width:768px) {
|
|
153
|
-
.mainbar-left {
|
|
154
|
-
display: none;
|
|
155
|
-
}
|
|
156
|
-
|
|
157
|
-
.desktop-only {
|
|
158
|
-
display: none;
|
|
159
|
-
}
|
|
160
|
-
|
|
161
|
-
.preview-button {
|
|
162
|
-
min-width: 0px;
|
|
163
|
-
}
|
|
164
|
-
|
|
165
|
-
.button.mobile-flexible .icon {
|
|
166
|
-
margin-left: calc(-.5em - 1px) !important;
|
|
167
|
-
margin-right: calc(-.5em - 1px) !important;
|
|
168
|
-
}
|
|
169
|
-
}
|
package/src/app.js
DELETED
|
@@ -1,203 +0,0 @@
|
|
|
1
|
-
const through2 = require('through2')
|
|
2
|
-
const transforms = require('./transforms')
|
|
3
|
-
|
|
4
|
-
async function run (pipeline, isBatch) {
|
|
5
|
-
let readStream
|
|
6
|
-
let writeStream
|
|
7
|
-
|
|
8
|
-
for (const transform of pipeline) {
|
|
9
|
-
// Convert inputs to params object
|
|
10
|
-
const params = {}
|
|
11
|
-
transform.inputs.forEach(i => {
|
|
12
|
-
params[i.name] = i.type === 'file' ? i.file : i.value
|
|
13
|
-
})
|
|
14
|
-
// Init stream
|
|
15
|
-
let nextStream = await transforms[transform.name].initStream(params)
|
|
16
|
-
if (typeof readStream === 'undefined') {
|
|
17
|
-
readStream = writeStream = nextStream
|
|
18
|
-
if ('File' in params) {
|
|
19
|
-
let size = params['File'].size
|
|
20
|
-
let progressBytes = 0
|
|
21
|
-
let progressBar = document.getElementById('progress')
|
|
22
|
-
progressBar.style.display = 'initial'
|
|
23
|
-
const progressStream = through2(function (chunk, enc, callback) {
|
|
24
|
-
progressBytes += chunk.length
|
|
25
|
-
let progressPercents = ((progressBytes / size) * 100).toFixed(1)
|
|
26
|
-
progressBar.style.width = progressPercents + '%'
|
|
27
|
-
this.push(chunk)
|
|
28
|
-
callback()
|
|
29
|
-
})
|
|
30
|
-
writeStream = writeStream.pipe(progressStream)
|
|
31
|
-
}
|
|
32
|
-
} else {
|
|
33
|
-
writeStream = writeStream.pipe(nextStream) //, {end: false})
|
|
34
|
-
}
|
|
35
|
-
}
|
|
36
|
-
|
|
37
|
-
writeStream.on('data', (piece) => {
|
|
38
|
-
if (isBatch) {
|
|
39
|
-
console.log('Pausing stream')
|
|
40
|
-
readStream.pause()
|
|
41
|
-
}
|
|
42
|
-
})
|
|
43
|
-
|
|
44
|
-
return {readStream, writeStream}
|
|
45
|
-
}
|
|
46
|
-
|
|
47
|
-
function resetInputs (inputs) {
|
|
48
|
-
inputs.forEach(input => {
|
|
49
|
-
if (input.default) {
|
|
50
|
-
input.value = input.default
|
|
51
|
-
} else {
|
|
52
|
-
switch (input.type) {
|
|
53
|
-
case 'int':
|
|
54
|
-
case 'float':
|
|
55
|
-
case 'number':
|
|
56
|
-
input.value = 0
|
|
57
|
-
break
|
|
58
|
-
case 'string':
|
|
59
|
-
case 'text':
|
|
60
|
-
input.value = ''
|
|
61
|
-
break
|
|
62
|
-
case 'color':
|
|
63
|
-
input.value = '#000000'
|
|
64
|
-
break
|
|
65
|
-
case 'categorical':
|
|
66
|
-
case 'select':
|
|
67
|
-
input.value = input.options ? input.options[0] : ''
|
|
68
|
-
break
|
|
69
|
-
case 'bool':
|
|
70
|
-
case 'checkbox':
|
|
71
|
-
input.value = false
|
|
72
|
-
break
|
|
73
|
-
case 'file':
|
|
74
|
-
input.file = null
|
|
75
|
-
input.value = ''
|
|
76
|
-
break
|
|
77
|
-
case 'group':
|
|
78
|
-
resetInputs(input.elements)
|
|
79
|
-
break
|
|
80
|
-
default:
|
|
81
|
-
input.value = ''
|
|
82
|
-
}
|
|
83
|
-
}
|
|
84
|
-
})
|
|
85
|
-
}
|
|
86
|
-
|
|
87
|
-
let readStream = null
|
|
88
|
-
let writeStream = null
|
|
89
|
-
export default {
|
|
90
|
-
components: {
|
|
91
|
-
// draggable,
|
|
92
|
-
// 'vue-input': bulmaInput
|
|
93
|
-
},
|
|
94
|
-
data() {
|
|
95
|
-
return {
|
|
96
|
-
drag: false,
|
|
97
|
-
preview: false,
|
|
98
|
-
loadedAllData: true,
|
|
99
|
-
title: '',
|
|
100
|
-
showResults: false,
|
|
101
|
-
modalAddTransforms: false,
|
|
102
|
-
counter: 0,
|
|
103
|
-
transforms: transforms,
|
|
104
|
-
pipeline: []
|
|
105
|
-
}
|
|
106
|
-
},
|
|
107
|
-
methods: {
|
|
108
|
-
getTransformIndex (t) {
|
|
109
|
-
return this.pipeline.findIndex((el) => el.id === t.id)
|
|
110
|
-
},
|
|
111
|
-
cloneTransform (t) {
|
|
112
|
-
const i = this.getTransformIndex(t)
|
|
113
|
-
const newTransform = JSON.parse(JSON.stringify(t))
|
|
114
|
-
newTransform.id = this.counter
|
|
115
|
-
this.counter += 1
|
|
116
|
-
this.pipeline.splice(i + 1, 0, newTransform)
|
|
117
|
-
},
|
|
118
|
-
resetTransform (t) {
|
|
119
|
-
resetInputs(t.inputs)
|
|
120
|
-
},
|
|
121
|
-
deleteTransform (t) {
|
|
122
|
-
const i = this.getTransformIndex(t)
|
|
123
|
-
this.pipeline.splice(i, 1)
|
|
124
|
-
},
|
|
125
|
-
showLoading (p) {
|
|
126
|
-
this.$Loading.update(p)
|
|
127
|
-
},
|
|
128
|
-
addTransform (Transform) {
|
|
129
|
-
const newTransform = new Transform(this.counter)
|
|
130
|
-
this.resetTransform(newTransform)
|
|
131
|
-
this.pipeline.push(newTransform)
|
|
132
|
-
this.modalAddTransforms = false
|
|
133
|
-
this.counter += 1
|
|
134
|
-
},
|
|
135
|
-
showMessage (type) {
|
|
136
|
-
switch (type) {
|
|
137
|
-
case 'success':
|
|
138
|
-
this.$Message.success({ text: 'Success message!' })
|
|
139
|
-
break
|
|
140
|
-
case 'danger':
|
|
141
|
-
this.$Message.danger({ text: 'Danger message!' })
|
|
142
|
-
break
|
|
143
|
-
case 'warning':
|
|
144
|
-
this.$Message.warning({ text: 'Success message!' })
|
|
145
|
-
break
|
|
146
|
-
default:
|
|
147
|
-
this.$Message({ text: 'Primary message!' })
|
|
148
|
-
break
|
|
149
|
-
}
|
|
150
|
-
},
|
|
151
|
-
run (isBatch) {
|
|
152
|
-
run(this.pipeline, isBatch).then(streams => {
|
|
153
|
-
this.loadedAllData = false
|
|
154
|
-
readStream = streams.readStream
|
|
155
|
-
readStream.on('end', function () {
|
|
156
|
-
this.loadedAllData = true
|
|
157
|
-
console.log('End of stream')
|
|
158
|
-
let progressBar = document.getElementById('progress')
|
|
159
|
-
progressBar.style.display = 'none'
|
|
160
|
-
})
|
|
161
|
-
})
|
|
162
|
-
},
|
|
163
|
-
runMore () {
|
|
164
|
-
readStream.resume()
|
|
165
|
-
}
|
|
166
|
-
},
|
|
167
|
-
watch: {
|
|
168
|
-
// pipeline: {
|
|
169
|
-
// handler (pipeline) {
|
|
170
|
-
// this.env.data.inputs = pipeline.map((v, i) => ({type: 'int', name: v.name}))
|
|
171
|
-
// },
|
|
172
|
-
// deep: true
|
|
173
|
-
// }
|
|
174
|
-
},
|
|
175
|
-
computed: {
|
|
176
|
-
// a computed getter
|
|
177
|
-
displayInputs() {
|
|
178
|
-
const inputs = []
|
|
179
|
-
this.pipeline.forEach(transform => {
|
|
180
|
-
transform.displayInputs.forEach(i => {
|
|
181
|
-
inputs.push(transform.inputs[i])
|
|
182
|
-
})
|
|
183
|
-
})
|
|
184
|
-
return inputs
|
|
185
|
-
}
|
|
186
|
-
},
|
|
187
|
-
mounted () {
|
|
188
|
-
// const tranfi = this
|
|
189
|
-
// this.env = new JSEE({
|
|
190
|
-
// model: {
|
|
191
|
-
// code: function run (params) {
|
|
192
|
-
// tranfi.run(params)
|
|
193
|
-
// },
|
|
194
|
-
// worker: false
|
|
195
|
-
// },
|
|
196
|
-
// design: {
|
|
197
|
-
// grid: [6, 12]
|
|
198
|
-
// },
|
|
199
|
-
// inputs: []
|
|
200
|
-
// }, "#jsee-container")
|
|
201
|
-
}
|
|
202
|
-
}
|
|
203
|
-
|
package/src/app.vue
DELETED
|
@@ -1,250 +0,0 @@
|
|
|
1
|
-
<template>
|
|
2
|
-
<div>
|
|
3
|
-
|
|
4
|
-
<it-drawer placement="left" v-model="modalAddTransforms">
|
|
5
|
-
<nav class="panel">
|
|
6
|
-
<!--
|
|
7
|
-
<p class="panel-tabs">
|
|
8
|
-
<a class="is-active">All</a>
|
|
9
|
-
<a>Public</a>
|
|
10
|
-
<a>Private</a>
|
|
11
|
-
</p>
|
|
12
|
-
-->
|
|
13
|
-
<a class="panel-block" v-for="(Transform, i) in transforms" :key="i" @click="addTransform(Transform)">
|
|
14
|
-
<span class="panel-icon">
|
|
15
|
-
<i class="mdi mdi-import" aria-hidden="true" v-if="Transform.type === 'loader'"></i>
|
|
16
|
-
<i class="mdi mdi-shape" aria-hidden="true" v-if="Transform.type === 'parser'"></i>
|
|
17
|
-
<i class="mdi mdi-play-box-outline" aria-hidden="true" v-if="Transform.type === 'output'"></i>
|
|
18
|
-
</span>
|
|
19
|
-
{{ Transform.name }}
|
|
20
|
-
</a>
|
|
21
|
-
</nav>
|
|
22
|
-
</it-drawer>
|
|
23
|
-
|
|
24
|
-
<nav class="mainbar" role="navigation" aria-label="main navigation" style="background: #e6e6e6; position: fixed; width: 100%; top: 0; left: 0; z-index: 100">
|
|
25
|
-
<div class="columns">
|
|
26
|
-
<div class="column is-3 mainbar-left" v-if="!preview">
|
|
27
|
-
<div class="navbar-brand">
|
|
28
|
-
<span class="logo">Tranfi</span>
|
|
29
|
-
<button class="button is-primary is-outlined" @click="modalAddTransforms = true">
|
|
30
|
-
<span class="icon is-small">
|
|
31
|
-
<i class="mdi mdi-playlist-plus" aria-hidden="true"></i>
|
|
32
|
-
</span>
|
|
33
|
-
</button>
|
|
34
|
-
</div>
|
|
35
|
-
</div>
|
|
36
|
-
<div class="column mainbar-right" v-bind:class="{ 'is-9': !preview, 'is-12': preview }">
|
|
37
|
-
<div class="navbar-start">
|
|
38
|
-
<div class="navbar-item mainbar-title">
|
|
39
|
-
<span v-if="preview">{{ title }}</span>
|
|
40
|
-
<input class="input" type="text" v-model="title" placeholder="Title..." v-else>
|
|
41
|
-
</div>
|
|
42
|
-
</div>
|
|
43
|
-
<div class="navbar-end">
|
|
44
|
-
<div class="navbar-item">
|
|
45
|
-
<div class="buttons">
|
|
46
|
-
<a class="button is-light is-outlined mobile-flexible" v-if="pipeline.length">
|
|
47
|
-
<span class="icon is-small">
|
|
48
|
-
<i class="mdi mdi-content-save" aria-hidden="true"></i>
|
|
49
|
-
</span>
|
|
50
|
-
<span class="desktop-only">
|
|
51
|
-
Save pipeline
|
|
52
|
-
</span>
|
|
53
|
-
</a>
|
|
54
|
-
<a class="button is-light is-outlined preview-button mobile-flexible" @click="preview=true" v-if="!preview">
|
|
55
|
-
<span class="icon is-small">
|
|
56
|
-
<i class="mdi mdi-eye" aria-hidden="true"></i>
|
|
57
|
-
</span>
|
|
58
|
-
<span class="desktop-only">
|
|
59
|
-
View
|
|
60
|
-
</span>
|
|
61
|
-
</a>
|
|
62
|
-
<a class="button is-light is-outlined preview-button mobile-flexible" @click="preview=false" v-if="preview">
|
|
63
|
-
<span class="icon is-small">
|
|
64
|
-
<i class="mdi mdi-pencil" aria-hidden="true"></i>
|
|
65
|
-
</span>
|
|
66
|
-
<span class="desktop-only">
|
|
67
|
-
Edit
|
|
68
|
-
</span>
|
|
69
|
-
</a>
|
|
70
|
-
</div>
|
|
71
|
-
</div>
|
|
72
|
-
</div>
|
|
73
|
-
</div>
|
|
74
|
-
</div>
|
|
75
|
-
</nav>
|
|
76
|
-
|
|
77
|
-
<div class="columns" style="margin-top: 77px">
|
|
78
|
-
<div class="pipeline column is-3" v-if="!preview">
|
|
79
|
-
|
|
80
|
-
<draggable
|
|
81
|
-
v-model="pipeline"
|
|
82
|
-
@start="drag=true"
|
|
83
|
-
@end="drag=false"
|
|
84
|
-
item-key="id"
|
|
85
|
-
handle=".card-header"
|
|
86
|
-
>
|
|
87
|
-
<template #item="{element}">
|
|
88
|
-
<div>
|
|
89
|
-
<div class="card" v-bind:class="{ active: element.expanded }">
|
|
90
|
-
<header class="card-header">
|
|
91
|
-
<p class="card-header-title">
|
|
92
|
-
{{ element.name }}
|
|
93
|
-
</p>
|
|
94
|
-
<button class="card-header-icon" aria-label="more options" v-on:click="element.expanded = !element.expanded">
|
|
95
|
-
<span class="icon">
|
|
96
|
-
<i class="mdi mdi-chevron-up" aria-hidden="true" v-if="element.expanded"></i>
|
|
97
|
-
<i class="mdi mdi-chevron-down" aria-hidden="true" v-else></i>
|
|
98
|
-
</span>
|
|
99
|
-
</button>
|
|
100
|
-
</header>
|
|
101
|
-
<div class="card-content" >
|
|
102
|
-
<ul>
|
|
103
|
-
<li v-for="(input, index) in element.inputs">
|
|
104
|
-
<vue-input v-bind:input="input"></vue-input>
|
|
105
|
-
</li>
|
|
106
|
-
<li v-if="element.inputs.length">
|
|
107
|
-
<div class="field">
|
|
108
|
-
<label v-bind:for="'disp' + element.id" class="is-size-7">Display on preview:</label>
|
|
109
|
-
<div class="control">
|
|
110
|
-
<div class="select is-multiple">
|
|
111
|
-
<select
|
|
112
|
-
v-model="element.displayInputs"
|
|
113
|
-
v-bind:id="'disp' + element.id"
|
|
114
|
-
multiple
|
|
115
|
-
size="3"
|
|
116
|
-
>
|
|
117
|
-
<option v-for="(input, index) in element.inputs" v-bind:value="index">
|
|
118
|
-
{{ input.name }}
|
|
119
|
-
</option>
|
|
120
|
-
</select>
|
|
121
|
-
</div>
|
|
122
|
-
</div>
|
|
123
|
-
</div>
|
|
124
|
-
</li>
|
|
125
|
-
<li>
|
|
126
|
-
<pre style="font-size: 10px;">{{ element }}</pre>
|
|
127
|
-
</li>
|
|
128
|
-
</ul>
|
|
129
|
-
</div>
|
|
130
|
-
<footer class="card-footer">
|
|
131
|
-
<a class="card-footer-item" @click="cloneTransform(element)">Clone</a>
|
|
132
|
-
<a class="card-footer-item" @click="resetTransform(element)">Reset</a>
|
|
133
|
-
<a class="card-footer-item" @click="deleteTransform(element)">Delete</a>
|
|
134
|
-
</footer>
|
|
135
|
-
</div>
|
|
136
|
-
<p style="text-align: center; font-size: 11px; color: #AAA;">
|
|
137
|
-
<span> ↓ </span>
|
|
138
|
-
<small>{{ element.outputType }}</small>
|
|
139
|
-
</p>
|
|
140
|
-
</div>
|
|
141
|
-
</template>
|
|
142
|
-
</draggable>
|
|
143
|
-
|
|
144
|
-
<button
|
|
145
|
-
@click="modalAddTransforms = true"
|
|
146
|
-
class="button is-primary is-outlined is-fullwidth"
|
|
147
|
-
style="margin-bottom: 10px; min-height: 45px;"
|
|
148
|
-
>
|
|
149
|
-
<span class="icon is-small">
|
|
150
|
-
<i class="mdi mdi-playlist-plus" aria-hidden="true"></i>
|
|
151
|
-
</span>
|
|
152
|
-
<span>
|
|
153
|
-
Add stream
|
|
154
|
-
</span>
|
|
155
|
-
</button>
|
|
156
|
-
|
|
157
|
-
</div>
|
|
158
|
-
|
|
159
|
-
<div class="column preview-content" v-bind:class="{ 'is-9': !preview, 'is-12': preview }">
|
|
160
|
-
|
|
161
|
-
<nav class="breadcrumb has-arrow-separator" aria-label="breadcrumbs">
|
|
162
|
-
<ul>
|
|
163
|
-
<li v-for="transform in pipeline"> {{ transform.name }} </li>
|
|
164
|
-
</ul>
|
|
165
|
-
</nav>
|
|
166
|
-
|
|
167
|
-
<hr v-if="pipeline.length">
|
|
168
|
-
|
|
169
|
-
<nav class="panel preview-panel" v-if="pipeline.length">
|
|
170
|
-
<div class="panel-block" v-for="(input, index) in displayInputs">
|
|
171
|
-
<vue-input v-bind:input="input"></vue-input>
|
|
172
|
-
</div>
|
|
173
|
-
<div class="panel-block" v-if="pipeline.length">
|
|
174
|
-
<button class="button is-primary is-outlined is-fullwidth" @click="run(true)">
|
|
175
|
-
<span class="icon is-small">
|
|
176
|
-
<i class="mdi mdi-play-pause" aria-hidden="true"></i>
|
|
177
|
-
</span>
|
|
178
|
-
<span>
|
|
179
|
-
Load batch
|
|
180
|
-
</span>
|
|
181
|
-
</button>
|
|
182
|
-
</div>
|
|
183
|
-
<div class="panel-block" v-if="pipeline.length">
|
|
184
|
-
<button class="button is-primary is-large is-fullwidth" @click="run(false)">
|
|
185
|
-
<span class="icon is-small">
|
|
186
|
-
<i class="mdi mdi-play" aria-hidden="true"></i>
|
|
187
|
-
</span>
|
|
188
|
-
<span>
|
|
189
|
-
Load all
|
|
190
|
-
</span>
|
|
191
|
-
</button>
|
|
192
|
-
</div>
|
|
193
|
-
</nav>
|
|
194
|
-
|
|
195
|
-
<hr v-if="pipeline.length">
|
|
196
|
-
|
|
197
|
-
<pre id="text-output" style="display: none;"></pre>
|
|
198
|
-
|
|
199
|
-
<hr v-if="pipeline.length && (!loadedAllData)">
|
|
200
|
-
|
|
201
|
-
<nav class="panel preview-panel" v-if="pipeline.length && (!loadedAllData)">
|
|
202
|
-
<div class="panel-block" v-if="pipeline.length">
|
|
203
|
-
<button class="button is-primary is-outlined is-fullwidth" @click="runMore">
|
|
204
|
-
<span class="icon is-small">
|
|
205
|
-
<i class="mdi mdi-play-pause" aria-hidden="true"></i>
|
|
206
|
-
</span>
|
|
207
|
-
<span>
|
|
208
|
-
Load more
|
|
209
|
-
</span>
|
|
210
|
-
</button>
|
|
211
|
-
</div>
|
|
212
|
-
</nav>
|
|
213
|
-
|
|
214
|
-
|
|
215
|
-
<!--
|
|
216
|
-
<it-tag>Neutral</it-tag><it-tag>Neutral</it-tag><it-tag>Neutral</it-tag><it-tag>Neutral</it-tag>
|
|
217
|
-
<it-button @click="showMessage('Warning')" type="warning">Warning message</it-button>
|
|
218
|
-
<it-tabs box style="flex: 1">
|
|
219
|
-
<it-tab title="Tab 1">First tab</it-tab>
|
|
220
|
-
<it-tab title="Tab 2">Second tab</it-tab>
|
|
221
|
-
<it-tab title="Tab 3" :disabled="disabledTab">Third tab</it-tab>
|
|
222
|
-
</it-tabs>
|
|
223
|
-
-->
|
|
224
|
-
</div>
|
|
225
|
-
</div>
|
|
226
|
-
|
|
227
|
-
<!--
|
|
228
|
-
<nav class="bottombar" role="navigation" style="background: none; position: fixed; width: 100%; bottom: 0; left: 0; z-index: 100">
|
|
229
|
-
<div class="columns">
|
|
230
|
-
<div class="column is-3" v-if="!preview"></div>
|
|
231
|
-
<div class="column bottombar-right" v-bind:class="{ 'is-9': !preview, 'is-12': preview }" style="">
|
|
232
|
-
<div class="buttons" v-if="pipeline.length">
|
|
233
|
-
<button class="button is-primary" @click="run">
|
|
234
|
-
<span class="icon is-small">
|
|
235
|
-
<i class="mdi mdi-subdirectory-arrow-right" aria-hidden="true"></i>
|
|
236
|
-
</span>
|
|
237
|
-
<span>
|
|
238
|
-
Run
|
|
239
|
-
</span>
|
|
240
|
-
</button>
|
|
241
|
-
</div>
|
|
242
|
-
</div>
|
|
243
|
-
</div>
|
|
244
|
-
</nav>
|
|
245
|
-
-->
|
|
246
|
-
|
|
247
|
-
</div>
|
|
248
|
-
</template>
|
|
249
|
-
<style src="./app.css"></style>
|
|
250
|
-
<script src="./app.js" scoped></script>
|