m/blog
1
0
Fork 0
mirror of https://github.com/kremalicious/blog.git synced 2024-12-02 06:07:09 +01:00
Code

simplify & lint all js

Browse Source
This commit is contained in:
Matthias Kretschmann 2017-09-09 02:44:03 +02:00
parent e627d1717b
commit a0d6b38a4e
Signed by: m
GPG Key ID: 606EEEF3C479A91F
7 changed files with 186 additions and 281 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

103
_src/_assets/js/_analytics.js
View File

@ -1,87 +1,78 @@
/* global ga */
var GoogleAnalytics = (function(w, d, dnt) { //
// Track Responsive Breakpoints
var app, _private; //
// stolen & adapted from
_private = { // http://philipwalton.com/articles/measuring-your-sites-responsive-breakpoint-usage/
// //
// Track Responsive Breakpoints const gaBreakpoints = () => {
//
// stolen & adapted from
// http://philipwalton.com/articles/measuring-your-sites-responsive-breakpoint-usage/
//
gaBreakpoints: function() {
// Do nothing in browsers that don't support `window.matchMedia`. // Do nothing in browsers that don't support `window.matchMedia`.
if (!window.matchMedia) return; if (!window.matchMedia) {
return
}
// Prevent rapid breakpoint changes for all firing at once. // Prevent rapid breakpoint changes for all firing at once.
var timeout; let timeout
var breakpoints = { const breakpoints = {
xxs: '(max-width: 479px)', xxs: '(max-width: 479px)',
xs: '(min-width: 480px) and (max-width: 767px)', xs: '(min-width: 480px) and (max-width: 767px)',
sm: '(min-width: 768px) and (max-width: 991px)', sm: '(min-width: 768px) and (max-width: 991px)',
md: '(min-width: 992px) and (max-width: 1199px)', md: '(min-width: 992px) and (max-width: 1199px)',
lg: '(min-width: 1200px) and (max-width: 1599px)', lg: '(min-width: 1200px) and (max-width: 1599px)',
hg: '(min-width: 1600px)' hg: '(min-width: 1600px)'
}; }
Object.keys(breakpoints).forEach(function(breakpoint) { Object.keys(breakpoints).forEach(breakpoint => {
var mql = window.matchMedia(breakpoints[breakpoint]); const mql = window.matchMedia(breakpoints[breakpoint])
// Set the initial breakpoint on page load. // Set the initial breakpoint on page load.
if (mql.matches) { if (mql.matches) {
ga('set', 'dimension1', breakpoint); ga('set', 'dimension1', breakpoint)
} }
// Update the breakpoint as the matched media changes // Update the breakpoint as the matched media changes
mql.addListener(function() { mql.addListener(() => {
if (mql.matches) { if (mql.matches) {
clearTimeout(timeout); clearTimeout(timeout)
timeout = setTimeout(function() { timeout = setTimeout(() => {
ga('set', 'dimension1', breakpoint); ga('set', 'dimension1', breakpoint)
}, 1000); }, 1000)
} }
}); })
}); })
}, }
// //
// Track Viewport // Track Viewport
// //
gaViewport: function() { const gaViewport = () => {
var width = Math.max(document.documentElement.clientWidth, window.innerWidth || 0); const width = Math.max(document.documentElement.clientWidth, window.innerWidth || 0)
var height = Math.max(document.documentElement.clientHeight, window.innerHeight || 0); const height = Math.max(document.documentElement.clientHeight, window.innerHeight || 0)
var dimensions = width + 'x' + height; const dimensions = width + 'x' + height
ga('set', 'dimension2', dimensions); ga('set', 'dimension2', dimensions)
}, }
// //
// Track Pixel Density // Track Pixel Density
// //
gaPixelDensity: function() { const gaPixelDensity = () => {
// Heads up! // Heads up!
// window.devicePixelRatio doesn't work correctly in IE but whatever // window.devicePixelRatio doesn't work correctly in IE but whatever
var pixeldensity = window.devicePixelRatio; const pixeldensity = window.devicePixelRatio
ga('set', 'dimension3', pixeldensity); ga('set', 'dimension3', pixeldensity)
} }
};
app = { const dnt = navigator.doNotTrack || window.doNotTrack || navigator.msDoNotTrack
init: function() {
if (dnt !== "yes" && dnt !== "1") {
_private.gaBreakpoints();
_private.gaViewport();
_private.gaPixelDensity();
}
}
};
return app; if (dnt !== 'yes' && dnt !== '1') {
gaBreakpoints()
})(window, document, navigator.doNotTrack || navigator.msDoNotTrack || null); gaViewport()
gaPixelDensity()
}

64
_src/_assets/js/_menu.js
View File

@ -1,47 +1,27 @@
var Menu = (function(w, d) { $(document).ready(() => {
const thesite = $('.site')
const thelink = $('.menu-btn')
const thepop = $('.nav-popover')
var app, _private, _config; thelink.on('click', e => {
e.preventDefault()
_config = { // Toggle menu
thesite : $('.site'), thesite.toggleClass('has-menu-open')
thelink : $('.menu-btn'),
thepop : $('.nav-popover')
};
_private = { // Bind the hide controls
menuShow: function() { $(document).bind('click.hidethepop', () => {
_config.thelink.on('click', function(e) { thesite.removeClass('has-menu-open')
e.preventDefault(); // Unbind the hide controls
$(document).unbind('click.hidethepop')
})
$('[data-toggle="tooltip"]').tooltip('hide'); // Dont close thepop when you click on thepop
thepop.on('click', e => {
e.stopPropagation()
})
// toggle menu // And dont close thepop now
_config.thesite.toggleClass('has-menu-open'); e.stopPropagation()
})
// bind the hide controls })
$(document).bind('click.hidethepop', function() {
_config.thesite.removeClass('has-menu-open');
// unbind the hide controls
$(document).unbind('click.hidethepop');
});
// dont close thepop when you click on thepop
_config.thepop.on('click', function(e) {
e.stopPropagation();
});
// and dont close thepop now
e.stopPropagation();
});
}
};
app = {
init: function() {
_private.menuShow();
}
};
return app;
})(window, document);

161
_src/_assets/js/_search.js
View File

@ -1,115 +1,84 @@
/* global SimpleJekyllSearch */
/* eslint-disable spaced-comment */
//=require simple-jekyll-search/dest/simple-jekyll-search.js //=require simple-jekyll-search/dest/simple-jekyll-search.js
/* eslint-enable spaced-comment */
var Search = (function(w, d) { $(document).ready(() => {
const searchlink = $('.search-btn, .js-search-init')
const searcharea = $('.search-area')
const searchfield = $('#search-input')
const searchpop = $('#search-popover')
var app, _private, _config; const searchReset = () => {
// Revert all search elements
_config = { searcharea
content : $('.site__content'), .removeClass('animation-slidedown')
searchlink : $('.search-btn, .js-search-init'), .addClass('animation-bounceOutUp')
searcharea : $('.search-area'), .on('animationend webkitAnimationEnd oAnimationEnd', () => {
searchfield : $('#search-input'), $('body').removeClass('has-search-open')
searchresults : $('#search-results'), })
searchpop : $('#search-popover'), searchpop.addClass('hide')
body : $('body')
};
_private = {
searchShow: function() {
_config.searchlink.on('click', function(e) {
e.preventDefault();
$('[data-toggle="tooltip"]').tooltip('hide');
// show search field
_config.searcharea
.removeClass('is-ready animation-bounceOutUp')
.addClass('is-ready animation-slidedown')
.on('animationend webkitAnimationEnd oAnimationEnd', function(){
_config.body.addClass('has-search-open');
});
_config.searchfield.focus();
_private.searchSimpleJekyllSearch();
// hide menu too just in case
if (_config.body.hasClass('has-menu-open')) {
_config.body.removeClass('has-menu-open');
} }
// bind the hide controls searchlink.on('click', e => {
$(document).bind('click.hidethepop', function() { e.preventDefault()
_private.searchReset();
// unbind the hide controls // Show search field
$(document).unbind('click.hidethepop'); searcharea
}); .removeClass('is-ready animation-bounceOutUp')
.addClass('is-ready animation-slidedown')
.on('animationend webkitAnimationEnd oAnimationEnd', () => {
$('body').addClass('has-search-open')
})
// dont close thepop when click on thepop searchfield.focus()
_config.searchpop.on('click', function(e) {
e.stopPropagation();
});
// dont close thepop when click on search field
_config.searchfield.on('click', function(e) {
e.stopPropagation();
});
// and dont close thepop now SimpleJekyllSearch({ // eslint-disable-line new-cap
e.stopPropagation();
});
},
searchResultsShow: function() {
// show popup upon first keypress
_config.searchfield.on('keyup', function() {
_config.searchpop.removeClass('hide');
});
},
searchSimpleJekyllSearch: function() {
SimpleJekyllSearch({
searchInput: document.getElementById('search-input'), searchInput: document.getElementById('search-input'),
resultsContainer: document.getElementById('search-results'), resultsContainer: document.getElementById('search-results'),
json: '/api/search.json', json: '/api/search.json',
searchResultTemplate: '<a class="search-link" href="{url}">{title}</a>', searchResultTemplate: '<a class="search-link" href="{url}">{title}</a>',
fuzzy: false fuzzy: false
}); })
},
searchHide: function() { // Hide menu too just in case
$('.search-close').on('click', function(e) { if ($('body').hasClass('has-menu-open')) {
e.preventDefault(); $('body').removeClass('has-menu-open')
_private.searchReset();
// empty search field
_config.searchfield.val('').blur();
});
},
searchReset: function() {
// revert all search elements
_config.searcharea
.removeClass('animation-slidedown')
.addClass('animation-bounceOutUp')
.on('animationend webkitAnimationEnd oAnimationEnd', function(){
_config.body.removeClass('has-search-open');
});
_config.searchpop.addClass('hide');
} }
};
app = { // Bind the hide controls
init: function() { $(document).bind('click.hidethepop', () => {
_private.searchShow(); searchReset()
_private.searchResultsShow();
_private.searchHide();
}
};
return app; // Unbind the hide controls
$(document).unbind('click.hidethepop')
})
})(document, window); // Dont close thepop when click on thepop
searchpop.on('click', e => {
e.stopPropagation()
})
// Dont close thepop when click on search field
searchfield.on('click', e => {
e.stopPropagation()
})
// And dont close thepop now
e.stopPropagation()
})
// Show popup upon first keypress
searchfield.on('keyup', () => {
searchpop.removeClass('hide')
})
$('.search-close').on('click', e => {
e.preventDefault()
searchReset()
// Empty search field
searchfield.val('').blur()
})
})

26
_src/_assets/js/_tooltips.js
View File

@ -1,26 +0,0 @@
//=require bootstrap/js/tooltip.js
var Tooltips = (function(w, d) {
var app, _private;
_private = {
tooltipsShow: function() {
$('[data-toggle="tooltip"]').tooltip({
placement: 'bottom',
template: '<div class="tooltip" role="tooltip"><div class="tooltip-inner"></div></div>',
container: 'body'
})
}
};
app = {
init: function() {
_private.tooltipsShow();
}
};
return app;
})(window, document);

34
_src/_assets/js/kremalicious3.js
View File

@ -1,4 +1,4 @@
/* global Menu, Search, GoogleAnalytics, svg4everybody, vex */ /* global svg4everybody, vex */
/* eslint-disable spaced-comment */ /* eslint-disable spaced-comment */
//=require webcomponents.js/CustomElements.js //=require webcomponents.js/CustomElements.js
@ -7,29 +7,20 @@
//=require time-elements/time-elements.js //=require time-elements/time-elements.js
//=require vex-js/dist/js/vex.combined.js //=require vex-js/dist/js/vex.combined.js
//=include _menu.js /* eslint-disable spaced-comment */
//=include _search.js
//=include _tooltips.js
//=include _analytics.js //=include _analytics.js
//=include _search.js
//=include _menu.js
/* eslint-enable spaced-comment */ /* eslint-enable spaced-comment */
$(document).ready(() => {
//
// init modules
//
Menu.init()
Search.init()
GoogleAnalytics.init()
})
// //
// Vex modals // Vex modals
// //
const vexTriggers = document.querySelectorAll('.js-vex-btc') const vexInit = () => {
const vexTriggers = document.querySelectorAll('.js-vex-btc')
vexTriggers.forEach(el => { vexTriggers.forEach(el => {
el.addEventListener('click', e => { el.addEventListener('click', e => {
e.preventDefault() e.preventDefault()
@ -39,10 +30,11 @@ vexTriggers.forEach(el => {
unsafeContent: '<h3 class="vex__title">My Bitcoin Address</h3>\n <img src="/assets/img/btc-qr.png" />\n <pre class="highlight"><code class="nt">171qDmKEXm9YBgBLXyGjjPvopP5o9htQ1V</code></pre>' unsafeContent: '<h3 class="vex__title">My Bitcoin Address</h3>\n <img src="/assets/img/btc-qr.png" />\n <pre class="highlight"><code class="nt">171qDmKEXm9YBgBLXyGjjPvopP5o9htQ1V</code></pre>'
}) })
}, false) }, false)
})
document.addEventListener('DOMContentLoaded', () => {
svg4everybody({
nosvg: false
}) })
}
vexInit()
svg4everybody({
nosvg: false
}) })

5
_src/_includes/scripts.html
View File

@ -4,6 +4,7 @@
<script src="/assets/js/{{ page.js }}"></script> <script src="/assets/js/{{ page.js }}"></script>
{% endif %} {% endif %}
{% if jekyll.environment == "production" %} {% if jekyll.environment == "production" %}
<script> <script>
var _paq = _paq || []; var _paq = _paq || [];
@ -17,7 +18,7 @@
var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0]; var d=document, g=d.createElement('script'), 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); g.type='text/javascript'; g.async=true; g.defer=true; g.src=u+'piwik.js'; s.parentNode.insertBefore(g,s);
} }
}(navigator.doNotTrack || navigator.msDoNotTrack || null)); }(navigator.doNotTrack || window.doNotTrack || navigator.msDoNotTrack || null));
</script> </script>
<noscript><p><img src="//analytics.kremalicious.com/piwik.php?idsite=1" style="border:0;" alt="" /></p></noscript> <noscript><p><img src="//analytics.kremalicious.com/piwik.php?idsite=1" style="border:0;" alt="" /></p></noscript>
{% endif %} {% endif %}
@ -60,7 +61,7 @@
}; };
} }
}(window, navigator.doNotTrack || navigator.msDoNotTrack || null)); }(window, navigator.doNotTrack || window.doNotTrack || navigator.msDoNotTrack || null));
</script> </script>
{% if jekyll.environment == "production" %} {% if jekyll.environment == "production" %}

4
package.json
View File

@ -32,11 +32,9 @@
"globals": [ "globals": [
"window", "window",
"document", "document",
"navigator",
"jQuery", "jQuery",
"$" "$"
],
"ignores": [
"_src/_assets/js/_*.js"
] ]
}, },
"dependencies": { "dependencies": {