refactoring of javascripts

assets/js/app/app.js

@@ -1,17 +1,19 @@
-const App = function (components) {
+class App {
+    constructor(components) {
         this.components = components || []
-}
+    }
 
-App.prototype.add = function (c) {
+    add(c) {
         this.components.push(c)
 
         return this
-}
+    }
 
-App.prototype.init = function () {
+    init() {
         for (let u = 0, x = this.components.length; u < x; u++) {
             this.components[u].init()
         }
+    }
 }
 
 module.exports = App

assets/js/app/code.js

@@ -23,11 +23,12 @@ require('prismjs/plugins/keep-markup/prism-keep-markup')
 require('prismjs/plugins/line-highlight/prism-line-highlight')
 require('prismjs/plugins/line-numbers/prism-line-numbers')
 
-const Code = function (w) {
+class Code {
+    constructor(w) {
         this.window = w
-}
+    }
 
-Code.prototype.init = function () {
+    init() {
         Prism.highlightAllUnder(document)
         let elements = this.window.document.querySelectorAll('code[data-title], div[data-title]')
 
@@ -93,6 +94,7 @@ Code.prototype.init = function () {
 
             post.insertBefore(win, pre)
         }
+    }
 }
 
 module.exports = Code

assets/js/app/form-pwn.js

@@ -1,13 +1,14 @@
 const Routing = require('./routing')
 
-const FormPnw = function (w) {
+class FormPnw {
+    constructor(w) {
         this.window = w
-}
+    }
 
-FormPnw.prototype.init = function () {
+    init() {
         const doc = this.window.document
 
-  doc.addEventListener('mousemove', function () {
+        doc.addEventListener('mousemove', function() {
             const forms = doc.querySelectorAll('form[data-form-bot]')
 
             for (let i = 0, len = forms.length; i < len; i++) {
@@ -25,6 +26,7 @@ FormPnw.prototype.init = function () {
                 form.removeAttribute('data-form-bot')
             }
         })
+    }
 }
 
 module.exports = FormPnw

assets/js/app/knmc.js

@@ -1,15 +1,16 @@
 const Mario = require('../../images/mario.gif')
 
-const Knmc = function (w) {
+class Knmc {
+    constructor(w) {
         this.window = w
-}
+    }
 
-Knmc.prototype.init = function () {
+    init() {
         let chars = ''
         const seq = '38384040373937396665'
         const body = this.window.document.querySelector('body')
 
-  body.addEventListener('keyup', function (e) {
+        body.addEventListener('keyup', function(e) {
             chars += e.keyCode.toString()
 
             if (chars.indexOf(seq) !== -1) {
@@ -21,7 +22,7 @@ Knmc.prototype.init = function () {
                 image.style.bottom = '-11px'
                 image.style.left = '-256px'
 
-      image.onload = function () {
+                image.onload = function() {
                     image.classList.add('knmc')
                     body.appendChild(image)
                 }
@@ -29,6 +30,7 @@ Knmc.prototype.init = function () {
                 image.src = url
             }
         })
+    }
 }
 
 module.exports = Knmc

assets/js/app/lazy-load.js

@@ -1,11 +1,10 @@
 const lozad = require('lozad')
 
-const LazyLoad = function () {
-}
-
-LazyLoad.prototype.init = function () {
+class LazyLoad {
+    init() {
         const observer = lozad('.lazy-img')
         observer.observe()
+    }
 }
 
 module.exports = LazyLoad

assets/js/app/mesh-viewer.js

@@ -1,10 +1,11 @@
 const tingle = require('tingle.js/src/tingle.js')
 
-const MeshViewer = function (w) {
+class MeshViewer {
+    constructor(w) {
         this.window = w
-}
+    }
 
-MeshViewer.prototype.init = function () {
+    init() {
         const openers = this.window.document.querySelectorAll('*[data-modal]')
 
         for (let i = 0, len = openers.length; i < len; i++) {
@@ -29,6 +30,7 @@ MeshViewer.prototype.init = function () {
                 modal.open()
             })
         }
+    }
 }
 
 module.exports = MeshViewer

assets/js/app/particles.js

@@ -1,10 +1,11 @@
 require('particles.js')
 
-const Particles = function (w) {
+class Particles {
+    constructor(w) {
         this.window = w
-}
+    }
 
-Particles.prototype.start = function () {
+    start() {
         if (this.window.innerWidth < 708) {
             return
         }
@@ -17,13 +18,13 @@ Particles.prototype.start = function () {
         this.particles.style.maxWidth = width + 'px'
 
         particlesJS.load('particles', '/js/particles.json?v=3')
-}
+    }
 
-Particles.prototype.clean = function () {
+    clean() {
         this.particles.innerHTML = ''
-}
+    }
 
-Particles.prototype.init = function () {
+    init() {
         this.particles = this.window.document.getElementById('particles')
 
         if (!this.particles) {
@@ -37,10 +38,11 @@ Particles.prototype.init = function () {
 
         const that = this
 
-  this.window.addEventListener('resize', function () {
+        this.window.addEventListener('resize', function() {
             that.clean()
             that.start()
         }, false)
+    }
 }
 
 module.exports = Particles

assets/js/app/post.js

@@ -1,10 +1,11 @@
 const Routing = require('./routing')
 
-const Post = function (w) {
+class Post {
+    constructor(w) {
         this.window = w
-}
+    }
 
-Post.prototype.commentsEvents = function () {
+    commentsEvents() {
         const document = this.window.document
 
         const parentCommentIdField = document.getElementById('user_comment_parentCommentId')
@@ -16,7 +17,7 @@ Post.prototype.commentsEvents = function () {
         const isAnswerAlert = document.getElementById('answer-alert')
         const cancelAnswerButton = document.getElementById('cancel-answer')
 
-  const toogleAnswerAlert = function () {
+        const toogleAnswerAlert = function() {
             if (parentCommentIdField.value) {
                 isAnswerAlert.classList.remove('hidden')
             } else {
@@ -29,13 +30,13 @@ Post.prototype.commentsEvents = function () {
         const answerButtons = document.querySelectorAll('a[data-answer]')
 
         for (let i = 0, len = answerButtons.length; i < len; i++) {
-    answerButtons[i].addEventListener('click', function (e) {
+            answerButtons[i].addEventListener('click', function(e) {
                 parentCommentIdField.value = e.target.getAttribute('data-answer')
                 toogleAnswerAlert()
             }, false)
         }
 
-  cancelAnswerButton.addEventListener('click', function (e) {
+        cancelAnswerButton.addEventListener('click', function(e) {
             e.preventDefault()
 
             parentCommentIdField.value = null
@@ -45,7 +46,7 @@ Post.prototype.commentsEvents = function () {
         const previewButton = document.querySelector('.preview-button')
         const previewRender = document.querySelector('#preview')
 
-  previewButton.addEventListener('click', function () {
+        previewButton.addEventListener('click', function() {
             if (previewRender.innerHTML === '') {
                 previewRender.innerHTML = '<p>Chargement en cours…</p>'
             }
@@ -53,7 +54,7 @@ Post.prototype.commentsEvents = function () {
             const content = document.querySelector('#user_comment_content').value
             const httpRequest = new XMLHttpRequest()
 
-    httpRequest.onreadystatechange = function (data) {
+            httpRequest.onreadystatechange = function(data) {
                 if (httpRequest.readyState === 4 && httpRequest.status === 200) {
                     const json = JSON.parse(httpRequest.response)
                     previewRender.innerHTML = json.render
@@ -68,14 +69,14 @@ Post.prototype.commentsEvents = function () {
             )
             httpRequest.send('content=' + encodeURIComponent(content))
         }, false)
-}
+    }
 
-Post.prototype.imagesEvents = function () {
+    imagesEvents() {
         const document = this.window.document
         let isFullscreen = false
         const images = document.querySelectorAll('.body img')
 
-  const handleClick = function (image) {
+        const handleClick = function(image) {
             if (isFullscreen) {
                 if (document.exitFullscreen) {
                     document.exitFullscreen()
@@ -104,17 +105,18 @@ Post.prototype.imagesEvents = function () {
                 continue
             }
 
-    (function (i) {
-      i.addEventListener('click', function () {
+            (function(i) {
+                i.addEventListener('click', function() {
                     handleClick(i)
                 }, false)
             })(image)
         }
-}
+    }
 
-Post.prototype.init = function () {
+    init() {
         this.commentsEvents()
         this.imagesEvents()
+    }
 }
 
 module.exports = Post

assets/js/app/quick-post.js

@@ -1,18 +1,19 @@
-const QuickPost = function (w) {
+class QuickPost {
+    constructor(w) {
         this.window = w
-}
+    }
 
-QuickPost.prototype.init = function () {
+    init() {
         const doc = this.window.document
 
         const images = doc.querySelectorAll('.quick-image img')
 
         for (let i = 0, len = images.length; i < len; i++) {
-    (function (image) {
+            (function(image) {
                 const source = image.getAttribute('data-src')
                 const loader = new Image()
 
-      loader.onload = function () {
+                loader.onload = function() {
                     image.style.backgroundImage = 'url(' + source + ')'
                     image.style.backgroundSize = 'cover'
                 }
@@ -20,6 +21,7 @@ QuickPost.prototype.init = function () {
                 loader.src = source
             })(images[i])
         }
+    }
 }
 
 module.exports = QuickPost

assets/js/app/small-menu.js

@@ -1,10 +1,11 @@
 const Routing = require('./routing')
 
-const SmallMenu = function (w) {
+class SmallMenu {
+    constructor(w) {
         this.window = w
-}
+    }
 
-SmallMenu.prototype.addEvent = function () {
+    addEvent() {
         const document = this.window.document
         const menu = document.querySelector('.small-menu')
         const opener = document.querySelector('.menu-opener')
@@ -13,10 +14,11 @@ SmallMenu.prototype.addEvent = function () {
             menu.classList.toggle('is-open')
             opener.classList.toggle('is-open')
         })
-}
+    }
 
-SmallMenu.prototype.init = function () {
+    init() {
         this.addEvent()
+    }
 }
 
 module.exports = SmallMenu

assets/js/app/stats.js

@@ -1,38 +1,19 @@
-const Stats = function () {
-}
-
-Stats.prototype.init = function () {
-  (function (f, a, t, h, o, m) {
-    a[h] = a[h] || function () {
+class Stats {
+    init() {
+        (function(f, a, t, h, o, m) {
+            a[h] = a[h] || function() {
                 (a[h].q = a[h].q || []).push(arguments)
             }
             o = f.createElement('script'),
                 m = f.getElementsByTagName('script')[0]
-    o.async = 1; o.src = t; o.id = 'fathom-script'
+            o.async = 1;
+            o.src = t;
+            o.id = 'fathom-script'
             m.parentNode.insertBefore(o, m)
         })(document, window, '//ftm.deblan.org/tracker.js', 'fathom')
         fathom('set', 'siteId', 'HQAWS')
         fathom('trackPageview')
-
-  /*
-    var _paq = _paq || [];
-    _paq.push(['trackPageView']);
-    _paq.push(['enableLinkTracking']);
-
-    var u="//piwik.deblan.org/";
-    _paq.push(['setTrackerUrl', u+'piwik.php']);
-    _paq.push(['setSiteId', '1']);
-
-    var d= document;
-    var g= d.createElement('script');
-    var s= d.getElementsByTagName('script')[0];
-
-    g.type='text/javascript';
-    g.async=true;
-    g.defer=true;
-    g.src=u+'piwik.js';
-    s.parentNode.insertBefore(g,s);
-    */
+    }
 }
 
 module.exports = Stats

assets/js/app/video-ratio.js

@@ -1,13 +1,15 @@
-const VideoRatio = function (w) {
+class VideoRatio {
+    constructor(w) {
         this.window = w
-}
+    }
 
-VideoRatio.prototype.init = function () {
+    init() {
         const videos = this.window.document.querySelectorAll('.video-ratio')
 
         for (let i = 0, len = videos.length; i < len; i++) {
             videos[i].style.paddingBottom = videos[i].getAttribute('data-ratio')
         }
+    }
 }
 
 module.exports = VideoRatio