diff --git a/app/api/common.py b/app/api/common.py
index 017750b9..8e8df1e5 100644
--- a/app/api/common.py
+++ b/app/api/common.py
@@ -40,7 +40,7 @@ def get_tile_json(name, tiles, bounds):
'scheme': 'tms',
'tiles': tiles,
'minzoom': 0,
- 'maxzoom': 22,
+ 'maxzoom': 21,
'bounds': bounds
}
diff --git a/app/static/app/js/ModelView.jsx b/app/static/app/js/ModelView.jsx
index 1f5be817..ed0de590 100644
--- a/app/static/app/js/ModelView.jsx
+++ b/app/static/app/js/ModelView.jsx
@@ -1,6 +1,7 @@
import React from 'react';
import './css/ModelView.scss';
import ErrorMessage from './components/ErrorMessage';
+import Standby from './components/Standby';
import $ from 'jquery';
const THREE = require('three'); // import does not work :/
@@ -495,6 +496,8 @@ class ModelView extends React.Component {
if (modelReference === null && !initializingModel){
initializingModel = true;
+ this.texturedModelStandby.show();
+
const mtlLoader = new THREE.MTLLoader();
mtlLoader.setTexturePath(this.texturedModelDirectoryPath());
mtlLoader.setPath(this.texturedModelDirectoryPath());
@@ -528,6 +531,7 @@ class ModelView extends React.Component {
modelReference = object;
initializingModel = false;
+ this.texturedModelStandby.hide();
});
});
}else{
@@ -1052,8 +1056,13 @@ class ModelView extends React.Component {
{ this.container = domNode; }}
- style={{height: "100%", width: "100%"}}
- onContextMenu={(e) => {e.preventDefault();}}>
+ style={{height: "100%", width: "100%", position: "relative"}}
+ onContextMenu={(e) => {e.preventDefault();}}>
+ { this.texturedModelStandby = domNode; }}
+ />
+
);
}
}
diff --git a/app/static/app/js/components/Map.jsx b/app/static/app/js/components/Map.jsx
index 5eeb3019..56ca4483 100644
--- a/app/static/app/js/components/Map.jsx
+++ b/app/static/app/js/components/Map.jsx
@@ -56,19 +56,19 @@ class Map extends React.Component {
"Google Maps Hybrid": L.tileLayer('//{s}.google.com/vt/lyrs=s,h&x={x}&y={y}&z={z}', {
attribution: 'Map data: © Google Maps',
subdomains: ['mt0','mt1','mt2','mt3'],
- maxZoom: 22,
+ maxZoom: 21,
minZoom: 0,
label: 'Google Maps Hybrid'
}).addTo(this.map),
"ESRI Satellite": L.tileLayer('//server.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tile/{z}/{y}/{x}', {
attribution: 'Tiles © Esri — Source: Esri, i-cubed, USDA, USGS, AEX, GeoEye, Getmapping, Aerogrid, IGN, IGP, UPR-EGP, and the GIS User Community',
- maxZoom: 22,
+ maxZoom: 21,
minZoom: 0,
label: 'ESRI Satellite' // optional label used for tooltip
}),
"OSM Mapnik": L.tileLayer('//{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
attribution: '© OpenStreetMap',
- maxZoom: 22,
+ maxZoom: 21,
minZoom: 0,
label: 'OSM Mapnik' // optional label used for tooltip
})
diff --git a/app/static/app/js/components/Standby.jsx b/app/static/app/js/components/Standby.jsx
new file mode 100644
index 00000000..7831139b
--- /dev/null
+++ b/app/static/app/js/components/Standby.jsx
@@ -0,0 +1,47 @@
+import React from 'react';
+import '../css/Standby.scss';
+
+class Standby extends React.Component {
+ static defaultProps = {
+ message: ""
+ };
+
+ static propTypes = {
+ message: React.PropTypes.string
+ };
+
+ constructor(props){
+ super(props);
+
+ this.state = {
+ message: props.message,
+ show: false
+ }
+ }
+
+ show(message = null){
+ this.setState({show: true});
+ if (message){
+ this.setState({message: message});
+ }
+ }
+
+ hide(){
+ this.setState({show: false});
+ }
+
+ render() {
+ return (
+
+
+
+
+
{this.state.message}
+
+
+ );
+ }
+}
+
+export default Standby;
diff --git a/app/static/app/js/css/Standby.scss b/app/static/app/js/css/Standby.scss
new file mode 100644
index 00000000..060a54f8
--- /dev/null
+++ b/app/static/app/js/css/Standby.scss
@@ -0,0 +1,26 @@
+.standby{
+ position: absolute;
+ top: 0;
+ bottom: 0;
+ left: 0;
+ right: 0;
+ .cover{
+ opacity: 0.5;
+ background-color: #111;
+ position: absolute;
+ top: 0;
+ bottom: 0;
+ left: 0;
+ right: 0;
+ }
+ .content{
+ text-align: center;
+ position: absolute;
+ top: 45%;
+ bottom: 0;
+ left: 0;
+ right: 0;
+ padding: 0;
+ color: white;
+ }
+}
\ No newline at end of file