mirror of
https://github.com/OpenBB-finance/OpenBB.git
synced 2026-10-27 12:40:35 +00:00
30ca6c69e0
* init * Update style.css * oops was stashed * Update popups.js * bump plotly.js version * fix disappearing modebar
182 lines
7.2 KiB
HTML
Vendored
182 lines
7.2 KiB
HTML
Vendored
<html>
|
|
<head>
|
|
<meta charset="utf-8" />
|
|
<meta name="color-scheme" content="dark" />
|
|
<link rel="stylesheet" href="/{{MAIN_PATH}}/web/css/style.css" />
|
|
|
|
<script src="/{{MAIN_PATH}}/web/helpers.js" type="text/javascript"></script>
|
|
<script
|
|
src="/{{MAIN_PATH}}/web/bar_menus.js"
|
|
type="text/javascript"
|
|
></script>
|
|
<script src="/{{MAIN_PATH}}/web/popups.js" type="text/javascript"></script>
|
|
<script src="/{{MAIN_PATH}}/web/main.js" type="text/javascript"></script>
|
|
<script
|
|
src="/{{PLOTLYJS_PATH}}"
|
|
type="text/javascript"
|
|
></script>
|
|
<script
|
|
src="https://cdnjs.cloudflare.com/ajax/libs/dom-to-image/2.6.0/dom-to-image.min.js"
|
|
integrity="sha512-01CJ9/g7e8cUmY0DFTMcUw/ikS799FHiOA0eyHsUWfOetgbx/t6oV4otQ5zXKQyIrQGTHSmRVPIgrgLcZi/WMA=="
|
|
crossorigin="anonymous"
|
|
referrerpolicy="no-referrer"
|
|
></script>
|
|
</head>
|
|
|
|
<body>
|
|
<!-- Plotly -->
|
|
<div id="openbb_container">
|
|
<div
|
|
id="openbb_header"
|
|
class="_header flex items-center justify-between gap-4 py-2 px-4 text-center"
|
|
style="z-index: 99999999999; width: 100%; top: 0; max-height: 60px;"
|
|
>
|
|
<div class="w-1/3">
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
width="64"
|
|
height="40"
|
|
fill="none"
|
|
viewBox="0 0 64 40"
|
|
>
|
|
<path
|
|
fill="#fff"
|
|
d="M61.283 3.965H33.608v27.757h25.699V19.826H37.561v-3.965H63.26V3.965h-1.977zM39.538 23.792h15.815v3.965H37.561v-3.965h1.977zM59.306 9.913v1.983H37.561V7.931h21.745v1.982zM33.606 0h-3.954v3.965H33.606V0zM25.7 3.966H0V15.86h25.7v3.965H3.953v11.896h25.7V3.966h-3.955zm0 21.808v1.983H7.907v-3.965h17.791v1.982zm0-15.86v1.982H3.953V7.931h21.745v1.982zM37.039 35.693v2.952l-.246-.246-.245-.245-.245-.247-.245-.246-.246-.246-.245-.245-.245-.247-.247-.246-.245-.246-.245-.246-.245-.246-.246-.246h-.49v3.936h.49v-3.198l.246.246.245.246.245.246.245.246.246.246.246.246.245.247.246.245.245.246.245.247.245.246.246.245.245.246h.245v-3.936h-.49zM44.938 37.17h-.491v-1.477h-2.944v3.937h3.93v-2.46h-.495zm-2.944-.246v-.739h1.962v.984h-1.962v-.245zm2.944.984v1.23h-2.944V37.66h2.944v.247zM52.835 37.17h-.49v-1.477h-2.946v3.937h3.925v-2.46h-.489zm-2.944-.246v-.739h1.963v.984h-1.965l.002-.245zm2.944.984v1.23H49.89V37.66h2.946v.247zM29.174 35.693H25.739v3.936H29.663v-.491H26.229v-.984h2.943v-.493H26.229v-1.476h3.434v-.492h-.489zM13.37 35.693H9.934v3.937h3.925v-3.937h-.49zm0 .738v2.709h-2.945v-2.955h2.943l.001.246zM21.276 35.693h-3.435v3.937h.491v-1.476h3.434v-2.461h-.49zm0 .738v1.23h-2.944v-1.476h2.944v.246z"
|
|
></path>
|
|
</svg>
|
|
</div>
|
|
<strong class="w-1/3 font-bold" id="title" style="font-size: 16px;"></strong>
|
|
<p class="w-1/3 text-right" id="date"></p>
|
|
</div>
|
|
<div
|
|
id="openbb_chart"
|
|
class="plotly-graph-div"
|
|
></div>
|
|
<div
|
|
id="openbb_footer"
|
|
class="_footer flex items-center justify-between gap-4 py-2 px-4 text-center"
|
|
style="z-index: 99999999999; width: 100%; bottom: 0; max-height: 60px;"
|
|
>......................</div>
|
|
</div>
|
|
|
|
<div id="loading" class="saving">
|
|
<div id="loading_text" class="loading_text"></div><div id="loader" class="loader"></div>
|
|
</div>
|
|
|
|
|
|
<!-- Popups Overlay -->
|
|
<div id="popup_overlay" class="popup_overlay">
|
|
<div id="popup_content" class="popup_content">
|
|
<!-- CSV Popup -->
|
|
<div id="popup_csv" class="popup_content">
|
|
<div>
|
|
<label for="csv_file">CSV file</label>
|
|
<input type="file" id="csv_file" accept=".csv, .txt" />
|
|
</div>
|
|
|
|
<div style="margin-top: 10px">
|
|
<label for="csv_trace_type">Display data type</label>
|
|
<select id="csv_trace_type" value="scatter">
|
|
<option value="scatter">Scatter</option>
|
|
<option value="candlestick">Candlestick</option>
|
|
</select>
|
|
</div>
|
|
|
|
<div style="margin-top: 10px">
|
|
<label for="csv_name">Name of the trace</label>
|
|
<textarea
|
|
id="csv_name" style="width: 100%; max-width: 100%;
|
|
max-height: 200px; margin-top: 8px;" rows="2" cols="20"
|
|
value="" placeholder="Enter a name for the trace"></textarea>
|
|
</div>
|
|
|
|
<div style="margin-top: 10px" id="csv_columns"><!-- Empty --></div>
|
|
<div style="margin-top: 10px" id="csv_colors"><!-- Empty --></div>
|
|
|
|
<div style="margin-top: 10px; display: none;" id="csv_scatter_options">
|
|
|
|
<div id="csv_percent_change_div" style="display: none;">
|
|
<input type="checkbox" id="csv_percent_change" name="csv_scatter_check" onclick="onlyOne(this)" />
|
|
<label for="csv_percent_change">Plot as percent change from first value</label>
|
|
</div><br />
|
|
|
|
<input type="checkbox" id="csv_same_yaxis" name="csv_scatter_check" onclick="onlyOne(this)" />
|
|
<label for="csv_same_yaxis">Share Y-axis</label>
|
|
</div><br />
|
|
|
|
<div style="float: right; margin-top: 20px">
|
|
<button
|
|
class="_btn-tertiary"
|
|
id="csv_cancel"
|
|
onclick="closePopup()"
|
|
>
|
|
Cancel
|
|
</button>
|
|
<button class="_btn" id="csv_submit" onclick="on_submit('csv')">
|
|
Submit
|
|
</button>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Text Popup -->
|
|
<div class="popup_content" id="popup_text"></div>
|
|
|
|
<!-- Title Popup -->
|
|
<div class="popup_content" id="popup_title"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Change Color Popup -->
|
|
<div id="changecolor">
|
|
<div id="changecolor_header">
|
|
<input
|
|
type="color"
|
|
id="picked_color"
|
|
value="#00ACFF"
|
|
onchange="update_color()"
|
|
/>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Plotly Chart -->
|
|
<script type="text/javascript">
|
|
window.PlotlyConfig = { MathJaxConfig: "local" };
|
|
|
|
var interval = setInterval(function () {
|
|
// Waits for OpenBBMain and plotly_figure to be defined before
|
|
// calling OpenBBMain to avoid errors
|
|
if (typeof OpenBBMain != "undefined" && window.plotly_figure) {
|
|
clearInterval(interval);
|
|
const date = new Date();
|
|
const formattedDate = new Intl.DateTimeFormat("en-GB", {
|
|
dateStyle: "full",
|
|
timeStyle: "long",
|
|
})
|
|
.format(date)
|
|
.replace(/:\d\d /, " ");
|
|
|
|
document
|
|
.querySelector('meta[name="color-scheme"]')
|
|
.setAttribute("content", window.plotly_figure.layout.template.layout.mapbox.style);
|
|
|
|
document.getElementById("date").innerHTML = formattedDate;
|
|
document.getElementById("title").innerHTML =
|
|
window.plotly_figure?.layout?.title?.text ?? "Interactive Chart";
|
|
|
|
CHART_DIV = document.getElementById("openbb_chart");
|
|
CSV_DIV = document.getElementById("popup_csv");
|
|
TEXT_DIV = document.getElementById("popup_text");
|
|
TITLE_DIV = document.getElementById("popup_title");
|
|
OpenBBMain(
|
|
window.plotly_figure,
|
|
CHART_DIV,
|
|
CSV_DIV,
|
|
TEXT_DIV,
|
|
TITLE_DIV
|
|
);
|
|
}
|
|
}, 20);
|
|
</script>
|
|
</body>
|
|
</html>
|