jh-componentj 0.2.0

package/src/extensions/legend-buttons/main.js

@@ -0,0 +1,156 @@
+// Extension's controller
+
+import { Utils } from "trading-vue-js";
+import Vue from "vue";
+import AddWin from "./AddWin.vue";
+
+export default class Main {
+  constructor(tv, dc, sett) {
+    console.log(dc, "usydfufgysdguydsguy");
+
+    this.widgets = {};
+    this.tv = tv;
+    this.dc = dc;
+    this.sett = sett;
+  }
+
+  // Listens to all tvjs events, creates new widgets
+  update(e) {
+    switch (e.event) {
+      case "legend-button-click":
+        this.onbutton(e.args[0]);
+        break;
+    }
+  }
+
+  onbutton(e) {
+    let ov = this.dc.get(e.type)[e.dataIndex];
+    let onchart = this.dc.data.onchart;
+    let offchart = this.dc.data.offchart;
+    console.log(e.button);
+    if (!ov) return;
+    switch (e.button) {
+      case "display":
+        if (ov.settings.display === undefined) {
+          var flag = false;
+        } else {
+          flag = !ov.settings.display;
+        }
+        this.tv.$set(ov.settings, "display", flag);
+        break;
+      case "up":
+        if (e.type === "offchart") {
+          if (e.dataIndex === 0) {
+            offchart.splice(e.dataIndex, 1);
+            onchart.push(ov);
+          } else {
+            let data = offchart;
+            let i0 = e.dataIndex;
+            let i1 = e.dataIndex - 1;
+            data[i0] = data.splice(i1, 1, data[i0])[0];
+          }
+        }
+        this.dc.update_ids();
+        break;
+      case "down":
+        if (e.type === "onchart") {
+          let h = this.avg_grid_h(offchart);
+          onchart.splice(e.dataIndex, 1);
+          offchart.unshift(ov);
+          this.tv.$set(ov, "grid", { height: h });
+        } else {
+          let n = offchart.length;
+          let data = offchart;
+          if (e.dataIndex < n - 1) {
+            let i0 = e.dataIndex;
+            let i1 = e.dataIndex + 1;
+            data[i0] = data.splice(i1, 1, data[i0])[0];
+          }
+        }
+        this.dc.update_ids();
+        break;
+      case "add":
+        try {
+          let id = `AddWin-${Utils.uuid2()}`;
+          let ov = this.dc.data[e.type][e.dataIndex];
+          let f = Object.values(this.widgets).find((x) => x.data.ov === ov);
+          console.log(" ov data", ov);
+          if (f) {
+            this.tv.$delete(this.widgets, f.id);
+            break;
+          }
+          this.tv.$set(this.widgets, id, {
+            id,
+            cls: AddWin,
+            data: {
+              ov: ov,
+              type: e.type,
+              index: e.dataIndex,
+            },
+          });
+        } catch (e) {
+          console.log(e);
+        }
+        break;
+      case "remove":
+        this.dc.data[e.type].splice(e.dataIndex, 1);
+        this.dc.update_ids();
+        break;
+    }
+  }
+
+  // Called from AddWin.vue
+  add_overlay(e) {
+    let preset = this.get_preset(e.type) || {};
+    if (preset.side) e.side = preset.side;
+    let onchart = this.dc.data.onchart;
+    let offchart = this.dc.data.offchart;
+    if (e.side === "onchart") {
+      onchart.splice(e.index + 1, 0, {
+        name: preset.name,
+        type: e.type,
+        data: [],
+        settings: preset.settings || {},
+      });
+    } else {
+      let h = this.avg_grid_h(offchart);
+      offchart.splice(e.index + 1, 0, {
+        name: preset.name,
+        type: e.type,
+        data: [],
+        settings: preset.settings || {},
+        grid: { height: h },
+      });
+    }
+    this.dc.update_ids();
+  }
+
+  // Get preset (default settings, colors) if defined
+  get_preset(type) {
+    let proto = this.tv.overlays.find((x) => x.name === type);
+    if (proto && proto.methods.meta_info) {
+      let meta = proto.methods.meta_info();
+      return meta.preset;
+    }
+  }
+
+  // Extension settings has changed
+  onsettings(sett) {}
+
+  avg_grid_h(ovs) {
+    if (!ovs.length) return 0.25;
+    let gh = 0;
+    for (var ov of ovs) {
+      if (ov.grid && typeof ov.grid.height === "number") {
+        gh += ov.grid.height;
+      }
+    }
+    return gh / ovs.length;
+  }
+
+  remove_widget(id) {
+    this.tv.$delete(this.widgets, id);
+  }
+
+  destroy() {}
+}

package/src/extensions/legend-buttons/x.json

@@ -0,0 +1,11 @@
+{
+    "name": "legend-buttons",
+    "author": "StdSquad",
+    "version": "1.0.0",
+    "components": [],
+    "widgets": [],
+    "overlays": [],
+    "skins": [],
+    "colorpacks": [],
+    "deps": {}
+}

package/src/extensions/settings-win/SettingsWin.vue

@@ -0,0 +1,76 @@
+<template>
+    <window :title="data.ov.name" class="sett-win"
+        @close="on_close" :tv='tv'>
+        <div v-for="k in settlist" class="sett-win-item">
+            <label>{{s2d(k)}}</label>
+            <std-input :value="sett[k]"
+                @input="update_sett(k, $event)"/>
+        </div>
+        <span v-if="!settlist.length" class="sett-win-empty">
+            <i>No script settings</i>
+        </span>
+    </window>
+</template>
+<script>
+
+import Window from '../../components/Window.vue'
+import StdInput from '../../components/StdInput.vue'
+import Utils from './utils.js'
+
+export default {
+    name: 'SettingsWin',
+    props: ['id', 'main', 'dc', 'tv', 'data'],
+    components: { Window, StdInput },
+    mounted() {
+    },
+    methods: {
+        s2d(str) {
+            return Utils.sett2desc(str)
+        },
+        on_close() {
+            this.$props.main.remove_widget(this.$props.id)
+        },
+        update_sett(k, val) {
+            let dcid = this.$props.data.ov.id
+
+            let valN = parseFloat(val)
+            if (valN !== valN) valN = val
+
+            this.$props.dc.merge(`${dcid}.settings`,
+                { [k]: valN }
+            )
+        }
+    },
+    computed: {
+        sett() {
+            return this.$props.data.ov.settings
+        },
+        settlist() {
+            return Object.keys(this.sett).filter(x =>
+                x[0] !== '$' && this.sett.$props &&
+                this.sett.$props.includes(x))
+        }
+    }
+}
+</script>
+<style scoped>
+.tvjs-x-window.sett-win {
+    padding-bottom: 30px;
+    border: 1px solid #80808011;
+}
+.sett-win-item {
+    display: flex;
+    flex-direction: row;
+    flex-wrap: nowrap;
+    justify-content: flex-start;
+    align-content: center;
+    align-items: center;
+}
+.sett-win-item label {
+    min-width: 80px;
+    color: #35a776;
+}
+.sett-win-empty {
+    opacity: 0.5;
+}
+</style>

package/src/extensions/settings-win/main.js

@@ -0,0 +1,39 @@
+import { Utils } from "trading-vue-js";
+import SettingsWin from "./SettingsWin.vue";
+
+export default class Main {
+  constructor(tv, dc) {
+    this.widgets = {};
+    this.tv = tv;
+    this.dc = dc;
+  }
+
+  update(e) {
+    switch (e.event) {
+      case "legend-button-click":
+        let id = `SettingsWin-${Utils.uuid2()}`;
+        let args = e.args[0];
+        if (args.button !== "settings") break;
+        try {
+          let ov = this.dc.data[args.type][args.dataIndex];
+          let f = Object.values(this.widgets).find((x) => x.data.ov === ov);
+          if (f) {
+            this.tv.$delete(this.widgets, f.id);
+            break;
+          }
+          this.tv.$set(this.widgets, id, {
+            id,
+            cls: SettingsWin,
+            data: { ov: ov },
+          });
+        } catch (e) {
+          console.log(e);
+        }
+        break;
+    }
+  }
+
+  remove_widget(id) {
+    this.tv.$delete(this.widgets, id);
+  }
+}

package/src/extensions/settings-win/utils.js

@@ -0,0 +1,19 @@
+
+export default {
+
+    sett2desc(sett) {
+        function setCharAt(str,index,chr) {
+            if(index > str.length-1) return str
+            return str.substring(0,index) + chr + str.substring(index+1)
+        }
+
+        sett = sett.replace(/([^A-Z])([A-Z])/g, '$1 $2')
+        sett = sett.replace(/-|_/g, ' ')
+        let tuple = sett.split(' ')
+        tuple = tuple
+            .filter(x => x.length)
+            .map(x => setCharAt(x, 0, x[0].toUpperCase()))
+        return tuple.join(' ')
+    }
+    
+}

package/src/extensions/settings-win/x.json

@@ -0,0 +1,11 @@
+{
+    "name": "settings-win",
+    "author": "StdSquad",
+    "version": "1.0.0",
+    "components": [],
+    "widgets": ["SettingsWin.vue"],
+    "overlays": [],
+    "skins": [],
+    "colorpacks": [],
+    "deps": {}
+}

package/src/index.html

@@ -0,0 +1,19 @@
+<!doctype html>
+<html lang="en">
+
+<head>
+    <meta charset="utf-8">
+    <meta http-equiv="x-ua-compatible" content="ie=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <title>TradingVue Std XP</title>
+    <style>
+    </style>
+</head>
+
+<body>
+    <!-- Our vue app will be mounted on this DOM element -->
+    <div id="app"></div>
+    <!-- Bundle will be injected below -->
+</body>
+
+</html>

package/src/index_dev.js

@@ -0,0 +1,27 @@
+
+
+// -------- Development extension index ---------
+//      ! THIS FILE WAS AUTO-GENERATED !
+//
+// You can overwrite it and have fun, to restore
+// the default state: 'npm run compile'
+
+import ChartLink from '../build/chart-link/chart-link-dev.js'
+import GridResize from '../build/grid-resize/grid-resize-dev.js'
+import LegendButtons from '../build/legend-buttons/legend-buttons-dev.js'
+import SettingsWin from '../build/settings-win/settings-win-dev.js'
+
+
+
+const Pack = {
+    'chart-link': ChartLink,
+    'grid-resize': GridResize,
+    'legend-buttons': LegendButtons,
+    'settings-win': SettingsWin
+}
+
+export default Pack
+
+export {
+    
+}

package/src/index_prod.js

@@ -0,0 +1,28 @@
+
+
+// -------- Production extension index ---------
+//      ! THIS FILE WAS AUTO-GENERATED !
+//
+// Do not commit this file, the final index is
+// compiled by the repo owner, use index_dev.js to
+// experiment: 'npm run compile'
+
+import ChartLink from '../build/chart-link/chart-link.js'
+import GridResize from '../build/grid-resize/grid-resize.js'
+import LegendButtons from '../build/legend-buttons/legend-buttons.js'
+import SettingsWin from '../build/settings-win/settings-win.js'
+
+
+
+const Pack = {
+    'chart-link': ChartLink,
+    'grid-resize': GridResize,
+    'legend-buttons': LegendButtons,
+    'settings-win': SettingsWin
+}
+
+export default Pack
+
+export {
+    
+}

package/src/main.js

@@ -0,0 +1,14 @@
+// import Vue from "vue";
+// import App from "./Main.vue";
+
+// new Vue({
+//   el: "#app",
+//   render: (h) => h(App),
+// });
+
+import Vue from "vue";
+import VueCustomElement from "vue-custom-element";
+import App from "./Main.vue";
+Vue.use(VueCustomElement);
+
+Vue.customElement("my-component", App);

package/src/stuff/utils.js

@@ -0,0 +1,16 @@
+export default {
+    name2Name(sett) {
+        function setCharAt(str,index,chr) {
+            if(index > str.length-1) return str
+            return str.substring(0,index) + chr + str.substring(index+1)
+        }
+
+        sett = sett.replace(/([^A-Z])([A-Z])/g, '$1 $2')
+        sett = sett.replace(/-|_/g, ' ')
+        let tuple = sett.split(' ')
+        tuple = tuple
+            .filter(x => x.length)
+            .map(x => setCharAt(x, 0, x[0].toUpperCase()))
+        return tuple.join('')
+    }
+}