I’m paying with the concept of a bric to create a video background that scrubs through the video forward and backward on scroll.
There is so many possibilities for this, the hard part is deciding exactly what best to make the bric do for general use cases.
Concept demo:
There could be good possibilities not just for usual frame rate video, but something such as 3, 5 or 10 frame video, for stepped image replay. In effect as the user scrolls, to the viewer it is perceived as a sequence of images, when it is actually a low frame rate video, and low file size, a video of only 5 frames will be small. Good for showing gradual construction of something, for example a house being gradually built, or a concept that starts as a sketch and builds up to finished design.
This looks super cool! 
Great idea, I think this would go down well with the Blocs community.
If I was building this, I would do the following.
• Because Blocs users already have video Brics, I would use a special class to enable it on other Brics. Something like doo-box-video-scrub. Then in your Logic, when the page loads scan all videos on the page and trigger scrubbing on video players with the matching class assigned. (This allows Blocs users to integrate it into their current sites really quickly. This is basically how Fancy Text and Fancy Numbers work.
• I would use custom data attributes assigned to the video Bric to customise the playback options, users can then apply these to video Brics and get the assigned logic. I would also leverage the options already available for self hosted videos (mainly loop) to give desired scrubbing effects. This would make the Bric feel more integrated with the video Bric that comes with Blocs.
Using this approach means your Bric is essentially a really versatile script that is added to the page and integrates into the current design without the user needing to add your Bric multiple times in-place of their original videos, as that may be time consuming.
Oh course you could create an alternative version using custom Bric containers and templates to adjust the outcome with your own UI. But thats obviously a lot more work.
Anyway, I hope some of this helps.
Hi Norm, Thanks for the feedback, all good food for thought.
I have seen how you’re doing Fancy (Numbers / Text), It’s neat for sure. Decisions, decisions…
As a page wide script scanning for existing videos. Scrubber class, pin, and scroll distance attributes etc.
Or standalone, in my minds eye, more integrated, more intuative perhaps.
Decisions, decisions… 
I’ll let it sink in as I also explore what options can be offered in terms of functionality, there is just so much GSAP can do here, I need to settle on a concise set of options. Normally takes me longer than the build
Of course, just some ideas to consider.
That’s the bric done. Now I just need a website built with Blocs
Time to rebuild the Doobox site I think 
Just one thing. How does everyone handle possible duplicate libs being added?
The bric uses GSAP and the GSAP plugin Scroll Trigger. (big libs).
I wrote code to check that functions in each of them are not present before adding them to the head. But I noted that resources are added to the page regardless. So for now I have just added the libs to includes.
But what if another Dev also uses these libs?
Spent quite some time getting this guide as best I can.
Will this make sense to you when you go back and use the bric six months after watching the initial guide video?
As Blocs works it way through page resources during export it will automatically replace attachments that have the same name rather than append them. The templating option in Blocs handles duplicates by appending the resources and their names.
But even that can cause problems, there is always the chance that loading the same framework / resource on a page under different names can cause side effects. Unless you wrote the code to consider multiple instances of the code loaded on a page.
Anyway, a more simple approach is to add a unique prefix or suffix to your resources to prevent that my-resource-doobox.js.
I hope that helps
Thanks.
Yes that’s what I figured. I noted that we can’t get duplicates of resources that have the same name. And assumed Blocs was doing a check before adding them.
But yes, I guess even the same libraries used by different devs could be named differently and would be impossible to detect dups.
What I have done, is wrote a check for a given function in a big library exists, before adding the library to the dom at least. OK it gets added to the resources and may be a dupe, but at least if someone loads that library before me (named differently) I don’t trample on it.
I haven’t came across any reference in the api, to calling for any of the big popular libraries via an api call? thats not a thing in Blocs at the moment right?
Great to see you active on Blocs again. I had several of your Stacks years ago and they worked flawlessly.
I can not wait to see what you create in Blocs - this video scrub looks great!
