JS: https://www.toluna.com/o/influencers-responsive-theme/js
page_name: IMPL Home Public Video INDIA 2
friendly_page_name: IMPL Home Public Video INDIA 2
the_title: IMPL Home Public Video INDIA 2
nav_item_footer: non-footer

IMPL Home Public Video INDIA 2

Home Public Intro

Influence Your World

Influencers is a community where you can voice your opinion and get rewarded instantly by participating in exciting market research projects relevant to you.

Menu Display

Influencers App Download

Get the full experience through our app
Downloads
Not Now Get the app

Voucher Logos

Menu Display

Nested Applications

Language Selector

Social Icons FA

App Download Buttons

Public Home Video INDIA

An error occurred while processing the template.
Java method "com.liferay.portal.kernel.security.permission.wrapper.PermissionCheckerWrapper.init(com.liferay.portal.kernel.model.User)" threw an exception when invoked on com.liferay.depot.internal.security.permission.wrapper.DepotPermissionCheckerWrapper object "com.liferay.depot.internal.security.permission.wrapper.DepotPermissionCheckerWrapper@3e0dd12"; see cause exception in the Java stack trace.

----
FTL stack trace ("~" means nesting-related):
	- Failed at: #assign void = permissionChecker.init...  [in template "3189288#3189322#29678495" at line 7, column 1]
----
1<#-- Web content templates are used to lay out the fields defined in a web 
2content structure. Please use the left panel to quickly add commonly used 
3variables. Autocomplete is also available and can be invoked by typing "${". --> 
4 
5<#assign LayoutService = serviceLocator.findService("com.liferay.portal.kernel.service.LayoutService") /> 
6<#assign UserService = serviceLocator.findService("com.liferay.portal.kernel.service.UserService")> 
7<#assign void = permissionChecker.init(UserService.getCurrentUser()) /> 
8 
9<style> 
10@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;700&display=swap'); 
11  #video-intro-container { 
12    height: 100%; 
13    display: flex; 
14    align-items: center; 
15    overflow: hidden; 
16    position: relative; 
17
18    
19  #video-intro-player { 
20    width: 100%; 
21    height: 100%; 
22    object-fit: cover; 
23
24  .video-header-container { 
25    position: absolute; 
26    top: 50%; 
27    left: 50%; 
28    font-family: "Poppins", sans-serif; 
29    color: white; 
30    opacity: 0; 
31    transition: all 1.5s ease-out; 
32
33 
34  .video-header-big-header { 
35    font-size: 5em; 
36    font-weight: 700; 
37    line-height: 0.8em; 
38
39  .video-header-small-header { 
40    font-size: 3em; 
41    font-weight: 400; 
42    letter-spacing: 0.03em; 
43
44   
45  @media only screen and (max-width: 768px){ 
46    .video-header-container { 
47        display: none; 
48
49     
50     #mobile-intro-container { 
51      left:0; 
52      right:0; 
53      margin-left: auto; 
54      margin-right: auto; 
55      position: absolute; 
56      width: 90%; 
57      top:30%; 
58
59   
60  #mobile-main-title { 
61    font-style: normal; 
62    font-weight: 600; 
63    line-height: 38px; 
64    margin: 0; 
65    text-align:center; 
66    color:#ffffff; 
67    font-family: "Greycliff CF", sans-serif; 
68    font-size: 40px !important; 
69    padding-bottom: 20px; 
70
71   
72  #mobile-main-text { 
73    font-family: "Greycliff CF", sans-serif; 
74    font-style: normal; 
75    font-weight: normal; 
76    font-size: 18px!important; 
77    line-height: 150%; 
78    letter-spacing: -0.002em; 
79    padding-left: 7px; 
80    color: #ffffff; 
81    letter-spacing: -0.02em; 
82    text-align:center; 
83
84   
85  #mobile-register-btn,#mobile-signin-btn,#mobile-signout-btn { 
86    max-width: 300px; 
87    border-radius: 10em; 
88    margin: 10px auto; 
89
90   
91  #layout-column_social { 
92      margin-top:20%; 
93
94
95 
96${CSSoverride.getData()} 
97 
98<#if Step.getSiblings()?has_content> 
99<#list Step.getSiblings() as cur_Step> 
100<#if getterUtil.getBoolean(cur_Step.getData())> 
101  #video-intro-container.step-${cur_Step?index} .step-${cur_Step?index} { 
102    opacity: 1; 
103
104  #video-intro-container .step-${cur_Step?index} { 
105    margin-top: ${cur_Step.getChild("VerticalOffset").getData()}%; 
106
107  #video-intro-container .step-${cur_Step?index} .video-header-big-header { 
108    margin-left: ${cur_Step.getChild("BigHeaderOffset").getData()}%; 
109
110  #video-intro-container .step-${cur_Step?index} .video-header-small-header { 
111    margin-left: ${cur_Step.getChild("SmallHeaderOffset").getData()}%; 
112
113   
114</#if> 
115</#list> 
116</#if> 
117</style> 
118 
119<div id="video-intro-container" class="step-0"> 
120  <video id="video-intro-player" defer muted autoplay muted playsinline></video> 
121   
122<#if Step.getSiblings()?has_content> 
123<#list Step.getSiblings() as cur_Step> 
124<#if getterUtil.getBoolean(cur_Step.getData())> 
125  <div class="video-header-container step-${cur_Step?index}"> 
126    <div class="video-header-big-header">${cur_Step.getChild("BigHeaderText").getData()}</div> 
127    <div class="video-header-small-header">${cur_Step.getChild("SmallHeaderText").getData()}</div> 
128  </div> 
129</#if> 
130</#list> 
131</#if> 
132  
133</div> 
134 
135<script> 
136let video_region = "${Region.getData()}"; 
137let videos = { 
138    APAC: [ 
139
140        webm_filename: "/documents/3189313/23244499/Influencers_APAC_480x640.webm/01a74721-7c5f-2983-90f8-7298d6f6b43a", 
141        mp4_filename: "/documents/3189313/23244499/Influencers_APAC_480x640.mp4/f6ce27bb-86fd-93d6-8f43-82a7518032f6", 
142        media: window.matchMedia("(max-width: 768px)"), 
143      }, 
144
145        webm_filename: "/documents/3189313/23244499/Influencers_APAC_800x600.webm/5c17db50-5182-c03b-f50c-b75ae678f469", 
146        mp4_filename: "/documents/3189313/23244499/Influencers_APAC_800x600.mp4/eaafd5ea-d16a-77c7-7614-03197d75d0d8", 
147        media: window.matchMedia("(max-width: 960px)"), 
148      }, 
149
150        webm_filename: "/documents/3189313/23244499/Influencers_APAC_960x720.webm/790112f7-9c33-9de3-5897-4a24a100ce45", 
151        mp4_filename: "/documents/3189313/23244499/Influencers_APAC_960x720.mp4/ba10579f-78d7-8f40-2e6f-783633e4e123", 
152        media: window.matchMedia("(min-width: 960px)"), 
153      }, 
154    ], 
155    EMEA: [ 
156
157        webm_filename: "/documents/3189313/23244499/Influencers_EMEA_480x640.webm/edc6e90e-d228-0fe3-6214-502284d967de", 
158        mp4_filename: "/documents/3189313/23244499/Influencers_EMEA_480x640.mp4/155428b0-f035-5ffa-6cf7-0ed8c3cbd005", 
159        media: window.matchMedia("(max-width: 768px)"), 
160      }, 
161
162        webm_filename: "/documents/3189313/23244499/Influencers_EMEA_800x600.webm/ef2b6290-7703-2afe-063e-200642eb79b7", 
163        mp4_filename: "/documents/3189313/23244499/Influencers_EMEA_800x600.mp4/cc3f7baa-2cd6-53c7-723c-d0594ac4c955", 
164        media: window.matchMedia("(max-width: 960px)"), 
165      }, 
166
167        webm_filename: "/documents/3189313/23244499/Influencers_EMEA_960x720.webm/6be8d1a3-7462-6274-e176-6440f7a2085d", 
168        mp4_filename: "/documents/3189313/23244499/Influencers_EMEA_960x720.mp4/f48609f1-8f3e-c3b5-3544-5eda0bb7feb5", 
169        media: window.matchMedia("(min-width: 960px)"), 
170      }, 
171    ], 
172    INDIA: [ 
173
174        webm_filename: "/documents/3189313/23244499/Influencers_INDIA_480x640.webm/65b0306e-80ac-71de-f7ff-723b285ed1ad", 
175        mp4_filename: "/documents/3189313/23244499/Influencers_INDIA_480x640.mp4/8047ee9f-3c38-3e3a-ec27-03772bb0928a", 
176        media: window.matchMedia("(max-width: 768px)"), 
177      }, 
178
179        webm_filename: "/documents/3189313/23244499/Influencers_INDIA_800x600.webm/9a9d537f-ca76-89c5-b81a-46e875742f94", 
180        mp4_filename: "/documents/3189313/23244499/Influencers_INDIA_800x600.mp4/eb389ec8-8d9d-9724-99ac-657511b2a0b4", 
181        media: window.matchMedia("(max-width: 960px)"), 
182      }, 
183
184        webm_filename: "/documents/3189313/23244499/Influencers_INDIA_960x720.webm/6f56d5be-0099-e0c2-dc05-184301ef20a0", 
185        mp4_filename: "/documents/3189313/23244499/Influencers_INDIA_960x720.mp4/07aa243e-210f-5dd4-19e2-274747d9ba69", 
186        media: window.matchMedia("(min-width: 960px)"), 
187      }, 
188    ], 
189    MENA: [ 
190
191        webm_filename: "/documents/3189313/23244499/Influencers_MENA_480x640.webm/450df341-f139-ff8c-45fe-1bc8b5d0dae7", 
192        mp4_filename: "/documents/3189313/23244499/Influencers_MENA_480x640.mp4/d6f0136a-a637-17d6-fd38-9ea84d8e688b", 
193        media: window.matchMedia("(max-width: 768px)"), 
194      }, 
195
196        webm_filename: "/documents/3189313/23244499/Influencers_MENA_800x600.webm/e0a291e2-874f-32ec-b158-8a145bc04c54", 
197        mp4_filename: "/documents/3189313/23244499/Influencers_MENA_800x600.mp4/ddfdf204-0dac-15e0-ee87-50fb9f061cb7", 
198        media: window.matchMedia("(max-width: 960px)"), 
199      }, 
200
201        webm_filename: "/documents/3189313/23244499/Influencers_MENA_960x720.webm/fc619e27-7a5c-1a65-03c3-b27c272acb5a", 
202        mp4_filename: "/documents/3189313/23244499/Influencers_MENA_960x720.mp4/a2b267e8-30d7-c42e-fa3f-c5eb01aaa5db", 
203        media: window.matchMedia("(min-width: 960px)"), 
204      }, 
205    ], 
206  }; 
207   
208 
209for (video of videos[video_region]) { 
210  if (video.media.matches) { 
211    let container = document.querySelector("#video-intro-container"); 
212    let player = document.querySelector("#video-intro-player"); 
213 
214    let webm = document.createElement("source"); 
215    webm.setAttribute("type", "video/webm"); 
216    webm.setAttribute("src", video.webm_filename); 
217 
218    let mp4 = document.createElement("source"); 
219    mp4.setAttribute("type", "video/mp4"); 
220    mp4.setAttribute("src", video.mp4_filename); 
221 
222    player.append(webm); 
223    player.append(mp4); 
224 
225    player.addEventListener("timeupdate", (event) => { 
226      let step = Math.min(4, Math.floor(player.currentTime / 5)); // 5 secs per video segment 
227 
228      if (!container.classList.contains("step-"+step)) { 
229        container.classList.forEach(function (value) { 
230          if (value.match(/step/gi)) { 
231            container.classList.remove(value); 
232
233        }); 
234        container.classList.add("step-"+step); 
235
236    }); 
237 
238    player.addEventListener("ended", (event) => { 
239      player.play(); 
240    }); 
241 
242    player.play(); 
243 
244    break; 
245
246
247 
248</script> 
249 
250<div id="mobile-intro-container"> 
251<div class="btn-group-vertical shadow hidden-md hidden-lg hidden-xl"> 
252 
253<p>${MobileText.getData()}</p> 
254<p id="mobile-main-title">${MobileText.getChild("MobileTextBigHeader").getData()}</p> 
255<p id="mobile-main-text">${MobileText.getChild("MobileTextSmallHeader").getData()}</p> 
256 
257 
258<#attempt> 
259 
260<#if MobileRegistration?has_content> 
261<#if (MobileRegistration.getData()?length > 0)> 
262<a href="${MobileRegistration.getFriendlyUrl()}" class="btn btn-default" id="mobile-register-btn"> 
263${LayoutService.getLayoutName(groupId, false, MobileRegistration.getData()?number, MobileRegistration.getAttribute("language-id"))}</a> 
264</#if> 
265</#if> 
266 
267<#recover> 
268</#attempt> 
269 
270<#attempt> 
271<#if MobileLogin?has_content> 
272<#if true >    
273<a href="${MobileLogin.getFriendlyUrl()}" class="btn btn-info sign-in" rel="nofollow" data-redirect="false" id="mobile-signin-btn">${languageUtil.get(locale, "sign-in")}</a> 
274</a> 
275<#else> 
276<a href="/c/portal/logout" class="btn btn-info sign-out" rel="nofollow" data-redirect="false" id="mobile-signout-btn">${languageUtil.get(locale, "sign-out")}</a> 
277</#if> 
278</#if> 
279<#recover> 
280</#attempt> 
281</div> 
282 </div> <!-- end of mobileintrocontainer -->