mirror of https://github.com/MISP/misp-dashboard
Added zoom selector
parent
2b6e696548
commit
d24a41cf39
|
@ -5,6 +5,7 @@ graph_log_refresh_rate = 1
|
||||||
rotation_wait_time = 30
|
rotation_wait_time = 30
|
||||||
max_img_rotation = 10
|
max_img_rotation = 10
|
||||||
hours_spanned = 48
|
hours_spanned = 48
|
||||||
|
zoomlevel = 15
|
||||||
|
|
||||||
[Log]
|
[Log]
|
||||||
fieldname_order=["id", "category", "type", "value"]
|
fieldname_order=["id", "category", "type", "value"]
|
||||||
|
|
|
@ -86,7 +86,8 @@ def index():
|
||||||
graph_log_refresh_rate=cfg.getint('Dashboard' ,'graph_log_refresh_rate'),
|
graph_log_refresh_rate=cfg.getint('Dashboard' ,'graph_log_refresh_rate'),
|
||||||
rotation_wait_time=cfg.getint('Dashboard' ,'rotation_wait_time'),
|
rotation_wait_time=cfg.getint('Dashboard' ,'rotation_wait_time'),
|
||||||
max_img_rotation=cfg.getint('Dashboard' ,'max_img_rotation'),
|
max_img_rotation=cfg.getint('Dashboard' ,'max_img_rotation'),
|
||||||
hours_spanned=cfg.getint('Dashboard' ,'hours_spanned')
|
hours_spanned=cfg.getint('Dashboard' ,'hours_spanned'),
|
||||||
|
zoomlevel=cfg.getint('Dashboard' ,'zoomlevel')
|
||||||
)
|
)
|
||||||
|
|
||||||
@app.route("/_logs")
|
@app.route("/_logs")
|
||||||
|
|
|
@ -138,6 +138,13 @@ $(document).ready(function () {
|
||||||
mapEventManager._timeoutRotate = setTimeout(function(){ mapEventManager.rotateMap(); }, ROTATIONWAITTIME);
|
mapEventManager._timeoutRotate = setTimeout(function(){ mapEventManager.rotateMap(); }, ROTATIONWAITTIME);
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
|
$( "#zoom_selector" ).change(function() {
|
||||||
|
var sel = parseInt($( this ).val());
|
||||||
|
zoomlevel = sel;
|
||||||
|
ZOOMLEVEL = sel;
|
||||||
|
});
|
||||||
|
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
||||||
|
|
|
@ -5,9 +5,10 @@ const MAXIMGROTATION = max_img_rotation;
|
||||||
const OSMURL='http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png';
|
const OSMURL='http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png';
|
||||||
const OSMATTRIB='Map data © <a href="http://openstreetmap.org">OpenStreetMap</a> contributors';
|
const OSMATTRIB='Map data © <a href="http://openstreetmap.org">OpenStreetMap</a> contributors';
|
||||||
var ROTATIONWAITTIME = 1000*rotation_wait_time; //seconds
|
var ROTATIONWAITTIME = 1000*rotation_wait_time; //seconds
|
||||||
|
var ZOOMLEVEL = zoomlevel;
|
||||||
|
|
||||||
var myOpenStreetMap = L.map('feedDivMap1').setView([0, 0], 1);
|
var myOpenStreetMap = L.map('feedDivMap1').setView([0, 0], 1);
|
||||||
var osm = new L.TileLayer(OSMURL, {minZoom: 0, maxZoom: 17}).addTo(myOpenStreetMap);
|
var osm = new L.TileLayer(OSMURL, {minZoom: 0, maxZoom: 18}).addTo(myOpenStreetMap);
|
||||||
|
|
||||||
class MapEvent {
|
class MapEvent {
|
||||||
constructor(json, marker) {
|
constructor(json, marker) {
|
||||||
|
@ -83,7 +84,7 @@ class MapEventManager {
|
||||||
this._latToPing = mapEvent.coord.lat;
|
this._latToPing = mapEvent.coord.lat;
|
||||||
this._lonToPing = mapEvent.coord.lon;
|
this._lonToPing = mapEvent.coord.lon;
|
||||||
var marker = mapEvent.marker;
|
var marker = mapEvent.marker;
|
||||||
myOpenStreetMap.flyTo([mapEvent.coord.lat, mapEvent.coord.lon], 15);
|
myOpenStreetMap.flyTo([mapEvent.coord.lat, mapEvent.coord.lon], ZOOMLEVEL);
|
||||||
mapEvent.marker.bindPopup(mapEvent.textMarker).openPopup();
|
mapEvent.marker.bindPopup(mapEvent.textMarker).openPopup();
|
||||||
|
|
||||||
$("#textMap1").fadeOut(400, function(){ $(this).text(mapEvent.text); }).fadeIn(400);
|
$("#textMap1").fadeOut(400, function(){ $(this).text(mapEvent.text); }).fadeIn(400);
|
||||||
|
|
|
@ -49,6 +49,12 @@ table {
|
||||||
margin-right:auto;
|
margin-right:auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.leftSepa {
|
||||||
|
border-left-color: rgb(221, 221, 221);
|
||||||
|
border-left-style: solid;
|
||||||
|
border-left-width: 2px;
|
||||||
|
padding-left: 8px;
|
||||||
|
}
|
||||||
|
|
||||||
small {
|
small {
|
||||||
font-size: 100%;
|
font-size: 100%;
|
||||||
|
@ -81,13 +87,23 @@ small {
|
||||||
<div class="panel-heading bg-info" style="font-weight: bold;">
|
<div class="panel-heading bg-info" style="font-weight: bold;">
|
||||||
<b id="textMap1"> No map </b>
|
<b id="textMap1"> No map </b>
|
||||||
<div style="float: right;">
|
<div style="float: right;">
|
||||||
<i id="txtMapNum">1</i><i>/{{ max_img_rotation }}</i>
|
<i class="leftSepa" id="txtMapNum">Rotation speed: </i>
|
||||||
<select id="rotation_wait_time_selector" style="margin-top: -7px;">
|
<select id="rotation_wait_time_selector" style="margin-top: -7px;">
|
||||||
<option value="∞" selected>No rotation</option>
|
<option value="∞" selected>No rotation</option>
|
||||||
<option value="{{ rotation_wait_time }}" selected>{{ rotation_wait_time }} sec</option>
|
<option value="{{ rotation_wait_time }}" selected>{{ rotation_wait_time }} sec</option>
|
||||||
<option value="{{ rotation_wait_time * 2 }}">{{ rotation_wait_time * 2 }} sec</option>
|
<option value="{{ rotation_wait_time * 2 }}">{{ rotation_wait_time * 2 }} sec</option>
|
||||||
<option value="{{ rotation_wait_time * 5}}">{{ rotation_wait_time * 5 }} sec</option>
|
<option value="{{ rotation_wait_time * 5}}">{{ rotation_wait_time * 5 }} sec</option>
|
||||||
</select>
|
</select>
|
||||||
|
<i class="leftSepa" id="txtMapNum">Zoom level: </i>
|
||||||
|
<select id="zoom_selector" style="margin-top: -7px;">
|
||||||
|
<option value="{{ zoomlevel + 3 }}">{{ zoomlevel + 3 }}</option>
|
||||||
|
<option value="{{ zoomlevel + 2 }}">{{ zoomlevel + 2 }}</option>
|
||||||
|
<option value="{{ zoomlevel }}" selected>{{ zoomlevel }}</option>
|
||||||
|
<option value="{{ zoomlevel - 2 }}">{{ zoomlevel - 2 }}</option>
|
||||||
|
<option value="{{ zoomlevel - 4 }}">{{ zoomlevel - 4 }}</option>
|
||||||
|
<option value="{{ zoomlevel - 6 }}">{{ zoomlevel - 6 }}</option>
|
||||||
|
<option value="{{ zoomlevel - 8 }}">{{ zoomlevel - 8 }}</option>
|
||||||
|
</select>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div id="panelbody" class="panel-body" style="height: 93%; padding: 5px">
|
<div id="panelbody" class="panel-body" style="height: 93%; padding: 5px">
|
||||||
|
@ -191,6 +207,7 @@ small {
|
||||||
var rotation_wait_time = {{ rotation_wait_time }};
|
var rotation_wait_time = {{ rotation_wait_time }};
|
||||||
var max_img_rotation = {{ max_img_rotation }};
|
var max_img_rotation = {{ max_img_rotation }};
|
||||||
var hours_spanned = {{ hours_spanned }};
|
var hours_spanned = {{ hours_spanned }};
|
||||||
|
var zoomlevel = {{ zoomlevel}};
|
||||||
|
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
|
|
Loading…
Reference in New Issue