Skip to content

Commit

Permalink
working
Browse files Browse the repository at this point in the history
  • Loading branch information
pure-js committed Nov 25, 2016
1 parent f20368f commit 98e3b93
Show file tree
Hide file tree
Showing 3 changed files with 73 additions and 68 deletions.
78 changes: 35 additions & 43 deletions demo/index.pug
Original file line number Diff line number Diff line change
Expand Up @@ -37,71 +37,63 @@ html(lang='en')
h1#home The check browser version plugin
p Latest version is 1.0.0
p You can use default view of this plugin look like so (See under) or create himself warning block
.row
.col-md-12
.old-browser-warning
.old-browser-warning__left-side
h3.text-primary.h3 Warning!
p.old-browser-warning__text You use the oldest version of a browser. It may be a reason of incorrect work and view of a website.
p.old-browser-warning__text For comfortable work, please download latest version of a browser convenient for you from official website.
p.old-browser-warning__text
| Please read our
a.old-browser-warning__link(href='#') documentation
| .
.old-browser-warning__right-side
a.old-browser-warning__img-link.browser-sprite.browser-chrome(href='https://www.google.com/intl/ru/chrome/browser/', target='_blank', title='Chrome')
a.old-browser-warning__img-link.browser-sprite.browser-firefox(href='http://www.mozilla.org/ru/firefox/new/', target='_blank', title='Firefox')
a.old-browser-warning__img-link.browser-sprite.browser-ie(href='http://windows.microsoft.com/ru-ru/internet-explorer/download-ie', target='_blank', title='Internet Explorer')
a.old-browser-warning__img-link.browser-sprite.browser-opera(href='http://www.opera.com/ru', target='_blank', title='Opera')
i#close-old-browser-warning.icon-remove(title='Close')
.old-browser-warning
.old-browser-warning__left-side
h3.text-primary.h3 Warning!
p.old-browser-warning__text You use the oldest version of a browser. It may be a reason of incorrect work and view of a website.
p.old-browser-warning__text For comfortable work, please download latest version of a browser convenient for you from official website.
p.old-browser-warning__text
| Please read our
a.old-browser-warning__link(href='#') documentation
| .
.old-browser-warning__right-side
a.old-browser-warning__img-link.browser-sprite.browser-chrome(href='https://www.google.com/intl/ru/chrome/browser/', target='_blank', title='Chrome')
a.old-browser-warning__img-link.browser-sprite.browser-firefox(href='http://www.mozilla.org/ru/firefox/new/', target='_blank', title='Firefox')
a.old-browser-warning__img-link.browser-sprite.browser-ie(href='http://windows.microsoft.com/ru-ru/internet-explorer/download-ie', target='_blank', title='Internet Explorer')
a.old-browser-warning__img-link.browser-sprite.browser-opera(href='http://www.opera.com/ru', target='_blank', title='Opera')
i#close-old-browser-warning.icon-remove(title='Close')
.row
.col-md-12
p For begin you need check - you use jquery or not use? If you not add jquery plugin - you need do it
p And inicialize plugin
pre
code.language-javascript.
$(document).ready(function () {
$('body').checkBrowser();
});

checkBrowser();
p All supported params:
pre
code.language-javascript.
$(document).ready(function () {
$('body').checkBrowser({
once: 'No',
warningBoxName: '.old-browser-warning',
closeBtnName: '#close-old-browser-warning',
duration: 1200,
easing: 'swing',

browsers: {
Firefox: 27,
Chrome: 30,
Opera: 15,
IE: 10
}
});
checkBrowser({
once: false,
warningEl: '.old-browser-warning',
closeBtnName: '#close-old-browser-warning',
duration: 1200,
easing: 'swing',
browsers: {
Firefox: 27,
Chrome: 30,
Opera: 15,
IE: 10
}
});
p In this option you can change amount of show
pre
code.language-javascript.
$('body').checkBrowser({
once: 'No'
checkBrowser({
once: false
});
pre
code.language-javascript.
$('body').checkBrowser({
warningBoxName: '.old-browser-warning'
checkBrowser({
warningEl: '.old-browser-warning'
});
pre
code.language-javascript.
$('body').checkBrowser({
checkBrowser({
closeBtnName: '#close-old-browser-warning'
});
pre
code.language-javascript.
$('body').checkBrowser({
checkBrowser({
duration: 1200
});
pre
Expand All @@ -111,7 +103,7 @@ html(lang='en')
});
pre
code.language-javascript.
$('body').checkBrowser({
checkBrowser({
browsers: {
Firefox: 27,
Chrome: 30,
Expand Down
12 changes: 9 additions & 3 deletions gulpfile.js
Original file line number Diff line number Diff line change
@@ -1,19 +1,25 @@
const gulp = require('gulp'),
del = require('del'),
// config = require('./gulp/config'),
config = require('./gulp/config'),
tasks = require('./gulp/tasks'),
plugins = require('gulp-load-plugins')();

gulp.task('build', tasks.build);

const clean = () => del(['build']);
const clean = () => del([config.paths.build]);

exports.clean = clean;

function watch() {
gulp.watch(config.paths.stylusWatch, tasks.build);
gulp.watch(config.paths.pugWatch, tasks.build);
}

// gulp.task('deploy', () =>
// gulp.src(paths.dist + '**/*')
// .pipe(plugins.ghPages())
// );

// The default task (called when you run `gulp` from cli)
gulp.task('default', tasks.build);
const dev = gulp.parallel(tasks.build, watch);
gulp.task('default', dev);
51 changes: 29 additions & 22 deletions src/check-browser.js
Original file line number Diff line number Diff line change
@@ -1,38 +1,38 @@
const defaults = {
once: true,
warningBox: '.old-browser-warning',
warningEl: '.old-browser-warning',
closeBtn: '#close-old-browser-warning',
duration: 1200,
easing: 'swing',
browsers: {
Firefox: 27,
Chrome: 30,
Chrome: 60,
Opera: 15,
IE: 11
}
};

function checkBrowser(
function checkBrowser({
once = defaults.once,
warningBox = document.querySelector(defaults.warningBox),
warningEl = document.querySelector(defaults.warningEl),
closeBtn = document.querySelector(defaults.closeBtn),
duration = defaults.duration,
easing = defaults.easing,
browsers = defaults.browsers) {
'use strict';
browsers = defaults.browsers
}) {

warningBox.classList.add('hide');
warningEl.classList.add('hide');

// Old browser warning close button
closeBtn.onclick = hidePopUp();
closeBtn.addEventListener('click', hidePopup);

function hidePopUp() {
function hidePopup() {
// Check if parameter is setup we will save user press close button
if($once) {
sessionStorage.setItem('DoNotShowMeItAgain', 'true');
if(once) {
sessionStorage.setItem('browserWarningClose', true);
}

warningBox.classList.add('hide');
warningEl.classList.add('hide');
}

// Detecting browser version
Expand All @@ -57,21 +57,28 @@ function checkBrowser(
return M;
})();

let currentBrowser = {
name: browserDetect[0],
version: Number(browserDetect[1])
}

var checkBrowser = function(takesBrowsers) {
let storage = sessionStorage.getItem('DoNotShowMeItAgain');
function findBrowser(browsers) {
let close = sessionStorage.getItem('browserWarningClose');

// Check if user press close button
if(storage === 'true') {
// Check if user press on close button
if(close === 'true') {
return false;
}

// If version of browser more old you will see window
for(let name in takesBrowsers) {
if(browserDetect.indexOf(name) !== -1 && takesBrowsers[name] > browserDetect[1]) {
warningBox.show();
// If version of browser is older - you will see the window
for(let name in browsers) {
let version = browsers[name];
if(name === currentBrowser.name && version > currentBrowser.version) {
warningEl.classList.remove('hide');
break;
}
}
}(browsers);
};
}

findBrowser(browsers);
}

0 comments on commit 98e3b93

Please sign in to comment.