diff --git a/app/static/js/ascroll.js b/app/static/js/ascroll.js
index 0e30230..5366d13 100644
--- a/app/static/js/ascroll.js
+++ b/app/static/js/ascroll.js
@@ -257,6 +257,9 @@ async function loadClips(annotations) {
 
         annotations.forEach(annotation => {
             var clipId = annotation.clipId || annotation.id.split('/')[0] + '/' + annotation.in.toFixed(3)  + '-'+ annotation.out.toFixed(3)
+            if (annotation.colorId && !colors[clipId]) {
+                colors[clipId] = colors[annotation.colorId]
+            }
             if (!colors[clipId]) {
                 console.log('no match for clip', clipId)
                 return
@@ -319,7 +322,30 @@ async function loadAnnotations(config) {
                 response.data.layers[layer] && response.data.layers[layer].forEach(annotation => {
                     annotation.clipId = annotation.id.split('/')[0] + '/' + annotation.in.toFixed(3)  + '-'+ annotation.out.toFixed(3)
                     if (!(config.user && annotation.user != config.user) && isInside(config, annotation)) {
-                        annotations.push(annotation)
+                        if (config.split && config.split.indexOf(layer) > -1) {
+                            var parts = annotation.value.replace(/<br\ \/>/g, '<br>').replace(/<br\/>/g, '<br>').split('<br>')
+                            var duration = (annotation.out - annotation['in'])  / parts.length
+                            if (parts.length > 1 && duration > 2) {
+                                var position = annotation['in']
+                                var part
+                                while (parts.length) {
+                                    part = { ...annotation }
+                                    part['in'] = position
+                                    part['out'] = position + duration
+                                    part.clipId = part.id.split('/')[0] + '/' + part.in.toFixed(3)  + '-'+ part.out.toFixed(3)
+                                    part.colorId = annotation.clipId
+                                    part.value = parts.pop(0)
+                                    if (parts.length) {
+                                        position = part['out']
+                                    } else {
+                                        position = annotation.out
+                                    }
+                                    annotations.push(part)
+                                }
+                            }
+                        } else {
+                            annotations.push(annotation)
+                        }
                     }
                 })
             })
diff --git a/app/static/js/pandora-scroll.js b/app/static/js/pandora-scroll.js
index 3892b98..0a503e3 100644
--- a/app/static/js/pandora-scroll.js
+++ b/app/static/js/pandora-scroll.js
@@ -76,6 +76,8 @@ class PandoraScroll extends HTMLElement {
           }
           if (a.name == 'layers') {
               config[a.name] = a.value.split(' ')
+          } else if (a.name == 'split') {
+              config[a.name] = a.value.split(' ')
           } else if (['in', 'out'].indexOf(a.name) > -1) {
               config[a.name] = parseTime(a.value)
           } else {