Woocommerce variation slideshow (Instead of product Image)

I need in Woocommerce, to replace the product's image, with a Javascript slideshow of the images of the variations. (preloaded and fade in one by one when done). Until they are loaded I want the normal image to show. with a small loading icon on them.

It will show on the products list page (products archive) instead of the product image, and in the single product page.
I need to add a field for the products, so I can mark which product I want this slideshow to be active
and another field to set speed and if fade or cut transition.