New plugin add a pan control to the map

2013-03-28 14:04:57 -07:00
parent 99a464ae14
commit e301f2aeff
11 changed files with 216 additions and 0 deletions
--- a/external/L.Control.Pan.css
+++ b/external/L.Control.Pan.css
@ -0,0 +1,112 @@
+.leaflet-control-pan  {
+	   /* 
+	     .leaflet-control-pan-right-wrap: right 
+	   + .leaflet-control-pan a: width
+	   = 52 + 24 = 76
+	   */
+	width: 76px; 
+	   /* 
+	     .leaflet-control-pan-down-wrap: top
+	   + .leaflet-control-pan a: height
+	   = 52 + 24 = 76
+	   */
+	height: 76px;
+}
+
+.leaflet-control-pan > div {
+    -moz-border-radius: 5px;
+    -webkit-border-radius: 5px;
+    border-radius: 5px;
+}
+.leaflet-control-pan > div {
+  border: 1px solid #888;
+  box-shadow: 0 0 8px rgba(0,0,0,0.4);
+}
+.leaflet-control-pan a {
+    background-color: rgba(255, 255, 255, 0.8);
+}
+.leaflet-control-pan a{
+    background-position: 50% 50%;
+    background-repeat: no-repeat;
+    display: block;
+}
+.leaflet-control-pan a {
+    -moz-border-radius: 4px;
+    -webkit-border-radius: 4px;
+    border-radius: 4px;
+    width: 22px;
+    height: 22px;
+}
+.leaflet-control-pan a:hover {
+    background-color: #fff;
+}
+
+.leaflet-control-pan-up-wrap {
+	position:absolute;
+	left:26px;
+}
+.leaflet-control-pan-left-wrap {
+	position:absolute;
+	top:26px;
+}
+.leaflet-control-pan-right-wrap {
+	position:absolute;
+	left:52px;	
+	top:26px;
+}
+.leaflet-control-pan-down-wrap {
+	position:absolute;
+	left:26px;
+	top:52px;
+}
+
+.leaflet-control-pan-up {
+	background-image: url(@@INCLUDEIMAGE:images/pan-up.png@@);
+}
+.leaflet-control-pan-left {
+	background-image: url(@@INCLUDEIMAGE:images/pan-left.png@@);
+}
+.leaflet-control-pan-right {
+	background-image: url(@@INCLUDEIMAGE:images/pan-right.png@@);
+}
+.leaflet-control-pan-down {
+	background-image: url(@@INCLUDEIMAGE:images/pan-down.png@@);
+}
+
+/****** Touch Alterations ******/
+.leaflet-touch .leaflet-control-pan div {
+  border: 4px solid rgba(0, 0, 0, 0.3);
+  box-shadow: none;
+
+  border-radius: 10px;
+}
+
+.leaflet-touch .leaflet-control-pan {
+  width: 89px;
+  height: 119px;
+}
+
+.leaflet-touch .leaflet-control-pan a {
+  width: 30px;
+  height: 30px;
+
+  border-radius: 7px;
+}
+
+.leaflet-touch .leaflet-control-pan-up-wrap {
+  left:26px;
+}
+
+.leaflet-touch .leaflet-control-pan-left-wrap {
+  top:40px;
+}
+
+.leaflet-touch .leaflet-control-pan-right-wrap {
+  left:52px;
+  top:40px;
+}
+
+.leaflet-touch .leaflet-control-pan-down-wrap {
+  left:26px;
+  top:80px;
+}