v-strength
Version:
Vue component which verify password complexity
718 lines (614 loc) • 21.8 kB
JavaScript
(function webpackUniversalModuleDefinition(root, factory) {
if(typeof exports === 'object' && typeof module === 'object')
module.exports = factory();
else if(typeof define === 'function' && define.amd)
define("v-strength", [], factory);
else if(typeof exports === 'object')
exports["v-strength"] = factory();
else
root["v-strength"] = factory();
})(this, function() {
return /******/ (function(modules) { // webpackBootstrap
/******/ // The module cache
/******/ var installedModules = {};
/******/ // The require function
/******/ function __webpack_require__(moduleId) {
/******/ // Check if module is in cache
/******/ if(installedModules[moduleId])
/******/ return installedModules[moduleId].exports;
/******/ // Create a new module (and put it into the cache)
/******/ var module = installedModules[moduleId] = {
/******/ exports: {},
/******/ id: moduleId,
/******/ loaded: false
/******/ };
/******/ // Execute the module function
/******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
/******/ // Flag the module as loaded
/******/ module.loaded = true;
/******/ // Return the exports of the module
/******/ return module.exports;
/******/ }
/******/ // expose the modules object (__webpack_modules__)
/******/ __webpack_require__.m = modules;
/******/ // expose the module cache
/******/ __webpack_require__.c = installedModules;
/******/ // __webpack_public_path__
/******/ __webpack_require__.p = "";
/******/ // Load entry module and return exports
/******/ return __webpack_require__(0);
/******/ })
/************************************************************************/
/******/ ([
/* 0 */
/***/ function(module, exports, __webpack_require__) {
/* styles */
__webpack_require__(1)
var Component = __webpack_require__(9)(
/* script */
__webpack_require__(10),
/* template */
__webpack_require__(11),
/* scopeId */
"data-v-530b459d",
/* cssModules */
null
)
Component.options.__file = "D:\\Projects (Sergei)\\projects\\v-pasStrength\\src\\strength.vue"
if (Component.esModule && Object.keys(Component.esModule).some(function (key) {return key !== "default" && key !== "__esModule"})) {console.error("named exports are not supported in *.vue files.")}
if (Component.options.functional) {console.error("[vue-loader] strength.vue: functional components are not supported with templates, they should use render functions.")}
/* hot reload */
if (false) {(function () {
var hotAPI = require("vue-hot-reload-api")
hotAPI.install(require("vue"), false)
if (!hotAPI.compatible) return
module.hot.accept()
if (!module.hot.data) {
hotAPI.createRecord("data-v-530b459d", Component.options)
} else {
hotAPI.reload("data-v-530b459d", Component.options)
}
})()}
module.exports = Component.exports
/***/ },
/* 1 */
/***/ function(module, exports, __webpack_require__) {
// style-loader: Adds some css to the DOM by adding a <style> tag
// load the styles
var content = __webpack_require__(2);
if(typeof content === 'string') content = [[module.id, content, '']];
if(content.locals) module.exports = content.locals;
// add the styles to the DOM
var update = __webpack_require__(7)("535022e8", content, false);
// Hot Module Replacement
if(false) {
// When the styles change, update the <style> tags
if(!content.locals) {
module.hot.accept("!!../node_modules/css-loader/index.js!../node_modules/vue-loader/lib/style-compiler/index.js?{\"id\":\"data-v-530b459d\",\"scoped\":true,\"hasInlineConfig\":false}!../node_modules/vue-loader/lib/selector.js?type=styles&index=0!./strength.vue", function() {
var newContent = require("!!../node_modules/css-loader/index.js!../node_modules/vue-loader/lib/style-compiler/index.js?{\"id\":\"data-v-530b459d\",\"scoped\":true,\"hasInlineConfig\":false}!../node_modules/vue-loader/lib/selector.js?type=styles&index=0!./strength.vue");
if(typeof newContent === 'string') newContent = [[module.id, newContent, '']];
update(newContent);
});
}
// When the module is disposed, remove the <style> tags
module.hot.dispose(function() { update(); });
}
/***/ },
/* 2 */
/***/ function(module, exports, __webpack_require__) {
exports = module.exports = __webpack_require__(3)(false);
// imports
// module
exports.push([module.id, "\n.levelBlock[data-v-530b459d] {\n display: block;\n position: relative;\n max-width: 100%;\n width: 80px;\n padding-top: 7px;\n}\n.levelBlock__power[data-v-530b459d] {\n width: calc(100% / 4);\n height: 3px;\n display: inline-block;\n background: #C0C4CC;\n margin: 0 2px;\n transition: background-color .4s ease-in-out;\n}\n.levelBlock__power_red[data-v-530b459d] {\n background-color: #F56C6C;\n}\n.levelBlock__power_yellow[data-v-530b459d] {\n background-color: #E6A23C;\n}\n.levelBlock__power_green[data-v-530b459d] {\n background-color: #67C23A;\n}\n.levelBlock__text[data-v-530b459d] {\n position: absolute;\n color: #606266;\n font-weight: 300;\n font-size: 14px;\n right: 9px;\n top: 0;\n text-transform: capitalize;\n}\n", ""]);
// exports
/***/ },
/* 3 */
/***/ function(module, exports, __webpack_require__) {
"use strict";
var _stringify = __webpack_require__(4);
var _stringify2 = _interopRequireDefault(_stringify);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
module.exports = function (useSourceMap) {
var list = [];
list.toString = function toString() {
return this.map(function (item) {
var content = cssWithMappingToString(item, useSourceMap);
if (item[2]) {
return "@media " + item[2] + "{" + content + "}";
} else {
return content;
}
}).join("");
};
list.i = function (modules, mediaQuery) {
if (typeof modules === "string") modules = [[null, modules, ""]];
var alreadyImportedModules = {};
for (var i = 0; i < this.length; i++) {
var id = this[i][0];
if (typeof id === "number") alreadyImportedModules[id] = true;
}
for (i = 0; i < modules.length; i++) {
var item = modules[i];
if (typeof item[0] !== "number" || !alreadyImportedModules[item[0]]) {
if (mediaQuery && !item[2]) {
item[2] = mediaQuery;
} else if (mediaQuery) {
item[2] = "(" + item[2] + ") and (" + mediaQuery + ")";
}
list.push(item);
}
}
};
return list;
};
function cssWithMappingToString(item, useSourceMap) {
var content = item[1] || '';
var cssMapping = item[3];
if (!cssMapping) {
return content;
}
if (useSourceMap && typeof btoa === 'function') {
var sourceMapping = toComment(cssMapping);
var sourceURLs = cssMapping.sources.map(function (source) {
return '/*# sourceURL=' + cssMapping.sourceRoot + source + ' */';
});
return [content].concat(sourceURLs).concat([sourceMapping]).join('\n');
}
return [content].join('\n');
}
function toComment(sourceMap) {
var base64 = btoa(unescape(encodeURIComponent((0, _stringify2.default)(sourceMap))));
var data = 'sourceMappingURL=data:application/json;charset=utf-8;base64,' + base64;
return '/*# ' + data + ' */';
}
/***/ },
/* 4 */
/***/ function(module, exports, __webpack_require__) {
"use strict";
module.exports = { "default": __webpack_require__(5), __esModule: true };
/***/ },
/* 5 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
var _stringify = __webpack_require__(4);
var _stringify2 = _interopRequireDefault(_stringify);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var core = __webpack_require__(6);
var $JSON = core.JSON || (core.JSON = { stringify: _stringify2.default });
module.exports = function stringify(it) {
return $JSON.stringify.apply($JSON, arguments);
};
/***/ },
/* 6 */
/***/ function(module, exports) {
'use strict';
var core = module.exports = { version: '2.5.3' };
if (typeof __e == 'number') __e = core;
/***/ },
/* 7 */
/***/ function(module, exports, __webpack_require__) {
/*
MIT License http://www.opensource.org/licenses/mit-license.php
Author Tobias Koppers @sokra
Modified by Evan You @yyx990803
*/
var hasDocument = typeof document !== 'undefined'
if (false) {
if (!hasDocument) {
throw new Error(
'vue-style-loader cannot be used in a non-browser environment. ' +
"Use { target: 'node' } in your Webpack config to indicate a server-rendering environment."
) }
}
var listToStyles = __webpack_require__(8)
/*
type StyleObject = {
id: number;
parts: Array<StyleObjectPart>
}
type StyleObjectPart = {
css: string;
media: string;
sourceMap: ?string
}
*/
var stylesInDom = {/*
[id: number]: {
id: number,
refs: number,
parts: Array<(obj?: StyleObjectPart) => void>
}
*/}
var head = hasDocument && (document.head || document.getElementsByTagName('head')[0])
var singletonElement = null
var singletonCounter = 0
var isProduction = false
var noop = function () {}
// Force single-tag solution on IE6-9, which has a hard limit on the # of <style>
// tags it will allow on a page
var isOldIE = typeof navigator !== 'undefined' && /msie [6-9]\b/.test(navigator.userAgent.toLowerCase())
module.exports = function (parentId, list, _isProduction) {
isProduction = _isProduction
var styles = listToStyles(parentId, list)
addStylesToDom(styles)
return function update (newList) {
var mayRemove = []
for (var i = 0; i < styles.length; i++) {
var item = styles[i]
var domStyle = stylesInDom[item.id]
domStyle.refs--
mayRemove.push(domStyle)
}
if (newList) {
styles = listToStyles(parentId, newList)
addStylesToDom(styles)
} else {
styles = []
}
for (var i = 0; i < mayRemove.length; i++) {
var domStyle = mayRemove[i]
if (domStyle.refs === 0) {
for (var j = 0; j < domStyle.parts.length; j++) {
domStyle.parts[j]()
}
delete stylesInDom[domStyle.id]
}
}
}
}
function addStylesToDom (styles /* Array<StyleObject> */) {
for (var i = 0; i < styles.length; i++) {
var item = styles[i]
var domStyle = stylesInDom[item.id]
if (domStyle) {
domStyle.refs++
for (var j = 0; j < domStyle.parts.length; j++) {
domStyle.parts[j](item.parts[j])
}
for (; j < item.parts.length; j++) {
domStyle.parts.push(addStyle(item.parts[j]))
}
if (domStyle.parts.length > item.parts.length) {
domStyle.parts.length = item.parts.length
}
} else {
var parts = []
for (var j = 0; j < item.parts.length; j++) {
parts.push(addStyle(item.parts[j]))
}
stylesInDom[item.id] = { id: item.id, refs: 1, parts: parts }
}
}
}
function createStyleElement () {
var styleElement = document.createElement('style')
styleElement.type = 'text/css'
head.appendChild(styleElement)
return styleElement
}
function addStyle (obj /* StyleObjectPart */) {
var update, remove
var styleElement = document.querySelector('style[data-vue-ssr-id~="' + obj.id + '"]')
if (styleElement) {
if (isProduction) {
// has SSR styles and in production mode.
// simply do nothing.
return noop
} else {
// has SSR styles but in dev mode.
// for some reason Chrome can't handle source map in server-rendered
// style tags - source maps in <style> only works if the style tag is
// created and inserted dynamically. So we remove the server rendered
// styles and inject new ones.
styleElement.parentNode.removeChild(styleElement)
}
}
if (isOldIE) {
// use singleton mode for IE9.
var styleIndex = singletonCounter++
styleElement = singletonElement || (singletonElement = createStyleElement())
update = applyToSingletonTag.bind(null, styleElement, styleIndex, false)
remove = applyToSingletonTag.bind(null, styleElement, styleIndex, true)
} else {
// use multi-style-tag mode in all other cases
styleElement = createStyleElement()
update = applyToTag.bind(null, styleElement)
remove = function () {
styleElement.parentNode.removeChild(styleElement)
}
}
update(obj)
return function updateStyle (newObj /* StyleObjectPart */) {
if (newObj) {
if (newObj.css === obj.css &&
newObj.media === obj.media &&
newObj.sourceMap === obj.sourceMap) {
return
}
update(obj = newObj)
} else {
remove()
}
}
}
var replaceText = (function () {
var textStore = []
return function (index, replacement) {
textStore[index] = replacement
return textStore.filter(Boolean).join('\n')
}
})()
function applyToSingletonTag (styleElement, index, remove, obj) {
var css = remove ? '' : obj.css
if (styleElement.styleSheet) {
styleElement.styleSheet.cssText = replaceText(index, css)
} else {
var cssNode = document.createTextNode(css)
var childNodes = styleElement.childNodes
if (childNodes[index]) styleElement.removeChild(childNodes[index])
if (childNodes.length) {
styleElement.insertBefore(cssNode, childNodes[index])
} else {
styleElement.appendChild(cssNode)
}
}
}
function applyToTag (styleElement, obj) {
var css = obj.css
var media = obj.media
var sourceMap = obj.sourceMap
if (media) {
styleElement.setAttribute('media', media)
}
if (sourceMap) {
// https://developer.chrome.com/devtools/docs/javascript-debugging
// this makes source maps inside style tags work properly in Chrome
css += '\n/*# sourceURL=' + sourceMap.sources[0] + ' */'
// http://stackoverflow.com/a/26603875
css += '\n/*# sourceMappingURL=data:application/json;base64,' + btoa(unescape(encodeURIComponent(JSON.stringify(sourceMap)))) + ' */'
}
if (styleElement.styleSheet) {
styleElement.styleSheet.cssText = css
} else {
while (styleElement.firstChild) {
styleElement.removeChild(styleElement.firstChild)
}
styleElement.appendChild(document.createTextNode(css))
}
}
/***/ },
/* 8 */
/***/ function(module, exports) {
'use strict';
module.exports = function listToStyles(parentId, list) {
var styles = [];
var newStyles = {};
for (var i = 0; i < list.length; i++) {
var item = list[i];
var id = item[0];
var css = item[1];
var media = item[2];
var sourceMap = item[3];
var part = {
id: parentId + ':' + i,
css: css,
media: media,
sourceMap: sourceMap
};
if (!newStyles[id]) {
styles.push(newStyles[id] = { id: id, parts: [part] });
} else {
newStyles[id].parts.push(part);
}
}
return styles;
};
/***/ },
/* 9 */
/***/ function(module, exports) {
// this module is a runtime utility for cleaner component module output and will
// be included in the final webpack user bundle
module.exports = function normalizeComponent (
rawScriptExports,
compiledTemplate,
scopeId,
cssModules
) {
var esModule
var scriptExports = rawScriptExports = rawScriptExports || {}
// ES6 modules interop
var type = typeof rawScriptExports.default
if (type === 'object' || type === 'function') {
esModule = rawScriptExports
scriptExports = rawScriptExports.default
}
// Vue.extend constructor export interop
var options = typeof scriptExports === 'function'
? scriptExports.options
: scriptExports
// render functions
if (compiledTemplate) {
options.render = compiledTemplate.render
options.staticRenderFns = compiledTemplate.staticRenderFns
}
// scopedId
if (scopeId) {
options._scopeId = scopeId
}
// inject cssModules
if (cssModules) {
var computed = Object.create(options.computed || null)
Object.keys(cssModules).forEach(function (key) {
var module = cssModules[key]
computed[key] = function () { return module }
})
options.computed = computed
}
return {
esModule: esModule,
exports: scriptExports,
options: options
}
}
/***/ },
/* 10 */
/***/ function(module, exports) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = {
name: 'Strength',
props: {
password: { type: String, default: '' },
label: { type: Boolean, default: false },
lang: { type: String, default: 'ru' },
colors: { type: Array, default: function _default() {
return [];
} }
},
watch: {
password: function password() {
this.verifyPassword(this.password);
}
},
created: function created() {
if (this.colors !== []) {
for (var i in this.colors) {
console.log(this.colors[i].name, ' - ', this.colors[i].value);
if (this.colors[i].name === 'strong') {
this.customColor.strong = this.colors[i].value;
}
if (this.colors[i].name === 'good') {
this.customColor.good = this.colors[i].value;
}
if (this.colors[i].name === 'weak') {
this.customColor.weak = this.colors[i].value;
}
}
}
},
data: function data() {
return {
level: null,
levelText: null,
customColor: {
strong: '#67C23A',
good: '#E6A23C',
weak: '#F56C6C'
},
score: 0
};
},
methods: {
switchLang: function switchLang() {
switch (this.lang) {
case 'en':
if (this.level > 80) {
this.levelText = 'strong';
} else if (this.level > 60) {
this.levelText = 'good';
} else if (this.level >= 30) {
this.levelText = 'weak';
} else {
this.levelText = '';
}
break;
case 'ru':
if (this.level > 80) {
this.levelText = 'сильный';
} else if (this.level > 60) {
this.levelText = 'хороший';
} else if (this.level >= 30) {
this.levelText = 'слабый';
} else {
this.levelText = '';
}
break;
}
},
verifyPassword: function verifyPassword() {
this.score = 0;
this.level = this.initPas(this.password);
this.switchLang();
},
initPas: function initPas(password) {
this.findUniquePas(password);
this.bonusMixPas(password);
return this.implementScorePas();
},
findUniquePas: function findUniquePas(password) {
var letters = new Object();
for (var i = 0; i < password.length; i++) {
letters[password[i]] = (letters[password[i]] || 0) + 1;
this.score += 5.0 / letters[password[i]];
}
},
bonusMixPas: function bonusMixPas(password) {
var variations = {
digits: /\d/.test(password),
lower: /[a-z]/.test(password),
upper: /[A-Z]/.test(password),
nonWords: /\W/.test(password)
};
var variationCount = 0;
for (var check in variations) {
variationCount += variations[check] == true ? 1 : 0;
}
this.score += (variationCount - 1) * 10;
},
implementScorePas: function implementScorePas() {
if (this.score > 80) {
console.log("strong");
return this.score;
}
if (this.score > 60) {
console.log("good");
return this.score;
}
if (this.score >= 30) {
console.log("weak");
return this.score;
}
return this.score;
}
}
};
/***/ },
/* 11 */
/***/ function(module, exports, __webpack_require__) {
module.exports={render:function (){var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;
return _c('div', {
staticClass: "componentBlock"
}, [_c('div', {
staticClass: "levelBlock"
}, [_c('div', {
staticClass: "levelBlock__text"
}, [_vm._v(_vm._s(_vm.label ? _vm.levelText : ''))]), _vm._v(" "), _c('div', {
class: {
'levelBlock__power': true,
'levelBlock__power_green': _vm.level > 80 ? true : false
}
}), _vm._v(" "), _c('div', {
class: {
'levelBlock__power': true,
'levelBlock__power_yellow': _vm.level > 60 ? true : false
}
}), _vm._v(" "), _c('div', {
class: {
'levelBlock__power': true,
'levelBlock__power_red': _vm.level >= 30 ? true : false
}
})])])
},staticRenderFns: []}
module.exports.render._withStripped = true
if (false) {
module.hot.accept()
if (module.hot.data) {
require("vue-hot-reload-api").rerender("data-v-530b459d", module.exports)
}
}
/***/ }
/******/ ])
});
;