-
+
+
+
+ refresh Reset price scale
+
+
+
+
+
+
+ ✓ Auto (fits data to screen)
+
+
+ Invert scale
+
+
+
+
+
+
+ ✓ Regular
+
+
+ Percent
+
+
+ Indexed to 100
+
+
+ Logarithmic
+
+
+
+
+
+
-
-
-
-
-
-
-
-
+
+
+
+
diff --git a/js/ui/chart.js b/js/ui/chart.js
index c3f89e4..3111156 100644
--- a/js/ui/chart.js
+++ b/js/ui/chart.js
@@ -485,10 +485,9 @@ constructor() {
}
initPriceScaleControls() {
+ // Gear Button Toggle
const btnSettings = document.getElementById('btnSettings');
const settingsPopup = document.getElementById('settingsPopup');
- const btnAutoScale = document.getElementById('btnAutoScale');
- const btnLogScale = document.getElementById('btnLogScale');
if (btnSettings && settingsPopup) {
btnSettings.addEventListener('click', (e) => {
@@ -502,78 +501,56 @@ constructor() {
}
});
}
-
- if (!btnAutoScale || !btnLogScale) return;
-
- this.priceScaleState = {
- autoScale: true,
- logScale: false
+
+ // Initialize state from storage
+ this.scaleState = {
+ autoScale: localStorage.getItem('winterfail_scale_auto') !== 'false',
+ invertScale: localStorage.getItem('winterfail_scale_invert') === 'true',
+ scaleMode: parseInt(localStorage.getItem('winterfail_scale_mode')) || 0
};
-
- btnAutoScale.addEventListener('click', () => {
- this.priceScaleState.autoScale = !this.priceScaleState.autoScale;
- btnAutoScale.classList.toggle('active', this.priceScaleState.autoScale);
+
+ // UI Helpers
+ const updateCheckmark = (id, active) => {
+ const el = document.getElementById(id);
+ if (el) el.textContent = active ? '✓' : '';
+ };
+
+ const updateUI = () => {
+ updateCheckmark('autoScaleCheck', this.scaleState.autoScale);
+ updateCheckmark('invertScaleCheck', this.scaleState.invertScale);
+ updateCheckmark('modeNormalCheck', this.scaleState.scaleMode === 0);
+ updateCheckmark('modeLogCheck', this.scaleState.scaleMode === 1);
+ updateCheckmark('modePercentCheck', this.scaleState.scaleMode === 2);
+ updateCheckmark('modeIndexedCheck', this.scaleState.scaleMode === 3);
+ };
+
+ // Apply initial state
+ this.candleSeries.priceScale().applyOptions({
+ autoScale: this.scaleState.autoScale,
+ invertScale: this.scaleState.invertScale,
+ mode: this.scaleState.scaleMode
+ });
+ updateUI();
+
+ window.toggleScaleOption = (option) => {
+ this.scaleState[option] = !this.scaleState[option];
+ localStorage.setItem(`winterfail_scale_${option}`, this.scaleState[option]);
this.candleSeries.priceScale().applyOptions({
- autoScale: this.priceScaleState.autoScale
+ [option]: this.scaleState[option]
});
-
- console.log('Auto Scale:', this.priceScaleState.autoScale ? 'ON' : 'OFF');
- });
-
- btnLogScale.addEventListener('click', () => {
- this.priceScaleState.logScale = !this.priceScaleState.logScale;
- btnLogScale.classList.toggle('active', this.priceScaleState.logScale);
-
- let currentPriceRange = null;
- let currentTimeRange = null;
- if (!this.priceScaleState.autoScale) {
- try {
- currentPriceRange = this.candleSeries.priceScale().getVisiblePriceRange();
- } catch (e) {
- console.log('Could not get price range');
- }
- }
- try {
- currentTimeRange = this.chart.timeScale().getVisibleLogicalRange();
- } catch (e) {
- console.log('Could not get time range');
- }
+ updateUI();
+ };
+
+ window.setScaleMode = (mode) => {
+ this.scaleState.scaleMode = mode;
+ localStorage.setItem('winterfail_scale_mode', mode);
this.candleSeries.priceScale().applyOptions({
- mode: this.priceScaleState.logScale ? LightweightCharts.PriceScaleMode.Logarithmic : LightweightCharts.PriceScaleMode.Normal
+ mode: mode
});
-
- this.chart.applyOptions({});
-
- setTimeout(() => {
- if (currentTimeRange) {
- try {
- this.chart.timeScale().setVisibleLogicalRange(currentTimeRange);
- } catch (e) {
- console.log('Could not restore time range');
- }
- }
-
- if (!this.priceScaleState.autoScale && currentPriceRange) {
- try {
- this.candleSeries.priceScale().setVisiblePriceRange(currentPriceRange);
- } catch (e) {
- console.log('Could not restore price range');
- }
- }
- }, 100);
-
- console.log('Log Scale:', this.priceScaleState.logScale ? 'ON' : 'OFF');
- });
-
- document.addEventListener('keydown', (e) => {
- if (e.key === 'a' || e.key === 'A') {
- if (e.target.tagName !== 'INPUT') {
- btnAutoScale.click();
- }
- }
- });
+ updateUI();
+ };
}
initNavigationControls() {