improve examples

examples/commonFeatures.json5

@@ -20,10 +20,10 @@
     { duration: 3, transition: { name: 'colorphase' }, layers: [{ type: 'image', path: './assets/img2.jpg', zoomDirection: 'out' }, { type: 'subtitle', text: 'Komodo national park is the only home of the endangered Komodo dragons' }] },
     { duration: 2.5, transition: { name: 'simplezoom' }, layers: [{ type: 'image', path: './assets/img3.jpg', zoomDirection: 'in' }] },
 
-    { duration: 1.5, transition: { name: 'crosszoom', duration: 0.3 }, layers: [{ type: 'video', path: '/Users/mifi/Desktop/photos/drone koh lipe/DJI_0402.MOV', cutTo: 58 }, { type: 'title', text: 'Videos' }] },
-    { duration: 3, transition: { name: 'fade' }, layers: [{ type: 'video', path: '/Users/mifi/Desktop/photos/drone koh lipe/DJI_0402.MOV', cutFrom: 58 }] },
-    { transition: { name: 'fade' }, layers: [{ type: 'video', path: '/Users/mifi/Desktop/photos/drone koh lipe/DJI_0403.MOV', cutTo: 2.5 }] },
-    { duration: 1.5, layers: [{ type: 'video', path: '/Users/mifi/Desktop/photos/drone koh lipe/DJI_0401.MOV', cutFrom: 3, cutTo: 30 }] },
+    { duration: 1.5, transition: { name: 'crosszoom', duration: 0.3 }, layers: [{ type: 'video', path: 'assets/kohlipe1.mp4', cutTo: 58 }, { type: 'title', text: 'Videos' }] },
+    { duration: 3, transition: { name: 'fade' }, layers: [{ type: 'video', path: 'assets/kohlipe1.mp4', cutFrom: 58 }] },
+    { transition: { name: 'fade' }, layers: [{ type: 'video', path: 'assets/kohlipe2.mp4', cutTo: 2.5 }] },
+    { duration: 1.5, layers: [{ type: 'video', path: 'assets/kohlipe3.mp4', cutFrom: 3, cutTo: 30 }] },
 
     { duration: 3, transition: { name: 'crosszoom' }, layers: [{ type: 'gl', fragmentPath: './assets/shaders/3l23Rh.frag' }, { type: 'title', text: 'OpenGL\nshaders' }] },
     { duration: 3, layers: [{ type: 'gl', fragmentPath: './assets/shaders/MdXyzX.frag' }] },

examples/imageOverlay.json5

@@ -2,7 +2,7 @@
   outPath: './imageOverlay.mp4',
   clips: [
     { layers: [
-      { type: 'video', path: './assets/IMG_4605.MOV', cutTo: 2 },
+      { type: 'video', path: './assets/changi.mp4', cutTo: 2 },
       { type: 'image-overlay', path: './assets/overlay.svg', width: 0.2, position: { x: 0.95, y: 0.03, originX: 'right' } },
       { type: 'image-overlay', path: './assets/emoji.png', visibleUntil: 0.5, zoomDirection: 'in' },
       { type: 'image-overlay', path: './assets/emoji2.svg', position: 'top', visibleFrom: 0.7, visibleUntil: 1.5, width: 0.2 },

examples/mosaic.json5

@@ -10,11 +10,11 @@
   },
   clips: [
     { duration: 2, layers: [
-      { type: 'video', path: './assets/IMG_1322.MOV', cutFrom: 0, cutTo: 2, resizeMode: 'cover', top: 0.5, left: 0.5, originY: 'center', originX: 'center' },
-      { type: 'video', path: './assets/IMG_1322.MOV', cutFrom: 0, cutTo: 2, resizeMode: 'contain' },
-      { type: 'video', path: './assets/IMG_1322.MOV', cutFrom: 0, cutTo: 2, resizeMode: 'contain-blur', left: 1, originX: 'right' },
+      { type: 'video', path: './assets/palawan.mp4', cutFrom: 0, cutTo: 2, resizeMode: 'cover', top: 0.5, left: 0.5, originY: 'center', originX: 'center' },
+      { type: 'video', path: './assets/palawan.mp4', cutFrom: 0, cutTo: 2, resizeMode: 'contain' },
+      { type: 'video', path: './assets/palawan.mp4', cutFrom: 0, cutTo: 2, resizeMode: 'contain-blur', left: 1, originX: 'right' },
       { type: 'video', path: './assets/IMG_1884.MOV', cutFrom: 0, cutTo: 2, resizeMode: 'contain-blur', left: 1, top: 1, originX: 'right', originY: 'bottom' },
-      { type: 'video', path: './assets/IMG_1322.MOV', cutFrom: 0, cutTo: 2, resizeMode: 'stretch', top: 1, originY: 'bottom' },
+      { type: 'video', path: './assets/palawan.mp4', cutFrom: 0, cutTo: 2, resizeMode: 'stretch', top: 1, originY: 'bottom' },
     ] },
   ],
 }

examples/smartFit.json5

@@ -6,8 +6,8 @@
     layer: { backgroundColor: 'white' },
   },
   clips: [
-    { layers: [{ type: 'video', path: './assets/IMG_4605.MOV', cutFrom: 0.4, cutTo: 2 }] },
-    { layers: [{ type: 'video', path: './assets/IMG_4605.MOV', cutFrom: 0.4, cutTo: 2, resizeMode: 'contain' }] },
-    { layers: [{ type: 'video', path: './assets/IMG_4605.MOV', cutFrom: 0.4, cutTo: 2, resizeMode: 'stretch' }] },
+    { layers: [{ type: 'video', path: './assets/changi.mp4', cutFrom: 0.4, cutTo: 2 }] },
+    { layers: [{ type: 'video', path: './assets/changi.mp4', cutFrom: 0.4, cutTo: 2, resizeMode: 'contain' }] },
+    { layers: [{ type: 'video', path: './assets/changi.mp4', cutFrom: 0.4, cutTo: 2, resizeMode: 'stretch' }] },
   ],
 }

examples/speedTest.json5

@@ -6,8 +6,8 @@
   },
   clips: [
     { duration: 2, layers: [{ type: 'title-background', text: 'Speed up or slow down video', background: { type: 'radial-gradient' } }] },
-    { duration: 2, layers: [{ type: 'video', path: './assets/IMG_4605.MOV', cutFrom: 0, cutTo: 2 }, { type: 'title', text: 'Same speed' }] },
-    { duration: 1, layers: [{ type: 'video', path: './assets/IMG_4605.MOV', cutFrom: 0, cutTo: 4 }, { type: 'title', text: '4x' }] },
-    { duration: 2, layers: [{ type: 'video', path: './assets/IMG_4605.MOV', cutFrom: 0, cutTo: 1 }, { type: 'title', text: '1/2x' }] },
+    { duration: 2, layers: [{ type: 'video', path: './assets/changi.mp4', cutFrom: 0, cutTo: 2 }, { type: 'title', text: 'Same speed' }] },
+    { duration: 1, layers: [{ type: 'video', path: './assets/changi.mp4', cutFrom: 0, cutTo: 4 }, { type: 'title', text: '4x' }] },
+    { duration: 2, layers: [{ type: 'video', path: './assets/changi.mp4', cutFrom: 0, cutTo: 1 }, { type: 'title', text: '1/2x' }] },
   ],
 }

examples/timeoutTest.json5

@@ -1,7 +1,7 @@
 {
   outPath: './timeoutTest.mp4',
   clips: [
-    { duration: 1.5, transition: { name: 'crosszoom', duration: 0.3 }, layers: [{ type: 'video', path: './assets/DJI_0156.mov', cutTo: 58 }] },
-    { duration: 3, transition: { name: 'fade' }, layers: [{ type: 'video', path: './assets/DJI_0156.mov', cutFrom: 0 }] },
+    { duration: 1.5, transition: { name: 'crosszoom', duration: 0.3 }, layers: [{ type: 'video', path: './assets/tungestolen.mp4', cutTo: 58 }] },
+    { duration: 3, transition: { name: 'fade' }, layers: [{ type: 'video', path: './assets/tungestolen.mp4', cutFrom: 0 }] },
   ],
 }

examples/transitionEasing.json5

@@ -5,9 +5,9 @@
     duration: 2,
   },
   clips: [
-    { transition: { name: 'directional', duration: 0.5 }, layers: [{ type: 'video', path: '/Users/mifi/Desktop/photos/drone koh lipe/DJI_0402.MOV', cutTo: 2 }] },
-    { transition: { name: 'directional', duration: 0.5, params: { direction: [1, 0] } }, layers: [{ type: 'video', path: '/Users/mifi/Desktop/photos/drone koh lipe/DJI_0403.MOV', cutTo: 2 }] },
-    // { transition: { name: 'directional', duration: 0.5, easing: null }, layers: [{ type: 'video', path: '/Users/mifi/Desktop/photos/drone koh lipe/DJI_0403.MOV', cutTo: 2 }] },
+    { transition: { name: 'directional', duration: 0.5 }, layers: [{ type: 'video', path: 'assets/changi.mp4', cutTo: 2 }] },
+    { transition: { name: 'directional', duration: 0.5, params: { direction: [1, 0] } }, layers: [{ type: 'video', path: 'assets/lofoten.mp4', cutTo: 2 }] },
+    { transition: { name: 'directional', duration: 0.5, easing: null }, layers: [{ type: 'video', path: 'assets/lofoten.mp4', cutTo: 2 }] },
     { layers: [{ type: 'pause' }] },
   ],
 }

examples/videos.json5

@@ -7,10 +7,10 @@
   },
   clips: [
     { duration: 2, layers: [{ type: 'title-background', text: 'Editly can handle all formats and sizes with different fits', background: { type: 'radial-gradient' } }] },
-    { layers: [{ type: 'video', path: './assets/IMG_1322.MOV', cutFrom: 0, cutTo: 2, resizeMode: 'contain' }, { type: 'title', text: 'Contain' }] },
-    { layers: [{ type: 'video', path: './assets/IMG_1322.MOV', cutFrom: 0, cutTo: 2, resizeMode: 'contain-blur' }, { type: 'title', text: 'Contain (blur)' }] },
+    { layers: [{ type: 'video', path: './assets/palawan.mp4', cutFrom: 0, cutTo: 2, resizeMode: 'contain' }, { type: 'title', text: 'Contain' }] },
+    { layers: [{ type: 'video', path: './assets/palawan.mp4', cutFrom: 0, cutTo: 2, resizeMode: 'contain-blur' }, { type: 'title', text: 'Contain (blur)' }] },
     { layers: [{ type: 'video', path: './assets/IMG_1884.MOV', cutFrom: 0, cutTo: 2, resizeMode: 'contain-blur' }, { type: 'title', text: 'Contain\n(blur, vertical)' }] },
-    { layers: [{ type: 'video', path: './assets/IMG_1322.MOV', cutFrom: 0, cutTo: 2, resizeMode: 'stretch' }, { type: 'title', text: 'Stretch' }] },
-    { layers: [{ type: 'video', path: './assets/IMG_1322.MOV', cutFrom: 0, cutTo: 2, resizeMode: 'cover' }, { type: 'title', text: 'Cover' }] },
+    { layers: [{ type: 'video', path: './assets/palawan.mp4', cutFrom: 0, cutTo: 2, resizeMode: 'stretch' }, { type: 'title', text: 'Stretch' }] },
+    { layers: [{ type: 'video', path: './assets/palawan.mp4', cutFrom: 0, cutTo: 2, resizeMode: 'cover' }, { type: 'title', text: 'Cover' }] },
   ],
 }

examples/videos2.json5

@@ -8,7 +8,7 @@
     },
   },
   clips: [
-    { layers: [{ type: 'video', path: './assets/IMG_4605.MOV', cutFrom: 0, cutTo: 2 }, { type: 'title', text: 'Video 1' }] },
+    { layers: [{ type: 'video', path: './assets/changi.mp4', cutFrom: 0, cutTo: 2 }, { type: 'title', text: 'Video 1' }] },
     { layers: [{ type: 'video', path: './assets/IMG_1884.MOV', cutFrom: 0, cutTo: 2 }] },
   ],
 }

examples/visibleFromUntil.json5

@@ -12,7 +12,7 @@
     ] },
     { layers: [
       { type: 'video', path: './assets/lofoten.mp4', cutFrom: 0, cutTo: 4 },
-      { type: 'video', path: './assets/IMG_4605.MOV', cutFrom: 0, cutTo: 1, visibleFrom: 1, visibleUntil: 2 },
+      { type: 'video', path: './assets/changi.mp4', cutFrom: 0, cutTo: 1, visibleFrom: 1, visibleUntil: 2 },
     ] },
   ],
 }