Merge pull request #5948 from pasu/master

Gallery::Imagery Layers Split
CesiumGS · Nov 2, 2017 · 42324ab · 42324ab
2 parents 36fddf8 + 76446d5
commit 42324ab
Show file tree

Hide file tree

Showing 2 changed files with 33 additions and 18 deletions.
diff --git a/Apps/Sandcastle/gallery/Imagery Layers Split.html b/Apps/Sandcastle/gallery/Imagery Layers Split.html
@@ -26,7 +26,7 @@
         left: 50%;
         top: 0px;
         background-color: #D3D3D3;
-        width: 2px;
+        width: 5px;
         height: 100%;
         z-index: 9999;
     }
@@ -53,7 +53,8 @@
     imageryProvider : new Cesium.ArcGisMapServerImageryProvider({
         url : 'https://server.arcgisonline.com/ArcGIS/rest/services/World_Street_Map/MapServer'
     }),
-    baseLayerPicker : false
+    baseLayerPicker : false,
+    infoBox : false
 });
 
 var layers = viewer.imageryLayers;
@@ -68,27 +69,37 @@
 var slider = document.getElementById('slider');
 viewer.scene.imagerySplitPosition = (slider.offsetLeft) / slider.parentElement.offsetWidth;
 
-var dragStartX = 0;
+var handler = new Cesium.ScreenSpaceEventHandler(slider);
 
-document.getElementById('slider').addEventListener('mousedown', mouseDown, false);
-window.addEventListener('mouseup', mouseUp, false);
+var moveActive = false;
 
-function mouseUp() {
-  window.removeEventListener('mousemove', sliderMove, true);
-}
+function move(movement) {
+	if(!moveActive) {
+		return;
+	}
 
-function mouseDown(e) {
-  var slider = document.getElementById('slider');
-  dragStartX = e.clientX - slider.offsetLeft;
-  window.addEventListener('mousemove', sliderMove, true);
+	var relativeOffset = movement.endPosition.x ;
+	var splitPosition = (slider.offsetLeft + relativeOffset) / slider.parentElement.offsetWidth;
+	slider.style.left = 100.0 * splitPosition + '%';
+	viewer.scene.imagerySplitPosition = splitPosition;
 }
 
-function sliderMove(e) {
-  var slider = document.getElementById('slider');
-  var splitPosition = (e.clientX - dragStartX) / slider.parentElement.offsetWidth;
-  slider.style.left = 100.0 * splitPosition + "%";
-  viewer.scene.imagerySplitPosition = splitPosition;
-}
+handler.setInputAction(function() {
+	moveActive = true;
+}, Cesium.ScreenSpaceEventType.LEFT_DOWN);
+handler.setInputAction(function() {
+	moveActive = true;
+}, Cesium.ScreenSpaceEventType.PINCH_START);
+
+handler.setInputAction(move, Cesium.ScreenSpaceEventType.MOUSE_MOVE);
+handler.setInputAction(move, Cesium.ScreenSpaceEventType.PINCH_MOVE);
+
+handler.setInputAction(function() {
+	moveActive = false;
+}, Cesium.ScreenSpaceEventType.LEFT_UP);
+handler.setInputAction(function() {
+	moveActive = false;
+}, Cesium.ScreenSpaceEventType.PINCH_END);
 
 
 //Sandcastle_End

diff --git a/CHANGES.md b/CHANGES.md
@@ -1,6 +1,10 @@
 Change Log
 ==========
 
+### 1.40 - 2017-12-01
+
+* Added ability to support touch event in Imagery Layers Split demo application. [#5948](https://github.com/AnalyticalGraphicsInc/cesium/pull/5948)
+
 ### 1.39 - 2017-11-01
 
 * Cesium now officially supports webpack. See our [Integrating Cesium and webpack blog post](https://cesium.com/blog/2017/10/18/cesium-and-webpack/) for more details.