chore: resolve merge conflicts in index.html and finalize drawing tools
This commit is contained in:
59
index.html
59
index.html
@ -104,16 +104,61 @@
|
||||
<!-- Chart Container -->
|
||||
<section class="relative w-full bg-[#0d1421] h-[60vh] md:h-[70vh]" data-purpose="chart-container" id="chartWrapper">
|
||||
<div id="chart" class="w-full h-full"></div>
|
||||
|
||||
<!-- Drawing Layer Overlay -->
|
||||
<canvas id="drawingLayer" class="absolute inset-0 pointer-events-none z-20 w-full h-full"></canvas>
|
||||
|
||||
<!-- Overlay Controls --> <div class="absolute bottom-4 right-4 flex gap-2 z-10 opacity-0 hover:opacity-100 transition-opacity" id="priceScaleControls">
|
||||
<button class="w-8 h-8 bg-[#1e222d] border border-[#2d3a4f] text-gray-300 flex items-center justify-center rounded hover:bg-[#2d3a4f] transition-colors shadow-lg" id="btnSettings" title="Settings">
|
||||
<span class="material-symbols-outlined text-sm">settings</span>
|
||||
</button>
|
||||
|
||||
<!-- Settings Popup -->
|
||||
<div class="hidden absolute bottom-10 right-0 bg-[#1a2333] border border-[#2d3a4f] rounded-lg py-2 z-50 w-64 shadow-xl text-sm" id="settingsPopup">
|
||||
<!-- Vertical Drawing Toolbar (Left) -->
|
||||
<div class="absolute left-2 top-1/2 -translate-y-1/2 flex flex-col gap-1 z-30 bg-[#1a2333]/80 backdrop-blur border border-[#2d3a4f] p-1 rounded-md shadow-xl" id="drawingToolbar">
|
||||
<button class="w-8 h-8 text-gray-400 hover:text-white hover:bg-[#2d3a4f] rounded flex items-center justify-center transition-colors" onclick="window.activateDrawingTool('cursor')" title="Cursor">
|
||||
<span class="material-symbols-outlined text-sm">near_me</span>
|
||||
</button>
|
||||
<div class="w-full h-[1px] bg-[#2d3a4f] my-0.5"></div>
|
||||
<button class="w-8 h-8 text-gray-400 hover:text-white hover:bg-[#2d3a4f] rounded flex items-center justify-center transition-colors" onclick="window.activateDrawingTool('trend_line')" title="Trend Line">
|
||||
<span class="material-symbols-outlined text-sm">call_split</span>
|
||||
</button>
|
||||
<button class="w-8 h-8 text-gray-400 hover:text-white hover:bg-[#2d3a4f] rounded flex items-center justify-center transition-colors" onclick="window.activateDrawingTool('ray')" title="Ray">
|
||||
<span class="material-symbols-outlined text-sm">trending_flat</span>
|
||||
</button>
|
||||
<button class="w-8 h-8 text-gray-400 hover:text-white hover:bg-[#2d3a4f] rounded flex items-center justify-center transition-colors" onclick="window.activateDrawingTool('horizontal_line')" title="Horizontal Line">
|
||||
<span class="material-symbols-outlined text-sm">swap_horizontal_circle</span>
|
||||
</button>
|
||||
<button class="w-8 h-8 text-gray-400 hover:text-white hover:bg-[#2d3a4f] rounded flex items-center justify-center transition-colors" onclick="window.activateDrawingTool('vertical_line')" title="Vertical Line">
|
||||
<span class="material-symbols-outlined text-sm">swap_vert</span>
|
||||
</button>
|
||||
<button class="w-8 h-8 text-gray-400 hover:text-white hover:bg-[#2d3a4f] rounded flex items-center justify-center transition-colors" onclick="window.activateDrawingTool('fib_retracement')" title="Fibonacci Retracement">
|
||||
<span class="material-symbols-outlined text-sm">reorder</span>
|
||||
</button>
|
||||
<button class="w-8 h-8 text-gray-400 hover:text-white hover:bg-[#2d3a4f] rounded flex items-center justify-center transition-colors" onclick="window.activateDrawingTool('rectangle')" title="Rectangle">
|
||||
<span class="material-symbols-outlined text-sm">crop_square</span>
|
||||
</button>
|
||||
<button class="w-8 h-8 text-gray-400 hover:text-white hover:bg-[#2d3a4f] rounded flex items-center justify-center transition-colors" onclick="window.activateDrawingTool('text')" title="Text Label">
|
||||
<span class="material-symbols-outlined text-sm">text_fields</span>
|
||||
</button>
|
||||
<button class="w-8 h-8 text-gray-400 hover:text-white hover:bg-[#2d3a4f] rounded flex items-center justify-center transition-colors" onclick="window.activateDrawingTool('arrow_up')" title="Arrow Up">
|
||||
<span class="material-symbols-outlined text-sm">arrow_upward</span>
|
||||
</button>
|
||||
<button class="w-8 h-8 text-gray-400 hover:text-white hover:bg-[#2d3a4f] rounded flex items-center justify-center transition-colors" onclick="window.activateDrawingTool('arrow_down')" title="Arrow Down">
|
||||
<span class="material-symbols-outlined text-sm">arrow_downward</span>
|
||||
</button>
|
||||
<button class="w-8 h-8 text-gray-400 hover:text-white hover:bg-[#2d3a4f] rounded flex items-center justify-center transition-colors" onclick="window.activateDrawingTool('measure')" title="Measure">
|
||||
<span class="material-symbols-outlined text-sm">straighten</span>
|
||||
</button>
|
||||
<div class="w-full h-[1px] bg-[#2d3a4f] my-0.5"></div>
|
||||
<button class="w-8 h-8 text-red-400 hover:text-red-300 hover:bg-red-900/20 rounded flex items-center justify-center transition-colors" onclick="window.activateDrawingTool('clear')" title="Clear All">
|
||||
<span class="material-symbols-outlined text-sm">delete</span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<!-- Overlay Controls -->
|
||||
<div class="absolute bottom-4 right-4 flex gap-2 z-10 opacity-0 hover:opacity-100 transition-opacity" id="priceScaleControls">
|
||||
<button class="w-8 h-8 bg-[#1e222d] border border-[#2d3a4f] text-gray-300 flex items-center justify-center rounded hover:bg-[#2d3a4f] transition-colors shadow-lg" id="btnSettings" title="Settings">
|
||||
<span class="material-symbols-outlined text-sm">settings</span>
|
||||
</button>
|
||||
|
||||
<!-- Settings Popup -->
|
||||
<div class="hidden absolute bottom-10 right-0 bg-[#1a2333] border border-[#2d3a4f] rounded-lg py-2 z-50 w-64 shadow-xl text-sm" id="settingsPopup">
|
||||
|
||||
<!-- Reset Scale -->
|
||||
<div class="px-4 py-2 hover:bg-[#252f3f] cursor-pointer flex items-center gap-3" onclick="window.dashboard.chart.timeScale().fitContent()">
|
||||
<span class="material-symbols-outlined text-sm">refresh</span> Reset price scale
|
||||
|
||||
Reference in New Issue
Block a user