npm - tranfi - Versions diffs - 0.0.1 - Mend

tranfi 0.0.1

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.

Files changed (13) hide show

package/index.html ADDED Viewed

@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8" />
+    <meta name="viewport" content="width=device-width" />
+    <title>Tranfi</title>
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bulma@0.9.3/css/bulma.min.css">
+    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Material+Icons|Material+Icons+Outlined">
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@mdi/font@6.5.95/css/materialdesignicons.min.css">
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@5.15.4/css/fontawesome.min.css">
+    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;900&display=swap" rel="stylesheet">
+  </head>
+  <body>
+    <div id="progress"></div>
+    <div id="tranfi-container"></div>
+    <script src="dist/bundle.js"></script>
+  </body>
+</html>

package/logo.png ADDED Viewed

Binary file

package/package.json ADDED Viewed

@@ -0,0 +1,68 @@
+{
+  "name": "tranfi",
+  "version": "0.0.1",
+  "description": "Stream-based tool for file processing",
+  "main": "src/main.js",
+  "scripts": {
+    "build-dev": "webpack --mode=development --progress --stats-children --env DEVELOPMENT",
+    "build": "webpack --mode=production --progress && webpack --mode=production --progress --env RUNTIME",
+    "watch": "nodemon --watch . --ignore dist --ext vue,js,css,html --exec 'npm run build-dev'",
+    "prepublishOnly": "npm run build",
+    "test": "jest test.js --detectOpenHandles",
+    "test-head": "HEADLESS=false npm test"
+  },
+  "author": "Anton Zemlyansky",
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/tranfi/tranfi"
+  },
+  "dependencies": {
+    "@jseeio/jsee": "^0.2.8",
+    "buffer": "^6.0.3",
+    "bulma": "^0.9.3",
+    "csv-parse": "^4.16.3",
+    "element-plus": "^1.2.0-beta.6",
+    "equal-vue": "^0.79.3",
+    "file-saver": "^2.0.2",
+    "filestream": "^5.0.0",
+    "filtrex": "^2.2.3",
+    "JSONStream": "^1.3.5",
+    "notyf": "^3.10.0",
+    "process": "^0.11.10",
+    "stream-browserify": "^3.0.0",
+    "stream-http": "^3.2.0",
+    "through2": "^4.0.2",
+    "unzip-stream": "^0.3.1",
+    "url": "^0.11.0",
+    "vue": "^3.2.23",
+    "vue-style-loader": "^4.1.3",
+    "vue3-json-viewer": "^1.0.4",
+    "vuedraggable": "^4.1.0",
+    "vuex": "^4.0.2"
+  },
+  "devDependencies": {
+    "@babel/core": "^7.16.5",
+    "@babel/plugin-transform-runtime": "^7.4.4",
+    "@babel/preset-env": "^7.16.5",
+    "babel-loader": "^8.2.3",
+    "css-loader": "^6.5.1",
+    "http-server": "^14.0.0",
+    "jest": "^27.4.5",
+    "jest-puppeteer": "^6.0.3",
+    "node-sass": "^7.0.0",
+    "nodemon": "^2.0.15",
+    "puppeteer": "^1.20.0",
+    "sass-loader": "^12.4.0",
+    "source-map-loader": "^3.0.0",
+    "style-loader": "^3.3.1",
+    "tape": "^4.9.1",
+    "terser-webpack-plugin": "^5.3.0",
+    "uglify-es": "^3.3.9",
+    "vue-loader": "^17.0.0",
+    "vue-template-compiler": "^2.6.14",
+    "webpack": "^5.65.0",
+    "webpack-cli": "^4.9.1",
+    "worker-loader": "^3.0.8"
+  }
+}

package/src/app.css ADDED Viewed

@@ -0,0 +1,160 @@
+html, body {
+  font-family: sans-serif;
+  overflow-x: auto;
+  overflow-y: auto;
+}
+.navbar-brand {
+  align-items: center;
+  justify-content: space-between;
+}
+.pipeline {
+  min-height: calc(100vh - 77px);
+  background: #f2f2f2;
+}
+.pipeline .card.active .card-content, .card.active .card-footer {
+  display: flex;
+}
+.pipeline .card .card-content, .card .card-footer {
+  display: none;
+}
+.pipeline .card .card-header-title {
+    cursor: move;
+    cursor: grab;
+    cursor: -moz-grab;
+    cursor: -webkit-grab;
+}
+.pipeline .card .card-header-title:active {
+    cursor: grabbing;
+    cursor: -moz-grabbing;
+    cursor: -webkit-grabbing;
+}
+.columns {
+  margin: 0;
+}
+.columns:last-child {
+  margin-bottom: 0;
+}
+.column {
+  padding: 10px;
+}
+.it-drawer-body--left {
+  top: 100px !important;
+  height: calc(100% - 120px) !important;
+}
+.mainbar-left {
+  padding-top: 12px;
+  background-color: #222326;
+}
+.mainbar-right {
+  background-color: #2b2e35;
+  align-items: stretch;
+  display: flex;
+}
+.mainbar-right .navbar-start{
+  justify-content: flex-start;
+  margin-right: auto;
+  align-items: stretch;
+  display: flex;
+}
+.mainbar-right .navbar-item {
+  align-items: center;
+  display: flex;
+  color: white;
+}
+.mainbar-right input {
+  background: #222326;
+  border: none;
+  color: #c3c6ce;
+}
+.mainbar-right input::placeholder {
+  color: #6b6f79;
+}
+.mainbar-title {
+  font-weight: 500;
+  font-size: 16px;
+}
+.navbar-item {
+  padding: .5rem 0.4rem;
+}
+.breadcrumb {
+  margin: 6px auto 13px !important;
+  opacity: 0.5;
+  font-size: 12px;
+}
+.preview-panel {
+  max-width: 400px;
+  margin: 25px auto;
+}
+/*
+.mainbar-title:before {
+  content: '> ';
+  opacity: 0.4;
+  margin-right: 10px;
+  display: inline-block;
+  font-weight: 200;
+}
+*/
+hr {
+  height: 1px;
+  margin: 0.2rem 0;
+}
+.preview-button {
+  min-width: 100px;
+}
+.preview-content pre {
+  background: none;
+  font-size: 12px;
+}
+#progress {
+  background: #00d1b2;
+  position: fixed;
+  top: 0;
+  left: 0;
+  height: 3px;
+  z-index: 1000;
+}
+@media screen and (max-width:768px) {
+  .mainbar-left {
+    display: none;
+  }
+  .desktop-only {
+    display: none;
+  }
+  .preview-button {
+    min-width: 0px;
+  }
+  .button.mobile-flexible .icon {
+    margin-left: calc(-.5em - 1px) !important;
+    margin-right: calc(-.5em - 1px) !important;
+  }
+}

package/src/app.js ADDED Viewed

@@ -0,0 +1,203 @@
+const through2 = require('through2')
+const transforms = require('./transforms')
+async function run (pipeline, isBatch) {
+  let readStream
+  let writeStream
+  for (const transform of pipeline) {
+    // Convert inputs to params object
+    const params = {}
+    transform.inputs.forEach(i => {
+      params[i.name] = i.type === 'file' ? i.file : i.value
+    })
+    // Init stream
+    let nextStream = await transforms[transform.name].initStream(params)
+    if (typeof readStream === 'undefined') {
+      readStream = writeStream = nextStream
+      if ('File' in params) {
+        let size = params['File'].size
+        let progressBytes = 0
+        let progressBar = document.getElementById('progress')
+        progressBar.style.display = 'initial'
+        const progressStream = through2(function (chunk, enc, callback) {
+          progressBytes += chunk.length
+          let progressPercents = ((progressBytes / size) * 100).toFixed(1)
+          progressBar.style.width = progressPercents + '%'
+          this.push(chunk)
+          callback()
+        })
+        writeStream = writeStream.pipe(progressStream)
+      }
+    } else {
+      writeStream = writeStream.pipe(nextStream) //, {end: false})
+    }
+  }
+  writeStream.on('data', (piece) => {
+    if (isBatch) {
+      console.log('Pausing stream')
+      readStream.pause()
+    }
+  })
+  return {readStream, writeStream}
+}
+function resetInputs (inputs) {
+  inputs.forEach(input => {
+    if (input.default) {
+      input.value = input.default
+    } else {
+      switch (input.type) {
+        case 'int':
+        case 'float':
+        case 'number':
+          input.value = 0
+          break
+        case 'string':
+        case 'text':
+          input.value = ''
+          break
+        case 'color':
+          input.value = '#000000'
+          break
+        case 'categorical':
+        case 'select':
+          input.value = input.options ? input.options[0] : ''
+          break
+        case 'bool':
+        case 'checkbox':
+          input.value = false
+          break
+        case 'file':
+          input.file = null
+          input.value = ''
+          break
+        case 'group':
+          resetInputs(input.elements)
+          break
+        default:
+          input.value = ''
+      }
+    }
+  })
+}
+let readStream = null
+let writeStream = null
+export default {
+  components: {
+//    draggable,
+//    'vue-input': bulmaInput
+  },
+  data() {
+    return {
+      drag: false,
+      preview: false,
+      loadedAllData: true,
+      title: '',
+      showResults: false,
+      modalAddTransforms: false,
+      counter: 0,
+      transforms: transforms,
+      pipeline: []
+    }
+  },
+  methods: {
+    getTransformIndex (t) {
+      return this.pipeline.findIndex((el) => el.id === t.id)
+    },
+    cloneTransform (t) {
+      const i = this.getTransformIndex(t)
+      const newTransform = JSON.parse(JSON.stringify(t))
+      newTransform.id = this.counter
+      this.counter += 1
+      this.pipeline.splice(i + 1, 0, newTransform)
+    },
+    resetTransform (t) {
+      resetInputs(t.inputs)
+    },
+    deleteTransform (t) {
+      const i = this.getTransformIndex(t)
+      this.pipeline.splice(i, 1)
+    },
+    showLoading (p) {
+      this.$Loading.update(p)
+    },
+    addTransform (Transform) {
+      const newTransform = new Transform(this.counter)
+      this.resetTransform(newTransform)
+      this.pipeline.push(newTransform)
+      this.modalAddTransforms = false
+      this.counter += 1
+    },
+    showMessage (type) {
+      switch (type) {
+        case 'success':
+          this.$Message.success({ text: 'Success message!' })
+          break
+        case 'danger':
+          this.$Message.danger({ text: 'Danger message!' })
+          break
+        case 'warning':
+          this.$Message.warning({ text: 'Success message!' })
+          break
+        default:
+          this.$Message({ text: 'Primary message!' })
+          break
+      }
+    },
+    run (isBatch) {
+      run(this.pipeline, isBatch).then(streams => {
+        this.loadedAllData = false
+        readStream = streams.readStream
+        readStream.on('end', function () {
+          this.loadedAllData = true
+          console.log('End of stream')
+          let progressBar = document.getElementById('progress')
+          progressBar.style.display = 'none'
+        })
+      })
+    },
+    runMore () {
+      readStream.resume()
+    }
+  },
+  watch: {
+    // pipeline: {
+    //   handler (pipeline) {
+    //     this.env.data.inputs = pipeline.map((v, i) => ({type: 'int', name: v.name}))
+    //   },
+    //   deep: true
+    // }
+  },
+  computed: {
+    // a computed getter
+    displayInputs() {
+      const inputs = []
+      this.pipeline.forEach(transform => {
+        transform.displayInputs.forEach(i => {
+          inputs.push(transform.inputs[i])
+        })
+      })
+      return inputs
+    }
+  },
+  mounted () {
+    // const tranfi = this
+    // this.env = new JSEE({
+    //   model: {
+    //     code: function run (params) {
+    //       tranfi.run(params)
+    //     },
+    //     worker: false
+    //   },
+    //   design: {
+    //     grid: [6, 12]
+    //   },
+    //   inputs: []
+    // }, "#jsee-container")
+  }
+}