From 3bf7247b67fb69d9dbeec1bb80e6e9d5d7a66673 Mon Sep 17 00:00:00 2001 From: serapath Date: Sun, 24 Mar 2019 01:21:55 +0000 Subject: [PATCH] UPDATE refactor code and add value to callback --- .gitignore | 4 +- LICENSE | 21 ++++ README.md | 20 +++ bundle.js | 188 ++++++++++++++++------------- demo/demo.js | 34 ++++++ index.html | 8 +- package-lock.json | 43 +++++-- package.json | 8 +- src/index.js | 55 --------- src/input-integer.js | 45 +++++++ src/node_modules/validate-input.js | 13 -- 11 files changed, 267 insertions(+), 172 deletions(-) create mode 100644 LICENSE create mode 100644 demo/demo.js delete mode 100644 src/index.js create mode 100644 src/input-integer.js delete mode 100644 src/node_modules/validate-input.js diff --git a/.gitignore b/.gitignore index d7a12b4..ff5137b 100644 --- a/.gitignore +++ b/.gitignore @@ -1,2 +1,4 @@ /node_modules/* -package-lock.json +/package-lock.json + +/@todo/* diff --git a/LICENSE b/LICENSE new file mode 100644 index 0000000..6124b24 --- /dev/null +++ b/LICENSE @@ -0,0 +1,21 @@ +MIT License + +Copyright (c) 2019 Ethereum Financial Tools + +Permission is hereby granted, free of charge, to any person obtaining a copy +of this software and associated documentation files (the "Software"), to deal +in the Software without restriction, including without limitation the rights +to use, copy, modify, merge, publish, distribute, sublicense, and/or sell +copies of the Software, and to permit persons to whom the Software is +furnished to do so, subject to the following conditions: + +The above copyright notice and this permission notice shall be included in all +copies or substantial portions of the Software. + +THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR +IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, +FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE +AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER +LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, +OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE +SOFTWARE. diff --git a/README.md b/README.md index 5eccbf1..8b4e58f 100644 --- a/README.md +++ b/README.md @@ -3,3 +3,23 @@ An integer-input-type component built with bel and csjs-inject ![Imgur](https://i.imgur.com/YvINoJR.png) + +# usage +`npm install input-integer` + +see `./demo/demo.js` or https://ninabreznik.github.io/input-integer + +# contribute +``` +# fork this repository to your github username by clicking the fork button +git clone https://github.com//.git +cd +npm install +npm start # to check browser and see preview while editing +# start your editor and edit files to make all your changes +npm run build +git add -A +git commit -m "" +git push +# make a pull request to contribute back the changes +``` diff --git a/bundle.js b/bundle.js index fb05697..a52babd 100644 --- a/bundle.js +++ b/bundle.js @@ -1,4 +1,40 @@ (function(){function r(e,n,t){function o(i,f){if(!n[i]){if(!e[i]){var c="function"==typeof require&&require;if(!f&&c)return c(i,!0);if(u)return u(i,!0);var a=new Error("Cannot find module '"+i+"'");throw a.code="MODULE_NOT_FOUND",a}var p=n[i]={exports:{}};e[i][0].call(p.exports,function(r){var n=e[i][1][r];return o(n||r)},p,p.exports,r,e,n,t)}return n[i].exports}for(var u="function"==typeof require&&require,i=0;i +.inputField { + color: #cccccc; + background-color: #666; +} +.integerValue { + color: #cccccc; + background-color: #666666; + width: 25%; +} +.integerSlider { + background: #333333; +} +.integerField { + width: 300px; +} +` + +const classes = { + inputField: 'inputField', + integerValue: 'integerValue', + integerSlider: 'integerSlider', + integerField: 'integerField' +} +const log = document.createElement('pre') +const el = inputinteger({ theme: { classes }, type: 'uint8', cb: (err, val) => { + if (err) log.appendChild(document.createTextNode(`${err}\n`)) + else log.appendChild(document.createTextNode(`ok: ${val}\n`)) +} }) +document.body.appendChild(el) +document.body.appendChild(log) + +},{"../":52,"csjs-inject":7}],2:[function(require,module,exports){ var trailingNewlineRegex = /\n[\s]+$/ var leadingNewlineRegex = /^\n[\s]+/ var trailingSpaceRegex = /[\s]+$/ @@ -131,7 +167,7 @@ module.exports = function appendChild (el, childs) { } } -},{}],2:[function(require,module,exports){ +},{}],3:[function(require,module,exports){ var hyperx = require('hyperx') var appendChild = require('./appendChild') @@ -232,7 +268,7 @@ module.exports = hyperx(belCreateElement, {comments: true}) module.exports.default = module.exports module.exports.createElement = belCreateElement -},{"./appendChild":1,"hyperx":27}],3:[function(require,module,exports){ +},{"./appendChild":2,"hyperx":28}],4:[function(require,module,exports){ ;(function (globalObject) { 'use strict'; @@ -3094,7 +3130,7 @@ module.exports.createElement = belCreateElement } })(this); -},{}],4:[function(require,module,exports){ +},{}],5:[function(require,module,exports){ (function (global){ 'use strict'; @@ -3113,12 +3149,12 @@ function csjsInserter() { module.exports = csjsInserter; }).call(this,typeof global !== "undefined" ? global : typeof self !== "undefined" ? self : typeof window !== "undefined" ? window : {}) -},{"csjs":9,"insert-css":28}],5:[function(require,module,exports){ +},{"csjs":10,"insert-css":29}],6:[function(require,module,exports){ 'use strict'; module.exports = require('csjs/get-css'); -},{"csjs/get-css":8}],6:[function(require,module,exports){ +},{"csjs/get-css":9}],7:[function(require,module,exports){ 'use strict'; var csjs = require('./csjs'); @@ -3127,17 +3163,17 @@ module.exports = csjs; module.exports.csjs = csjs; module.exports.getCss = require('./get-css'); -},{"./csjs":4,"./get-css":5}],7:[function(require,module,exports){ +},{"./csjs":5,"./get-css":6}],8:[function(require,module,exports){ 'use strict'; module.exports = require('./lib/csjs'); -},{"./lib/csjs":13}],8:[function(require,module,exports){ +},{"./lib/csjs":14}],9:[function(require,module,exports){ 'use strict'; module.exports = require('./lib/get-css'); -},{"./lib/get-css":17}],9:[function(require,module,exports){ +},{"./lib/get-css":18}],10:[function(require,module,exports){ 'use strict'; var csjs = require('./csjs'); @@ -3147,7 +3183,7 @@ module.exports.csjs = csjs; module.exports.noScope = csjs({ noscope: true }); module.exports.getCss = require('./get-css'); -},{"./csjs":7,"./get-css":8}],10:[function(require,module,exports){ +},{"./csjs":8,"./get-css":9}],11:[function(require,module,exports){ 'use strict'; /** @@ -3169,7 +3205,7 @@ module.exports = function encode(integer) { return str; }; -},{}],11:[function(require,module,exports){ +},{}],12:[function(require,module,exports){ 'use strict'; var makeComposition = require('./composition').makeComposition; @@ -3213,7 +3249,7 @@ function getClassChain(obj) { return acc; } -},{"./composition":12}],12:[function(require,module,exports){ +},{"./composition":13}],13:[function(require,module,exports){ 'use strict'; module.exports = { @@ -3293,7 +3329,7 @@ function ignoreComposition(values) { */ function Composition() {} -},{}],13:[function(require,module,exports){ +},{}],14:[function(require,module,exports){ 'use strict'; var extractExtends = require('./css-extract-extends'); @@ -3371,7 +3407,7 @@ function without(obj, unwanted) { }, {}); } -},{"./build-exports":11,"./composition":12,"./css-extract-extends":14,"./css-key":15,"./extract-exports":16,"./scopeify":22}],14:[function(require,module,exports){ +},{"./build-exports":12,"./composition":13,"./css-extract-extends":15,"./css-key":16,"./extract-exports":17,"./scopeify":23}],15:[function(require,module,exports){ 'use strict'; var makeComposition = require('./composition').makeComposition; @@ -3424,7 +3460,7 @@ function getClassName(str) { return trimmed[0] === '.' ? trimmed.substr(1) : trimmed; } -},{"./composition":12}],15:[function(require,module,exports){ +},{"./composition":13}],16:[function(require,module,exports){ 'use strict'; /** @@ -3434,7 +3470,7 @@ function getClassName(str) { module.exports = ' css '; -},{}],16:[function(require,module,exports){ +},{}],17:[function(require,module,exports){ 'use strict'; var regex = require('./regex'); @@ -3461,7 +3497,7 @@ function getExport(css, regex) { return prop; } -},{"./regex":19}],17:[function(require,module,exports){ +},{"./regex":20}],18:[function(require,module,exports){ 'use strict'; var cssKey = require('./css-key'); @@ -3470,7 +3506,7 @@ module.exports = function getCss(csjs) { return csjs[cssKey]; }; -},{"./css-key":15}],18:[function(require,module,exports){ +},{"./css-key":16}],19:[function(require,module,exports){ 'use strict'; /** @@ -3488,7 +3524,7 @@ module.exports = function hashStr(str) { return hash >>> 0; }; -},{}],19:[function(require,module,exports){ +},{}],20:[function(require,module,exports){ 'use strict'; var findClasses = /(\.)(?!\d)([^\s\.,{\[>+~#:)]*)(?![^{]*})/.source; @@ -3504,7 +3540,7 @@ module.exports = { ignoreComments: ignoreComments, }; -},{}],20:[function(require,module,exports){ +},{}],21:[function(require,module,exports){ var ignoreComments = require('./regex').ignoreComments; module.exports = replaceAnimations; @@ -3535,7 +3571,7 @@ function replaceAnimations(result) { return result; } -},{"./regex":19}],21:[function(require,module,exports){ +},{"./regex":20}],22:[function(require,module,exports){ 'use strict'; var encode = require('./base62-encode'); @@ -3549,7 +3585,7 @@ module.exports = function fileScoper(fileSrc) { } }; -},{"./base62-encode":10,"./hash-string":18}],22:[function(require,module,exports){ +},{"./base62-encode":11,"./hash-string":19}],23:[function(require,module,exports){ 'use strict'; var fileScoper = require('./scoped-name'); @@ -3590,7 +3626,7 @@ function scopify(css, ignores) { return replaceAnimations(result); } -},{"./regex":19,"./replace-animations":20,"./scoped-name":21}],23:[function(require,module,exports){ +},{"./regex":20,"./replace-animations":21,"./scoped-name":22}],24:[function(require,module,exports){ // This was ported from https://github.com/emn178/js-sha3, with some minor // modifications and pruning. It is licensed under MIT: // @@ -3930,7 +3966,7 @@ module.exports = { keccak256s: keccak(256), keccak512s: keccak(512) }; -},{}],24:[function(require,module,exports){ +},{}],25:[function(require,module,exports){ 'use strict'; var BN = require('bn.js'); @@ -4099,7 +4135,7 @@ module.exports = { fromWei: fromWei, toWei: toWei }; -},{"bn.js":25,"number-to-bn":31}],25:[function(require,module,exports){ +},{"bn.js":26,"number-to-bn":32}],26:[function(require,module,exports){ (function (module, exports) { 'use strict'; @@ -7528,7 +7564,7 @@ module.exports = { }; })(typeof module === 'undefined' || module, this); -},{}],26:[function(require,module,exports){ +},{}],27:[function(require,module,exports){ module.exports = attributeToProperty var transform = { @@ -7549,7 +7585,7 @@ function attributeToProperty (h) { } } -},{}],27:[function(require,module,exports){ +},{}],28:[function(require,module,exports){ var attrToProp = require('hyperscript-attribute-to-property') var VAR = 0, TEXT = 1, OPEN = 2, CLOSE = 3, ATTR = 4 @@ -7845,7 +7881,7 @@ var closeRE = RegExp('^(' + [ ].join('|') + ')(?:[\.#][a-zA-Z0-9\u007F-\uFFFF_:-]+)*$') function selfClosing (tag) { return closeRE.test(tag) } -},{"hyperscript-attribute-to-property":26}],28:[function(require,module,exports){ +},{"hyperscript-attribute-to-property":27}],29:[function(require,module,exports){ var inserted = {}; module.exports = function (css, options) { @@ -7869,7 +7905,7 @@ module.exports = function (css, options) { } }; -},{}],29:[function(require,module,exports){ +},{}],30:[function(require,module,exports){ /** * Returns a `Boolean` on whether or not the a `String` starts with '0x' * @param {String} str the string input value @@ -7884,9 +7920,9 @@ module.exports = function isHexPrefixed(str) { return str.slice(0, 2) === '0x'; } -},{}],30:[function(require,module,exports){ -arguments[4][25][0].apply(exports,arguments) -},{"dup":25}],31:[function(require,module,exports){ +},{}],31:[function(require,module,exports){ +arguments[4][26][0].apply(exports,arguments) +},{"dup":26}],32:[function(require,module,exports){ var BN = require('bn.js'); var stripHexPrefix = require('strip-hex-prefix'); @@ -7926,11 +7962,11 @@ module.exports = function numberToBN(arg) { throw new Error('[number-to-bn] while converting number ' + JSON.stringify(arg) + ' to BN.js instance, error: invalid number value. Value must be an integer, hex string, BN or BigNumber instance. Note, decimals are not supported.'); } -},{"bn.js":30,"strip-hex-prefix":44}],32:[function(require,module,exports){ +},{"bn.js":31,"strip-hex-prefix":45}],33:[function(require,module,exports){ module.exports = window.crypto; -},{}],33:[function(require,module,exports){ +},{}],34:[function(require,module,exports){ module.exports = require('crypto'); -},{"crypto":32}],34:[function(require,module,exports){ +},{"crypto":33}],35:[function(require,module,exports){ var randomHex = function(size, callback) { var crypto = require('./crypto.js'); var isCallback = (typeof callback === 'function'); @@ -7996,7 +8032,7 @@ var randomHex = function(size, callback) { module.exports = randomHex; -},{"./crypto.js":33}],35:[function(require,module,exports){ +},{"./crypto.js":34}],36:[function(require,module,exports){ const getMessage = require('./lib/getMessage'); const getRange = require('./lib/getRange'); const isAddress = require('./lib/isAddress'); @@ -8018,7 +8054,7 @@ const validator = { }; module.exports = validator; -},{"./lib/getMessage":36,"./lib/getRange":37,"./lib/isAddress":38,"./lib/isBoolean":39,"./lib/isInt":40,"./lib/isUint":41,"./lib/isValid":42}],36:[function(require,module,exports){ +},{"./lib/getMessage":37,"./lib/getRange":38,"./lib/isAddress":39,"./lib/isBoolean":40,"./lib/isInt":41,"./lib/isUint":42,"./lib/isValid":43}],37:[function(require,module,exports){ const assertString = require('./util/assertString'); const isValid = require('./isValid'); @@ -8032,7 +8068,7 @@ function getMessage(type, str) { if (type.search(/\bbool/) != -1) return 'The value is not a boolean.'; if (type.search(/\baddress/) != -1) return 'The value is not a valid address.'; } -},{"./isValid":42,"./util/assertString":43}],37:[function(require,module,exports){ +},{"./isValid":43,"./util/assertString":44}],38:[function(require,module,exports){ const bigNumber = require('bignumber.js'); const assertString = require('./util/assertString'); @@ -8070,7 +8106,7 @@ function getIntRange(type) { return range; } } -},{"./util/assertString":43,"bignumber.js":3}],38:[function(require,module,exports){ +},{"./util/assertString":44,"bignumber.js":4}],39:[function(require,module,exports){ const assertString = require('./util/assertString'); var Web3Utils = require('web3-utils'); @@ -8080,7 +8116,7 @@ function isAddress(str) { assertString(str); return Web3Utils.isAddress(str); } -},{"./util/assertString":43,"web3-utils":48}],39:[function(require,module,exports){ +},{"./util/assertString":44,"web3-utils":49}],40:[function(require,module,exports){ const assertString = require('./util/assertString'); module.exports = isBoolean; @@ -8089,7 +8125,7 @@ function isBoolean(str) { assertString(str); return (['true', 'false'].indexOf(str) >= 0); } -},{"./util/assertString":43}],40:[function(require,module,exports){ +},{"./util/assertString":44}],41:[function(require,module,exports){ // 帶符號整型 const BigNumber = require('bignumber.js'); const assertString = require('./util/assertString'); @@ -8101,7 +8137,7 @@ function isInt(str, exponent) { let num = new BigNumber(str); return num.isInteger() && num.gte(-(Math.pow(2, exponent) / 2)) && num.lte((Math.pow(2, exponent) / 2) - 1); } -},{"./util/assertString":43,"bignumber.js":3}],41:[function(require,module,exports){ +},{"./util/assertString":44,"bignumber.js":4}],42:[function(require,module,exports){ // 不帶符號整型 const bigNumber = require('bignumber.js'); const assertString = require('./util/assertString'); @@ -8113,7 +8149,7 @@ function isUint(str, exponent) { let num = bigNumber(str); return num.isInteger() && num.gte(0) && num.lte(Math.pow(2, exponent) - 1); } -},{"./util/assertString":43,"bignumber.js":3}],42:[function(require,module,exports){ +},{"./util/assertString":44,"bignumber.js":4}],43:[function(require,module,exports){ const assertString = require('./util/assertString'); const isAddress = require('./isAddress'); const isBoolean = require('./isBoolean'); @@ -8131,7 +8167,7 @@ function isValid(type, value) { if (type.search(/\baddress/) != -1) return isAddress(value); return true; } -},{"./isAddress":38,"./isBoolean":39,"./isInt":40,"./isUint":41,"./util/assertString":43}],43:[function(require,module,exports){ +},{"./isAddress":39,"./isBoolean":40,"./isInt":41,"./isUint":42,"./util/assertString":44}],44:[function(require,module,exports){ module.exports = assertString; function assertString(input) { @@ -8152,7 +8188,7 @@ function assertString(input) { throw new TypeError(`Expected string but received ${invalidType}.`); } } -},{}],44:[function(require,module,exports){ +},{}],45:[function(require,module,exports){ var isHexPrefixed = require('is-hex-prefixed'); /** @@ -8168,7 +8204,7 @@ module.exports = function stripHexPrefix(str) { return isHexPrefixed(str) ? str.slice(2) : str; } -},{"is-hex-prefixed":29}],45:[function(require,module,exports){ +},{"is-hex-prefixed":30}],46:[function(require,module,exports){ // Underscore.js 1.8.3 // http://underscorejs.org // (c) 2009-2015 Jeremy Ashkenas, DocumentCloud and Investigative Reporters & Editors @@ -9718,7 +9754,7 @@ module.exports = function stripHexPrefix(str) { } }.call(this)); -},{}],46:[function(require,module,exports){ +},{}],47:[function(require,module,exports){ (function (global){ /*! https://mths.be/utf8js v2.0.0 by @mathias */ ;(function(root) { @@ -9966,9 +10002,9 @@ module.exports = function stripHexPrefix(str) { }(this)); }).call(this,typeof global !== "undefined" ? global : typeof self !== "undefined" ? self : typeof window !== "undefined" ? window : {}) -},{}],47:[function(require,module,exports){ -arguments[4][25][0].apply(exports,arguments) -},{"dup":25}],48:[function(require,module,exports){ +},{}],48:[function(require,module,exports){ +arguments[4][26][0].apply(exports,arguments) +},{"dup":26}],49:[function(require,module,exports){ /* This file is part of web3.js. @@ -10334,7 +10370,7 @@ module.exports = { }; -},{"./soliditySha3.js":49,"./utils.js":50,"ethjs-unit":24,"randomhex":34,"underscore":45}],49:[function(require,module,exports){ +},{"./soliditySha3.js":50,"./utils.js":51,"ethjs-unit":25,"randomhex":35,"underscore":46}],50:[function(require,module,exports){ /* This file is part of web3.js. @@ -10581,7 +10617,7 @@ var soliditySha3 = function () { module.exports = soliditySha3; -},{"./utils.js":50,"bn.js":47,"underscore":45}],50:[function(require,module,exports){ +},{"./utils.js":51,"bn.js":48,"underscore":46}],51:[function(require,module,exports){ /* This file is part of web3.js. @@ -11054,44 +11090,35 @@ module.exports = { sha3: sha3 }; -},{"bn.js":47,"eth-lib/lib/hash":23,"number-to-bn":31,"underscore":45,"utf8":46}],51:[function(require,module,exports){ -var bel = require('bel') -var csjs = require('csjs-inject') -var validator = require('solidity-validator') -var bigNumber = require('bignumber.js') +},{"bn.js":48,"eth-lib/lib/hash":24,"number-to-bn":32,"underscore":46,"utf8":47}],52:[function(require,module,exports){ +const bel = require('bel') +const csjs = require('csjs-inject') +const validator = require('solidity-validator') +const bigNumber = require('bignumber.js') module.exports = displayIntegerInput -/* --------------------- - ------------------------ */ - -function displayIntegerInput({theme: {classes: css}, type, cb}) { - var min = validator.getRange(type).MIN - var max = validator.getRange(type).MAX - var title = `Valid values for type ${type} are from ${min} to ${max}` - var num = bel`sliderUpdate(e, type)} onkeydown=${(e)=>keysUpdating(e, type)}>` - var slider = bel`numUpdate(e, type)}>` - return bel` -
- ${slider} - ${num} -
- ` +function displayIntegerInput ({ theme: { classes: css }, type, cb }) { + const min = validator.getRange(type).MIN + const max = validator.getRange(type).MAX + const title = `Valid values for type ${type} are from ${min} to ${max}` + const num = bel`sliderUpdate(e, type)} onkeydown=${(e)=>keysUpdating(e, type)}>` + const slider = bel`numUpdate(e, type)}>` + return bel`
+ ${slider} + ${num} +
` function numUpdate (e, type) { num.value = num.title = bigNumber(e.target.value).toFixed(0) validate(e, type) } - function validate (e, type) { - var msg = validator.getMessage(type, e.target.value) - if (msg) cb(msg) - else cb(null) + const value = e.target.value + cb(validator.getMessage(type, value), value) } - function keysUpdating (e, type) { - var key = e.which - var val = parseInt(e.target.value) + const key = e.which + const val = parseInt(e.target.value) if (key === 38 && val != slider.max) { slider.value = num.value = val + 1 } @@ -11100,7 +11127,6 @@ function displayIntegerInput({theme: {classes: css}, type, cb}) { } validate(e, type) } - function sliderUpdate (e, type) { if (e.target.value === '') { slider.value = num.value = 0 @@ -11111,4 +11137,4 @@ function displayIntegerInput({theme: {classes: css}, type, cb}) { } } -},{"bel":2,"bignumber.js":3,"csjs-inject":6,"solidity-validator":35}]},{},[51]); +},{"bel":3,"bignumber.js":4,"csjs-inject":7,"solidity-validator":36}]},{},[1]); diff --git a/demo/demo.js b/demo/demo.js new file mode 100644 index 0000000..df8a6bb --- /dev/null +++ b/demo/demo.js @@ -0,0 +1,34 @@ +const csjs = require('csjs-inject') +const inputinteger = require('../') + +document.body.innerHTML = `` + +const classes = { + inputField: 'inputField', + integerValue: 'integerValue', + integerSlider: 'integerSlider', + integerField: 'integerField' +} +const log = document.createElement('pre') +const el = inputinteger({ theme: { classes }, type: 'uint8', cb: (err, val) => { + if (err) log.appendChild(document.createTextNode(`${err}\n`)) + else log.appendChild(document.createTextNode(`ok: ${val}\n`)) +} }) +document.body.appendChild(el) +document.body.appendChild(log) diff --git a/index.html b/index.html index c6635c8..01c6625 100644 --- a/index.html +++ b/index.html @@ -1,9 +1,5 @@ - - - - - - + + diff --git a/package-lock.json b/package-lock.json index 138df30..04678aa 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,6 +1,6 @@ { "name": "input-integer", - "version": "3.0.2", + "version": "3.1.0", "lockfileVersion": 1, "requires": true, "dependencies": { @@ -1674,7 +1674,8 @@ "ansi-regex": { "version": "2.1.1", "bundled": true, - "dev": true + "dev": true, + "optional": true }, "aproba": { "version": "1.2.0", @@ -1695,12 +1696,14 @@ "balanced-match": { "version": "1.0.0", "bundled": true, - "dev": true + "dev": true, + "optional": true }, "brace-expansion": { "version": "1.1.11", "bundled": true, "dev": true, + "optional": true, "requires": { "balanced-match": "^1.0.0", "concat-map": "0.0.1" @@ -1715,17 +1718,20 @@ "code-point-at": { "version": "1.1.0", "bundled": true, - "dev": true + "dev": true, + "optional": true }, "concat-map": { "version": "0.0.1", "bundled": true, - "dev": true + "dev": true, + "optional": true }, "console-control-strings": { "version": "1.1.0", "bundled": true, - "dev": true + "dev": true, + "optional": true }, "core-util-is": { "version": "1.0.2", @@ -1842,7 +1848,8 @@ "inherits": { "version": "2.0.3", "bundled": true, - "dev": true + "dev": true, + "optional": true }, "ini": { "version": "1.3.5", @@ -1854,6 +1861,7 @@ "version": "1.0.0", "bundled": true, "dev": true, + "optional": true, "requires": { "number-is-nan": "^1.0.0" } @@ -1868,6 +1876,7 @@ "version": "3.0.4", "bundled": true, "dev": true, + "optional": true, "requires": { "brace-expansion": "^1.1.7" } @@ -1875,12 +1884,14 @@ "minimist": { "version": "0.0.8", "bundled": true, - "dev": true + "dev": true, + "optional": true }, "minipass": { "version": "2.3.5", "bundled": true, "dev": true, + "optional": true, "requires": { "safe-buffer": "^5.1.2", "yallist": "^3.0.0" @@ -1899,6 +1910,7 @@ "version": "0.5.1", "bundled": true, "dev": true, + "optional": true, "requires": { "minimist": "0.0.8" } @@ -1979,7 +1991,8 @@ "number-is-nan": { "version": "1.0.1", "bundled": true, - "dev": true + "dev": true, + "optional": true }, "object-assign": { "version": "4.1.1", @@ -1991,6 +2004,7 @@ "version": "1.4.0", "bundled": true, "dev": true, + "optional": true, "requires": { "wrappy": "1" } @@ -2076,7 +2090,8 @@ "safe-buffer": { "version": "5.1.2", "bundled": true, - "dev": true + "dev": true, + "optional": true }, "safer-buffer": { "version": "2.1.2", @@ -2112,6 +2127,7 @@ "version": "1.0.2", "bundled": true, "dev": true, + "optional": true, "requires": { "code-point-at": "^1.0.0", "is-fullwidth-code-point": "^1.0.0", @@ -2131,6 +2147,7 @@ "version": "3.0.1", "bundled": true, "dev": true, + "optional": true, "requires": { "ansi-regex": "^2.0.0" } @@ -2174,12 +2191,14 @@ "wrappy": { "version": "1.0.2", "bundled": true, - "dev": true + "dev": true, + "optional": true }, "yallist": { "version": "3.0.3", "bundled": true, - "dev": true + "dev": true, + "optional": true } } }, diff --git a/package.json b/package.json index 3f39c1e..bdacc56 100644 --- a/package.json +++ b/package.json @@ -1,11 +1,11 @@ { "name": "input-integer", - "version": "3.0.5", + "version": "3.1.0", "description": "An integer-input-type component built with bel and csjs-inject", - "main": "src/index.js", + "main": "src/input-integer.js", "scripts": { - "start": "budo src/index.js:bundle.js --dir ./ --live --open", - "build": "browserify src/index.js > bundle.js" + "start": "budo demo/demo.js:bundle.js --dir . --title $npm_package_name --force-default-index --ssl --live --open", + "build": "browserify demo/demo.js -o bundle.js" }, "repository": { "type": "git", diff --git a/src/index.js b/src/index.js deleted file mode 100644 index 78dd8b8..0000000 --- a/src/index.js +++ /dev/null @@ -1,55 +0,0 @@ -var bel = require('bel') -var csjs = require('csjs-inject') -var validator = require('solidity-validator') -var bigNumber = require('bignumber.js') - -module.exports = displayIntegerInput - -/* --------------------- - ------------------------ */ - -function displayIntegerInput({theme: {classes: css}, type, cb}) { - var min = validator.getRange(type).MIN - var max = validator.getRange(type).MAX - var title = `Valid values for type ${type} are from ${min} to ${max}` - var num = bel`sliderUpdate(e, type)} onkeydown=${(e)=>keysUpdating(e, type)}>` - var slider = bel`numUpdate(e, type)}>` - return bel` -
- ${slider} - ${num} -
- ` - function numUpdate (e, type) { - num.value = num.title = bigNumber(e.target.value).toFixed(0) - validate(e, type) - } - - function validate (e, type) { - var msg = validator.getMessage(type, e.target.value) - if (msg) cb(msg) - else cb(null) - } - - function keysUpdating (e, type) { - var key = e.which - var val = parseInt(e.target.value) - if (key === 38 && val != slider.max) { - slider.value = num.value = val + 1 - } - else if (key === 40 && val != slider.min) { - slider.value = num.value = val - 1 - } - validate(e, type) - } - - function sliderUpdate (e, type) { - if (e.target.value === '') { - slider.value = num.value = 0 - } else { - slider.value = e.target.value - } - validate(e, type) - } -} diff --git a/src/input-integer.js b/src/input-integer.js new file mode 100644 index 0000000..4dd9ce4 --- /dev/null +++ b/src/input-integer.js @@ -0,0 +1,45 @@ +const bel = require('bel') +const csjs = require('csjs-inject') +const validator = require('solidity-validator') +const bigNumber = require('bignumber.js') + +module.exports = displayIntegerInput + +function displayIntegerInput ({ theme: { classes: css }, type, cb }) { + const min = validator.getRange(type).MIN + const max = validator.getRange(type).MAX + const title = `Valid values for type ${type} are from ${min} to ${max}` + const num = bel`sliderUpdate(e, type)} onkeydown=${(e)=>keysUpdating(e, type)}>` + const slider = bel`numUpdate(e, type)}>` + return bel`
+ ${slider} + ${num} +
` + function numUpdate (e, type) { + num.value = num.title = bigNumber(e.target.value).toFixed(0) + validate(e, type) + } + function validate (e, type) { + const value = e.target.value + cb(validator.getMessage(type, value), value) + } + function keysUpdating (e, type) { + const key = e.which + const val = parseInt(e.target.value) + if (key === 38 && val != slider.max) { + slider.value = num.value = val + 1 + } + else if (key === 40 && val != slider.min) { + slider.value = num.value = val - 1 + } + validate(e, type) + } + function sliderUpdate (e, type) { + if (e.target.value === '') { + slider.value = num.value = 0 + } else { + slider.value = e.target.value + } + validate(e, type) + } +} diff --git a/src/node_modules/validate-input.js b/src/node_modules/validate-input.js deleted file mode 100644 index b5a85df..0000000 --- a/src/node_modules/validate-input.js +++ /dev/null @@ -1,13 +0,0 @@ -module.exports = validateInput - -function validateInput ({ type, e }) { - var value - if (type === 'int') { - if (value != parseInt(value, 10)) { alert('Value has to be an integer') } - } - else if (type === 'uint') { - value = e.target.value - if (value < 0) { alert('Value can not be less than 0') } - if (value != parseInt(value, 10)) { alert('Value has to be an integer') } - } -}