MoE in Photos and Videos

1<#assign LocaleUtil = staticUtil["com.liferay.portal.kernel.util.LocaleUtil"] /> 

2<#assign lrDateUtil = staticUtil["com.liferay.portal.kernel.util.DateUtil"] /> 

3<#assign dlAppServiceUtil = serviceLocator.findService("com.liferay.document.library.kernel.service.DLAppService") /> 

4<#assign vocabLocalService = serviceLocator.findService("com.liferay.asset.kernel.service.AssetVocabularyLocalService")  /> 

5<#function getFileEntry fileJSONObject> 

6<#assign fileEntryUUID = fileJSONObject.getString("uuid") /> 

7<#if fileJSONObject.getLong("groupId") gt 0> 

8	<#assign fileEntryGroupId = fileJSONObject.getLong("groupId") /> 

9	<#else> 

10	<#assign fileEntryGroupId = scopeGroupId /> 

11</#if> 

12<#attempt> 

13<#return dlAppServiceUtil.getFileEntryByUuidAndGroupId(fileEntryUUID, fileEntryGroupId)!""> 

14<#recover> 

15<#return ""> 

16</#attempt> 

17</#function> 

18<#function getFileJSONObject fieldValue> 

19	<#return jsonFactoryUtil.createJSONObject(fieldValue)> 

20	</#function> 

21	<#function getFileEntryURL fileEntry> 

22	<#return themeDisplay.getPathContext() + "/documents/" + fileEntry.getRepositoryId()?c + "/" + fileEntry.getFolderId()?c + "/" + urlCodec.encodeURL(htmlUtil.unescape(fileEntry.getTitle()), true) + "/" + fileEntry.getUuid()> 

23</#function> 

24 

25<#assign group_Id = themeDisplay.getScopeGroupId() /> 

26<#assign jls = serviceLocator.findService("com.liferay.journal.service.JournalArticleLocalService") /> 

27<#assign jARLService = serviceLocator.findService("com.liferay.journal.service.JournalArticleResourceLocalService") /> 

28<#assign catLocalService = serviceLocator.findService("com.liferay.asset.kernel.service.AssetCategoryLocalService") /> 

29<div class="filteration_form"> 

30   <div class="searchbar-container"> 

31      <@liferay_portlet["runtime"] 

32      portletProviderAction=portletProviderAction.VIEW 

33      instanceId="news-search-bar" 

34      portletName="com_liferay_portal_search_web_search_bar_portlet_SearchBarPortlet" 

35      />   

36   </div> 

37   <div class="category-container"><@liferay_portlet["runtime"] 

38      instanceId="photos-cat-listing" 

39      portletName="com_liferay_portal_search_web_category_facet_portlet_CategoryFacetPortlet" 

40      /></div> 

41   <div class="category-container"><@liferay_portlet["runtime"] 

42      portletProviderAction=portletProviderAction.VIEW 

43      instanceId="photos-year-listing" 

44      portletName="com_liferay_portal_search_web_tag_facet_portlet_TagFacetPortlet" 

45      /></div> 

46    <div class="search-icon"><i class="moeicon moeicon-search-02"></i></div> 

47</div> 

48 

49<div class="gallery_items" id="gallery_items"> 

50   <div class="row"> 

51     <#if entries?has_content> 

52      <#list entries as curEntry> 

53		  <div class="col-xl-4 col-lg-4 col-md-6"> 

54			 <#assign curArticle = jls.fetchLatestArticle(curEntry.getClassPK())  /> 

55			 <#assign   

56				 document = saxReaderUtil.read(curArticle.getContentByLocale(locale.toString())) 

57				 rootElement = document.getRootElement() 

58				 xPathSelectorIcon = saxReaderUtil.createXPath("dynamic-element[@name='Title']") 

59				 Title = xPathSelectorIcon.selectSingleNode(rootElement).getStringValue()?trim 

60				  

61			/>	 

62			 

63			<#assign xPathQuery = "/root/dynamic-element[@name='Content']" > 

64			<#assign mediaList = document.selectNodes(xPathQuery)> 

65			 

66			 

67			 

68			 

69			 <div class="sub_gallery custom_animation"> 

70				<div class="gall_single_item"> 

71				   <div class="related_images">				    

72					<#list mediaList as media> 

73						 

74						<#assign firstItemCls = "" /> 

75						<#if media?index == 0> 

76							<#assign firstItemCls = "first_item" /> 

77						</#if> 

78						 

79						<#assign selectedMedia = media/> 

80						<#assign mediaXML = saxReaderUtil.read(selectedMedia.asXML()) /> 

81						 

82						<#assign image = mediaXML.selectSingleNode("/dynamic-element/dynamic-element[@name='Image']/dynamic-content") > 

83						<#assign video = mediaXML.selectSingleNode("/dynamic-element/dynamic-element[@name='VideoUrl']/dynamic-content") > 

84						 

85						<#assign 

86							fileJSONObject = getFileJSONObject(image.getText()) 

87							fileEntry = getFileEntry(fileJSONObject) 

88							alt = fileJSONObject.getString("alt") 

89							src = fileJSONObject.getString("name") 

90						/> 

91											 

92						<#if video.getText()?? && video.getText() != "">							 

93							<a href="${video.getText()}" class="${firstItemCls}"> 

94								<#if (getFileEntryURL(fileEntry)??) && (getFileEntryURL(fileEntry)) != ""> 

95									<img alt="Thumbnail" src="${getFileEntryURL(fileEntry)}" > 

96								</#if> 

97							</a> 

98						<#else> 

99							<#if getFileEntryURL(fileEntry)?? && getFileEntryURL(fileEntry) != ""> 

100								<#assign imgUrl = getFileEntryURL(fileEntry) /> 

101								<a href="${imgUrl}" class="${firstItemCls}"> 

102									<img alt="Thumbnail"  src="${imgUrl}" > 

103								</a> 

104							</#if> 

105						</#if> 

106					</#list> 

107				   </div> 

108				   <#if Title?? && Title != ""> 

109					<h4>${Title}</h4> 

110				   </#if> 

111				</div> 

112			 </div> 

113		  </div> 

114      </#list> 

115     </#if> 

116   </div> 

117</div> 

118 

119<script src="https://cdnjs.cloudflare.com/ajax/libs/lightgallery-js/1.4.0/js/lightgallery.min.js"></script> 

120<script src="https://cdnjs.cloudflare.com/ajax/libs/lg-thumbnail/1.2.0/lg-thumbnail.min.js"></script> 

121<script src="https://cdnjs.cloudflare.com/ajax/libs/lg-video/1.3.0/lg-video.min.js"></script> 

122 

123<script> 

124    var elements = document.getElementsByClassName('sub_gallery custom_animation'); 

125    for (let item of elements) { 

126        lightGallery(item, { 

127            selector: 'a', 

128            thumbnail: true 

129        }); 

130    } 

131</script> 

132 

133<script> 

134    $(document).ready(function(){ 

135        $(".filteration_form .search-icon").on('click', function(){ 

136            $('.filteration_form').find('.searchbar-container form button').trigger('click');     

137        }) 

138    }) 

139</script>