4 replies to this topic

[chef]

This is kind of cool!

 

Create the 3d image and try it out here: https://www.omnivirt.com/3d-photo/

 

Choose one of your movie posters in emby.

 

Choose the online app to create a depth image for you.

 

Now your image has depth and movement.

 

 

 

 

 

Add your image and download the depth map.

 

Pixi.js will allow you to add these depth images to the web app, and add these type of images to the html.

 

I could do a how-to.

 

 

[shackbill]

ok i created the depth map how do i use pixi.js to get it into Emby?

[chef]

ok i created the depth map how do i use pixi.js to get it into Emby?

So... I didn't actually follow up in this 😂 but it's still possible.

here is a pixi.js tutorial

https://youtu.be/FgN2EENWPFc


Then I figured using a mutation observer we could add the effect to the covers in the web app, like how we ad vanilla-tilt effect in my other thread.

https://emby.media/c...pp/#entry800861



Should we figure it out? Its probably not to complicated. Just have to find time 🤪

The vanilla tilt is a cooler effect in my opinion, but the depth effect is neat too. 😄

And it only works in the web app.

Edited by chef, 03 November 2019 - 11:06 AM.

[shackbill]

im not a dev sounds complicated..if you can get it to work in web app i will try it. thanks.

[mdoverl]

This is kind of cool!

 

Create the 3d image and try it out here: https://www.omnivirt.com/3d-photo/

 

Choose one of your movie posters in emby.

 

Choose the online app to create a depth image for you.

 

Now your image has depth and movement.

 

 

 

 

 

Add your image and download the depth map.

 

Pixi.js will allow you to add these depth images to the web app, and add these type of images to the html.

 

I could do a how-to.

I'll play around with this later and report back. Thank you for sharing.