optimized gui

This commit is contained in:
David Brazda
2023-09-21 23:24:49 +02:00
parent 2bfd51845f
commit 2887e37ed1
5 changed files with 78 additions and 29 deletions

View File

@ -107,6 +107,7 @@
</div>
</div>
</div>
<div class="lowercontainer" id="lowercontainer"></div>
</div>
</div>
<div id="hist-trades" class="flex-items">
@ -623,7 +624,9 @@
<input type="text" id="itemName"><br><br>
<label for="jsonTextarea">JSON Data:</label><br>
<textarea id="jsonTextarea" rows="15" cols="75"></textarea><br><br>
<!-- <textarea id="jsonTextarea" rows="15" cols="75"></textarea><br><br> -->
<div id="json_editor" style="height: 513px;width: 1100px;;border:1px solid black;"></div>
<button type="button" id="saveButton">Save</button>
<button type="button" id="addButton">Add</button>

View File

@ -333,6 +333,7 @@ function chart_archived_run(archRecord, data, oneMinuteBars) {
//define tooltip
const container1 = document.getElementById('chart');
const containerlower = document.getElementById('lowercontainer');
const toolTipWidth = 90;
const toolTipHeight = 90;
@ -352,7 +353,7 @@ function chart_archived_run(archRecord, data, oneMinuteBars) {
initialize_chart()
container1.append(switcherElement)
containerlower.append(switcherElement)
candlestickSeries = null
@ -376,7 +377,7 @@ function chart_archived_run(archRecord, data, oneMinuteBars) {
remove_indicators();
btnElement = document.getElementById("indicatorsButtons")
if (btnElement) {
container1.removeChild(btnElement);
containerlower.removeChild(btnElement);
}
if (interval == native_resolution) {
@ -390,7 +391,7 @@ function chart_archived_run(archRecord, data, oneMinuteBars) {
//buttonky jako vypnute
var indbuttonElement = populate_indicator_buttons(false);
}
container1.append(indbuttonElement);
containerlower.append(indbuttonElement);
display_buy_markers();

View File

@ -1,3 +1,5 @@
let editor_json
//JS code for FRONTEND CONFIG FORM
$(document).ready(function () {
// API Base URL
@ -25,22 +27,24 @@ $(document).ready(function () {
if (((to_select !== null) && (to_select == item.id)) || ((to_select == null) && (index==0))) {
selected = "SELECTED"
$('#itemName').val(item.item_name);
$('#jsonTextarea').val(item.json_data);
//$('#jsonTextarea').val(item.json_data);
if (!editor_json) {
require(["vs/editor/editor.main"], () => {
editor_json = monaco.editor.create(document.getElementById('json_editor'), {
value: item.json_data,
language: 'json',
theme: 'vs-dark',
automaticLayout: true
});
});
}
else
{
editor_json.setValue(item.json_data)
}
editingItemId = item.id;
// Get the textarea element.
var textarea = $("#jsonTextarea");
// // Highlight the JSON formatted string in the textarea.
// hljs.highlightElement(textarea.get(0));
// console.log(textarea.get(0))
// console.log(textarea.get(1))
// // Highlight the JSON formatted string whenever the textarea is edited.
// textarea.on("input", function() {
// hljs.highlightElement(textarea.get(0));
// //hljs.highlightBlock(textarea.get(0),{ language: 'json' });
// });
}
configList.append(`<option value="${item.id}" ${selected}>${item.item_name}</option>`);
});
@ -54,8 +58,9 @@ $(document).ready(function () {
localArray.forEach((item, index, array) => {
if (item.id == itemId) {
$('#itemName').val(item.item_name);
$('#jsonTextarea').val(item.json_data);
//$('#jsonTextarea').val(item.json_data);
editingItemId = itemId;
editor_json.setValue(item.json_data)
}
});
}
@ -76,7 +81,8 @@ $(document).ready(function () {
// Save or add a config item
$('#saveButton').click(function () {
const itemName = $('#itemName').val();
const jsonData = $('#jsonTextarea').val();
//const jsonData = $('#jsonTextarea').val();
const jsonData = editor_json.getValue()
var validformat = false
$('#addButton').attr('disabled', false);
$('#deleteButton').attr('disabled', false);
@ -133,7 +139,8 @@ $(document).ready(function () {
$('#addButton').click(function () {
$('#configList').val('');
$('#itemName').val('');
$('#jsonTextarea').val('');
editor_json.setValue('')
//$('#jsonTextarea').val('');
editingItemId = null;
$('#addButton').attr('disabled', true);
$('#deleteButton').attr('disabled', true);
@ -154,7 +161,8 @@ $(document).ready(function () {
if (editingItemId == null) {
$('#configList').val('');
$('#itemName').val('');
$('#jsonTextarea').val('');
editor_json.setValue('')
//$('#jsonTextarea').val('');
}
else {
var confirmed = window.confirm("Confirm?");

View File

@ -1,8 +1,12 @@
API_KEY = localStorage.getItem("api-key")
var chart = null
var colors = ["#8B1874","#B71375","#B46060","#61c740","#BE6DB7","#898121","#4389d9","#00425A","#B5D5C5","#e61957","#8B1874","#B71375","#B46060","#61c740","#BE6DB7","#898121","#4389d9","#00425A","#B5D5C5","#e61957"]
var reset_colors = ["#8B1874","#B71375","#B46060","#61c740","#BE6DB7","#898121","#4389d9","#00425A","#B5D5C5","#e61957","#8B1874","#B71375","#B46060","#61c740","#BE6DB7","#898121","#4389d9","#00425A","#B5D5C5","#e61957"]
// var colors = ["#8B1874","#B71375","#B46060","#61c740","#BE6DB7","#898121","#4389d9","#00425A","#B5D5C5","#e61957","#8B1874","#B71375","#B46060","#61c740","#BE6DB7","#898121","#4389d9","#00425A","#B5D5C5","#e61957"]
// var reset_colors = ["#8B1874","#B71375","#B46060","#61c740","#BE6DB7","#898121","#4389d9","#00425A","#B5D5C5","#e61957","#8B1874","#B71375","#B46060","#61c740","#BE6DB7","#898121","#4389d9","#00425A","#B5D5C5","#e61957"]
var colors = ["#8B1874","#B71375","#B46060","#61c740","#BE6DB7","#898121","#4389d9","#00425A","#B5D5C5","#e61957","#7B0E60","#550844","#9B2888","#BD38A0","#A30F68","#6E0B50","#CA2183","#E6319B","#A04C54","#643848","#CA7474","#E68D8D","#4F9C34","#3B7128","#73DF4D","#95EF65","#A857A4","#824690","#D087CC","#E2A1DF","#79711B","#635D17","#99912B","#B1A73D","#3779C9","#2B68B3","#5599ED","#77A9F7","#003A4C","#002F3B","#004C67","#00687D","#A1C6B5","#8CC6A5","#C9E6D5","#E4F6EA","#D2144A","#A60F3B","#FA2463","#FF3775"];
var reset_colors = ["#8B1874","#B71375","#B46060","#61c740","#BE6DB7","#898121","#4389d9","#00425A","#B5D5C5","#e61957","#7B0E60","#550844","#9B2888","#BD38A0","#A30F68","#6E0B50","#CA2183","#E6319B","#A04C54","#643848","#CA7474","#E68D8D","#4F9C34","#3B7128","#73DF4D","#95EF65","#A857A4","#824690","#D087CC","#E2A1DF","#79711B","#635D17","#99912B","#B1A73D","#3779C9","#2B68B3","#5599ED","#77A9F7","#003A4C","#002F3B","#004C67","#00687D","#A1C6B5","#8CC6A5","#C9E6D5","#E4F6EA","#D2144A","#A60F3B","#FA2463","#FF3775"];
var indList = []
var verticalSeries=null
var candlestickSeries = null

View File

@ -281,8 +281,15 @@ html {
width: 100%;
}
#lowercontainer {
display: contents;
/* width: 500px; */
}
#indicatorsButtons {
display: contents;
/* width: 500px; */
}
pre {
display: block;
@ -352,7 +359,7 @@ pre {
/* color: var(--bs-dark-text-emphasis); */
}
.switcher {
/* .switcher {
display: flex;
align-items: center;
margin-left: 54px;
@ -360,9 +367,19 @@ pre {
height: 30px;
margin-top: 8px;
color: #2196F3;
} */
.switcher {
display: flex;
/* align-items: center; */
/* margin-left: 54px; */
/* width: 269px; */
margin-top: 5px;
margin-bottom: 3px;
color: #2196F3;
}
.switcher-item {
/* .switcher-item {
cursor: pointer;
text-decoration: none;
display: inline-block;
@ -374,6 +391,22 @@ pre {
border: none;
border-radius: 4px;
outline: none;
} */
.switcher-item {
cursor: pointer;
text-decoration: none;
display: inline-block;
padding: 3px 6px;
font-size: 14px;
/* color: #262b3e; */
/* background-color: #818581; */
background-color: #0202022e;;
margin-right: 8px;
margin-bottom: 6px;
border: none;
border-radius: 5px;
outline: none;
}
.switcher-item:hover {