diff --git a/demo/vanilla-js/main.js b/demo/vanilla-js/main.js
index 4df71e7..138cf46 100644
--- a/demo/vanilla-js/main.js
+++ b/demo/vanilla-js/main.js
@@ -1,5 +1,5 @@
-import { Chart, Fetcher, intervalsMs } from 'https://cdn.jsdelivr.net/npm/@dmidz/tickschart/+esm';
+import { Chart, Fetcher, intervalsMs } from 'https://cdn.jsdelivr.net/npm/@dmidz/tickschart@0.0/+esm';
const { m1, h1, d1 } = intervalsMs;
@@ -11,7 +11,7 @@ const mapTickProps = { open: 'open', high: 'high', low: 'low', close: 'close', v
// ! adapt this path to your public sample path
const sampleTimeStart = 1684800000000;
const ticksPerLoad = 1000;// must match the ticks count per fetch
-const sampleTicksURL = `/data/ticks_BTC_4h/${ sampleTimeStart }-${ ticksPerLoad }.json`;
+const sampleTicksURL = `/tickschart/data/ticks_BTC_4h/${ sampleTimeStart }-${ ticksPerLoad }.json`;
const timeScaleMs = h1 * 4;// must match time scale of fetched data ( here 4h )
const currentTime = new Date( Date.UTC( 2023, 9, 10 ) );// initial time position
const xOriginRatio = .75;// screen width delta ratio, .75 = 3/4 width from left
@@ -31,7 +31,7 @@ const fetcher = new Fetcher( defaultTick, async ( startTime, limit ) => {
}
//__ when github.io ( github pages ), must add sub directory ( repo name )
- const url = new URL( `${ window.location.hostname.match(/github.io$/)?'/tickschart':''}${sampleTicksURL}`, window.location.origin );
+ const url = new URL( `${sampleTicksURL}`, window.location.origin );
url.search = new URLSearchParams( {// sample of params for API, useless here with local json fetch
symbol: 'BTCUSDT',
diff --git a/demo/vanilla-ts/index.html b/demo/vanilla-ts/index.html
index bfe116f..7c1497b 100644
--- a/demo/vanilla-ts/index.html
+++ b/demo/vanilla-ts/index.html
@@ -5,7 +5,7 @@
Ticks Chart Vue Example
-
+
diff --git a/demo/vanilla-ts/main.ts b/demo/vanilla-ts/main.ts
index 7efa3ca..72ff53e 100644
--- a/demo/vanilla-ts/main.ts
+++ b/demo/vanilla-ts/main.ts
@@ -15,7 +15,7 @@ const mapTickProps = { open: 'open', high: 'high', low: 'low', close: 'close', v
// ! adapt this path to your public sample path ( native fetch needs absolute URL )
const sampleTimeStart = 1684800000000;
const ticksPerLoad = 1000;// must match the ticks count per fetch
-const sampleTicksURL = `/data/ticks_BTC_4h/${ sampleTimeStart }-${ ticksPerLoad }.json`;
+const sampleTicksURL = `/tickschart/data/ticks_BTC_4h/${ sampleTimeStart }-${ ticksPerLoad }.json`;
const timeScaleMs = h1 * 4;// must match time scale of fetched data ( here 4h )
const currentTime = new Date( Date.UTC( 2023, 9, 10 ) );// initial time position
const xOriginRatio = .75;// screen width delta ratio, .75 = 3/4 width from left
diff --git a/public/icons/chevron-double.svg b/public/tickschart/assets/icons/chevron-double.svg
similarity index 100%
rename from public/icons/chevron-double.svg
rename to public/tickschart/assets/icons/chevron-double.svg
diff --git a/public/icons/close.svg b/public/tickschart/assets/icons/close.svg
similarity index 100%
rename from public/icons/close.svg
rename to public/tickschart/assets/icons/close.svg
diff --git a/public/icons/settings.svg b/public/tickschart/assets/icons/settings.svg
similarity index 100%
rename from public/icons/settings.svg
rename to public/tickschart/assets/icons/settings.svg
diff --git a/public/css/main.css b/public/tickschart/assets/main.css
similarity index 94%
rename from public/css/main.css
rename to public/tickschart/assets/main.css
index 35427d7..25f27a9 100644
--- a/public/css/main.css
+++ b/public/tickschart/assets/main.css
@@ -154,6 +154,18 @@ body {
vertical-align: middle;
}
+.icon.ic-close {
+ background-image: url("./icons/close.svg");
+}
+
+.icon.ic-settings {
+ background-image: url("./icons/settings.svg");
+}
+
+.icon.ic-chevron-double {
+ background-image: url("./icons/chevron-double.svg");
+}
+
.chart .bt-link {
cursor: pointer;
font-size: 1rem;
diff --git a/public/data/ticks_BTC_4h/1684800000000-1000.json b/public/tickschart/data/ticks_BTC_4h/1684800000000-1000.json
similarity index 100%
rename from public/data/ticks_BTC_4h/1684800000000-1000.json
rename to public/tickschart/data/ticks_BTC_4h/1684800000000-1000.json
diff --git a/src/Chart.vue b/src/Chart.vue
index e634d17..8551e20 100644
--- a/src/Chart.vue
+++ b/src/Chart.vue
@@ -14,7 +14,7 @@ const defaultTick = { time: 0, open: 0, high: 0, low: 0, close: 0, vol: 0 } as c
const mapTickProps = { open: 'open', high: 'high', low: 'low', close: 'close', volume: 'vol' } as const;
const sampleTimeStart = 1684800000000;
const ticksPerLoad = 1000;// must match the ticks count per fetch
-const sampleTicksURL = `/data/ticks_BTC_4h/${ sampleTimeStart }-${ ticksPerLoad }.json`;
+const sampleTicksURL = `/tickschart/data/ticks_BTC_4h/${ sampleTimeStart }-${ ticksPerLoad }.json`;
const timeScaleMs = h1 * 4;// must match time scale of fetched data ( here 4h )
// const currentTime = new Date();// initial time position
// const currentTime = new Date( Date.UTC(2023, 6, 13 ) );// initial time position
diff --git a/src/lib/Chart.ts b/src/lib/Chart.ts
index 647675d..0ec6c9d 100644
--- a/src/lib/Chart.ts
+++ b/src/lib/Chart.ts
@@ -972,9 +972,8 @@ export default class Chart {
}
} );
createElement( 'span', this.elements.buttonGoMaxX, {
- className: 'icon',
+ className: 'icon ic-chevron-double',
style: {
- backgroundImage: 'url( "/icons/chevron-double.svg" )',
transform: 'rotate(90deg)',
marginBottom: '2px',
}
diff --git a/src/lib/ChartRow.ts b/src/lib/ChartRow.ts
index e2deb82..e6a3d5a 100644
--- a/src/lib/ChartRow.ts
+++ b/src/lib/ChartRow.ts
@@ -236,10 +236,9 @@ export default class ChartRow {
this.elements.set( 'name', name );
if( Object.keys( this.indicator.settings||{} ).length ){
createElement( 'div', name, {
- className: 'icon',
+ className: 'icon ic-settings',
style: {
marginLeft: '4px',
- backgroundImage: 'url( "/icons/settings.svg" )',
backgroundRepeat: 'no-repeat',
}
} );
diff --git a/src/lib/UI/Dialog.ts b/src/lib/UI/Dialog.ts
index c604267..e267bd8 100644
--- a/src/lib/UI/Dialog.ts
+++ b/src/lib/UI/Dialog.ts
@@ -105,9 +105,8 @@ export default class Dialog {
this.elements.btClose.addEventListener( 'click', this.handleClose );
createElement( 'span', this.elements.btClose, {
- className: 'icon',
+ className: 'icon ic-close',
style: {
- backgroundImage: 'url( "/icons/close.svg" )',
width: '24px',
height: '24px',
}
diff --git a/src/main.ts b/src/main.ts
index b11dc10..38e2dfb 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -1,7 +1,7 @@
import { createApp } from 'vue';
import App from './App.vue';
-import '@public/css/main.css';
+import '@public/assets/main.css';
-createApp(App).mount('#app')
+createApp(App).mount('#app');
diff --git a/vite.config.ts b/vite.config.ts
index 168cf56..683e3b3 100644
--- a/vite.config.ts
+++ b/vite.config.ts
@@ -12,7 +12,7 @@ export default defineConfig({
alias: {
'@': resolve( __dirname, 'src' ),
'@dmidz/tickschart': resolve( __dirname, 'dist' ),// trick to compile demo/vanilla-ts using real world package path
- '@public': resolve( __dirname, 'public' ),
+ '@public': resolve( __dirname, 'public/tickschart' ),
},
// preserveSymlinks: true,
},