Rietveld Code Review Tool
Help | Bug tracker | Discussion group | Source code

Side by Side Diff: static/poland/js/main.js

Issue 29800606: Fixes #91 - Homepage duplicate in Polish for SEM (Closed) Base URL: https://hg.adblockplus.org/web.adblockplus.org
Patch Set: Addressed comments #3 Created June 8, 2018, 6:26 p.m.
Left:
Right:
Use n/p to move between diff chunks; N/P to move between comments.
Jump to:
View unified diff | Download patch
« no previous file with comments | « static/poland/js/index.js ('k') | no next file » | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
OLDNEW
(Empty)
1 "use strict";
2
3 (function() {
4 function initLanguageSelection() {
5 var locale = document.getElementById("navbar-locale-selected");
6
7 // skip if page does not have language selection (EG: blog)
8 if (!locale) return;
9
10 locale.addEventListener("click", function() {
11 document.getElementById("navbar-locale-menu")
12 .classList.toggle("visible");
13 }, false);
14 }
15
16 function navigationClick(event) {
17 document.getElementById("navbar-menu")
18 .classList.toggle("visible");
19 }
20
21 function initMenu() {
22 document.getElementById("navbar-menu-toggle")
23 .addEventListener("click", navigationClick, false);
24 }
25
26 function initNavbarToggle() {
27 var navbar = document.getElementById("navbar");
28 var navbarLocale = document.getElementById("navbar-locale-menu");
29 var navbarHeight = navbar.offsetHeight;
30 var scrollHandled = false;
31 var lastScrollTop = 0;
32 var desktopBreakpoint = 991;
33
34 // IE9 does not support offsetHeight when element is fixed
35 if (!navbarHeight)
36 return;
37
38 window.addEventListener("scroll", (function() {
39 scrollHandled = false;
40 }));
41
42 setInterval(function() {
43 if(window.innerWidth > desktopBreakpoint) {
44 if (
45 !scrollHandled &&
46 ( // locale menu is not visible
47 !navbarLocale || // our blog doesn't have a locale menu
48 !navbarLocale.classList.contains("visible")
49 )
50 ) {
51 scrollHandled = handleScroll();
52 }
53 }
54 else {
55 navbar.style.top = 0;
56 }
57 }, 250);
58
59 function handleScroll() {
60 var currentScroll = window.pageYOffset;
61 if (currentScroll > lastScrollTop && currentScroll > navbarHeight) {
62 navbar.style.top = "-" + navbarHeight + "px";
63 } else {
64 navbar.style.top = 0;
65 }
66 lastScrollTop = currentScroll;
67 return true;
68 }
69 }
70
71 initLanguageSelection();
72 initMenu();
73 initNavbarToggle();
74 })();
75
76 (function()
77 {
78 /**
79 * Creats a GDPR compatible video
80 * @constructor
81 * @param {Element} parent - video parent / container
82 * @example
83 * <div id="example-video" class="video-parent">
84 * <a
85 * class="video-link"
86 * target="_blank"
87 * href="http://example.com/iframe/video/src">
88 * <img
89 * class="video-thumbnail"
90 * alt="Short description of video"
91 * src="/img/video-thumbnail.png" />
92 * <img
93 * class="video-play"
94 * alt="Open video in separate window""
95 * src="/img/video-link.png" />
96 * </a>
97 * <p class="video-disclaimer">Disclaimer text</p>
98 * </div>
99 */
100 function Video(parent)
101 {
102 /**
103 * Video parent / container element
104 * @member {Element}
105 */
106 this.parent = parent;
107
108 /**
109 * The last time that the play button was clicked
110 * @member {number}
111 */
112 this.lastClicked = 0;
113
114 var videoLink = parent.querySelector(".video-link");
115
116 /**
117 * The iframe video src url
118 * @member {string}
119 */
120 this.src = videoLink.getAttribute("href");
121
122 //remove disclaimer if disclaimer is shown by default
123 this.parent.classList.add("hide-disclaimer");
124
125 //change external link icon into play button icon
126 parent.querySelector(".video-play")
127 .setAttribute("src", "/img/video-play.png");
128
129 //show disclaimer or replace thumbnail with video on click
130 videoLink.addEventListener("click", this._onPlayClick.bind(this));
131 }
132
133 Video.prototype = {
134
135 _onPlayClick: function(event)
136 {
137 event.preventDefault();
138
139 if (this.parent.classList.contains("hide-disclaimer"))
140 this.toggleDisclaimer();
141 //prevent bypassing the disclaimer via double click
142 else if (new Date().getTime() - this.lastClicked > 600)
143 this.insertVideo();
144 },
145
146 toggleDisclaimer: function()
147 {
148 this.parent.classList.toggle("hide-disclaimer");
149 this.lastClicked = new Date().getTime();
150 },
151
152 /** Replace video thumbnail with video iframe */
153 insertVideo: function()
154 {
155 this.parent.classList.add("hide-disclaimer");
156 this.parent.classList.add("has-iframe");
157
158 //replace static thumbnail with iframe video
159 this.parent.innerHTML =
160 "<iframe " +
161 "class='video-iframe' " +
162 "frameborder=0 " +
163 "allowfullscreen " +
164 "src='" + encodeURI(this.src) + "'>" +
165 "</iframe>";
166 }
167 };
168
169 window.videos = [].slice.call(document.querySelectorAll(".video-parent"))
170 .map(function(parent) {return new Video(parent);});
171 }());
OLDNEW
« no previous file with comments | « static/poland/js/index.js ('k') | no next file » | no next file with comments »

Powered by Google App Engine
This is Rietveld