change to blendmode logic

script.js

@@ -123,7 +123,7 @@ function handleVideoEnded(event) {
 function drawVideos() {
   ctx.clearRect(0, 0, canvas.width, canvas.height)
 
-  let blendModes = ["source-over","overlay","screen"]
+  let blendModes = ["screen","overlay","difference","lighten"]
 
   videos.forEach((video,i) => {
     // Calculate scaling factor to fit the canvas
@@ -139,9 +139,9 @@ function drawVideos() {
 
     // Use default blend mode for first video (i=0), repeat the rest of blendModes
     if (i === 0) {
-      ctx.globalCompositeOperation = blendModes[0]
+      ctx.globalCompositeOperation = "source-over"
     } else {
-      ctx.globalCompositeOperation = blendModes[(i - 1) % (blendModes.length - 1) + 1]
+      ctx.globalCompositeOperation = blendModes[i % blendModes.length]
     }
 
     // Draw the current video frame onto the canvas