Apple Aerial Video Screensavers On Your Website, Full Page

(elcalibano) #1

Hey party people, anyone with an Apple TV who loves those built in Apple Aerial Screensavers, Drone Footage lovers, just anyone who wants to put some video on your webpage, here’s some videos for you, and a template for displaying it full screen on your site. Check the inner html of the rectangle, and copy and paste whatever video you want in place of the video link already in there.

Why post these Apple screensavers? Because they’re available online, because they’re cool, and not everyone knows where to find them. Also, to thank the forum community for past and future help. I don’t know if there’s any rules about posting these on your own site, so…

Full Page Background (11.7 KB)

Greenland Day:

Greenland Day 2:

Greenland Night:

Dubai Day:

Dubai Day 2:

Dubai Day 3:

Dubai Day 4:

Dubai Night:

Dubai Night 2:

Los Angeles Day:

Los Angeles Day 2:

Los Angeles Day 3:

Los Angeles Night:

Hong Kong Day:

Hong Kong Day 2:

Hong Kong Day 3:

Hong Kong Night:

China Day:

China Day 2:

China Day 3:

China Day 4:

China Day 5:

China Day 6:

Liwa Day:

Hawaii Day:

Hawaii Day 2:

Hawaii Day 3:

Hawaii Day 4:

Hawaii Night:

London Day:

London Day 2:

London Day 3:

London Night:

New York City Day:

New York City Day 2:

New York night:

San Francisco Day:

San Francisco Day 2:

San Francisco Day 3:

San Francisco Day 4:

San Francisco Day 5:

San Francisco Day 6:

San Francisco 7:

San Francisco Night:

San Francisco Night 2:

San Francisco:

(elcalibano) #2

And now, updated with @DBear’s full screen button:

Full Screen Background (17.4 KB)

(Trey Yancy) #3

That’s very useful. Is there a way to create a loading indicator for the content?

(elcalibano) #4

I don’t actually know how to implement a loading indicator for iframe content (or a hype doc. with iframe content). Someone else might know. On my macbook laptop the video loads pretty fast, maybe instantly.

You can try a couple different things, exporting from my hype project file and uploading to your personal website and seeing if it loads faster, or download the video and upload it to your own website and then copy and paste the url from your website into the iframe. Those are just guesses, don’t know if they’d make any difference.

(Trey Yancy) #5

It would require a query of the video file for the video duration and file size, triggering the load, monitoring the amount of data loaded over a given time, doing the math, and generating art that resizes according to the sampled rate.

I don’t know how to get at the metadata for a video file and, when it comes to JS, I don’t have the chops to translate scripts from the language with which I’m most familiar.

It appears that the video has not been formatted for fast web streaming. I’ll test it with some video I have on Wistia.

(Trey Yancy) #6

Not sure how to adapt this for my streaming content, as the link I would use does not point at something with a file extension.

(elcalibano) #7

This is just one example. Here is some iframe code that points to a youtube video. Copy and paste it into the inner html of a rectangle, and adjust the parameters to your liking. It doesn’t have a .mov or other video extension. Add this < to the beginning and this > to the end.

<iframe allowfullscreen="" frameborder="0" height="400" width="600" src=""></iframe>

(Mark Hunte) #8

Found that there is a Json file that lists all the videos if you do a google search.

Be aware that Apple may or may not be ok for you to use all of this for personal use but likely would not like it streamed outside of that. Also these links seem to be banding about on the web but not sure how they were obtained I.e delving into the atv software, which again would probably bring up licensing issues.

Saying that these are cool and there may very well be something somewhere describing their public use!

(Alex) #9


I note the line:
<video autoplay="" loop="" style="width: 100%; height: 100%; position:left">

is it helpful to achieve higher speed by adding [autobuffer=“autobuffer”] like the one below please?

<video autobuffer="autobuffer" autoplay="" loop="" style="width: 100%; height: 100%; position:left">

(Mark Hunte) #10

Have a read of this. ( Note it is a draft so do not know if this is live or not and not had time to check )