Welcome to the WIP community map of
Derail Valley, a resource for documenting and displaying all tracks and points of interest.
diff --git a/index.js b/index.js
index 700e1a1..ea31fde 100644
--- a/index.js
+++ b/index.js
@@ -503,7 +503,7 @@ function redrawDynamics(){
if(markerX > mapCanvas.width + Config.viewCullMargin || markerX < -Config.viewCullMargin || markerY > mapCanvas.height + Config.viewCullMargin || markerY < -Config.viewCullMargin) continue; // View Culling
switch(marker.type){
case 'player':
- if(!(MapData.layers.poi)) break;
+ if(!(MapData.layers.dynamic && MapData.layers.player)) break;
marker.visible = true;
curSprite = Config.spriteBounds.player;
spriteSize = 45;
@@ -526,7 +526,7 @@ function redrawDynamics(){
curSprite = null;
break;
case 'car':
- if(!(MapData.layers.poi)) break;
+ if(!(MapData.layers.dynamic && MapData.layers.cars)) break;
let scale = MapData.view.pixelRatio * MapData.view.scale;
let limitScaleRatio = (MapData.view.pixelRatio * Math.max(MapData.view.scale, 3)) / scale;
let width = marker.width * scale;
diff --git a/legend.js b/legend.js
index 4d296c1..ec41f1b 100644
--- a/legend.js
+++ b/legend.js
@@ -234,7 +234,39 @@ let settingEntries = [
func: state =>{
MapData.setLocationUpdateRate(Number(state) * 1000);
}
- }
+ },
+ {
+ label: 'Dynamic Objects',
+ id: 'toggle_dynamic',
+ saveState: true,
+ state: true,
+ func: state => {
+ MapData.layers.dynamic = state;
+ MapData.view.dynDirty = true;
+ },
+ children: [
+ {
+ label: 'Player',
+ id: 'toggle_player',
+ saveState: true,
+ state: true,
+ func: state =>{
+ MapData.layers.player = state;
+ MapData.view.dynDirty = true;
+ }
+ },
+ {
+ label: 'Cars',
+ id: 'toggle_cars',
+ saveState: true,
+ state: true,
+ func: state =>{
+ MapData.layers.cars = state;
+ MapData.view.dynDirty = true;
+ },
+ },
+ ]
+ },
];
const legendKey = document.getElementById('legendKey');
diff --git a/style.css b/style.css
index 4858a56..884a230 100644
--- a/style.css
+++ b/style.css
@@ -22,10 +22,13 @@ html, body{
}
a{
- color: #85c4f7;
+ color: #79bcf3;
}
a:visited{
- color: #559bd4;
+ color: #5ea8e4;
+}
+a:hover{
+ color: #e79830;
}
.orange{
@@ -56,6 +59,28 @@ a:visited{
border-bottom: 2px solid #b3b3b396;
}
+.linkpanel{
+ padding: 3px 3px;
+ >a{
+ display: inline-block;
+ white-space: nowrap;
+ text-decoration: none;
+ background: #191e2e;
+ padding: 2px 4px;
+ margin: 2px 1px;
+ border: 2px solid #b3b3b396;
+ border-radius: 8px;
+ }
+ a::after{
+ content: ' ⧉';
+ font-size: 10px;
+ }
+ a:hover{
+ color: #31281b;
+ background: #e79830;
+ }
+}
+
#topleft{
position:fixed;
top: 0px;