ashatora/openlayers
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Merge pull request #321 from tonio/zoomdefault

Browse Source 
Make Zoom control be default instead of PanZoom.
This commit is contained in:
Antoine Abt
2012-03-19 00:50:53 -07:00
parent 926283fa69 b10e6707e6
commit 2b41c8926b
7 changed files with 68 additions and 78 deletions
Download Patch File Download Diff File Expand all files Collapse all files
build/light.cfg
+1 -1
View File
@@ -13,7 +13,7 @@ OpenLayers/Layer/WMS.js
OpenLayers/Layer/Google/v3.js OpenLayers/Layer/Google/v3.js
OpenLayers/Popup/FramedCloud.js OpenLayers/Popup/FramedCloud.js
OpenLayers/Control/Navigation.js OpenLayers/Control/Navigation.js
OpenLayers/Control/ZoomPanel.js OpenLayers/Control/Zoom.js
OpenLayers/Control/Attribution.js OpenLayers/Control/Attribution.js
OpenLayers/Control/SelectFeature.js OpenLayers/Control/SelectFeature.js
OpenLayers/Control/Panel.js OpenLayers/Control/Panel.js
build/mobile.cfg
+1 -1
View File
@@ -11,7 +11,7 @@ OpenLayers/Layer/Bing.js
OpenLayers/Layer/WMS.js OpenLayers/Layer/WMS.js
OpenLayers/Control/TouchNavigation.js OpenLayers/Control/TouchNavigation.js
OpenLayers/Control/Geolocate.js OpenLayers/Control/Geolocate.js
OpenLayers/Control/ZoomPanel.js OpenLayers/Control/Zoom.js
OpenLayers/Control/Attribution.js OpenLayers/Control/Attribution.js
OpenLayers/Control/SelectFeature.js OpenLayers/Control/SelectFeature.js
OpenLayers/Control/DrawFeature.js OpenLayers/Control/DrawFeature.js
examples/mobile.html
-30
View File
@@ -35,36 +35,6 @@
padding : 2px 4px; padding : 2px 4px;
border-radius : 5px 0 0 0; border-radius : 5px 0 0 0;
} }
div.olControlZoomPanel .olControlZoomInItemInactive,
div.olControlZoomPanel .olControlZoomOutItemInactive {
background: rgba(0,0,0,0.2);
position: absolute;
}
div.olControlZoomPanel .olControlZoomInItemInactive {
border-radius: 5px 5px 0 0;
}
div.olControlZoomPanel .olControlZoomOutItemInactive {
border-radius: 0 0 5px 5px ;
top: 37px;
}
div.olControlZoomPanel .olControlZoomOutItemInactive:after ,
div.olControlZoomPanel .olControlZoomInItemInactive:after{
font-weight: bold;
content : '+';
font-size : 36px;
padding: 7px;
z-index: 2000;
color : #fff;
line-height: 1em;
}
div.olControlZoomPanel .olControlZoomOutItemInactive:after{
content: '–';
line-height: 0.9em;
padding: 0 8px;
}
div.olControlZoomPanel .olControlZoomToMaxExtentItemInactive {
display: none;
}
#title, #tags, #shortdesc { #title, #tags, #shortdesc {
display: none; display: none;
} }
examples/mobile.js
+1 -1
View File
@@ -26,7 +26,7 @@ var init = function () {
enableKinetic: true enableKinetic: true
} }
}), }),
new OpenLayers.Control.ZoomPanel() new OpenLayers.Control.Zoom()
], ],
layers: [ layers: [
new OpenLayers.Layer.OSM("OpenStreetMap", null, { new OpenLayers.Layer.OSM("OpenStreetMap", null, {
examples/style.mobile.css
+35 -24
View File
@@ -1,31 +1,42 @@
div.olControlZoomPanel { div.olControlZoom {
height: 108px;
width: 36px;
position: absolute; position: absolute;
top: 20px; top: 8px;
left: 20px; left: 8px;
} }
div.olControlZoomPanel div { * {
width: 36px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
height: 36px;
background-image: url(img/mobile-zoombar.png);
left: 0;
} }
div.olControlZoomPanel .olControlZoomInItemInactive { div.olControlZoom a {
top: 0; display: block;
background-position: 0 0; margin: 1px;
padding: 0;
color: white;
font-size: 28px;
font-family: sans-serif;
font-weight: bold;
text-decoration: none;
text-align: center;
height: 32px;
width: 32px;
line-height: 28px;
text-shadow: 0 0 3px rgba(0,0,0,0.8);
background: #666666; /* fallback for IE - IE6 requires background shorthand*/
background: rgba(0, 0, 0, 0.3);
filter: alpha(opacity=60);
} }
div.olControlZoomPanel .olControlZoomToMaxExtentItemInactive { a.olControlZoomIn {
top: 36px; border-radius: 4px 4px 0 0;
background-position: 0 -36px;
} }
div.olControlZoomPanel .olControlZoomOutItemInactive { a.olControlZoomOut {
top: 72px; border-radius: 0 0 4px 4px;
background-position: 0 -72px;
} }
.olTileImage { div.olControlZoom a:hover {
-webkit-transition: opacity 0.2s linear; background: #444444; /* fallback for IE */
-moz-transition: opacity 0.2s linear; background: rgba(0, 0, 0, 0.5);
-o-transition: opacity 0.2s linear; filter: alpha(opacity=80);
transition: opacity 0.2s linear; }
@media only screen and (max-width: 600px) {
div.olControlZoom a:hover {
background: rgba(0, 0, 0, 0.3);
}
} }
lib/OpenLayers/Map.js
+5 -2
View File
@@ -195,7 +195,7 @@ OpenLayers.Map = OpenLayers.Class({
* If not provided in the map options at construction, the map will * If not provided in the map options at construction, the map will
* by default be given the following controls if present in the build: * by default be given the following controls if present in the build:
* - <OpenLayers.Control.Navigation> or <OpenLayers.Control.TouchNavigation> * - <OpenLayers.Control.Navigation> or <OpenLayers.Control.TouchNavigation>
* - <OpenLayers.Control.PanZoom> * - <OpenLayers.Control.Zoom> or <OpenLayers.Control.PanZoom>
* - <OpenLayers.Control.ArgParser> * - <OpenLayers.Control.ArgParser>
* - <OpenLayers.Control.Attribution> * - <OpenLayers.Control.Attribution>
*/ */
@@ -622,9 +622,12 @@ OpenLayers.Map = OpenLayers.Class({
} else if (OpenLayers.Control.TouchNavigation) { } else if (OpenLayers.Control.TouchNavigation) {
this.controls.push(new OpenLayers.Control.TouchNavigation()); this.controls.push(new OpenLayers.Control.TouchNavigation());
} }
if (OpenLayers.Control.PanZoom) { if (OpenLayers.Control.Zoom) {
this.controls.push(new OpenLayers.Control.Zoom());
} else if (OpenLayers.Control.PanZoom) {
this.controls.push(new OpenLayers.Control.PanZoom()); this.controls.push(new OpenLayers.Control.PanZoom());
} }
if (OpenLayers.Control.ArgParser) { if (OpenLayers.Control.ArgParser) {
this.controls.push(new OpenLayers.Control.ArgParser()); this.controls.push(new OpenLayers.Control.ArgParser());
} }
theme/default/style.css
+25 -19
View File
@@ -23,16 +23,16 @@ div.olLayerDiv {
} }
.olLayerGooglePoweredBy { .olLayerGooglePoweredBy {
left: 2px; left: 2px;
bottom: 15px; bottom: 15px;
} }
.olLayerGoogleV3.olLayerGooglePoweredBy { .olLayerGoogleV3.olLayerGooglePoweredBy {
bottom: 15px !important; bottom: 15px !important;
} }
.olControlAttribution { .olControlAttribution {
font-size: smaller; font-size: smaller;
right: 3px; right: 3px;
bottom: 4.5em; bottom: 4.5em;
position: absolute; position: absolute;
display: block; display: block;
} }
.olControlScale { .olControlScale {
@@ -67,7 +67,7 @@ div.olLayerDiv {
display: block; display: block;
position: absolute; position: absolute;
font-size: smaller; font-size: smaller;
} }
div.olControlMousePosition { div.olControlMousePosition {
bottom: 0em; bottom: 0em;
@@ -133,7 +133,7 @@ div.olControlMousePosition {
.olPopupContent { .olPopupContent {
padding:5px; padding:5px;
overflow: auto; overflow: auto;
} }
.olControlNavigationHistory { .olControlNavigationHistory {
background-image: url("img/navigation_history.png"); background-image: url("img/navigation_history.png");
@@ -142,25 +142,25 @@ div.olControlMousePosition {
height: 24px; height: 24px;
} }
.olControlNavigationHistoryPreviousItemActive { .olControlNavigationHistoryPreviousItemActive {
background-position: 0 0; background-position: 0 0;
} }
.olControlNavigationHistoryPreviousItemInactive { .olControlNavigationHistoryPreviousItemInactive {
background-position: 0 -24px; background-position: 0 -24px;
} }
.olControlNavigationHistoryNextItemActive { .olControlNavigationHistoryNextItemActive {
background-position: -24px 0; background-position: -24px 0;
} }
.olControlNavigationHistoryNextItemInactive { .olControlNavigationHistoryNextItemInactive {
background-position: -24px -24px; background-position: -24px -24px;
} }
div.olControlSaveFeaturesItemActive { div.olControlSaveFeaturesItemActive {
background-image: url(img/save_features_on.png); background-image: url(img/save_features_on.png);
background-repeat: no-repeat; background-repeat: no-repeat;
background-position: 0 1px; background-position: 0 1px;
} }
div.olControlSaveFeaturesItemInactive { div.olControlSaveFeaturesItemInactive {
background-image: url(img/save_features_off.png); background-image: url(img/save_features_off.png);
background-repeat: no-repeat; background-repeat: no-repeat;
background-position: 0 1px; background-position: 0 1px;
@@ -181,12 +181,12 @@ div.olControlSaveFeaturesItemInactive {
opacity: 0.50; opacity: 0.50;
font-size: 1px; font-size: 1px;
filter: alpha(opacity=50); filter: alpha(opacity=50);
} }
.olControlPanPanel { .olControlPanPanel {
top: 10px; top: 10px;
left: 5px; left: 5px;
} }
.olControlPanPanel div { .olControlPanPanel div {
background-image: url(img/pan-panel.png); background-image: url(img/pan-panel.png);
@@ -221,7 +221,7 @@ div.olControlSaveFeaturesItemInactive {
.olControlZoomPanel { .olControlZoomPanel {
top: 71px; top: 71px;
left: 14px; left: 14px;
} }
.olControlZoomPanel div { .olControlZoomPanel div {
background-image: url(img/zoom-panel.png); background-image: url(img/zoom-panel.png);
@@ -249,9 +249,9 @@ div.olControlSaveFeaturesItemInactive {
background-position: 0 18px; background-position: 0 18px;
} }
/* /*
* When a potential text is bigger than the image it move the image * When a potential text is bigger than the image it move the image
* with some headers (closes #3154) * with some headers (closes #3154)
*/ */
.olControlPanZoomBar div { .olControlPanZoomBar div {
font-size: 1px; font-size: 1px;
@@ -440,13 +440,14 @@ div.olControlZoom a {
padding: 0; padding: 0;
color: white; color: white;
font-size: 18px; font-size: 18px;
font-family: 'Lucida Grande', Verdana, Geneva, Lucida, Arial, Helvetica, sans-serif; font-family: 'Lucida Grande', Verdana, Geneva, Lucida, Arial, Helvetica, sans-serif;
font-weight: bold; font-weight: bold;
text-decoration: none; text-decoration: none;
text-align: center; text-align: center;
height: 22px; height: 22px;
width:22px; width:22px;
line-height: 19px; line-height: 19px;
text-shadow: 0 0 3px rgba(0,0,0,0.8);
background: #666666; /* fallback for IE - IE6 requires background shorthand*/ background: #666666; /* fallback for IE - IE6 requires background shorthand*/
background: rgba(0, 0, 0, 0.3); background: rgba(0, 0, 0, 0.3);
filter: alpha(opacity=60); filter: alpha(opacity=60);
@@ -456,6 +457,11 @@ div.olControlZoom a:hover {
background: rgba(0, 0, 0, 0.5); background: rgba(0, 0, 0, 0.5);
filter: alpha(opacity=80); filter: alpha(opacity=80);
} }
@media only screen and (max-width: 600px) {
div.olControlZoom a:hover {
background: rgba(0, 0, 0, 0.3);
}
}
a.olControlZoomIn { a.olControlZoomIn {
border-radius: 4px 4px 0 0; border-radius: 4px 4px 0 0;
} }