B4J Library [ABMaterial] An image slider that can actually crop your image NOT

Ola

I'm looking for an image slider. Animated - check. Do not crop an image - check. Pause - check. Open a URL on image click - check. Navigation buttons - check, Pause on hover - check. Show progress of bar when viewing each image - check. Random animation per slide - check. Play local video on slide - check.

Define the class in Class_Globals

Dim mcs as MashCameraSlide

Add needed javascript and css on BuildPage.

Sub NeedsCameraSlide(pg As ABMPage)
    pg.AddExtraCSSFile("custom/camera.css")
    pg.AddExtraJavaScriptFile("custom/jquery.easing.1.3.js")
    pg.AddExtraJavaScriptFile("custom/camera.min.js")
End Sub

NB: Also copy the gifs and png from their /images folder to the images folder of your project

On ConnectPage, do the magic

mcs.Initialize(page,"mcs","600px")
    mcs.AddSlideImage("1","https://i.vimeocdn.com/video/679414310_1280.jpg","Introduction","https://vimeo.com/252710494","../images/Introduction.mp4")
    mcs.AddSlideImage("2","https://i.vimeocdn.com/video/680826175_1280.jpg","Code Flow","https://vimeo.com/253834441","")
    mcs.AddSlideImage("3","https://i.vimeocdn.com/video/679167167_1280.jpg","Subs & Variables", "https://vimeo.com/252510558","")
    mcs.AddSlideImage("4","https://i.vimeocdn.com/video/679395238_1280.jpg","Strings","https://vimeo.com/252694269","")
    mcs.AddSlideImage("5","https://i.vimeocdn.com/video/680035546_1280.jpg","Objects & Custom Types","https://vimeo.com/253209351","")
    'change the background loader color
    'mcs.loaderBgColor = MashPlugIns.COLOR_BROWN
    'change the loader color
    'mcs.loaderColor = MashPlugIns.COLOR_AQUA
    'the images should fit
    'mcs.Fit = True
    'do not pause on hover
    'mcs.hover = False
    'do not crop images
    mcs.DoNotCrop = True
    page.Cell(2,1).AddComponent(mcs.ABMComp)
  
    Dim msb As MashSliceBox
    msb.Initialize(page,"msb")
    msb.AddSlide("1","Image 1 test","../images/1.jpg","image1","#",True)
    msb.AddSlide("2","Image 2 text","../images/2.jpg","image2","#",False)
    msb.AddSlide("3","Image 2 text","../images/3.jpg","image3","#",False)
    msb.AddSlide("4","Image 2 text","../images/4.jpg","image4","#",False)
    msb.AddSlide("5","Image 2 text","../images/5.jpg","image5","#",False)
    msb.AddSlide("6","Image 2 text","../images/6.jpg","image6","#",False)
    msb.AddSlide("7","Image 2 text","../images/7.jpg","image7","#",False)
    page.Cell(2,1).AddComponent(msb.ABMComp)

To check if I can return the position of clicked image...

#Impressive..

Ta!