⚠️ Hi evreybody, big challenge today ⚠️
I am currently creating a course in the shape of a magazine. I would like to add a Javascript code in my storyline file in order to recreate the roll / flip page transition you can find in Powerpoint. Any ideas if it's possible and how can I manage to do that ?
>> it's not for a PDF in a webobject, I would like to be able to flip all slides of the course (intro, content, quiz, result page etc...) exactly like powerpoint does. So the code has to be build for the slide and not for a webobject.
Let me know, have a nice day ☀️
","kudosSumWeight":0,"postTime":"2024-07-07T01:37:51.000-07:00","images":{"__typename":"AssociatedImageConnection","edges":[],"totalCount":0,"pageInfo":{"__typename":"PageInfo","hasNextPage":false,"endCursor":null,"hasPreviousPage":false,"startCursor":null}},"attachments":{"__typename":"AttachmentConnection","pageInfo":{"__typename":"PageInfo","hasNextPage":false,"endCursor":null,"hasPreviousPage":false,"startCursor":null},"edges":[]},"tags":{"__typename":"TagConnection","pageInfo":{"__typename":"PageInfo","hasNextPage":false,"endCursor":null,"hasPreviousPage":false,"startCursor":null},"edges":[{"__typename":"TagEdge","cursor":"MjUuMXwyLjF8b3wxMHxfTlZffDE","node":{"__typename":"Tag","id":"tag:storyline 360","text":"storyline 360","time":"2014-10-09T03:01:38.000-07:00","lastActivityTime":null,"messagesCount":null,"followersCount":null}}]},"timeToRead":1,"currentRevision":{"__ref":"Revision:revision:959110_1"},"latestVersion":null,"metrics":{"__typename":"MessageMetrics","views":344},"visibilityScope":"PUBLIC","canonicalUrl":null,"seoTitle":null,"seoDescription":null,"isEscalated":null,"placeholder":false,"originalMessageForPlaceholder":null,"messagePolicies":{"__typename":"MessagePolicies","canModerateSpamMessage":{"__typename":"PolicyResult","failureReason":{"__typename":"FailureReason","message":"error.lithium.policies.feature.moderation_spam.action.moderate_entity.allowed.accessDenied","key":"error.lithium.policies.feature.moderation_spam.action.moderate_entity.allowed.accessDenied","args":[]}}},"archivalData":null,"body":"⚠️ Hi evreybody, big challenge today ⚠️
I am currently creating a course in the shape of a magazine. I would like to add a Javascript code in my storyline file in order to recreate the roll / flip page transition you can find in Powerpoint. Any ideas if it's possible and how can I manage to do that ?
>> it's not for a PDF in a webobject, I would like to be able to flip all slides of the course (intro, content, quiz, result page etc...) exactly like powerpoint does. So the code has to be build for the slide and not for a webobject.
Let me know, have a nice day ☀️
","customFields":[]},"Conversation:conversation:959110":{"__typename":"Conversation","id":"conversation:959110","solved":false,"topic":{"__ref":"ForumTopicMessage:message:959110"},"lastPostingActivityTime":"2025-01-29T12:01:25.057-08:00","lastPostTime":"2025-01-29T12:01:25.057-08:00","unreadReplyCount":16,"isSubscribed":false},"ModerationData:moderation_data:959110":{"__typename":"ModerationData","id":"moderation_data:959110","status":"APPROVED","rejectReason":null,"isReportedAbuse":false,"rejectUser":null,"rejectTime":null,"rejectActorType":null},"Revision:revision:959110_1":{"__typename":"Revision","id":"revision:959110_1","lastEditTime":"2024-07-07T01:37:51.000-07:00"},"ForumReplyMessage:message:1212572":{"__typename":"ForumReplyMessage","id":"message:1212572","conversation":{"__ref":"Conversation:conversation:959110"},"author":{"__ref":"User:user:165994"},"revisionNum":1,"uid":1212572,"depth":1,"hasGivenKudo":false,"subscribed":false,"board":{"__ref":"Forum:board:discuss"},"subject":"Re: FLIP BOOK / ROLL PAGE ANIMATION / TRANSITION","readOnly":false,"editFrozen":false,"moderationData":{"__ref":"ModerationData:moderation_data:1212572"},"parent":{"__ref":"ForumTopicMessage:message:959110"},"body":"I do think the upcoming Morph transition will give a quite similar effect as a page turn when used on groups in a page.
","body@stripHtml({\"removeProcessingText\":false,\"removeSpoilerMarkup\":false,\"removeTocMarkup\":false,\"truncateLength\":200})@stringLength":"121","kudosSumWeight":1,"repliesCount":0,"postTime":"2025-01-12T06:07:32.410-08:00","lastPublishTime":"2025-01-12T06:07:32.410-08:00","metrics":{"__typename":"MessageMetrics","views":164},"visibilityScope":"PUBLIC","placeholder":false,"originalMessageForPlaceholder":null,"isEscalated":null,"solution":false,"entityType":"FORUM_REPLY","eventPath":"category:connect/community:rwgqn69235board:discuss/message:959110/message:1212573","replies":{"__typename":"MessageConnection","pageInfo":{"__typename":"PageInfo","hasNextPage":false,"endCursor":null,"hasPreviousPage":false,"startCursor":null},"edges":[]},"customFields":[],"attachments":{"__typename":"AttachmentConnection","edges":[],"pageInfo":{"__typename":"PageInfo","hasNextPage":false,"endCursor":null,"hasPreviousPage":false,"startCursor":null}}},"User:user:679679":{"__typename":"User","id":"user:679679","uid":679679,"login":"Nathan_Hilliard","biography":null,"registrationData":{"__typename":"RegistrationData","status":null,"registrationTime":"2019-01-23T07:05:26.000-08:00"},"deleted":false,"email":"","avatar":{"__typename":"UserAvatar","url":"https://api.articulate.com/id/v1/avatars/auth0%7C5c48801d98e736790bc198ba"},"rank":{"__ref":"Rank:rank:6"},"entityType":"USER","eventPath":"community:rwgqn69235/user:679679"},"ModerationData:moderation_data:1212581":{"__typename":"ModerationData","id":"moderation_data:1212581","status":"APPROVED","rejectReason":null,"isReportedAbuse":false,"rejectUser":null,"rejectTime":null,"rejectActorType":null},"ForumReplyMessage:message:1212581":{"__typename":"ForumReplyMessage","author":{"__ref":"User:user:679679"},"id":"message:1212581","revisionNum":1,"uid":1212581,"depth":2,"hasGivenKudo":false,"subscribed":false,"board":{"__ref":"Forum:board:discuss"},"parent":{"__ref":"ForumReplyMessage:message:1212572"},"conversation":{"__ref":"Conversation:conversation:959110"},"subject":"Re: FLIP BOOK / ROLL PAGE ANIMATION / TRANSITION","moderationData":{"__ref":"ModerationData:moderation_data:1212581"},"body":"If you did use a JS library to produce a page turn/curl effect on the current slide, then there is a possible workaround for SL's lack of knowledge of upcoming/previous content. If you build out your flippable book as a set of slide layers on one slide (instead of a collection of different slides), then you can have the layers preload which makes all of the previous and upcoming content available at once. I experimented with this once when testing a horizontal scrolling environment. By using layers, I could freely flow between the different content sets. It seems reasonable that you could combine a page turn/curl effect with two sets of content to produce the effect you are seeking.
","body@stripHtml({\"removeProcessingText\":false,\"removeSpoilerMarkup\":false,\"removeTocMarkup\":false,\"truncateLength\":200})@stringLength":"203","kudosSumWeight":1,"repliesCount":0,"postTime":"2025-01-12T10:16:43.811-08:00","lastPublishTime":"2025-01-12T10:16:43.811-08:00","metrics":{"__typename":"MessageMetrics","views":153},"visibilityScope":"PUBLIC","placeholder":false,"originalMessageForPlaceholder":null,"isEscalated":null,"solution":false,"entityType":"FORUM_REPLY","eventPath":"category:connect/community:rwgqn69235board:discuss/message:959110/message:1212581","replies":{"__typename":"MessageConnection","pageInfo":{"__typename":"PageInfo","hasNextPage":false,"endCursor":null,"hasPreviousPage":false,"startCursor":null},"edges":[]},"customFields":[],"attachments":{"__typename":"AttachmentConnection","edges":[],"pageInfo":{"__typename":"PageInfo","hasNextPage":false,"endCursor":null,"hasPreviousPage":false,"startCursor":null}}},"CachedAsset:text:en_US-components/tags/TagView/TagViewChip-1740185487287":{"__typename":"CachedAsset","id":"text:en_US-components/tags/TagView/TagViewChip-1740185487287","value":{"tagLabelName":"Tag name {tagName}"},"localOverride":false}}}},"page":"/forums/ForumMessagePage/ForumMessagePage","query":{"boardId":"discuss","messageSubject":"flip-book--roll-page-animation--transition","messageId":"959110","replyId":"1212572"},"buildId":"UtG3-Pbti3STtL2t_tPEH","runtimeConfig":{"buildInformationVisible":false,"logLevelApp":"info","logLevelMetrics":"info","openTelemetryClientEnabled":false,"openTelemetryConfigName":"articulate","openTelemetryServiceVersion":"25.1.0","openTelemetryUniverse":"prod","openTelemetryCollector":"http://localhost:4318","openTelemetryRouteChangeAllowedTime":"5000","apolloDevToolsEnabled":false,"inboxMuteWipFeatureEnabled":false},"isFallback":false,"isExperimentalCompile":false,"dynamicIds":["./components/seo/QAPageSchema/QAPageSchema.tsx","./components/customComponent/CustomComponent/CustomComponent.tsx","./components/community/Navbar/NavbarWidget.tsx","./components/community/Breadcrumb/BreadcrumbWidget.tsx","./components/messages/TopicWithThreadedReplyListWidget/TopicWithThreadedReplyListWidget.tsx","./components/messages/RelatedContentWidget/RelatedContentWidget.tsx","./components/messages/MessageListForNodeByRecentActivityWidget/MessageListForNodeByRecentActivityWidget.tsx","./components/messages/MessageView/MessageViewStandard/MessageViewStandard.tsx","../shared/client/components/common/List/UnstyledList/UnstyledList.tsx","./components/messages/MessageView/MessageView.tsx","./components/messages/MessageView/MessageViewInline/MessageViewInline.tsx","../shared/client/components/common/List/ListGroup/ListGroup.tsx","../shared/client/components/common/Pager/PagerLoadMore/PagerLoadMore.tsx","../shared/client/components/common/List/UnwrappedList/UnwrappedList.tsx","./components/tags/TagView/TagView.tsx","./components/tags/TagView/TagViewChip/TagViewChip.tsx"],"appGip":true,"scriptLoader":[]}