Hello everyone!
I'm trying to impement a javascript library which has the same behaviour of instagram stories. The author of this library explain how to do it, but something went wrong when I try to send some objects as input parameter.
The basic of this script is:
var stories = new Zuck(this.document.querySelector('.UserStories'), // .UserStories is a class defined in a container
{
avatars: true, // shows user photo instead of last story item preview
list: false, // displays a timeline instead of carousel
openEffect: true, // enables effect when opening story
cubeEffect: false, // enables the 3d cube effect when sliding story
autoFullScreen: false, // enables fullscreen on mobile browsers
backButton: true, // adds a back button to close the story viewer
previousTap: true, // use 1/3 of the screen to navigate to previous item when tap the story
localStorage: true, // set true to save "seen" position. Element must have a id to save properly.
rtl: false, // enable/disable RTL
stories: [
]
});
Then I call a function to update stories
stories.update($itemobjects);
So my question here is every time that I put new objects hard coded it works fine, but if I put it as input parameter something wen wrong...
Hi Guilherme!Cool subject... Instagram! ??I don't know exactly what you did to use an input parameter, but follow attached an example of your module working with dynamic data.What I did:
Hope it helps! ??
Hi David,
You brought me some very important insights! I've tried a similar approach as you did, but some concepts was not completly connected in my mind and now I can see it clearly.
Thank you!
By the way, I'm a big fan of Hi Interactive approach... Hi Music project was insane, great webinar.
Great! ??Hope we can share some cool together ideas in the future!
Hi Guilherme,
In Addition to David's suggection please also keep in mind that because you are sending data in input parameter so you must be fetching it from any database entity or external API.
In this case you should execute that javascript on "On After Fetch" event of your screen aggrigate or fetch data action.
Thank you Nikhil, great extra suggestion!
Thank you, Nikhil! Nice tip, gotcha!
Hello guys, it's me again.
Now it is fetching data from db and create the stories. Nice, but there is this property that is not set only on the first load... if reaload the same screen, everything works fine...
just in case, OML v2 is attached.
url preview: https://personal-xmupmst4.outsystemscloud.com/JavaScriptIssueExemplo/
url to create stories and change data: https://personal-xmupmst4.outsystemscloud.com/StoriesContent/Stories