1<#--  

2## TV Paiaguas - Colunas 

3## Ultima Revisão: 2019-09-09 

4--> 

5 

6<style> 

7.foto-overlay span{display: block;text-align: center;font-size: 32px;} 

8.foto-overlay span>i{margin-top: 60px!important;opacity: .8;} 

9#vid-date{float: right;font-size: 12px;} 

10 

11.pagetitle-content input[type="text"] { 

12    color: #fff; 

13    background: rgba(255,255,255,0.3); 

14    border: 0; 

15    padding: 3px 5px; 

16    margin-top: 5px; 

17} 

18 

19.lfr-token-list{display:none;} 

20.search-layout{display:none;} 

21.control-group{margin-bottom:0 !important;} 

22.pagetitle-content form{margin-bottom:0;display:-webkit-inline-box;margin-left: 20px;} 

23.pagetitle-content{padding:5px 0 0 !important;} 

24 

25#vid-title > form > input[type=text]{ 

26	display: none; 

27} 

28 

29.hideLink{ 

30	visibility: hidden; 

31} 

32 

33#dl-video-link{ 

34	 

35} 

36 

37.aui img{ 

38	height: auto !important; 

39} 

40 

41/* Popup container - can be anything you want */ 

42.popup { 

43	position: fixed; 

44	-moz-user-select: none; 

45	-ms-user-select: none; 

46	user-select: none; 

47	left: 35%; 

48	top: 80%; 

49	z-index: 9999; 

50} 

51 

52/* The actual popup */ 

53.popup .popuptext { 

54	visibility: visible; 

55	width: 250px; 

56	background-color: #324688; 

57	color: #fff; 

58	text-align: center; 

59	border-radius: 6px; 

60	padding: 5px; 

61	position: fixed; 

62	z-index: 9999; 

63	top: 15%; 

64	left: 35%; 

65	margin-left: -80px; 

66	box-shadow: 0px 0px 11px 5px rgba(255,255,255,0.75); 

67} 

68 

69@media screen and (max-width: 499px) { 

70	.popup .popuptext { 

71		width: 250px; 

72	} 

73} 

74 

75 

76/* Toggle this class - hide and show the popup */ 

77.popup .hide { 

78	visibility: hidden; 

79	-webkit-animation: fadeIn 1s; 

80	animation: fadeIn 1s; 

81} 

82 

83.closer{ 

84	text-align: right !important; 

85	font-family: nexa; 

86float: right; 

87margin-right: 6px; 

88cursor: pointer; 

89} 

90 

91/* Add animation (fade in the popup) */ 

92@-webkit-keyframes fadeIn { 

93	from {opacity: 0;} 

94	to {opacity: 1;} 

95} 

96 

97@keyframes fadeIn { 

98	from {opacity: 0;} 

99	to {opacity:1 ;} 

100} 

101 

102.form-fields{ 

103	text-align: left; 

104} 

105 

106#myPopup > form > button{ 

107	width: 220px; 

108} 

109 

110#dl-video-link{ 

111	display: block; 

112	padding: 15px 0px 0px 0px; 

113} 

114</style> 

115 

116<#assign namespace = renderResponse.getNamespace() > 

117<#assign urlActionPortlet = renderResponse.createActionURL().toString() > 

118<#assign nomeForm = renderRequest.getParameter("nomeForm")!"" >  

119<#assign veiculoForm = renderRequest.getParameter("veiculoForm")!"" >  

120<#assign emailForm = renderRequest.getParameter("emailForm")!"" >  

121<#assign file = "" > 

122 

123<#assign renderer = entries[0].getAssetRenderer() > 

124<#if renderer.getClassName() == "com.liferay.portlet.journal.model.JournalArticle" > 

125	<#assign journalArticle = renderer.getArticle() > 

126	<#assign document = saxReaderUtil.read(journalArticle.getContent()) > 

127	<#assign rootElement = document.getRootElement() > 

128	<#assign xPathSelector = saxReaderUtil.createXPath("dynamic-element[@name='url']") > 

129	<#assign url = xPathSelector.selectSingleNode(rootElement).getStringValue() > 

130	<#assign link = renderer.getURLViewInContext(renderRequest, renderResponse, '') > 

131	<#assign xPathSelector = saxReaderUtil.createXPath("dynamic-element[@name='file']") > 

132	<#assign file = xPathSelector.selectSingleNode(rootElement).getStringValue() > 

133	<#assign url = url?split("/")[3]> 

134	<#assign date = journalArticle.displayDate?string["dd 'de' MMMM 'de' yyyy '&agrave;s' HH:mm"] > 

135</#if> 

136 

137<#-- POP UP --> 

138<div class="popup" style="text-align: rigth !important;"> 

139	<span class="popuptext hide" style="text-align: rigth !important;" id="myPopup"> 

140		<span  onclick="hidePopup()" style="text-align: rigth !important;" class="closer"> 

141			X 

142		</span> 

143		<form class="vid-download" action="/video-link" target="_blank" method="post" name="fm" > 

144			<div class="form-fields span9"> 

145				Nome:<br /> 

146				<input type="text" name=nomeForm value="" required /><br /> 

147				Veículo:<br /> 

148				<input type="text" name=veiculoForm value="" required /><br /> 

149				E-mail:<br /> 

150				<input type="email" name=emailForm value='' required /><br /> 

151				<!-- ${dateUtil.newDate()?string["hh-mm-ss"]} --> 

152			</div> 

153			<br /> 

154			 

155			<input id="fileForm" type="hidden" name="fileForm" value=${file}> 

156			 

157			<button type="submit" alt="Download" class="btn btn-primary" > 

158			  <i class="icon-download-alt"></i> 

159			</button> 

160		</form> 

161	</span> 

162</div> 

163<#-- FIM POP UP --> 

164 

165<#-- VIDEO MAIOR --> 

166<div class="vid-container"> 

167    <span id="vid-date">${date}</span> 

168    <iframe  

169        id="vid_frame"  

170        src="https://www.youtube.com/embed/${url?trim}?rel=0&showinfo=0&autohide=1"  

171        frameborder="0" width="100%" height="315"> 

172    </iframe> 

173    <div id="vid-title"> 

174        <span><a href=${link}>${entry.getTitle(locale)}</a></span> 

175		<#if file?has_content> 

176			<#-- 

177##				<div class="vid-download"> 

178##					<button type="button" onClick="hidePopup()" alt="Download" class="btn btn-primary"> 

179##					  <i class="icon-download-alt"></i> 

180##					</button> 

181##				</div> 

182			--> 

183		</#if> 

184    </div> 

185</div> 

186<#-- FIM VIDEO MAIOR --> 

187 

188<#-- MOSAICO DE VIDEOS --> 

189<div class="recents">  

190    <div class="recents-title">Recentes</div>  

191</div> 

192<#assign count = 0> 

193<#if entries?has_content> 

194	<#list entries as entry> 

195        <#assign renderer = entry.getAssetRenderer() > 

196        <#assign className = renderer.getClassName() > 

197        <#if className == "com.liferay.portlet.journal.model.JournalArticle" > 

198            <#assign journalArticle = renderer.getArticle() > 

199            <#assign document = saxReaderUtil.read(journalArticle.getContent()) > 

200            <#assign rootElement = document.getRootElement() > 

201            <#assign xPathSelector = saxReaderUtil.createXPath("dynamic-element[@name='url']") > 

202            <#assign url = xPathSelector.selectSingleNode(rootElement).getStringValue() > 

203            <#assign link = renderer.getURLViewInContext(renderRequest, renderResponse, '') > 

204            <#assign xPathSelector = saxReaderUtil.createXPath("dynamic-element[@name='file']") > 

205            <#assign file = xPathSelector.selectSingleNode(rootElement).getStringValue() > 

206             

207            <#if count == 0> 

208                <div class="row-fluid vid-line" style="margin-bottom:30px;"> 

209            </#if> 

210             

211            <#assign url = url?split("/")[3]> 

212             

213            <#assign date = journalArticle.displayDate?string["dd 'de' MMMM 'de' yyyy '&agrave;s' HH:mm"] > 

214            <div class="span4" style="background:url(https://img.youtube.com/vi/${url?trim}/sddefault.jpg);background-position-x:50%;height:150px;background-size: contain;position:relative;"> 

215				<span style="font-size: 11px;color: #fff;padding: 1px 3px;position: absolute;">${date}</span> 

216				<a onClick="playVideo(${url?trim},${entry.getTitle(locale)},${link},${date},${file?trim})" href="#video"> 

217					<span class="foto-overlay"> 

218						<span> 

219							<i class="icon-play"></i> 

220						</span> 

221						<div class="vid-thumb-title"><a onClick="playVideo('${url?trim}','${entry.getTitle(locale)}','${link}','${date}', '${file?trim}')" style="color:#fff;" href="#video">${entry.getTitle(locale)}</a></div> 

222					</span> 

223				</a> 

224            </div> 

225            <#assign count = count+1> 

226             

227            <#if count == 3> 

228                </div> 

229                <#assign count = 0> 

230            </#if> 

231        </#if> 

232    </#list> 

233    <#if count != 0> 

234        </div> 

235    </#if> 

236</#if> 

237<#-- FIM MOSAICO DE VIDEOS --> 

238<script> 

239 

240    function hidePopup() { 

241        var popup = document.getElementById('myPopup'); 

242        popup.classList.toggle('hide'); 

243    } 

244	 

245    function playVideo(id, title, link, date, file){ 

246        document.getElementById('vid_frame').src="https://www.youtube.com/embed/"+id+"?autoplay=1&rel=0&showinfo=0&autohide=1"; 

247		if (file === ""){ 

248			document.getElementById('vid-title').innerHTML = '<span><a href="'+ link +'">' + title + '</a></span>'; 

249		} else { 

250			<#-- //document.getElementById('vid-title').innerHTML = '<span><a href="'+ link +'">' + title + '</a></span><div class="vid-download"><button type="button" onClick="hidePopup()" alt="Download" class="btn btn-primary"><i class="icon-download-alt"></i></button></div>'; --> 

251			document.getElementById('vid-title').innerHTML = '<span><a href="'+ link +'">' + title + '</a></span>'; 

252		} 

253        document.getElementById('vid-date').innerHTML = date; 

254		document.getElementById('fileForm').value = file; 

255    } 

256     

257    searchInterno(); 

258	 

259    function showLink(){ 

260        document.getElementById('dl-video-link').style.display('block'); 

261    } 

262</script>