static/js/main.js - Issue 29624561: Issue 6104 - Minified code in help center repository

Delta Between Two Patch Sets: static/js/main.js

Issue 29624561: Issue 6104 - Minified code in help center repository (Closed) Base URL: https://hg.adblockplus.org/help.eyeo.com

Left Patch Set: Fix sourcemaps for CSS files, Change tabs to spaces Created Nov. 30, 2017, 10:03 a.m.

Right Patch Set: Consolidated gulp tasks Created Dec. 7, 2017, 2:48 p.m.

Left:
Right:

Use n/p to move between diff chunks; N/P to move between comments.

Jump to:

Left: Side by side diff | Download
Right: Side by side diff | Download

LEFT	RIGHT
1 /*!

2 * This file is part of help.eyeo.com.

3 * Copyright (C) 2017-present eyeo GmbH

4 *

5 * help.eyeo.com is free software: you can redistribute it and/or modify

6 * it under the terms of the GNU General Public License as published by

7 * the Free Software Foundation, either version 3 of the License, or

8 * (at your option) any later version.

9 *

10 * help.eyeo.com is distributed in the hope that it will be useful,

11 * but WITHOUT ANY WARRANTY; without even the implied warranty of

12 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the

13 * GNU General Public License for more details.

14 *

15 * You should have received a copy of the GNU General Public License

16 * along with help.eyeo.com. If not, see <http://www.gnu.org/licenses/>.

17 */

18 (function()

19 {

20 document.addEventListener("DOMContentLoaded", function()

21 {

22

23 /**************************************************************************

24 * General

25 **************************************************************************/

26

27 // Change html class name from "no-js" to "js"

28 document.documentElement.className = "js";

29

30 /**************************************************************************

31 * Navbar

32 **************************************************************************/

33

34 function toggleNavbarCollapse()

35 {

36 var navbarCollapseEls = this.parentElement.getElementsByClassName("navbar- collapse");

37 for (var i = 0; i < navbarCollapseEls.length; i++)

38 {

39 navbarCollapseEls[i]

40 .classList.toggle("open")

41 }

42 }

43

44 var toggleNavbarCollapseEls = document.getElementsByClassName("toggle-navbar -collapse");

45 for (var i = 0; i < toggleNavbarCollapseEls.length; i++)

46 {

47 toggleNavbarCollapseEls[i]

48 .addEventListener("click", toggleNavbarCollapse, false);

49 }

50

51 /**************************************************************************

52 * CustomSelect

53 **************************************************************************/

54

55 function CustomSelect(select)

56 {

57 this.select = select;

58 this.close();

59 this.select

60 .addEventListener("click", this._onClick.bind(this), false);

61 this.select

62 .addEventListener("focusout", this._onFocusOut.bind(this), false);

63 }

64

65 CustomSelect.prototype._onFocusOut = function()

66 {

67 // setTimeout to allow document.activeElement

68 // to move to newly focused element

69 setTimeout(function()

70 {

71 var newFocus = document.activeElement;

72

73 if (newFocus

74 .classList.contains("custom-select-selected") \|\|

75 newFocus

76 .classList.contains("custom-select-option") \|\|

77 newFocus

78 .parentElement

79 .classList.contains("custom-select-option"))

80 {

81 return;

82 }

83

84 this.close();

85

86 }.bind(this), 1);

87 }

88

89 CustomSelect.prototype._onClick = function(event)

90 {

91 if (event.target.classList.contains("custom-select-selected"))

92 {

93 var options = this.select.querySelector(".custom-select-options");

94 if (options.getAttribute("aria-hidden") == "true")

95 {

96 this.open();

97 }

98 else

99 {

100 this.close();

101 }

102 }

103 }

104

105 CustomSelect.prototype.open = function()

106 {

107 this.select

108 .querySelector(".custom-select-selected")

109 .setAttribute("aria-expanded", "true");

110

111 this.select

112 .querySelector(".custom-select-options")

113 .removeAttribute("aria-hidden");

114 }

115

116 CustomSelect.prototype.close = function()

117 {

118 this.select

119 .querySelector(".custom-select-selected")

120 .setAttribute("aria-expanded", "false");

121

122 this.select

123 .querySelector(".custom-select-options")

124 .setAttribute("aria-hidden", "true");

125 }

126

127 new CustomSelect(document.getElementById("language-select"));

128

129 /**************************************************************************

130 * Accordion

131 **************************************************************************/

132

133 function Accordion(accordion)

134 {

135 this.accordion = accordion;

136

137 var accordionButtons = this.accordion.getElementsByClassName('accordion-to ggle-button');

138 for (var i = 0; i < accordionButtons.length; i++)

139 {

140 // Close all sections except the first

141 if (i !== 0)

142 {

143 accordionButtons[i].setAttribute("aria-expanded", "false");

144 document

145 .getElementById( accordionButtons[i].getAttribute("aria-controls") )

146 .setAttribute("hidden", "true");

147 }

148 }

149

150 this.accordion

151 .addEventListener("click", this._onClick.bind(this), false);

152 this.accordion

153 .addEventListener("keydown", this._onKeyDown.bind(this), false);

154 }

155

156 Accordion.prototype.toggleSection = function(clickedButton)

157 {

158 // Hide currently expanded section

159 var expandedButton = this.accordion.querySelector("button[aria-expanded='t rue']");

160 if (expandedButton)

161 {

162 expandedButton.setAttribute("aria-expanded", "false");

163 document

164 .getElementById( expandedButton.getAttribute("aria-controls") )

165 .setAttribute("hidden", "true");

166 }

167

168 // If currently expanded section is clicked

169 if (expandedButton === clickedButton) return;

170

171 // Expand new section

172 clickedButton.setAttribute("aria-expanded", "true");

173 document

174 .getElementById( clickedButton.getAttribute("aria-controls") )

175 .removeAttribute("hidden");

176 }

177

178 Accordion.prototype.focusNextSection = function()

179 {

180 var currentFocus = document.activeElement;

181 var nextheading = currentFocus.parentElement.nextElementSibling.nextElemen tSibling;

182

183 if (nextheading)

184 {

185 nextheading // .accordion-heading

186 .firstElementChild // .accordion-toggle-button

187 .focus();

188 }

189 else

190 {

191 this.accordion

192 .firstElementChild // .accordion-heading

193 .firstElementChild // .accordion-toggle-button

194 .focus();

195 }

196 }

197

198 Accordion.prototype.focusPrevSection = function()

199 {

200 var currentFocus = document.activeElement;

201 var prevAccordionBody = currentFocus.parentElement.previousElementSibling;

202

203 if (prevAccordionBody)

204 {

205 prevAccordionBody // .accordion-body

206 .previousElementSibling // .accordion-heading

207 .firstElementChild // .accordion-toggle-button

208 .focus();

209 }

210 else

211 {

212 this.accordion

213 .lastElementChild // .accordion-body

214 .previousElementSibling // .accordion-heading

215 .firstElementChild // .accordion-toggle-button

216 .focus();

217 }

218 }

219

220 Accordion.prototype._onKeyDown = function(event)

221 {

222 if (!event.target.classList.contains("accordion-toggle-button")) return;

223

224 if (event.key == "ArrowUp" \|\| event.keyCode == 38)

225 {

226 this.focusPrevSection();

227 }

228 else if (event.key == "ArrowDown" \|\| event.keyCode == 40)

229 {

230 this.focusNextSection();

231 }

232 }

233

234 Accordion.prototype._onClick = function(event)

235 {

236 if (!event.target.classList.contains("accordion-toggle-button")) return;

237

238 this.toggleSection(event.target);

239 }

240

241 var productTopicsAccordion = document.getElementById('product-topics-accordi on');

242 if (productTopicsAccordion)

243 {

244 new Accordion(productTopicsAccordion);

245 }

246

247 /**************************************************************************

248 * BrowserSelect

249 **************************************************************************/

250

251 function BrowserSelect(select)

252 {

253 this.select = select;

254 CustomSelect.apply(this, [this.select]);

255

256 this.BROWSER_STORAGE_KEY = "BROWSER";

257 this.BROWSER_AUTODETECTED_STORAGE_KEY = "BROWSER_AUTODETECTED";

258 this.SUPPORTED_BROWSERS = ["chrome", "opera", "samsungBrowser",

259 "yandexbrowser", "maxthon", "msie",

260 "msedge", "firefox", "ios", "safari"];

261 this.DEFAULT_BROWSER = "chrome";

262

263 this.select

264 .addEventListener("click", this._onClickOrKeyDown.bind(this), false);

265

266 this.select

267 .addEventListener("keydown", this._onClickOrKeyDown.bind(this), false);

268

269 var storedBrowser = localStorage.getItem(this.BROWSER_STORAGE_KEY);

270 if (storedBrowser) this.selectOption(storedBrowser);

271 else this.detectBrowser();

272 }

273

274 BrowserSelect.prototype = Object.create(CustomSelect.prototype);

275 BrowserSelect.prototype.constructor = BrowserSelect;

276

277 BrowserSelect.prototype.detectBrowser = function()

278 {

279 for (var i = 0; i < this.SUPPORTED_BROWSERS.length; i++)

280 {

281 var supportedBrowser = this.SUPPORTED_BROWSERS[i];

282 if (bowser[supportedBrowser])

283 {

284 localStorage.setItem(this.BROWSER_AUTODETECTED_STORAGE_KEY, "true");

285 return this.selectOption(supportedBrowser);

286 }

287 }

288

289 this.selectOption(this.DEFAULT_BROWSER);

290 };

291

292 BrowserSelect.prototype.selectOption = function(browser)

293 {

294 localStorage.setItem(this.BROWSER_STORAGE_KEY, browser);

295

296 // Change body class

297 var bodyClassList = Array.prototype.slice.call(document.body.classList);

298 for (var i = 0; i < bodyClassList.length; i++)

299 {

300 if (bodyClassList[i].indexOf("ua-") > -1)

301 {

302 document.body.classList.remove(bodyClassList[i]);

303 }

304 }

305 document.body.classList.add("ua-" + browser);

306

307 // Check selected option

308 var selectedItem = this.select

309 .querySelector("[data-value='" + browser + "']");

310 selectedItem.setAttribute("aria-checked", "true");

311

312 // Set selected option

313 var selectedOption = selectedItem.innerHTML;

314

315 if (localStorage.getItem(this.BROWSER_AUTODETECTED_STORAGE_KEY))

316 {

317 var autodetected = document

318 .getElementById("browser-select-autodetected")

319 .innerHTML;

320 selectedOption += "<span class='muted'>(" + autodetected + ")</span>";

321 }

322

323 this.select

324 .querySelector(".custom-select-selected")

325 .innerHTML = selectedOption;

326

327 if (!document.querySelector(".platform-" + browser))

328 {

329 this.handleNoContentForBrowser(browser);

330 }

331 };

332

333 BrowserSelect.prototype.handleNoContentForBrowser = function(browser)

334 {

335 var section = document.createElement("section");

336 section.classList.add("platform-" + browser);

337 section.innerHTML = document

338 .getElementById("no-content-for-platform-message")

339 .innerHTML;

340

341 document

342 .querySelector(".article-body")

343 .insertAdjacentElement("afterbegin", section);

344 }

345

346 BrowserSelect.prototype._onClickOrKeyDown = function(event)

347 {

348 var option = event.target.closest(".custom-select-option");

349 if (!option) return;

350

351 var IS_ENTER_KEY = event.key == "Enter" \|\| event.keyCode == 13;

352 if (event.keyCode && !IS_ENTER_KEY) return;

353

354 localStorage.removeItem(this.BROWSER_AUTODETECTED_STORAGE_KEY);

355

356 // Uncheck previously checked option

357 this.select

358 .querySelector("[aria-checked='true']")

359 .setAttribute("aria-checked", "false");

360

361 this.selectOption(option.getAttribute("data-value"));

362

363 this.close();

364 };

365

366 var browserSelect = document.getElementById("browser-select");

367 if (browserSelect)

368 {

369 new BrowserSelect(browserSelect);

370 }

371

372 }, false);

373 }());

374 //# sourceMappingURL=main.js.map

375

376 //# sourceMappingURL=main-debug.js.map

377

378 //# sourceMappingURL=main.js.map

379

380 //# sourceMappingURL=main.js.map

LEFT	RIGHT