Skip to content

Commit

Permalink
Add new settings (#46,#57,#111)
Browse files Browse the repository at this point in the history
  • Loading branch information
@ricktu288
ricktu288 committed Dec 26, 2023
1 parent bf9cd6d commit d8bc442
Show file tree
Hide file tree
Showing 16 changed files with 477 additions and 6 deletions.
13 changes: 13 additions & 0 deletions simulator/css/style.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -206,6 +206,14 @@
padding-right: 0px;
}

.settings-number {
background-color: transparent;
border: none;
border-bottom: 1px solid rgba(0, 0, 0, 0.5);
width: 40px;
text-align: center;
}

#more-options-dropdown {
width:300px;
max-height: 80vh;
Expand Down Expand Up @@ -401,4 +409,9 @@
color:white;
position:absolute;
border:none;
}

#status {
color: gray;
background-color: rgba(0,0,0,0.8);
}
63 changes: 61 additions & 2 deletions simulator/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -429,6 +429,24 @@
</div>
</div>

<div class="row d-flex justify-content-between align-items-center" data-bs-placement="left" data-bs-offset="75,0">
<div class="col-auto" data-text="grid_size"></div>
<div class="col-auto d-flex align-items-center">
<div class="flex-grow-1 d-flex align-items-center">
<input type="text" class="settings-number" id="grid_size" value="20">
</div>
</div>
</div>

<div class="row d-flex justify-content-between align-items-center" data-bs-placement="left" data-bs-offset="75,0">
<div class="col-auto" data-text="observer_size"></div>
<div class="col-auto d-flex align-items-center">
<div class="flex-grow-1 d-flex align-items-center">
<input type="text" class="settings-number" id="observer_size" value="40">
</div>
</div>
</div>

<div class="row d-flex justify-content-between align-items-center">
<div class="col-auto" data-text="zoom"></div>
<div class="col-auto d-flex align-items-center">
Expand All @@ -454,6 +472,17 @@
</button>
</div>
</div>

<div class="row d-flex justify-content-between align-items-center" data-bs-placement="left">
<div class="col-auto" data-text="show_status"></div>
<div class="col-auto d-flex align-items-center">
<div class="flex-grow-1 d-flex align-items-center">
<div class="form-check form-switch align-items-center">
<input class="form-check-input" type="checkbox" id="show_status">
</div>
</div>
</div>
</div>

<div class="row d-flex justify-content-between align-items-center" data-popover="show_help_popups_popover" data-bs-placement="left">
<div class="col-auto" data-text="show_help_popups"></div>
Expand Down Expand Up @@ -816,6 +845,23 @@
</div>
</div>
</div>
<div class="row d-flex justify-content-between align-items-center" data-bs-placement="left" data-bs-offset="75,0">
<div class="col-auto" data-text="grid_size"></div>
<div class="col-auto d-flex align-items-center">
<div class="flex-grow-1 d-flex align-items-center">
<input type="text" class="settings-number" id="grid_size_mobile" value="20">
</div>
</div>
</div>

<div class="row d-flex justify-content-between align-items-center" data-bs-placement="left" data-bs-offset="75,0">
<div class="col-auto" data-text="observer_size"></div>
<div class="col-auto d-flex align-items-center">
<div class="flex-grow-1 d-flex align-items-center">
<input type="text" class="settings-number" id="observer_size_mobile" value="40">
</div>
</div>
</div>
<div class="row d-flex justify-content-between align-items-center">
<div class="col-auto" data-text="zoom"></div>
<div class="col-auto d-flex align-items-center">
Expand All @@ -834,6 +880,17 @@
</div>

<hr class="dropdown-divider">
<div class="row d-flex justify-content-between align-items-center" data-bs-placement="left">
<div class="col-auto" data-text="show_status"></div>
<div class="col-auto d-flex align-items-center">
<div class="flex-grow-1 d-flex align-items-center">
<div class="form-check form-switch align-items-center">
<input class="form-check-input" type="checkbox" id="show_status_mobile">
</div>
</div>
</div>
</div>

<div class="row d-flex justify-content-between align-items-center">
<div class="col-auto" data-text="language"></div>
<div class="col-auto d-flex align-items-center">
Expand All @@ -842,6 +899,8 @@
</button>
</div>
</div>


</div>
</div>
</div>
Expand Down Expand Up @@ -1096,7 +1155,7 @@ <h5 class="modal-title" id="staticBackdropLabel" data-text="language"></h5>
<div class="spinner-border text-secondary" role="status"></div>
<span data-text="processing"></span>
</div>

<div id="status" style="display: none;"></div>
</div>

<!-- Footer buttons -->
Expand Down Expand Up @@ -1128,7 +1187,7 @@ <h5 class="modal-title" id="staticBackdropLabel" data-text="language"></h5>
</div>

<input type="file" id="openfile" style="display:none">
<div id="status" style="display: none;"></div>


<!--Thirdparty scripts-->
<script src="../thirdparty/jquery.min.js"></script>
Expand Down
83 changes: 82 additions & 1 deletion simulator/js/index.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -256,6 +256,64 @@ window.onload = function (e) {
localStorage.rayOpticsHelp = popoversEnabled ? "on" : "off";
};

document.getElementById('show_status').onclick = function () {
document.getElementById('show_status').checked = this.checked;
document.getElementById('show_status_mobile').checked = this.checked;

document.getElementById('status').style.display = this.checked ? '' : 'none';
localStorage.rayOpticsShowStatus = this.checked ? "on" : "off";
};
document.getElementById('show_status_mobile').onclick = document.getElementById('show_status').onclick;

if (typeof (Storage) !== "undefined" && localStorage.rayOpticsShowStatus && localStorage.rayOpticsShowStatus == "on") {
document.getElementById('show_status').checked = true;
document.getElementById('show_status_mobile').checked = true;
document.getElementById('status').style.display = '';
}

document.getElementById('grid_size').onchange = function () {
gridSize = parseFloat(this.value);
document.getElementById('grid_size').value = gridSize;
document.getElementById('grid_size_mobile').value = gridSize;
draw(true, false);
}
document.getElementById('grid_size_mobile').onchange = document.getElementById('grid_size').onchange;

document.getElementById('grid_size').onclick = function () {
this.select();
}
document.getElementById('grid_size_mobile').onclick = document.getElementById('grid_size').onclick;

document.getElementById('grid_size').onkeydown = function(e)
{
e.cancelBubble = true;
if (e.stopPropagation) e.stopPropagation();
};
document.getElementById('grid_size_mobile').onkeydown = document.getElementById('grid_size').onkeydown;

document.getElementById('observer_size').onchange = function () {
document.getElementById('observer_size').value = this.value;
document.getElementById('observer_size_mobile').value = this.value;
if (observer) {
observer.r = parseFloat(this.value) * 0.5;
}
draw(false, true);
}
document.getElementById('observer_size_mobile').onchange = document.getElementById('observer_size').onchange;

document.getElementById('observer_size').onclick = function () {
this.select();
}
document.getElementById('observer_size_mobile').onclick = document.getElementById('observer_size').onclick;

document.getElementById('observer_size').onkeydown = function(e)
{
e.cancelBubble = true;
if (e.stopPropagation) e.stopPropagation();
};
document.getElementById('observer_size_mobile').onkeydown = document.getElementById('observer_size').onkeydown;


document.getElementById('zoomPlus').onclick = function () {
setScale(scale * 1.1);
}
Expand Down Expand Up @@ -582,6 +640,13 @@ function initParameters() {
document.getElementById('setAttrAll').checked = false;
document.getElementById('applytoall_mobile').checked = false;

gridSize = 20;
document.getElementById('grid_size').value = gridSize;
document.getElementById('grid_size_mobile').value = gridSize;

document.getElementById('observer_size').value = 40;
document.getElementById('observer_size_mobile').value = 40;

draw();
}

Expand Down Expand Up @@ -746,6 +811,7 @@ function JSONOutput() {
showGrid: document.getElementById('showgrid').checked,
grid: document.getElementById('grid').checked,
lockobjs: document.getElementById('lockobjs').checked,
gridSize: gridSize,
observer: observer,
origin: origin,
scale: scale,
Expand Down Expand Up @@ -827,6 +893,9 @@ function JSONInput() {
if (!jsonData.lockobjs) {
jsonData.lockobjs = false;
}
if (!jsonData.gridSize) {
jsonData.gridSize = 20;
}

objs = jsonData.objs;
rayDensity_light = jsonData.rayDensity_light;
Expand All @@ -844,6 +913,18 @@ function JSONInput() {

observer = jsonData.observer;

if (observer) {
document.getElementById('observer_size').value = Math.round(observer.r * 2 * 1000000) / 1000000;
document.getElementById('observer_size_mobile').value = Math.round(observer.r * 2 * 1000000) / 1000000;
} else {
document.getElementById('observer_size').value = 40;
document.getElementById('observer_size_mobile').value = 40;
}

gridSize = jsonData.gridSize;
document.getElementById('grid_size').value = gridSize;
document.getElementById('grid_size_mobile').value = gridSize;

var canvasWidth = Math.ceil((canvas.width/dpr) / 100) * 100;
var canvasHeight = Math.ceil((canvas.height/dpr) / 100) * 100;

Expand Down Expand Up @@ -894,7 +975,7 @@ function modebtn_clicked(mode1) {
}
if (mode == 'observer' && !observer) {
//初始化觀察者 Initialize the observer
observer = graphs.circle(graphs.point((canvas.width * 0.5 / dpr - origin.x) / scale, (canvas.height * 0.5 / dpr - origin.y) / scale), 20);
observer = graphs.circle(graphs.point((canvas.width * 0.5 / dpr - origin.x) / scale, (canvas.height * 0.5 / dpr - origin.y) / scale), parseFloat(document.getElementById('observer_size').value) * 0.5);
}


Expand Down
9 changes: 6 additions & 3 deletions simulator/js/simulator.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,7 @@ var exportRayCountLimit = 100000;
var hasExceededTime = false;
var forceStop = false;
var lastDrawTime = -1;
var drawBeginTime = -1;
var stateOutdated = false; //上次繪圖完後狀態已經變更 The state has changed since last draw
var minShotLength = 1e-6; //光線兩次作用的最短距離(小於此距離的光線作用會被忽略) The minimal length between two interactions with rays (when smaller than this, the interaction will be ignored)
var minShotLength_squared = minShotLength * minShotLength;
Expand All @@ -36,6 +37,7 @@ function draw(skipLight, skipGrid)

if (!skipLight) {
totalTruncation = 0;
drawBeginTime = new Date();
document.getElementById('forceStop').style.display = 'none';
}

Expand Down Expand Up @@ -254,6 +256,7 @@ function shootWaitingRays() {
timerID = setTimeout(shootWaitingRays, firstBreak ? 100:1);
firstBreak = false;
document.getElementById('forceStop').style.display = '';
document.getElementById('status').innerHTML = getMsg("ray_count") + shotRayCount + '<br>' + getMsg("total_truncation") + totalTruncation.toFixed(3) + '<br>' + getMsg("time_elapsed") + (new Date() - drawBeginTime) + '<br>';

draw(true, true); // Redraw the objs to avoid outdated information (e.g. detector readings).
return;
Expand Down Expand Up @@ -633,16 +636,16 @@ function shootWaitingRays() {

if (forceStop)
{
document.getElementById('status').innerHTML = shotRayCount + ' rays (stopped)';
document.getElementById('status').innerHTML = getMsg("ray_count") + shotRayCount + '<br>' + getMsg("total_truncation") + totalTruncation.toFixed(3) + '<br>' + getMsg("time_elapsed") + (new Date() - drawBeginTime) + '<br>' + getMsg("force_stopped");
forceStop = false;
}
else if (hasExceededTime)
{
document.getElementById('status').innerHTML = shotRayCount + ' rays';
//document.getElementById('status').innerHTML = getMsg("ray_count") + shotRayCount + '<br>' + getMsg("total_truncation") + totalTruncation;
}
else
{
document.getElementById('status').innerHTML = shotRayCount + ' rays (' + (new Date() - st_time) + 'ms)';
document.getElementById('status').innerHTML = getMsg("ray_count") + shotRayCount + '<br>' + getMsg("total_truncation") + totalTruncation.toFixed(3) + '<br>' + getMsg("time_elapsed") + (new Date() - drawBeginTime);
}
document.getElementById('forceStop').style.display = 'none';
//ctx.stroke();
Expand Down
28 changes: 28 additions & 0 deletions simulator/locales/de.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -726,6 +726,18 @@ locales["de"] = {
"incomplete": true,
"message": "Defines whether to show help popups when hovering over buttons. (Reload the page to take effect.)"
},
"show_status": {
"incomplete": true,
"message": "Show status box"
},
"grid_size": {
"incomplete": true,
"message": "Grid Size (px)"
},
"observer_size": {
"incomplete": true,
"message": "Observer Size (px)"
},
"language": {
"incomplete": true,
"message": "Language"
Expand All @@ -737,5 +749,21 @@ locales["de"] = {
"advanced_help": {
"incomplete": true,
"message": "For advanced help, see the help icon in the lower-right corner."
},
"ray_count": {
"incomplete": true,
"message": "Number of ray segments: "
},
"total_truncation": {
"incomplete": true,
"message": "Truncated brightness: "
},
"time_elapsed": {
"incomplete": true,
"message": "Time elapsed (ms): "
},
"force_stopped": {
"incomplete": true,
"message": "Force stopped."
}
}
21 changes: 21 additions & 0 deletions simulator/locales/en.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -663,6 +663,15 @@ locales["en"] = {
"show_help_popups_popover": {
"message": "Defines whether to show help popups when hovering over buttons. (Reload the page to take effect.)"
},
"show_status": {
"message": "Show status box"
},
"grid_size": {
"message": "Grid Size (px)"
},
"observer_size": {
"message": "Observer Size (px)"
},
"language": {
"message": "Language"
},
Expand All @@ -671,5 +680,17 @@ locales["en"] = {
},
"advanced_help": {
"message": "For advanced help, see the help icon in the lower-right corner."
},
"ray_count": {
"message": "Number of ray segments: "
},
"total_truncation": {
"message": "Truncated brightness: "
},
"time_elapsed": {
"message": "Time elapsed (ms): "
},
"force_stopped": {
"message": "Force stopped."
}
}
Loading

0 comments on commit d8bc442

Please sign in to comment.