diff --git a/samples/js/demos/html/gum4.html b/samples/js/demos/html/gum4.html
new file mode 100644
index 0000000000..47709cc6f2
--- /dev/null
+++ b/samples/js/demos/html/gum4.html
@@ -0,0 +1,95 @@
+<!DOCTYPE html>
+<!-- saved from url=(0070)http://webrtc.googlecode.com/svn/trunk/samples/js/demos/html/gum1.html -->
+<html><head><meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
+<title>getUserMedia Demo 4</title>
+<style>
+video {
+    border:5px solid black;
+    width:400px;
+    height:300px;
+}
+button {
+    font: 18px sans-serif;
+    padding: 8px;
+}
+</style>
+</head>
+<body>
+<video id="vid1" name="morrallas" autoplay="true"></video>
+<video id="vid2" autoplay="true"></video>
+<video id="vid3" autoplay="true"></video>
+<video id="vid4" autoplay="true"></video>
+<br/>
+<button id="btn" onclick="start1()">Start Lowres (160x120)</button>
+<button id="btn" onclick="start2()">Start Midres (320x240) @15fps</button>
+<button id="btn" onclick="start3()">Start NormRes Unconstrained (640x480)</button>
+<button id="btn" onclick="start4()">Start HighRes (960x720) @8fps</button>
+<script>
+video1= document.getElementById("vid1");
+ var constraints1 ={
+  "audio": false, "video": { "mandatory": {
+    "minWidth": "160", "maxWidth": "160", "minHeight": "120", "maxHeight": "120",
+    "minFrameRate": "30"
+   },
+   "optional": []
+  }
+ }
+video2= document.getElementById("vid2");
+ var constraints2 ={
+  "audio": false, "video": { "mandatory": {
+    "minWidth": "320", "maxWidth": "320", "minHeight": "240", "maxHeight": "240",
+    "maxFrameRate": "15"
+   },
+   "optional": []
+  }
+ }
+video3 = document.getElementById("vid3");
+
+video4= document.getElementById("vid4");
+ var constraints4 ={
+  "audio": false, "video": { "mandatory": {
+    "minWidth": "960", "maxWidth": "960", "minHeight": "720", "maxHeight": "720",
+    "maxFrameRate": "8"
+   },
+   "optional": []
+  }
+ }
+
+function start1() {
+  navigator.webkitGetUserMedia(constraints1, gotStream1,   getUserMediaError); 
+  btn.disabled = true;
+}
+function gotStream1(stream) {
+  video1.src = webkitURL.createObjectURL(stream);
+}
+function start2() {
+  navigator.webkitGetUserMedia(constraints2, gotStream2,  getUserMediaError); 
+  btn.disabled = true;
+}
+function gotStream2(stream) {
+  video2.src = webkitURL.createObjectURL(stream);
+}
+function start3() {
+  navigator.webkitGetUserMedia({video:true}, gotStream3,  getUserMediaError); 
+  btn.disabled = true;
+}
+function gotStream3(stream) {
+  video3.src = webkitURL.createObjectURL(stream);
+}
+function start4() {
+  navigator.webkitGetUserMedia(constraints4, gotStream4,  getUserMediaError); 
+  btn.disabled = true;
+}
+function gotStream4(stream) {
+  video4.src = webkitURL.createObjectURL(stream);
+}
+
+function getUserMediaError(e) {
+  alert('Error during webkitGetUserMedia: '+e);
+}
+
+</script>
+
+
+
+</body></html>
