removed the UI elements for zooming and panning

This commit is contained in:
Mavis Ou 2013-04-24 16:25:58 -07:00
Родитель 7fce472001
Коммит 07c6d15eda
3 изменённых файлов: 1 добавлений и 173 удалений

Просмотреть файл

@ -40,14 +40,6 @@
</div>
</div>
<ul class="controls_options">
<li class="zooming">
<a class="move-up"><i class="icon-circle-arrow-up"></i></a>
<a class="move-left"><i class="icon-circle-arrow-left"></i></a>
<a class="move-right"><i class="icon-circle-arrow-right"></i></a>
<a class="zoom-in"><i class="icon-plus-sign"></i></a>
<a class="zoom-out"><i class="icon-minus-sign"></i></a>
<a class="move-down"><i class="icon-circle-arrow-down"></i></a>
</li>
<li class="upload"><a><i class="icon-arrow-up"></i>Share Data</a></li>
<li class="download"><a><i class="icon-arrow-down"></i>Download data</a></li>
<li class="reset-data"><a><i class="icon-refresh"></i>Reset data</a></li>
@ -66,14 +58,6 @@
<header class="subhead">Location</header>
<div class="map-section">
<div><span id="country">&nbsp;</span></div>
<div class="map-control zooming">
<a class="move-up"><i class="icon-circle-arrow-up"></i></a>
<a class="move-left"><i class="icon-circle-arrow-left"></i></a>
<a class="move-right"><i class="icon-circle-arrow-right"></i></a>
<a class="zoom-in"><i class="icon-plus-sign"></i></a>
<a class="zoom-out"><i class="icon-minus-sign"></i></a>
<a class="move-down"><i class="icon-circle-arrow-down"></i></a>
</div>
<!-- SVG world map code starts; based on BlankMap-World6,_compact.svg by Canuckguy et al. ========================= -->
<div class="world-map">

Просмотреть файл

@ -147,51 +147,6 @@ h3 {
color: white;
}
.controls .zooming{
height: auto;
overflow: hidden;
line-height: 10px;
padding-top: 4px;
padding-bottom: 4px;
}
.zooming a{
padding: 0;
margin: 0;
cursor: pointer;
}
.zooming .move-up{
float: left;
margin-left: 11px;
position: relative;
top: 5px;
}
.zooming .move-left{
float: left;
clear: left;
}
.zooming .move-right{
float: left;
}
.zooming .move-down{
float: left;
margin-left: 11px;
clear: left;
position: relative;
top: -5px;
}
.zooming .zoom-in{
float: right;
}
.zooming .zoom-out{
float: right;
}
#content{
position: relative;
margin-left: 200px;

Просмотреть файл

@ -159,63 +159,6 @@ function setZoom(box,canvas){
}
}
document.querySelector('.controls_options .move-up').addEventListener('click', function(){
var box = getZoom('vizcanvas');
var dY = Math.floor(box.h / 10);
box.y += dY;
setZoom(box,'vizcanvas');
return false;
});
document.querySelector('.controls_options .move-down').addEventListener('click', function(){
var box = getZoom('vizcanvas');
var dY = Math.floor(box.h / 10);
box.y -= dY;
setZoom(box,'vizcanvas');
return false;
});
document.querySelector('.controls_options .move-left').addEventListener('click', function(){
var box = getZoom('vizcanvas');
var dX = Math.floor(box.w / 10);
box.x += dX;
setZoom(box,'vizcanvas');
return false;
});
document.querySelector('.controls_options .move-right').addEventListener('click', function(){
var box = getZoom('vizcanvas');
var dX = Math.floor(box.w / 10);
box.x -= dX;
setZoom(box,'vizcanvas');
return false;
});
document.querySelector('.controls_options .zoom-in').addEventListener('click', function(){
var box = getZoom('vizcanvas');
var dX = Math.floor(box.w / 5);
var dY = Math.floor(box.h / 5);
// box.x -= dX;
// box.h -= dY;
box.w /= 1.1;
box.h /= 1.1;
setZoom(box,'vizcanvas');
return false;
});
document.querySelector('.controls_options .zoom-out').addEventListener('click', function(){
var box = getZoom('vizcanvas');
var dX = Math.floor(box.w / 5);
var dY = Math.floor(box.h / 5);
// box.x += dX;
// box.h += dY;
box.w *= 1.1;
box.h *= 1.1;
setZoom(box,'vizcanvas');
return false;
});
/* Scroll over visualization to zoom in/out ========================= */
@ -309,7 +252,7 @@ function vizZooming(target,ratio){
box.w = box.w / ratio;
box.h = box.h / ratio;
box.x = box.x - offsetX;
box.y = ( currentVisualization.name == "graph") ? (box.y - offsetY) : -1 * (box.h - 5);
box.y = box.y - offsetY;;
setZoom(box,"mapcanvas");
@ -409,60 +352,6 @@ document.querySelector(".world-map").addEventListener("mousemove",mousemoveHandl
document.querySelector(".world-map").addEventListener("mouseup",mouseupHandler,false);
document.querySelector(".world-map").addEventListener("mouseleave",mouseleaveHandler,false);
/* Map Controls ========================= */
document.querySelector('.map-control .move-up').addEventListener('click', function(){
var box = getZoom('mapcanvas');
var dY = Math.floor(box.h / 10);
box.y += dY;
setZoom(box,'mapcanvas');
return false;
});
document.querySelector('.map-control .move-down').addEventListener('click', function(){
var box = getZoom('mapcanvas');
var dY = Math.floor(box.h / 10);
box.y -= dY;
setZoom(box,'mapcanvas');
return false;
});
document.querySelector('.map-control .move-left').addEventListener('click', function(){
var box = getZoom('mapcanvas');
var dX = Math.floor(box.w / 10);
box.x += dX;
setZoom(box,'mapcanvas');
return false;
});
document.querySelector('.map-control .move-right').addEventListener('click', function(){
var box = getZoom('mapcanvas');
var dX = Math.floor(box.w / 10);
box.x -= dX;
setZoom(box,'mapcanvas');
return false;
});
document.querySelector('.map-control .zoom-in').addEventListener('click', function(){
// TODO: zoom in/out adjustment
var box = getZoom('mapcanvas');
box.w /= 1.5;
box.h /= 1.5;
setZoom(box,'mapcanvas');
return false;
});
document.querySelector('.map-control .zoom-out').addEventListener('click', function(){
// TODO: zoom in/out adjustment
var box = getZoom('mapcanvas');
box.w *= 1.5;
box.h *= 1.5;
setZoom(box,'mapcanvas');
return false;
});
/* Help Mode ========================= */
document.querySelector(".help-mode").checked = false;
document.querySelector(".help-mode").addEventListener("click", function(){