Index: /issm/trunk-jpl/src/m/plot/plot_unit.js
===================================================================
--- /issm/trunk-jpl/src/m/plot/plot_unit.js	(revision 20919)
+++ /issm/trunk-jpl/src/m/plot/plot_unit.js	(revision 20920)
@@ -236,5 +236,5 @@
 				}
 				indices.itemSize = 1;
-				
+			
 				//Initialize movie loop
 				node["movieInterval"] = 1000 / canvas.moviefps;
@@ -242,5 +242,5 @@
 				node["movieLength"] = timestamps.length;
 				node["movieFrame"] = 0;
-			
+
 				if (canvas["movieHandler"])	clearInterval(canvas["movieHandler"]);
 				canvas["movieHandler"] = setInterval(function () {
@@ -261,5 +261,5 @@
 							canvas["progressBar"].slider('refresh');
 						}
-						node["buffers"] = initBuffers(gl,[node["arrays"][0],node["arrays"][1][node["movieFrame"]],node["arrays"][2]]);
+						node["buffers"] = node["buffersArray"][node["movieFrame"]];
 						canvas["movieFrame"] = node["movieFrame"];
 					}, node["movieInterval"]);
@@ -272,7 +272,11 @@
 			}
 			
-			//Initalize buffers
+			//Initialize buffers
 			node["arrays"] = [vertices, texcoords, indices];
-			node["buffers"] = initBuffers(gl,[node["arrays"][0],node["arrays"][1][0],node["arrays"][2]]);
+			node["buffersArray"] = [];
+			for(var i = 0; i < timestamps.length; i++){
+				node["buffersArray"][i] = initBuffers(gl,[node["arrays"][0],node["arrays"][1][i],node["arrays"][2]]);
+			}
+			node["buffers"] = node["buffersArray"][0];
 			break;
 		//}}}
Index: /issm/trunk-jpl/src/m/plot/plotdoc.js
===================================================================
--- /issm/trunk-jpl/src/m/plot/plotdoc.js	(revision 20919)
+++ /issm/trunk-jpl/src/m/plot/plotdoc.js	(revision 20920)
@@ -30,4 +30,5 @@
 	console.log('       "colormap": same as standard matlab option (default "jet", ex: "hsv","cool","spring","gray","Ala","Rignot",...)');
 	console.log('       "edgecolor": same as standard matlab option EdgeColor (default "black", ex: color name: "blue" or RGB array: [0.5, 0.2, 0.8])');
+	console.log('       "viewPanning": enable view origin panning with two-finger touch or shift+mouse drag. (default "off", ex: "on", "off")');
 	console.log('       "view": initial azimuth and elevation angles for camera (default [0,90], ex: [90, 180]');
 	console.log('       "zoom": initial camera zoom as a percentage of default (default 1, ex: 1.5, 0.01)');
Index: /issm/trunk-jpl/src/m/plot/webgl.js
===================================================================
--- /issm/trunk-jpl/src/m/plot/webgl.js	(revision 20919)
+++ /issm/trunk-jpl/src/m/plot/webgl.js	(revision 20920)
@@ -49,9 +49,10 @@
 	canvas.cameraMatrix = mat4.create();
 	canvas.translation = options.getfieldvalue('origin',[0,0,0.0]);
+	canvas.viewPanning = options.getfieldvalue('viewpanning','off') == 'on';
+	canvas.view = options.getfieldvalue('view',[0,90]); //0 azimuth - up is north, 90 elevation - looking straight down
+	canvas.rotation = canvas.view;
 	canvas.rotationAzimuthBounds = options.getfieldvalue('azlim',[0,360]);
 	canvas.rotationElevationBounds = options.getfieldvalue('ellim',[-180,180]);
-	canvas.view = options.getfieldvalue('view',[0,90]); //0 azimuth - up is north, 90 elevation - looking straight down
-	canvas.rotation = canvas.view;
-	canvas.controlsensitivity = options.getfieldvalue('controlsensitivity',1);
+	canvas.controlSensitivity = options.getfieldvalue('controlsensitivity',1);
 	canvas.twod = options.getfieldvalue('2d','off') == 'on';
 	canvas.moviePlay = true;
@@ -59,4 +60,7 @@
 	canvas.movieIncrement = true;
 	canvas.moviefps = options.getfieldvalue('moviefps',5);
+	var backgroundcolor = new RGBColor(options.getfieldvalue('backgroundcolor','lightcyan'));
+	if (backgroundcolor.ok) canvas.backgroundcolor = [backgroundcolor.r/255.0, backgroundcolor.g/255.0, backgroundcolor.b/255.0, 1.0];
+	else throw Error(sprintf("s%s%s\n","initWebGL error message: cound not find out background color for curent canvas ",canvas));
 	
 	// Add event listeners for canvas
@@ -330,6 +334,7 @@
 	}
 	if (ev.srcEvent.shiftKey || ev.pointers.length == 2) {
-		var deltaX = (canvas.lastDeltaX - ev.deltaX) / canvas.clientWidth / canvas.zoom * -2 * canvas.controlsensitivity;
-		var deltaY = (canvas.lastDeltaY - ev.deltaY) / canvas.clientHeight / canvas.zoom * -2 * canvas.controlsensitivity;
+		if (!canvas.viewPanning) return;
+		var deltaX = (canvas.lastDeltaX - ev.deltaX) / canvas.clientWidth / canvas.zoom * -2 * canvas.controlSensitivity;
+		var deltaY = (canvas.lastDeltaY - ev.deltaY) / canvas.clientHeight / canvas.zoom * -2 * canvas.controlSensitivity;
 		
 		if (canvas.twod) {
@@ -343,6 +348,6 @@
 	}
 	else {
-		canvas.rotation[0] += degrees((canvas.lastDeltaX - ev.deltaX) / canvas.clientWidth / canvas.zoom * -2 * canvas.controlsensitivity);
-		canvas.rotation[1] += degrees((canvas.lastDeltaY - ev.deltaY) / canvas.clientHeight / canvas.zoom * -2 * canvas.controlsensitivity);
+		canvas.rotation[0] += degrees((canvas.lastDeltaX - ev.deltaX) / canvas.clientWidth * -2 * canvas.controlSensitivity);
+		canvas.rotation[1] += degrees((canvas.lastDeltaY - ev.deltaY) / canvas.clientHeight * -2 * canvas.controlSensitivity);
 		
 		if (canvas.rotation[0] > 360) {canvas.rotation[0] -= 360};
@@ -356,5 +361,5 @@
 	canvas.lastDeltaX = ev.deltaX;
 	canvas.lastDeltaY = ev.deltaY;
-	
+
 	if (displaylog) console.log(canvas.rotation);
 } //}}}
@@ -371,5 +376,5 @@
 function onZoom(ev,canvas,displaylog) { //{{{
 	ev.preventDefault();
-	var delta = clamp(clamp(ev.scale || ev.wheelDelta || -ev.detail, -1, 1) * canvas.controlsensitivity * canvas.zoom / 20, -1.0, 1.0);
+	var delta = clamp(clamp(ev.scale || ev.wheelDelta || -ev.detail, -1, 1) * canvas.controlSensitivity * canvas.zoom / 20, -1.0, 1.0);
 	canvas.zoom = clamp(canvas.zoom + delta, canvas.zoomBounds[0], canvas.zoomBounds[1]);
 	
@@ -486,13 +491,8 @@
 	}
 	
-	if (canvas.textcanvas) {
-		canvas.textcanvas.draw(canvas);
-	}
-
-	// Set clear color to black, fully opaque
+	if (canvas.textcanvas) canvas.textcanvas.draw(canvas);
+
 	var gl = canvas.gl;
-	var backgroundcolor = new RGBColor(options.getfieldvalue('backgroundcolor','lightcyan'));
-	if (backgroundcolor.ok) gl.clearColor(backgroundcolor.r/255.0, backgroundcolor.g/255.0, backgroundcolor.b/255.0, 1.0);
-	else throw Error(sprintf("s%s%s\n","initWebGL error message: cound not find out background color for curent canvas ",canvas));
+	gl.clearColor(canvas.backgroundcolor[0], canvas.backgroundcolor[1], canvas.backgroundcolor[2], canvas.backgroundcolor[3]);
 		
 	// Skip drawing of new frame if any texture is not yet loaded
@@ -512,7 +512,5 @@
 	for (var i = drawPassNumber - 1; i >= 0; i--) {
 		for (var node in nodes) {
-			if (nodes[node]["drawOrder"] == i) {
-				drawSceneGraphNode(canvas,nodes[node]);
-			}
+			if (nodes[node]["drawOrder"] == i) drawSceneGraphNode(canvas,nodes[node]);
 		}
 	}