diff --git a/package-lock.json b/package-lock.json index 156c42f..d9b560f 100644 --- a/package-lock.json +++ b/package-lock.json @@ -896,6 +896,11 @@ "glob-to-regexp": "0.3.0" } }, + "@tweenjs/tween.js": { + "version": "17.2.0", + "resolved": "https://registry.npmjs.org/@tweenjs/tween.js/-/tween.js-17.2.0.tgz", + "integrity": "sha1-IfibcJuvxLMDra56g7TzWg2eR5Y=" + }, "@types/strip-bom": { "version": "3.0.0", "resolved": "https://registry.npmjs.org/@types/strip-bom/-/strip-bom-3.0.0.tgz", @@ -3786,6 +3791,11 @@ "randomfill": "1.0.4" } }, + "crypto-js": { + "version": "3.1.9-1", + "resolved": "https://registry.npmjs.org/crypto-js/-/crypto-js-3.1.9-1.tgz", + "integrity": "sha1-/aGedh/Ad+Af+/3G6f38WeiAbNg=" + }, "css": { "version": "2.2.3", "resolved": "https://registry.npmjs.org/css/-/css-2.2.3.tgz", @@ -8326,6 +8336,11 @@ "nopt": "3.0.6" } }, + "js-cookie": { + "version": "2.2.0", + "resolved": "https://registry.npmjs.org/js-cookie/-/js-cookie-2.2.0.tgz", + "integrity": "sha1-Gywnmm7s44ChIWi5JIUmWzWx7/s=" + }, "js-tokens": { "version": "3.0.2", "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-3.0.2.tgz", @@ -8812,6 +8827,11 @@ "object-visit": "1.0.1" } }, + "materialize-css": { + "version": "1.0.0-rc.1", + "resolved": "https://registry.npmjs.org/materialize-css/-/materialize-css-1.0.0-rc.1.tgz", + "integrity": "sha512-YzxLgNrkaE6QKMtrjZG3ogQy64S23u3aXvwGEt5JBoGpI1jni9WIM3U8xhuZUtgUjHuCMdRqrRnA5BtUrV0wrg==" + }, "math-expression-evaluator": { "version": "1.2.17", "resolved": "https://registry.npmjs.org/math-expression-evaluator/-/math-expression-evaluator-1.2.17.tgz", diff --git a/package.json b/package.json index 17c42ff..94a82e5 100644 --- a/package.json +++ b/package.json @@ -9,6 +9,10 @@ "lint": "vue-cli-service lint" }, "dependencies": { + "@tweenjs/tween.js": "^17.2.0", + "crypto-js": "^3.1.9-1", + "js-cookie": "^2.2.0", + "materialize-css": "^1.0.0-rc.1", "vue": "^2.5.16" }, "devDependencies": { diff --git a/public/dice-cube-outline.svg b/public/dice-cube-outline.svg new file mode 100644 index 0000000..eef08cc --- /dev/null +++ b/public/dice-cube-outline.svg @@ -0,0 +1,38 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/public/index.html b/public/index.html index 4339708..03596c2 100644 --- a/public/index.html +++ b/public/index.html @@ -5,6 +5,9 @@ + + + dice diff --git a/src/App.vue b/src/App.vue index a6c2824..84c4a1f 100644 --- a/src/App.vue +++ b/src/App.vue @@ -1,28 +1,112 @@ diff --git a/src/assets/logo.png b/src/assets/logo.png deleted file mode 100644 index f3d2503..0000000 Binary files a/src/assets/logo.png and /dev/null differ diff --git a/src/assets/logo.svg b/src/assets/logo.svg new file mode 100644 index 0000000..eef08cc --- /dev/null +++ b/src/assets/logo.svg @@ -0,0 +1,38 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/src/components/Balance.vue b/src/components/Balance.vue new file mode 100644 index 0000000..6c428bc --- /dev/null +++ b/src/components/Balance.vue @@ -0,0 +1,38 @@ + + + + + diff --git a/src/components/Board.vue b/src/components/Board.vue new file mode 100644 index 0000000..9003ece --- /dev/null +++ b/src/components/Board.vue @@ -0,0 +1,197 @@ + + + + + diff --git a/src/components/HelloWorld.vue b/src/components/HelloWorld.vue deleted file mode 100644 index cee6464..0000000 --- a/src/components/HelloWorld.vue +++ /dev/null @@ -1,58 +0,0 @@ - - - - - - diff --git a/src/components/Info.vue b/src/components/Info.vue new file mode 100644 index 0000000..90ee07e --- /dev/null +++ b/src/components/Info.vue @@ -0,0 +1,71 @@ + + + + + diff --git a/src/components/helpers/Animated.vue b/src/components/helpers/Animated.vue new file mode 100644 index 0000000..8c9ee73 --- /dev/null +++ b/src/components/helpers/Animated.vue @@ -0,0 +1,50 @@ + + + + + diff --git a/src/components/helpers/Card.vue b/src/components/helpers/Card.vue new file mode 100644 index 0000000..d5a22ce --- /dev/null +++ b/src/components/helpers/Card.vue @@ -0,0 +1,26 @@ + + + + + diff --git a/src/main.js b/src/main.js index 77f35b6..81cce54 100644 --- a/src/main.js +++ b/src/main.js @@ -1,3 +1,7 @@ +// Inject materialize-css framework +import 'materialize-css'; +import 'materialize-css/dist/css/materialize.css'; + import Vue from 'vue'; import App from './App.vue'; diff --git a/tests/unit/Board.spec.js b/tests/unit/Board.spec.js new file mode 100644 index 0000000..cb0c28e --- /dev/null +++ b/tests/unit/Board.spec.js @@ -0,0 +1,65 @@ +import CryptoJS from 'crypto-js'; + +import { shallow } from '@vue/test-utils'; +import Board from '@/components/Board.vue'; + +const getCurrent = () => { + let key = Math.random().toString(36).substr(2, 8); + let val = Math.floor(Math.random() * 100).toString(); + + key = CryptoJS.SHA3(key, { outputLength: 256 }).toString(CryptoJS.enc.Base64); + val = CryptoJS.AES.encrypt(val, key).toString(); + + return { key, val }; +}; +const info = { + balance: 100, +}; + +describe('Board.vue component', () => { + describe('Check computed bid/multiplier', () => { + const current = getCurrent(); + const wrapper = shallow(Board, { + propsData: { current, info }, + }); + + it('Bet 50 Hi Chance of Winning', () => { + wrapper.setData({ + number: 50, + }); + + const { high: { chance, multiplier } } = wrapper.vm.bid; + + expect(chance).toEqual(50); + expect(multiplier).toEqual(2); + }); + + it('Bet 1 Hi/Lo Chance of Winning', () => { + wrapper.setData({ + number: 1, + }); + + const { high, low } = wrapper.vm.bid; + + expect(high.chance).toEqual(99); + expect(high.multiplier).toEqual(1.01); + + expect(low.chance).toEqual(1); + expect(low.multiplier).toEqual(100); + }); + + it('Bet 10 Hi/Lo Chance of Winning', () => { + wrapper.setData({ + number: 10, + }); + + const { high, low } = wrapper.vm.bid; + + expect(high.chance).toEqual(90); + expect(high.multiplier).toEqual(1.11); + + expect(low.chance).toEqual(10); + expect(low.multiplier).toEqual(10); + }); + }); +}); diff --git a/tests/unit/HelloWorld.spec.js b/tests/unit/HelloWorld.spec.js deleted file mode 100644 index e2dcea5..0000000 --- a/tests/unit/HelloWorld.spec.js +++ /dev/null @@ -1,12 +0,0 @@ -import { shallow } from '@vue/test-utils'; -import HelloWorld from '@/components/HelloWorld.vue'; - -describe('HelloWorld.vue', () => { - it('renders props.msg when passed', () => { - const msg = 'new message'; - const wrapper = shallow(HelloWorld, { - propsData: { msg }, - }); - expect(wrapper.text()).toMatch(msg); - }); -}); diff --git a/tests/unit/Info.spec.js b/tests/unit/Info.spec.js new file mode 100644 index 0000000..86e2141 --- /dev/null +++ b/tests/unit/Info.spec.js @@ -0,0 +1,58 @@ +import { shallow } from '@vue/test-utils'; +import Info from '@/components/Info.vue'; + +const previous = { + key: 'This is the key', + val: 'This is the val', +}; + +describe('Info.vue component', () => { + it('renders info.previous when this object passed', () => { + const info = { previous }; + + const wrapper = shallow(Info, { + propsData: { info }, + }); + + const { key, val } = wrapper.props().info.previous; + + expect(key).toMatch(previous.key); + expect(val).toMatch(previous.val); + }); + it('renders status when user win', () => { + const info = { + status: true, + amount: 10, + previous, + }; + + const wrapper = shallow(Info, { + propsData: { info }, + }); + + const { status } = wrapper.vm; + + expect(status.charge).toEqual(10); + expect(status.msg).toMatch('You won! +$'); + + expect(status.clr).toMatch('green'); + }); + it('renders status when user lose', () => { + const info = { + status: false, + amount: -10, + previous, + }; + + const wrapper = shallow(Info, { + propsData: { info }, + }); + + const { status } = wrapper.vm; + + expect(status.charge).toEqual(10); + expect(status.msg).toMatch('You lose! -$'); + + expect(status.clr).toMatch('red'); + }); +});