on master help sign in
merging new card design into mino
commit5ed192526cde4e6ad5d3b47e89b081acc916f41a authorAnthony Arroyo <anthony@tlon.io> dateWed 16 Oct 2019, 20:56 (7 years ago) parent663561ce4e6c6e
10 files changed+1016−220
package-lock.json+64−64 public/spritesheet_a.png src/components/Passport.js+279−136 src/lib/card.js+190 src/style/anim.css+460 src/style/indigo-proposals.scss+1−1 src/views/Activate/ActivateCode.js+7−2 src/views/Activate/ActivatePassport.js+5−6 src/views/Invite/InviteEmail.js+1−10 src/views/Point.js+9−1
package-lock.json+64−64
@@ -51,7 +51,7 @@
5151 },
5252 "minimist": {
5353 "version": "1.2.0",
54− "resolved": "http://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz",
54+ "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz",
5555 "integrity": "sha1-o1AIsg9BOD7sH7kU9M1d95omQoQ="
5656 },
5757 "ms": {
@@ -2217,7 +2217,7 @@
22172217 },
22182218 "arg": {
22192219 "version": "2.0.0",
2220− "resolved": "http://registry.npmjs.org/arg/-/arg-2.0.0.tgz",
2220+ "resolved": "https://registry.npmjs.org/arg/-/arg-2.0.0.tgz",
22212221 "integrity": "sha512-XxNTUzKnz1ctK3ZIcI2XUPlD96wbHP2nGqkPKpvk/HNRlPveYrXIVSTk9m3LcqOgDPg3B1nMvdV/K8wZd7PG4w==",
22222222 "dev": true
22232223 },
@@ -2281,7 +2281,7 @@
22812281 },
22822282 "array-equal": {
22832283 "version": "1.0.0",
2284− "resolved": "http://registry.npmjs.org/array-equal/-/array-equal-1.0.0.tgz",
2284+ "resolved": "https://registry.npmjs.org/array-equal/-/array-equal-1.0.0.tgz",
22852285 "integrity": "sha1-jCpe8kcv2ep0KwTHenUJO6J1fJM="
22862286 },
22872287 "array-filter": {
@@ -2434,7 +2434,7 @@
24342434 },
24352435 "util": {
24362436 "version": "0.10.3",
2437− "resolved": "http://registry.npmjs.org/util/-/util-0.10.3.tgz",
2437+ "resolved": "https://registry.npmjs.org/util/-/util-0.10.3.tgz",
24382438 "integrity": "sha1-evsa/lCAUkZInj23/g7TeTNqwPk=",
24392439 "requires": {
24402440 "inherits": "2.0.1"
@@ -2842,7 +2842,7 @@
28422842 },
28432843 "babel-plugin-syntax-object-rest-spread": {
28442844 "version": "6.13.0",
2845− "resolved": "http://registry.npmjs.org/babel-plugin-syntax-object-rest-spread/-/babel-plugin-syntax-object-rest-spread-6.13.0.tgz",
2845+ "resolved": "https://registry.npmjs.org/babel-plugin-syntax-object-rest-spread/-/babel-plugin-syntax-object-rest-spread-6.13.0.tgz",
28462846 "integrity": "sha1-/WU28rzhODb/o6VFjEkDpZe7O/U="
28472847 },
28482848 "babel-plugin-transform-object-rest-spread": {
@@ -3257,7 +3257,7 @@
32573257 },
32583258 "bl": {
32593259 "version": "1.2.2",
3260− "resolved": "http://registry.npmjs.org/bl/-/bl-1.2.2.tgz",
3260+ "resolved": "https://registry.npmjs.org/bl/-/bl-1.2.2.tgz",
32613261 "integrity": "sha512-e8tQYnZodmebYDWGH7KMRvtzKXaJHx3BbilrgZCfvyLUYdKpK1t5PSPmpkny/SgiTSCnjfLW7v5rlONXVFkQEA==",
32623262 "requires": {
32633263 "readable-stream": "^2.3.5",
@@ -3475,7 +3475,7 @@
34753475 "dependencies": {
34763476 "resolve": {
34773477 "version": "1.1.7",
3478− "resolved": "http://registry.npmjs.org/resolve/-/resolve-1.1.7.tgz",
3478+ "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.1.7.tgz",
34793479 "integrity": "sha1-IDEU2CrSxe2ejgQRs5ModeiJ6Xs="
34803480 }
34813481 }
@@ -3487,7 +3487,7 @@
34873487 },
34883488 "browserify-aes": {
34893489 "version": "1.2.0",
3490− "resolved": "http://registry.npmjs.org/browserify-aes/-/browserify-aes-1.2.0.tgz",
3490+ "resolved": "https://registry.npmjs.org/browserify-aes/-/browserify-aes-1.2.0.tgz",
34913491 "integrity": "sha512-+7CHXqGuspUn/Sl5aO7Ea0xWGAtETPXNSAjHo48JfLdPWcMng33Xe4znFvQweqc/uzk5zSOI3H52CYnjCfb5hA==",
34923492 "requires": {
34933493 "buffer-xor": "^1.0.3",
@@ -3521,7 +3521,7 @@
35213521 },
35223522 "browserify-rsa": {
35233523 "version": "4.0.1",
3524− "resolved": "http://registry.npmjs.org/browserify-rsa/-/browserify-rsa-4.0.1.tgz",
3524+ "resolved": "https://registry.npmjs.org/browserify-rsa/-/browserify-rsa-4.0.1.tgz",
35253525 "integrity": "sha1-IeCr+vbyApzy+vsTNWenAdQTVSQ=",
35263526 "requires": {
35273527 "bn.js": "^4.1.0",
@@ -3750,7 +3750,7 @@
37503750 },
37513751 "callsites": {
37523752 "version": "2.0.0",
3753− "resolved": "http://registry.npmjs.org/callsites/-/callsites-2.0.0.tgz",
3753+ "resolved": "https://registry.npmjs.org/callsites/-/callsites-2.0.0.tgz",
37543754 "integrity": "sha1-BuuE8A7qQT2oav/vrL/7Ngk7PFA="
37553755 },
37563756 "camel-case": {
@@ -3821,7 +3821,7 @@
38213821 },
38223822 "chalk": {
38233823 "version": "1.1.3",
3824− "resolved": "http://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
3824+ "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
38253825 "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
38263826 "requires": {
38273827 "ansi-styles": "^2.2.1",
@@ -4031,7 +4031,7 @@
40314031 },
40324032 "clone-deep": {
40334033 "version": "0.2.4",
4034− "resolved": "http://registry.npmjs.org/clone-deep/-/clone-deep-0.2.4.tgz",
4034+ "resolved": "https://registry.npmjs.org/clone-deep/-/clone-deep-0.2.4.tgz",
40354035 "integrity": "sha1-TnPdCen7lxzDhnDF3O2cGJZIHMY=",
40364036 "requires": {
40374037 "for-own": "^0.1.3",
@@ -4413,7 +4413,7 @@
44134413 },
44144414 "create-hash": {
44154415 "version": "1.2.0",
4416− "resolved": "http://registry.npmjs.org/create-hash/-/create-hash-1.2.0.tgz",
4416+ "resolved": "https://registry.npmjs.org/create-hash/-/create-hash-1.2.0.tgz",
44174417 "integrity": "sha512-z00bCGNHDG8mHAkP7CtT1qVu+bFQUPjYq/4Iv3C3kWjTFV10zIjfSoeqXo9Asws8gwSHDGj/hl2u4OGIjapeCg==",
44184418 "requires": {
44194419 "cipher-base": "^1.0.1",
@@ -4425,7 +4425,7 @@
44254425 },
44264426 "create-hmac": {
44274427 "version": "1.1.7",
4428− "resolved": "http://registry.npmjs.org/create-hmac/-/create-hmac-1.1.7.tgz",
4428+ "resolved": "https://registry.npmjs.org/create-hmac/-/create-hmac-1.1.7.tgz",
44294429 "integrity": "sha512-MJG9liiZ+ogc4TzUwuvbER1JRdgvUFSB5+VR/g5h82fGaIRWMWddtKBHi7/sVhfjQZ6SehlyhvQYrcYkaUIpLg==",
44304430 "requires": {
44314431 "cipher-base": "^1.0.3",
@@ -4476,7 +4476,7 @@
44764476 },
44774477 "css-color-names": {
44784478 "version": "0.0.4",
4479− "resolved": "http://registry.npmjs.org/css-color-names/-/css-color-names-0.0.4.tgz",
4479+ "resolved": "https://registry.npmjs.org/css-color-names/-/css-color-names-0.0.4.tgz",
44804480 "integrity": "sha1-gIrcLnnPhHOAabZGyyDsJ762KeA="
44814481 },
44824482 "css-declaration-sorter": {
@@ -4878,12 +4878,12 @@
48784878 "dependencies": {
48794879 "file-type": {
48804880 "version": "3.9.0",
4881− "resolved": "http://registry.npmjs.org/file-type/-/file-type-3.9.0.tgz",
4881+ "resolved": "https://registry.npmjs.org/file-type/-/file-type-3.9.0.tgz",
48824882 "integrity": "sha1-JXoHg4TR24CHvESdEH1SpSZyuek="
48834883 },
48844884 "get-stream": {
48854885 "version": "2.3.1",
4886− "resolved": "http://registry.npmjs.org/get-stream/-/get-stream-2.3.1.tgz",
4886+ "resolved": "https://registry.npmjs.org/get-stream/-/get-stream-2.3.1.tgz",
48874887 "integrity": "sha1-Xzj5PzRgCWZu4BUKBUFn+Rvdld4=",
48884888 "requires": {
48894889 "object-assign": "^4.0.1",
@@ -5019,7 +5019,7 @@
50195019 "dependencies": {
50205020 "globby": {
50215021 "version": "6.1.0",
5022− "resolved": "http://registry.npmjs.org/globby/-/globby-6.1.0.tgz",
5022+ "resolved": "https://registry.npmjs.org/globby/-/globby-6.1.0.tgz",
50235023 "integrity": "sha1-9abXDoOV4hyFj7BInWTfAkJNUGw=",
50245024 "requires": {
50255025 "array-union": "^1.0.1",
@@ -5031,7 +5031,7 @@
50315031 "dependencies": {
50325032 "pify": {
50335033 "version": "2.3.0",
5034− "resolved": "http://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
5034+ "resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
50355035 "integrity": "sha1-7RQaasBDqEnqWISY59yosVMw6Qw="
50365036 }
50375037 }
@@ -5117,7 +5117,7 @@
51175117 },
51185118 "diffie-hellman": {
51195119 "version": "5.0.3",
5120− "resolved": "http://registry.npmjs.org/diffie-hellman/-/diffie-hellman-5.0.3.tgz",
5120+ "resolved": "https://registry.npmjs.org/diffie-hellman/-/diffie-hellman-5.0.3.tgz",
51215121 "integrity": "sha512-kqag/Nl+f3GwyK25fhUMYj81BUOrZ9IuJsjIcDE5icNM9FJHAVm3VcUDxdLPoQtTuUylWm6ZIknYJwwaPxsUzg==",
51225122 "requires": {
51235123 "bn.js": "^4.1.0",
@@ -5273,7 +5273,7 @@
52735273 },
52745274 "duplexer": {
52755275 "version": "0.1.1",
5276− "resolved": "http://registry.npmjs.org/duplexer/-/duplexer-0.1.1.tgz",
5276+ "resolved": "https://registry.npmjs.org/duplexer/-/duplexer-0.1.1.tgz",
52775277 "integrity": "sha1-rOb/gIwc5mtX0ev5eXessCM0z8E="
52785278 },
52795279 "duplexer3": {
@@ -5744,7 +5744,7 @@
57445744 "dependencies": {
57455745 "doctrine": {
57465746 "version": "1.5.0",
5747− "resolved": "http://registry.npmjs.org/doctrine/-/doctrine-1.5.0.tgz",
5747+ "resolved": "https://registry.npmjs.org/doctrine/-/doctrine-1.5.0.tgz",
57485748 "integrity": "sha1-N53Ocw9hZvds76TmcHoVmwLFpvo=",
57495749 "requires": {
57505750 "esutils": "^2.0.2",
@@ -5761,7 +5761,7 @@
57615761 },
57625762 "load-json-file": {
57635763 "version": "2.0.0",
5764− "resolved": "http://registry.npmjs.org/load-json-file/-/load-json-file-2.0.0.tgz",
5764+ "resolved": "https://registry.npmjs.org/load-json-file/-/load-json-file-2.0.0.tgz",
57655765 "integrity": "sha1-eUfkIUmvgNaWy/eXvKq8/h/inKg=",
57665766 "requires": {
57675767 "graceful-fs": "^4.1.2",
@@ -6817,7 +6817,7 @@
68176817 },
68186818 "fs-extra": {
68196819 "version": "0.30.0",
6820− "resolved": "http://registry.npmjs.org/fs-extra/-/fs-extra-0.30.0.tgz",
6820+ "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-0.30.0.tgz",
68216821 "integrity": "sha1-8jP/zAjU2n1DLapEl3aYnbHfk/A=",
68226822 "requires": {
68236823 "graceful-fs": "^4.1.2",
@@ -9256,7 +9256,7 @@
92569256 },
92579257 "is-accessor-descriptor": {
92589258 "version": "0.1.6",
9259− "resolved": "http://registry.npmjs.org/is-accessor-descriptor/-/is-accessor-descriptor-0.1.6.tgz",
9259+ "resolved": "https://registry.npmjs.org/is-accessor-descriptor/-/is-accessor-descriptor-0.1.6.tgz",
92609260 "integrity": "sha1-qeEss66Nh2cn7u84Q/igiXtcmNY=",
92619261 "requires": {
92629262 "kind-of": "^3.0.2"
@@ -9313,7 +9313,7 @@
93139313 },
93149314 "is-data-descriptor": {
93159315 "version": "0.1.4",
9316− "resolved": "http://registry.npmjs.org/is-data-descriptor/-/is-data-descriptor-0.1.4.tgz",
9316+ "resolved": "https://registry.npmjs.org/is-data-descriptor/-/is-data-descriptor-0.1.4.tgz",
93179317 "integrity": "sha1-C17mSDiOLIYCgueT8YVv7D8wG1Y=",
93189318 "requires": {
93199319 "kind-of": "^3.0.2"
@@ -9415,7 +9415,7 @@
94159415 },
94169416 "is-obj": {
94179417 "version": "1.0.1",
9418− "resolved": "http://registry.npmjs.org/is-obj/-/is-obj-1.0.1.tgz",
9418+ "resolved": "https://registry.npmjs.org/is-obj/-/is-obj-1.0.1.tgz",
94199419 "integrity": "sha1-PkcprB9f3gJc19g6iW2rn09n2w8="
94209420 },
94219421 "is-object": {
@@ -11069,7 +11069,7 @@
1106911069 },
1107011070 "jsesc": {
1107111071 "version": "1.3.0",
11072− "resolved": "http://registry.npmjs.org/jsesc/-/jsesc-1.3.0.tgz",
11072+ "resolved": "https://registry.npmjs.org/jsesc/-/jsesc-1.3.0.tgz",
1107311073 "integrity": "sha1-RsP+yMGJKxKwgz25vHYiF226s0s="
1107411074 },
1107511075 "json-parse-better-errors": {
@@ -11112,12 +11112,12 @@
1111211112 },
1111311113 "json5": {
1111411114 "version": "0.5.1",
11115− "resolved": "http://registry.npmjs.org/json5/-/json5-0.5.1.tgz",
11115+ "resolved": "https://registry.npmjs.org/json5/-/json5-0.5.1.tgz",
1111611116 "integrity": "sha1-Hq3nrMASA0rYTiOWdn6tn6VJWCE="
1111711117 },
1111811118 "jsonfile": {
1111911119 "version": "2.4.0",
11120− "resolved": "http://registry.npmjs.org/jsonfile/-/jsonfile-2.4.0.tgz",
11120+ "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-2.4.0.tgz",
1112111121 "integrity": "sha1-NzaitCi4e72gzIO1P6PWM6NcKug=",
1112211122 "requires": {
1112311123 "graceful-fs": "^4.1.6"
@@ -11337,7 +11337,7 @@
1133711337 },
1133811338 "load-json-file": {
1133911339 "version": "1.1.0",
11340− "resolved": "http://registry.npmjs.org/load-json-file/-/load-json-file-1.1.0.tgz",
11340+ "resolved": "https://registry.npmjs.org/load-json-file/-/load-json-file-1.1.0.tgz",
1134111341 "integrity": "sha1-lWkFcI1YtLq0wiYbBPWfMcmTdMA=",
1134211342 "requires": {
1134311343 "graceful-fs": "^4.1.2",
@@ -11393,7 +11393,7 @@
1139311393 "dependencies": {
1139411394 "json5": {
1139511395 "version": "1.0.1",
11396− "resolved": "http://registry.npmjs.org/json5/-/json5-1.0.1.tgz",
11396+ "resolved": "https://registry.npmjs.org/json5/-/json5-1.0.1.tgz",
1139711397 "integrity": "sha512-aKS4WQjPenRxiQsC93MNfjx+nbF4PAdYzmd/1JIj8HYzqfbu86beTuNgXDzPknWk0n0uARlyewZo4s++ES36Ow==",
1139811398 "requires": {
1139911399 "minimist": "^1.2.0"
@@ -11401,7 +11401,7 @@
1140111401 },
1140211402 "minimist": {
1140311403 "version": "1.2.0",
11404− "resolved": "http://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz",
11404+ "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz",
1140511405 "integrity": "sha1-o1AIsg9BOD7sH7kU9M1d95omQoQ="
1140611406 }
1140711407 }
@@ -11655,7 +11655,7 @@
1165511655 },
1165611656 "media-typer": {
1165711657 "version": "0.3.0",
11658− "resolved": "http://registry.npmjs.org/media-typer/-/media-typer-0.3.0.tgz",
11658+ "resolved": "https://registry.npmjs.org/media-typer/-/media-typer-0.3.0.tgz",
1165911659 "integrity": "sha1-hxDXrwqmJvj/+hzgAWhUUmMlV0g="
1166011660 },
1166111661 "mem": {
@@ -11852,7 +11852,7 @@
1185211852 },
1185311853 "minimist": {
1185411854 "version": "0.0.8",
11855− "resolved": "http://registry.npmjs.org/minimist/-/minimist-0.0.8.tgz",
11855+ "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.0.8.tgz",
1185611856 "integrity": "sha1-hX/Kv8M5fSYluCKCYuhqp6ARsF0="
1185711857 },
1185811858 "minipass": {
@@ -11926,7 +11926,7 @@
1192611926 },
1192711927 "mkdirp": {
1192811928 "version": "0.5.1",
11929− "resolved": "http://registry.npmjs.org/mkdirp/-/mkdirp-0.5.1.tgz",
11929+ "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-0.5.1.tgz",
1193011930 "integrity": "sha1-MAV0OOrGz3+MR2fzhkjWaX11yQM=",
1193111931 "requires": {
1193211932 "minimist": "0.0.8"
@@ -12814,12 +12814,12 @@
1281412814 },
1281512815 "os-homedir": {
1281612816 "version": "1.0.2",
12817− "resolved": "http://registry.npmjs.org/os-homedir/-/os-homedir-1.0.2.tgz",
12817+ "resolved": "https://registry.npmjs.org/os-homedir/-/os-homedir-1.0.2.tgz",
1281812818 "integrity": "sha1-/7xJiDNuDoM94MFox+8VISGqf7M="
1281912819 },
1282012820 "os-locale": {
1282112821 "version": "1.4.0",
12822− "resolved": "http://registry.npmjs.org/os-locale/-/os-locale-1.4.0.tgz",
12822+ "resolved": "https://registry.npmjs.org/os-locale/-/os-locale-1.4.0.tgz",
1282312823 "integrity": "sha1-IPnxeuKe00XoveWDsT0gCYA8FNk=",
1282412824 "requires": {
1282512825 "lcid": "^1.0.0"
@@ -12827,7 +12827,7 @@
1282712827 },
1282812828 "os-tmpdir": {
1282912829 "version": "1.0.2",
12830− "resolved": "http://registry.npmjs.org/os-tmpdir/-/os-tmpdir-1.0.2.tgz",
12830+ "resolved": "https://registry.npmjs.org/os-tmpdir/-/os-tmpdir-1.0.2.tgz",
1283112831 "integrity": "sha1-u+Z0BseaqFxc/sdm/lc0VV36EnQ="
1283212832 },
1283312833 "osenv": {
@@ -13030,7 +13030,7 @@
1303013030 },
1303113031 "path-is-absolute": {
1303213032 "version": "1.0.1",
13033− "resolved": "http://registry.npmjs.org/path-is-absolute/-/path-is-absolute-1.0.1.tgz",
13033+ "resolved": "https://registry.npmjs.org/path-is-absolute/-/path-is-absolute-1.0.1.tgz",
1303413034 "integrity": "sha1-F0uSaHNVNP+8es5r9TpanhtcX18="
1303513035 },
1303613036 "path-is-inside": {
@@ -13106,7 +13106,7 @@
1310613106 },
1310713107 "pify": {
1310813108 "version": "2.3.0",
13109− "resolved": "http://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
13109+ "resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
1311013110 "integrity": "sha1-7RQaasBDqEnqWISY59yosVMw6Qw="
1311113111 },
1311213112 "pinkie": {
@@ -14305,7 +14305,7 @@
1430514305 },
1430614306 "query-string": {
1430714307 "version": "5.1.1",
14308− "resolved": "http://registry.npmjs.org/query-string/-/query-string-5.1.1.tgz",
14308+ "resolved": "https://registry.npmjs.org/query-string/-/query-string-5.1.1.tgz",
1430914309 "integrity": "sha512-gjWOsm2SoGlgLEdAGt7a6slVOk9mGiXmPFMqrEhLQ68rhQuBnpfs3+EmlvqKyxnCo9/PPlF+9MtY02S1aFg+Jw==",
1431014310 "requires": {
1431114311 "decode-uri-component": "^0.2.0",
@@ -14395,7 +14395,7 @@
1439514395 "dependencies": {
1439614396 "minimist": {
1439714397 "version": "1.2.0",
14398− "resolved": "http://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz",
14398+ "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz",
1439914399 "integrity": "sha1-o1AIsg9BOD7sH7kU9M1d95omQoQ=",
1440014400 "dev": true
1440114401 }
@@ -14801,7 +14801,7 @@
1480114801 },
1480214802 "readable-stream": {
1480314803 "version": "2.3.6",
14804− "resolved": "http://registry.npmjs.org/readable-stream/-/readable-stream-2.3.6.tgz",
14804+ "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.6.tgz",
1480514805 "integrity": "sha512-tQtKA9WIAhBF3+VLAseyMqZeBjW0AHJoxOtYqSUZNJxauErmLbVm2FW1y+J/YA9dUrAC39ITejlZWhVIwawkKw==",
1480614806 "requires": {
1480714807 "core-util-is": "~1.0.0",
@@ -14957,7 +14957,7 @@
1495714957 "dependencies": {
1495814958 "jsesc": {
1495914959 "version": "0.5.0",
14960− "resolved": "http://registry.npmjs.org/jsesc/-/jsesc-0.5.0.tgz",
14960+ "resolved": "https://registry.npmjs.org/jsesc/-/jsesc-0.5.0.tgz",
1496114961 "integrity": "sha1-597mbjXW/Bb3EP6R1c9p9w8IkR0="
1496214962 }
1496314963 }
@@ -15010,7 +15010,7 @@
1501015010 "dependencies": {
1501115011 "css-select": {
1501215012 "version": "1.2.0",
15013− "resolved": "http://registry.npmjs.org/css-select/-/css-select-1.2.0.tgz",
15013+ "resolved": "https://registry.npmjs.org/css-select/-/css-select-1.2.0.tgz",
1501415014 "integrity": "sha1-KzoRBTnFNV8c2NMUYj6HCxIeyFg=",
1501515015 "requires": {
1501615016 "boolbase": "~1.0.0",
@@ -15247,7 +15247,7 @@
1524715247 },
1524815248 "rgba-regex": {
1524915249 "version": "1.0.0",
15250− "resolved": "http://registry.npmjs.org/rgba-regex/-/rgba-regex-1.0.0.tgz",
15250+ "resolved": "https://registry.npmjs.org/rgba-regex/-/rgba-regex-1.0.0.tgz",
1525115251 "integrity": "sha1-QzdOLiyglosO8VI0YLfXMP8i7rM="
1525215252 },
1525315253 "rimraf": {
@@ -15333,7 +15333,7 @@
1533315333 },
1533415334 "safe-regex": {
1533515335 "version": "1.1.0",
15336− "resolved": "http://registry.npmjs.org/safe-regex/-/safe-regex-1.1.0.tgz",
15336+ "resolved": "https://registry.npmjs.org/safe-regex/-/safe-regex-1.1.0.tgz",
1533715337 "integrity": "sha1-QKNmnzsHfR6UPURinhV91IAjvy4=",
1533815338 "requires": {
1533915339 "ret": "~0.1.10"
@@ -15362,7 +15362,7 @@
1536215362 "dependencies": {
1536315363 "minimist": {
1536415364 "version": "1.2.0",
15365− "resolved": "http://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz",
15365+ "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz",
1536615366 "integrity": "sha1-o1AIsg9BOD7sH7kU9M1d95omQoQ="
1536715367 }
1536815368 }
@@ -15519,7 +15519,7 @@
1551915519 },
1552015520 "scrypt.js": {
1552115521 "version": "0.2.0",
15522− "resolved": "http://registry.npmjs.org/scrypt.js/-/scrypt.js-0.2.0.tgz",
15522+ "resolved": "https://registry.npmjs.org/scrypt.js/-/scrypt.js-0.2.0.tgz",
1552315523 "integrity": "sha1-r40UZbcemZARC+38WTuUeeA6ito=",
1552415524 "requires": {
1552515525 "scrypt": "^6.0.2",
@@ -15580,7 +15580,7 @@
1558015580 "dependencies": {
1558115581 "commander": {
1558215582 "version": "2.8.1",
15583− "resolved": "http://registry.npmjs.org/commander/-/commander-2.8.1.tgz",
15583+ "resolved": "https://registry.npmjs.org/commander/-/commander-2.8.1.tgz",
1558415584 "integrity": "sha1-Br42f+v9oMMwqh4qBy09yXYkJdQ=",
1558515585 "requires": {
1558615586 "graceful-readlink": ">= 1.0.0"
@@ -15892,7 +15892,7 @@
1589215892 },
1589315893 "sha.js": {
1589415894 "version": "2.4.11",
15895− "resolved": "http://registry.npmjs.org/sha.js/-/sha.js-2.4.11.tgz",
15895+ "resolved": "https://registry.npmjs.org/sha.js/-/sha.js-2.4.11.tgz",
1589615896 "integrity": "sha512-QMEp5B7cftE7APOjk5Y6xgrbWu+WkLVQwk8JNjZ8nKRciZaByEW6MubieAiToS7+dwvrjGhH8jRXz3MVd0AYqQ==",
1589715897 "requires": {
1589815898 "inherits": "^2.0.1",
@@ -15927,7 +15927,7 @@
1592715927 "dependencies": {
1592815928 "kind-of": {
1592915929 "version": "2.0.1",
15930− "resolved": "http://registry.npmjs.org/kind-of/-/kind-of-2.0.1.tgz",
15930+ "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-2.0.1.tgz",
1593115931 "integrity": "sha1-AY7HpM5+OobLkUG+UZ0kyPqpgbU=",
1593215932 "requires": {
1593315933 "is-buffer": "^1.0.2"
@@ -16545,7 +16545,7 @@
1654516545 },
1654616546 "sprintf-js": {
1654716547 "version": "1.0.3",
16548− "resolved": "http://registry.npmjs.org/sprintf-js/-/sprintf-js-1.0.3.tgz",
16548+ "resolved": "https://registry.npmjs.org/sprintf-js/-/sprintf-js-1.0.3.tgz",
1654916549 "integrity": "sha1-BOaSb2YolTVPPdAVIDYzuFcpfiw="
1655016550 },
1655116551 "sshpk": {
@@ -16696,7 +16696,7 @@
1669616696 },
1669716697 "string-width": {
1669816698 "version": "1.0.2",
16699− "resolved": "http://registry.npmjs.org/string-width/-/string-width-1.0.2.tgz",
16699+ "resolved": "https://registry.npmjs.org/string-width/-/string-width-1.0.2.tgz",
1670016700 "integrity": "sha1-EYvfW4zcUaKn5w0hHgfisLmxB9M=",
1670116701 "requires": {
1670216702 "code-point-at": "^1.0.0",
@@ -16745,7 +16745,7 @@
1674516745 },
1674616746 "string_decoder": {
1674716747 "version": "1.1.1",
16748− "resolved": "http://registry.npmjs.org/string_decoder/-/string_decoder-1.1.1.tgz",
16748+ "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.1.1.tgz",
1674916749 "integrity": "sha512-n/ShnvDi6FHbbVfviro+WojiFzv+s8MPMHBczVePfUpDJLwoLT0ht1l4YwBCbi8pJAveEEdnkHyPyTP/mzRfwg==",
1675016750 "requires": {
1675116751 "safe-buffer": "~5.1.0"
@@ -16763,7 +16763,7 @@
1676316763 },
1676416764 "strip-ansi": {
1676516765 "version": "3.0.1",
16766− "resolved": "http://registry.npmjs.org/strip-ansi/-/strip-ansi-3.0.1.tgz",
16766+ "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-3.0.1.tgz",
1676716767 "integrity": "sha1-ajhfuIU9lS1f8F0Oiq+UJ43GPc8=",
1676816768 "requires": {
1676916769 "ansi-regex": "^2.0.0"
@@ -16796,7 +16796,7 @@
1679616796 },
1679716797 "strip-eof": {
1679816798 "version": "1.0.0",
16799− "resolved": "http://registry.npmjs.org/strip-eof/-/strip-eof-1.0.0.tgz",
16799+ "resolved": "https://registry.npmjs.org/strip-eof/-/strip-eof-1.0.0.tgz",
1680016800 "integrity": "sha1-u0P/VZim6wXYm1n80SnJgzE2Br8="
1680116801 },
1680216802 "strip-hex-prefix": {
@@ -17323,7 +17323,7 @@
1732317323 },
1732417324 "through": {
1732517325 "version": "2.3.8",
17326− "resolved": "http://registry.npmjs.org/through/-/through-2.3.8.tgz",
17326+ "resolved": "https://registry.npmjs.org/through/-/through-2.3.8.tgz",
1732717327 "integrity": "sha1-DdTJ/6q8NXlgsbckEV1+Doai4fU="
1732817328 },
1732917329 "through2": {
@@ -17554,7 +17554,7 @@
1755417554 },
1755517555 "tty-browserify": {
1755617556 "version": "0.0.0",
17557− "resolved": "http://registry.npmjs.org/tty-browserify/-/tty-browserify-0.0.0.tgz",
17557+ "resolved": "https://registry.npmjs.org/tty-browserify/-/tty-browserify-0.0.0.tgz",
1755817558 "integrity": "sha1-oVe6QC2iTpv5V/mqadUk7tQpAaY="
1755917559 },
1756017560 "tunnel-agent": {
@@ -17969,7 +17969,7 @@
1796917969 },
1797017970 "utf8": {
1797117971 "version": "2.1.1",
17972− "resolved": "http://registry.npmjs.org/utf8/-/utf8-2.1.1.tgz",
17972+ "resolved": "https://registry.npmjs.org/utf8/-/utf8-2.1.1.tgz",
1797317973 "integrity": "sha1-LgHbAvfY0JRPdxBPFgnrDDBM92g="
1797417974 },
1797517975 "util": {
@@ -19431,7 +19431,7 @@
1943119431 },
1943219432 "wrap-ansi": {
1943319433 "version": "2.1.0",
19434− "resolved": "http://registry.npmjs.org/wrap-ansi/-/wrap-ansi-2.1.0.tgz",
19434+ "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-2.1.0.tgz",
1943519435 "integrity": "sha1-2Pw9KE3QV5T+hJc8rs3Rz4JP3YU=",
1943619436 "requires": {
1943719437 "string-width": "^1.0.1",
@@ -19599,7 +19599,7 @@
1959919599 },
1960019600 "yargs": {
1960119601 "version": "4.8.1",
19602− "resolved": "http://registry.npmjs.org/yargs/-/yargs-4.8.1.tgz",
19602+ "resolved": "https://registry.npmjs.org/yargs/-/yargs-4.8.1.tgz",
1960319603 "integrity": "sha1-wMQpJMpKqmsObaFznfshZDn53cA=",
1960419604 "requires": {
1960519605 "cliui": "^3.2.0",
@@ -19620,7 +19620,7 @@
1962019620 },
1962119621 "yargs-parser": {
1962219622 "version": "2.4.1",
19623− "resolved": "http://registry.npmjs.org/yargs-parser/-/yargs-parser-2.4.1.tgz",
19623+ "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-2.4.1.tgz",
1962419624 "integrity": "sha1-hVaN488VD/SfpRgl8DqMiA3cxcQ=",
1962519625 "requires": {
1962619626 "camelcase": "^3.0.0",
public/spritesheet_a.pngnew file

Binary file not shown.

src/components/Passport.js+279−136
@@ -1,36 +1,57 @@
1−import React, { useMemo } from 'react';
2−import cn from 'classnames';
1+import React from 'react';
32import { Just, Nothing } from 'folktale/maybe';
43import ob from 'urbit-ob';
5−import { Grid, Flex, Text } from 'indigo-react';
6−import { times } from 'lodash';
4+import BN from 'bn.js';
5+import 'style/anim.css';
76
87import * as need from 'lib/need';
9−import usePointBirthday from 'lib/usePointBirthday';
10−
11−import Blinky, {
12− LOADING_CHARACTER,
13− INTERSTITIAL_CHARACTER,
14− matchBlinkyDate,
15−} from './Blinky';
16−import Sigil from './Sigil';
17−import MaybeSigil from './MaybeSigil';
8+import { chunkStr, Matrix, walk, rand } from 'lib/card';
189import usePermissionsForPoint from 'lib/usePermissionsForPoint';
19−import { useWallet } from 'store/wallet';
2010import { useSyncOwnedPoints } from 'lib/useSyncPoints';
2111
22−const TICKET_CHAR_LENGTH = 30;
23−const TICKET = times(TICKET_CHAR_LENGTH, i =>
24− i % 2 === 0 ? LOADING_CHARACTER : INTERSTITIAL_CHARACTER
25−).join('');
26−const PENDING_TICKET = TICKET;
27−const VALID_TICKET = `${TICKET} ◆`;
12+import { useWallet } from 'store/wallet';
13+
14+import Sigil from './Sigil';
15+import { sigil, reactRenderer } from 'urbit-sigil-js';
2816
29−const VISIBLE_ADDRESS_CHAR_COUNT = 20;
30−const EMPTY_ADDRESS = times(VISIBLE_ADDRESS_CHAR_COUNT, () => '<').join('');
31−const ADDRESS_BUFFER_CHARS = times(40, () => '<').join('');
17+function makeSigil(size, patp, colors) {
18+ const config = {
19+ patp: patp,
20+ colors: colors,
21+ margin: 0,
22+ renderer: reactRenderer,
23+ };
3224
33−const INVERTED_COLORWAY = ['#fff', '#000'];
25+ console.log(patp);
26+
27+ // Planet
28+ if (patp.length === 14) {
29+ return sigil({
30+ patp: patp,
31+ size: size,
32+ ...config,
33+ });
34+ }
35+ // Star
36+ if (patp.length === 7) {
37+ return sigil({
38+ patp: patp,
39+ width: size * 2,
40+ height: size,
41+ full: true,
42+ ...config,
43+ });
44+ }
45+ // Galaxy
46+ if (patp.length === 4) {
47+ return sigil({
48+ patp: patp,
49+ size: size,
50+ full: true,
51+ ...config,
52+ });
53+ }
54+}
3455
3556const buildKeyType = permissions => {
3657 if (permissions.isOwner) {
@@ -46,139 +67,261 @@ const buildKeyType = permissions => {
4667 }
4768};
4869
70+const symbols = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13];
71+
4972/**
50− * point is Maybe<number>
51− * ticket is null | boolean
52− * address is null | Maybe<string>
73+ * Address is Maybe<string>
74+ * point is Maybe<string>
75+ * animationMode is 'slide' | 'step' | 'none'
76+ *
5377 */
5478function Passport({
79+ address,
5580 point,
56− className,
57− ticket = null,
58− address = Nothing(),
59− onClick,
81+ inverted,
82+ animationMode = 'none',
83+ keyType,
6084}) {
61− const birthday = usePointBirthday(point.getOrElse(null));
62− const visualBirthday = matchBlinkyDate(birthday);
85+ const [cols, rows, tile] = [35, 12, 12];
6386
64− const name = point.matchWith({
65− Nothing: () => Nothing(),
66− Just: p => Just(ob.patp(p.value)),
67− });
68− const visualName = name.matchWith({
69− Nothing: () => '...',
70− Just: p => p.value,
87+ const loading = Nothing.hasInstance(address) || Nothing.hasInstance(point);
88+ const defaultMatrix = () => {
89+ return Matrix.new(rows, cols);
90+ };
91+
92+ const patp = ob.patp(point.value);
93+
94+ const makeMatrix = addr => {
95+ // remove the 0x
96+ const onlyTheNumberPart = addr.substring(2);
97+ // make bigNum from hex
98+ const int = new BN(onlyTheNumberPart, 16);
99+ // make a bigger number
100+ const big = int.pow(new BN(10));
101+ // parse that to a string and pad
102+ const b10 = big.toString(10).padStart(32, '0');
103+ // split the big number into parts
104+ const chunkSize = Math.ceil(b10.length / 8);
105+ const chunks = chunkStr(b10, chunkSize).map(c => new BN(c));
106+ // generate an empty matrix
107+ const startMatrix = Matrix.new(rows, cols);
108+ // do a few random walks starting at diff coordinates
109+ const [, matrix] = chunks.reduce((acc, chunk) => {
110+ return walk(chunk, acc[1]);
111+ // start with the 'random' points (not actually random, they are deterministic)
112+ }, rand(big, startMatrix));
113+
114+ return matrix;
115+ };
116+
117+ const matrix = address.matchWith({
118+ Just: ({ value }) => makeMatrix(value),
119+ Nothing: defaultMatrix,
71120 });
72121
73− const showTicket = ticket !== null;
74− const isValidTicket = !!ticket;
75− const visibleTicket = isValidTicket ? VALID_TICKET : PENDING_TICKET;
76− const visibleAddress = `${address.matchWith({
77− Nothing: () => EMPTY_ADDRESS,
78− Just: p => p.value.slice(0, VISIBLE_ADDRESS_CHAR_COUNT),
79− })}${ADDRESS_BUFFER_CHARS}`;
122+ const bgColor = inverted ? 'white' : 'black';
123+
124+ const fgColor = inverted ? 'black' : 'white';
80125
81126 return (
82− <Grid onClick={onClick} gap={4} className={cn('bg-black r8 p7', className)}>
83− <Grid.Item cols={[1, 4]}>
84− <MaybeSigil patp={name} size={64} />
85− </Grid.Item>
86− <Grid.Item as={Flex} cols={[4, 13]} col justify="between">
87− <Flex.Item className="mono white f5 pb2">{visualName}</Flex.Item>
88− <Flex.Item as={Flex} col>
89− <Flex.Item as={Text} className="mono f6 f5-ns gray4 uppercase">
90− Birth Time
91− </Flex.Item>
92− <Flex.Item as={Text} className="mono f6 f5-ns gray4 uppercase">
93− {visualBirthday}
94− </Flex.Item>
95− </Flex.Item>
96− </Grid.Item>
97− {showTicket && (
98− <Grid.Item full className="mv3" as={Flex} col>
99− <Flex.Item as={Text} className="mono f6 f5-ns gray4 uppercase">
100− Master Ticket
101− </Flex.Item>
102− <Flex.Item
103− as={Text}
104− className={cn('arial f6 f5-ns wrap', {
105− gray4: !isValidTicket,
106− green3: isValidTicket,
107− })}>
108− {visibleTicket}
109− </Flex.Item>
110− <Flex.Item as={Text} className="mono f6 f5-ns gray4 wrap">
111− {visibleAddress}
112− </Flex.Item>
113− </Grid.Item>
114− )}
115− </Grid>
127+ <div
128+ style={{
129+ fontFamily: 'Inter',
130+ backgroundColor: bgColor,
131+ border: inverted ? '2px solid #E6E6E6' : '2px solid black',
132+ borderRadius: '20px',
133+ marginBottom: '16px',
134+ width: `${16 + 16 + cols * tile}px`,
135+ minWidth: `${16 + 16 + cols * tile}px`,
136+ display: 'flex',
137+ flexDirection: 'column',
138+ }}>
139+ <div
140+ style={{
141+ height: '64px',
142+ padding: '16px',
143+ display: 'flex',
144+ }}>
145+ <div
146+ style={{
147+ width: '100%',
148+ display: 'flex',
149+ alignItems: 'center',
150+ }}>
151+ {Just.hasInstance(point) && makeSigil(64, patp, [bgColor, fgColor])}
152+ <div
153+ style={{
154+ marginLeft: '16px',
155+ }}>
156+ <div
157+ style={{
158+ fontWeight: '600',
159+ color: fgColor,
160+ fontSize: '16px',
161+ fontFamily: 'Source Code Pro',
162+ }}>
163+ {Just.hasInstance(point) && patp}
164+ </div>
165+ {keyType !== '' ? (
166+ <div
167+ style={{
168+ marginTop: '8px',
169+ fontWeight: '500',
170+ color: fgColor,
171+ fontSize: '14px',
172+ fontFamily: 'Source Code Pro',
173+ }}>
174+ {keyType}
175+ </div>
176+ ) : (
177+ <div />
178+ )}
179+ </div>
180+ </div>
181+ </div>
182+ <div
183+ style={{
184+ display: 'flex',
185+ flexDirection: 'column',
186+ padding: '16px',
187+ paddingTop: '0px',
188+ filter: inverted ? 'invert(1)' : '',
189+ }}>
190+ {matrix.map((row, _row) => {
191+ return (
192+ <div
193+ key={`card:row:${_row}`}
194+ style={{ display: 'flex', justifyContent: 'space-between' }}>
195+ {row.map((v, _col) => {
196+ return (
197+ <Cell
198+ row={_row}
199+ col={_col}
200+ value={typeof symbols[v] === 'undefined' ? 13 : v}
201+ spriteSheet={'a'}
202+ spriteSheetHeight={12}
203+ spriteSheetWidth={168}
204+ inverted={inverted}
205+ loading={loading}
206+ animationMode={animationMode}
207+ />
208+ );
209+ })}
210+ </div>
211+ );
212+ })}
213+ </div>
214+ </div>
116215 );
117216}
118217
119−// TODO: Passport.Mini should probably accept Maybe<> for point
120−// in order to display a pretty skeleton loading view
121−// but that requires making usePermissionsForPoint accept a Maybe<point>
122−// and I don't feel like that refactor is worth it right now, and the spec
123−// doesn't call for it, hence the TODO
124−Passport.Mini = function MiniPassport({ point, className, inverted, ...rest }) {
125− useSyncOwnedPoints([point]);
218+const Cell = props => {
219+ return (
220+ <div
221+ key={`card:cell:${props.row}:${props.col}:${props.value}`}
222+ className={
223+ props.loading
224+ ? 'blink'
225+ : props.animationMode === 'none'
226+ ? ''
227+ : `${props.animationMode}-h-${props.value}`
228+ }
229+ style={{
230+ backgroundImage: `url(/spritesheet_a.png)`,
231+ backgroundPosition:
232+ props.animationMode === 'none'
233+ ? `-${props.spriteSheetHeight * props.value}px 0px`
234+ : '',
235+ backgroundSize: `${props.spriteSheetWidth}px ${props.spriteSheetHeight}px`,
236+ width: `${props.spriteSheetHeight}px`,
237+ maxWidth: `${props.spriteSheetHeight}px`,
238+ height: `${props.spriteSheetHeight}px`,
239+ maxHeight: `${props.spriteSheetHeight}px`,
240+ animationDelay: `${props.value * 50}ms`,
241+ }}
242+ />
243+ );
244+};
126245
246+/**
247+ * point is number
248+ *
249+ */
250+function MiniPassport({ point, inverted, ...rest }) {
251+ useSyncOwnedPoints([point]);
127252 const { wallet } = useWallet();
128253 const address = need.addressFromWallet(wallet);
129254
255+ const patp = ob.patp(point);
130256 const permissions = usePermissionsForPoint(address, point);
131257 const keyType = buildKeyType(permissions);
132− const name = useMemo(() => ob.patp(point), [point]);
133−
134258 return (
135− <Grid
136− gap={4}
137− className={cn(
138− 'r8 p4',
139− {
140− 'bg-black': !inverted,
141− 'bg-white b-gray4 b1': inverted,
142− },
143− className
144− )}
259+ <div
260+ style={{
261+ fontFamily: 'Inter',
262+ backgroundColor: inverted ? 'white' : 'black',
263+ border: inverted ? '2px solid #E6E6E6' : '2px solid black',
264+ borderRadius: '20px',
265+ marginBottom: '16px',
266+ maxWidth: `${230}px`,
267+ display: 'flex',
268+ flexDirection: 'column',
269+ }}
145270 {...rest}>
146− <Grid.Item cols={[1, 4]}>
147− <Sigil
148− patp={name}
149− size={64}
150− colors={inverted ? INVERTED_COLORWAY : undefined}
151− />
152− </Grid.Item>
153− <Grid.Item as={Flex} cols={[4, 13]} col justify="between">
154− <Flex.Item
155− className={cn('mono f6 pb2', {
156− white: !inverted,
157− black: inverted,
158− })}>
159− {name}
160− </Flex.Item>
161− <Flex.Item as={Flex} col className={cn('mono f6 uppercase')}>
162− <Flex.Item
163− as={Text}
164− className={cn({
165− gray4: !inverted,
166− black: inverted,
167− })}>
168− Key Type
169− </Flex.Item>
170− <Flex.Item
171− as={Text}
172− className={cn({
173− white: !inverted,
174− black: inverted,
175− })}>
176− {keyType || <Blinky />}
177− </Flex.Item>
178− </Flex.Item>
179− </Grid.Item>
180− </Grid>
271+ <div
272+ style={{
273+ height: '44px',
274+ padding: '16px',
275+ display: 'flex',
276+ }}>
277+ <div
278+ style={{
279+ width: '100%',
280+ display: 'flex',
281+ alignItems: 'center',
282+ }}>
283+ {makeSigil(
284+ 44,
285+ patp,
286+ inverted ? ['white', 'black'] : ['black', 'white']
287+ )}
288+ <div
289+ style={{
290+ marginLeft: '16px',
291+ display: 'flex',
292+ flexDirection: 'column',
293+ justifyContent: 'space-between',
294+ }}>
295+ <div
296+ style={{
297+ fontWeight: '600',
298+ color: inverted ? 'black' : 'white',
299+ fontSize: '14px',
300+ fontFamily: 'Source Code Pro',
301+ }}>
302+ {patp}
303+ </div>
304+ {keyType !== '' ? (
305+ <div
306+ style={{
307+ marginTop: '8px',
308+ fontWeight: '500',
309+ color: inverted ? 'black' : 'white',
310+ fontSize: '12px',
311+ fontFamily: 'Source Code Pro',
312+ }}>
313+ {keyType}
314+ </div>
315+ ) : (
316+ <div />
317+ )}
318+ </div>
319+ </div>
320+ </div>
321+ </div>
181322 );
182−};
323+}
324+
325+Passport.Mini = MiniPassport;
183326
184327export default Passport;
src/lib/card.jsnew file+190
@@ -0,0 +1,190 @@
1+const initCanvas = (canvas, size, ratio) => {
2+ const { x, y } = size;
3+ // let ctx = canvas.getContext('2d')
4+
5+ const dpi200 = window.devicePixelRatio * (200 / 72);
6+
7+ canvas.width = x * dpi200;
8+ canvas.height = y * dpi200;
9+ canvas.style.width = x + 'px';
10+ canvas.style.height = y + 'px';
11+
12+ canvas.getContext('2d').scale(dpi200, dpi200);
13+
14+ return canvas;
15+};
16+
17+const mapToRange = (v, l1, h1, l2, h2) =>
18+ l2 + ((h2 - l2) * (v - l1)) / (h1 - l1);
19+
20+const seq = num => Array.from(Array(num), (_, i) => i);
21+
22+const compose = (...fns) =>
23+ fns.reduce((f, g) => (...xs) => {
24+ const r = g(...xs);
25+ return Array.isArray(r) ? f(...r) : f(r);
26+ });
27+
28+const Matrix = {
29+ get: {
30+ at: (m, r, c) => m[r][c],
31+ nn: (m, r, c) => m[r - 1][c],
32+ ne: (m, r, c) => m[r - 1][c + 1],
33+ ee: (m, r, c) => m[r][c + 1],
34+ se: (m, r, c) => m[r + 1][c + 1],
35+ ss: (m, r, c) => m[r + 1][c],
36+ sw: (m, r, c) => m[r + 1][c - 1],
37+ ww: (m, r, c) => m[r][c - 1],
38+ nw: (m, r, c) => m[r - 1][c - 1],
39+ },
40+ set: {
41+ at: (m, r, c, v) => (m[r][c] = v),
42+ nn: (m, r, c, v) => (m[r - 1][c] = v),
43+ ne: (m, r, c, v) => (m[r - 1][c + 1] = v),
44+ ee: (m, r, c, v) => (m[r][c + 1] = v),
45+ se: (m, r, c, v) => (m[r + 1][c + 1] = v),
46+ ss: (m, r, c, v) => (m[r + 1][c] = v),
47+ sw: (m, r, c, v) => (m[r + 1][c - 1] = v),
48+ ww: (m, r, c, v) => (m[r][c - 1] = v),
49+ nw: (m, r, c, v) => (m[r - 1][c - 1] = v),
50+ },
51+ coord: {
52+ at: (r, c) => ({ r: r, c: c }),
53+ nn: (r, c) => ({ r: r - 1, c: c }),
54+ ne: (r, c) => ({ r: r - 1, c: c + 1 }),
55+ ee: (r, c) => ({ r: r, c: c + 1 }),
56+ se: (r, c) => ({ r: r + 1, c: c + 1 }),
57+ ss: (r, c) => ({ r: r + 1, c: c }),
58+ sw: (r, c) => ({ r: r + 1, c: c - 1 }),
59+ ww: (r, c) => ({ r: r, c: c - 1 }),
60+ nw: (r, c) => ({ r: r - 1, c: c - 1 }),
61+ },
62+ dirs: {
63+ NN: 'nn',
64+ NE: 'ne',
65+ EE: 'ee',
66+ SE: 'se',
67+ SS: 'ss',
68+ SW: 'sw',
69+ WW: 'ww',
70+ NW: 'nw',
71+ },
72+ new: (rs, cs) => seq(rs).map(_ => seq(cs).map(_ => 0)),
73+ rows: m => m.length - 1,
74+ cols: m => m[0].length - 1,
75+};
76+
77+const chunkStr = (str, size) => {
78+ const r = new RegExp(`.{1,${size}}`, 'g');
79+ return str.match(r);
80+};
81+
82+const Base3Mapping = [
83+ Matrix.dirs.NN,
84+ Matrix.dirs.NE,
85+ Matrix.dirs.EE,
86+ Matrix.dirs.SE,
87+ Matrix.dirs.SS,
88+ Matrix.dirs.SW,
89+ Matrix.dirs.WW,
90+ Matrix.dirs.NW,
91+];
92+
93+const walk = (int, matrix) => {
94+ // convert the int to a base8 string, split to array
95+ var chunks = int.toString(8).split('');
96+
97+ // convert the int to a base10 string
98+ var b10 = int.toString(10);
99+
100+ // get number of rows and cols
101+ var rows = Matrix.rows(matrix);
102+ var cols = Matrix.cols(matrix);
103+
104+ // split the length-4 number into 2 parts, which is a number from 0-99
105+ // if the substring is empty, substitute 10
106+ var sx = parseInt(b10.substring(0, 2) || 0, 10);
107+ var sy = parseInt(b10.substring(2, 4) || 0, 10);
108+
109+ // generate a starting coordinate
110+ var coord = {
111+ c: ~~mapToRange(sx, 0, 99, 0, cols),
112+ r: ~~mapToRange(sy, 0, 99, 0, rows),
113+ };
114+
115+ var vect;
116+ var next;
117+
118+ for (var i = 0; i < chunks.length; i++) {
119+ // Each chunk is a number from 0-7 which refers to a direction assigned in Base3Mapping.
120+ // Get the current chunk, and then get the direction it has been paired with.
121+ vect = Base3Mapping[chunks[i]];
122+
123+ // generate the next coordinate to go to, based on the current coordinate and the direction stored in vect.
124+ next = Matrix.coord[vect](coord.r, coord.c);
125+
126+ // If at an edge of the matrix, substitute the opposite direction.
127+ if (next.r < 0) vect = Matrix.dirs.SS;
128+ if (next.c < 0) vect = Matrix.dirs.EE;
129+ if (next.r > rows) vect = Matrix.dirs.NN;
130+ if (next.c > cols) vect = Matrix.dirs.WW;
131+
132+ // If at in the corner of the matrix, substitute an alternative direction.
133+ if (next.r === 0 && coord.c === 0) vect = Matrix.dirs.SE;
134+ if (next.r > rows && coord.c === 0) vect = Matrix.dirs.NE;
135+ if (next.r === 0 && coord.c > cols) vect = Matrix.dirs.SW;
136+ if (next.r > rows && coord.c > cols) vect = Matrix.dirs.NW;
137+
138+ // get the next coordinate again in case there was an edge/cornercase
139+ next = Matrix.coord[vect](coord.r, coord.c);
140+
141+ // increment the value at the next coordinate.
142+ Matrix.set.at(
143+ matrix,
144+ next.r,
145+ next.c,
146+ Matrix.get.at(matrix, next.r, next.c) + 1
147+ );
148+
149+ // set the new current coordinate.
150+ coord = next;
151+ }
152+
153+ // return a 2-ary array in order to pass both values to the next function in the compose pipeline.
154+ return [int, matrix];
155+};
156+
157+const rand = (int, matrix) => {
158+ // break base10 integer into chunks with length of 4
159+ var chunks = chunkStr(int.toString(10), 4);
160+ var cols = Matrix.cols(matrix);
161+ var rows = Matrix.rows(matrix);
162+ var ch;
163+ var x;
164+ var y;
165+ var c;
166+ var r;
167+
168+ for (var i = 0; i < chunks.length; i++) {
169+ // for each chunk in chunks
170+ ch = chunks[i];
171+
172+ // split the length-4 number into 2 parts, which is a number from 0-99
173+ // if the substring is empty, substitute 10
174+ x = parseInt(ch.substring(0, 2) || 0, 10);
175+ y = parseInt(ch.substring(2, 4) || 0, 10);
176+
177+ // map num from 0-99 to 0 - num of cols, then use ~~ for fast math.floor
178+ // c (col) and r (row) are coordinates
179+ c = ~~mapToRange(x, 0, 99, 0, cols);
180+ r = ~~mapToRange(y, 0, 99, 0, rows);
181+
182+ // increment number at the coordinate
183+ Matrix.set.at(matrix, r, c, Matrix.get.at(matrix, r, c) + 1);
184+ }
185+
186+ // return a 2-ary array in order to pass both values to the next function in the compose pipeline.
187+ return [int, matrix];
188+};
189+
190+export { chunkStr, initCanvas, seq, Matrix, compose, mapToRange, walk, rand };
src/style/anim.cssnew file+460
@@ -0,0 +1,460 @@
1+/* @for $i from 0 through 13 {
2+ .anim-s#{$i} {
3+ animation: s#{$i} #{$i*50}ms steps(#{$i}, end) forwards;
4+}
5+} */
6+.step-h-0 {
7+ animation: frame-h-0 0ms steps(0, end) forwards;
8+}
9+
10+.step-h-1 {
11+ animation: frame-h-1 50ms steps(1, end) forwards;
12+}
13+
14+.step-h-2 {
15+ animation: frame-h-2 100ms steps(2, end) forwards;
16+}
17+
18+.step-h-3 {
19+ animation: frame-h-3 150ms steps(3, end) forwards;
20+}
21+
22+.step-h-4 {
23+ animation: frame-h-4 200ms steps(4, end) forwards;
24+}
25+
26+.step-h-5 {
27+ animation: frame-h-5 250ms steps(5, end) forwards;
28+}
29+
30+.step-h-6 {
31+ animation: frame-h-6 300ms steps(6, end) forwards;
32+}
33+
34+.step-h-7 {
35+ animation: frame-h-7 350ms steps(7, end) forwards;
36+}
37+
38+.step-h-8 {
39+ animation: frame-h-8 400ms steps(8, end) forwards;
40+}
41+
42+.step-h-9 {
43+ animation: frame-h-9 450ms steps(9, end) forwards;
44+}
45+
46+.step-h-10 {
47+ animation: frame-h-10 500ms steps(10, end) forwards;
48+}
49+
50+.step-h-11 {
51+ animation: frame-h-11 550ms steps(11, end) forwards;
52+}
53+
54+.step-h-12 {
55+ animation: frame-h-12 600ms steps(12, end) forwards;
56+}
57+
58+.step-h-13 {
59+ animation: frame-h-13 650ms steps(13, end) forwards;
60+}
61+
62+.step-h-14 {
63+ animation: frame-h-14 700ms steps(14, end) forwards;
64+}
65+
66+.step-v-0 {
67+ animation: frame-v-0 0ms steps(0, end) forwards;
68+}
69+
70+.step-v-1 {
71+ animation: frame-v-1 50ms steps(1, end) forwards;
72+}
73+
74+.step-v-2 {
75+ animation: frame-v-2 100ms steps(2, end) forwards;
76+}
77+
78+.step-v-3 {
79+ animation: frame-v-3 150ms steps(3, end) forwards;
80+}
81+
82+.step-v-4 {
83+ animation: frame-v-4 200ms steps(4, end) forwards;
84+}
85+
86+.step-v-5 {
87+ animation: frame-v-5 250ms steps(5, end) forwards;
88+}
89+
90+.step-v-6 {
91+ animation: frame-v-6 300ms steps(6, end) forwards;
92+}
93+
94+.step-v-7 {
95+ animation: frame-v-7 350ms steps(7, end) forwards;
96+}
97+
98+.step-v-8 {
99+ animation: frame-v-8 400ms steps(8, end) forwards;
100+}
101+
102+.step-v-9 {
103+ animation: frame-v-9 450ms steps(9, end) forwards;
104+}
105+
106+.step-v-10 {
107+ animation: frame-v-10 500ms steps(10, end) forwards;
108+}
109+
110+.step-v-11 {
111+ animation: frame-v-11 550ms steps(11, end) forwards;
112+}
113+
114+.step-v-12 {
115+ animation: frame-v-12 600ms steps(12, end) forwards;
116+}
117+
118+.step-v-13 {
119+ animation: frame-v-13 650ms steps(13, end) forwards;
120+}
121+
122+.step-v-14 {
123+ animation: frame-v-14 700ms steps(14, end) forwards;
124+}
125+
126+.slide-h-0 {
127+ animation: frame-h-0 0ms forwards;
128+}
129+
130+.slide-h-1 {
131+ animation: frame-h-1 100ms forwards;
132+}
133+
134+.slide-h-2 {
135+ animation: frame-h-2 200ms forwards;
136+}
137+
138+.slide-h-3 {
139+ animation: frame-h-3 300ms forwards;
140+}
141+
142+.slide-h-4 {
143+ animation: frame-h-4 400ms forwards;
144+}
145+
146+.slide-h-5 {
147+ animation: frame-h-5 500ms forwards;
148+}
149+
150+.slide-h-6 {
151+ animation: frame-h-6 600ms forwards;
152+}
153+
154+.slide-h-7 {
155+ animation: frame-h-7 700ms forwards;
156+}
157+
158+.slide-h-8 {
159+ animation: frame-h-8 800ms forwards;
160+}
161+
162+.slide-h-9 {
163+ animation: frame-h-9 900ms forwards;
164+}
165+
166+.slide-h-10 {
167+ animation: frame-h-10 1000ms forwards;
168+}
169+
170+.slide-h-11 {
171+ animation: frame-h-11 1100ms forwards;
172+}
173+
174+.slide-h-12 {
175+ animation: frame-h-12 1200ms forwards;
176+}
177+
178+.slide-h-13 {
179+ animation: frame-h-13 1300ms forwards;
180+}
181+
182+.slide-h-14 {
183+ animation: frame-h-14 1400ms forwards;
184+}
185+
186+.slide-v-0 {
187+ animation: frame-v-0 0ms forwards;
188+}
189+
190+.slide-v-1 {
191+ animation: frame-v-1 200ms forwards;
192+}
193+
194+.slide-v-2 {
195+ animation: frame-v-2 400ms forwards;
196+}
197+
198+.slide-v-3 {
199+ animation: frame-v-3 600ms forwards;
200+}
201+
202+.slide-v-4 {
203+ animation: frame-v-4 800ms forwards;
204+}
205+
206+.slide-v-5 {
207+ animation: frame-v-5 1000ms forwards;
208+}
209+
210+.slide-v-6 {
211+ animation: frame-v-6 1200ms forwards;
212+}
213+
214+.slide-v-7 {
215+ animation: frame-v-7 1400ms forwards;
216+}
217+
218+.slide-v-8 {
219+ animation: frame-v-8 1600ms forwards;
220+}
221+
222+.slide-v-9 {
223+ animation: frame-v-9 1800ms forwards;
224+}
225+
226+.slide-v-10 {
227+ animation: frame-v-10 2000ms forwards;
228+}
229+
230+.slide-v-11 {
231+ animation: frame-v-11 2200ms forwards;
232+}
233+
234+.slide-v-12 {
235+ animation: frame-v-12 2400ms forwards;
236+}
237+
238+.slide-v-13 {
239+ animation: frame-v-13 2600ms forwards;
240+}
241+
242+.slide-v-14 {
243+ animation: frame-v-14 2800ms forwards;
244+}
245+
246+@keyframes s0 {
247+ to {
248+ background-position: 0px 0px;
249+ }
250+}
251+@keyframes frame-h-0 {
252+ to {
253+ background-position: -0px 0px;
254+ }
255+}
256+@keyframes frame-h-1 {
257+ to {
258+ background-position: -12px 0px;
259+ }
260+}
261+@keyframes frame-h-2 {
262+ to {
263+ background-position: -24px 0px;
264+ }
265+}
266+@keyframes frame-h-3 {
267+ to {
268+ background-position: -36px 0px;
269+ }
270+}
271+@keyframes frame-h-4 {
272+ to {
273+ background-position: -48px 0px;
274+ }
275+}
276+@keyframes frame-h-5 {
277+ to {
278+ background-position: -60px 0px;
279+ }
280+}
281+@keyframes frame-h-6 {
282+ to {
283+ background-position: -72px 0px;
284+ }
285+}
286+@keyframes frame-h-7 {
287+ to {
288+ background-position: -84px 0px;
289+ }
290+}
291+@keyframes frame-h-8 {
292+ to {
293+ background-position: -96px 0px;
294+ }
295+}
296+@keyframes frame-h-9 {
297+ to {
298+ background-position: -108px 0px;
299+ }
300+}
301+@keyframes frame-h-10 {
302+ to {
303+ background-position: -120px 0px;
304+ }
305+}
306+@keyframes frame-h-11 {
307+ to {
308+ background-position: -132px 0px;
309+ }
310+}
311+@keyframes frame-h-12 {
312+ to {
313+ background-position: -144px 0px;
314+ }
315+}
316+@keyframes frame-h-13 {
317+ to {
318+ background-position: -156px 0px;
319+ }
320+}
321+@keyframes frame-h-14 {
322+ to {
323+ background-position: -168px 0px;
324+ }
325+}
326+@keyframes frame-v-14 {
327+ to {
328+ background-position: 0px 0px;
329+ }
330+}
331+@keyframes frame-v-13 {
332+ to {
333+ background-position: 0px 12px;
334+ }
335+}
336+@keyframes frame-v-12 {
337+ to {
338+ background-position: 0px 24px;
339+ }
340+}
341+@keyframes frame-v-11 {
342+ to {
343+ background-position: 0px 36px;
344+ }
345+}
346+@keyframes frame-v-10 {
347+ to {
348+ background-position: 0px 48px;
349+ }
350+}
351+@keyframes frame-v-9 {
352+ to {
353+ background-position: 0px 60px;
354+ }
355+}
356+@keyframes frame-v-8 {
357+ to {
358+ background-position: 0px 72px;
359+ }
360+}
361+@keyframes frame-v-7 {
362+ to {
363+ background-position: 0px 84px;
364+ }
365+}
366+@keyframes frame-v-6 {
367+ to {
368+ background-position: 0px 96px;
369+ }
370+}
371+@keyframes frame-v-5 {
372+ to {
373+ background-position: 0px 108px;
374+ }
375+}
376+@keyframes frame-v-4 {
377+ to {
378+ background-position: 0px 120px;
379+ }
380+}
381+@keyframes frame-v-3 {
382+ to {
383+ background-position: 0px 132px;
384+ }
385+}
386+@keyframes frame-v-2 {
387+ to {
388+ background-position: 0px 144px;
389+ }
390+}
391+@keyframes frame-v-1 {
392+ to {
393+ background-position: 0px 156px;
394+ }
395+}
396+@keyframes frame-v-0 {
397+ to {
398+ background-position: 0px 168px;
399+ }
400+}
401+
402+.blink {
403+ animation: s0 1s steps(2, forwards) infinite;
404+ -webkit-animation: s0 1s steps(2, forwards) infinite;
405+}
406+
407+/* @keyframes blink-animation {
408+ to {
409+ visibility: hidden;
410+ }
411+}
412+@-webkit-keyframes blink-animation {
413+ to {
414+ visibility: hidden;
415+ }
416+} */
417+
418+
419+
420+button {
421+ border: 1px solid #A6A6A6;
422+ padding: 5px 5px;
423+ margin-bottom: 2px;
424+ border-radius: 7px;
425+ font-family: Inter;
426+ outline: none;
427+}
428+
429+button:hover {
430+ cursor: pointer;
431+ /* border: 2px solid #E6E6E6;
432+ background-color: #E6E6E6; */
433+}
434+
435+/*
436+button:active {
437+ background-color: #4330FC;
438+ border: 1px solid #4330FC;
439+ color: white;
440+} */
441+
442+button:active {
443+ background-color: #000;
444+ border: 1px solid #000;
445+ color: white;
446+}
447+
448+button:disabled{
449+ cursor: default;
450+ pointer-events: none;
451+}
452+
453+p {
454+ font-size: 12px;
455+}
456+
457+*{
458+ -moz-osx-font-smoothing: grayscale;
459+ font-smoothing: grayscale;
460+}
src/style/indigo-proposals.scss+1−1
@@ -1,6 +1,6 @@
11.mw1 {
22 margin: 0 auto;
3− max-width: calc(32rem + 48px * 2);
3+ max-width: calc(28rem + 52px * 2);
44 // TODO: this css is gross, fix
55}
66
src/views/Activate/ActivateCode.js+7−2
@@ -1,5 +1,5 @@
11import React, { useCallback, useMemo, useRef } from 'react';
2−import { Just } from 'folktale/maybe';
2+import { Just, Nothing } from 'folktale/maybe';
33import * as azimuth from 'azimuth-js';
44import { Grid, H4, P, CheckboxInput } from 'indigo-react';
55import { FORM_ERROR } from 'final-form';
@@ -146,7 +146,12 @@ export default function ActivateCode() {
146146 return (
147147 <View inset>
148148 <Grid>
149− <Grid.Item full as={Passport} point={derivedPoint} />
149+ <Grid.Item
150+ full
151+ as={Passport}
152+ point={derivedPoint}
153+ address={Nothing()}
154+ />
150155 <Grid.Item full as={H4} className="mt3">
151156 Activate
152157 </Grid.Item>
src/views/Activate/ActivatePassport.js+5−6
@@ -1,6 +1,6 @@
11import React, { useMemo } from 'react';
22import cn from 'classnames';
3−import { Grid } from 'indigo-react';
3+import { Grid, Flex } from 'indigo-react';
44
55import { LocalRouterProvider, useLocalRouter } from 'lib/LocalRouter';
66
@@ -62,12 +62,12 @@ export default function ActivatePassport() {
6262 .map(wallet => addressFromSecp256k1Public(wallet.publicKey)),
6363 [derivedWallet]
6464 );
65−
65+ //~hobbyn-mismur-fonrux-datber
6666 return (
67− <View full={fullView}>
67+ <View inset>
6868 <LocalRouterProvider value={router}>
6969 <Grid gap={gap} className="mt8 mb10">
70− <Grid.Item half={half && 1} full={full}>
70+ <Grid.Item full>
7171 <Passport
7272 className={cn({ [`mt${marginTop}`]: marginTop })}
7373 point={derivedPoint}
@@ -76,8 +76,7 @@ export default function ActivatePassport() {
7676 />
7777 </Grid.Item>
7878 <Grid.Item
79− half={half && 2}
80− full={full}
79+ full
8180 as={Route}
8281 resetActivateRouter={resetActivateRouter}
8382 />
src/views/Invite/InviteEmail.js+1−10
@@ -378,16 +378,7 @@ export default function InviteEmail() {
378378 if (errorString !== '') {
379379 throw new Error(errorString);
380380 }
381− }, [
382− web3,
383− wallet,
384− point,
385− gasPrice,
386− invites,
387− clearReceipts,
388− addReceipt,
389− sendMail,
390− ]);
381+ }, [web3, wallet, point, gasPrice, invites, clearReceipts, addReceipt]);
391382
392383 const onSubmit = useCallback(
393384 async values => {
src/views/Point.js+9−1
@@ -4,6 +4,7 @@ import { Grid } from 'indigo-react';
44import { azimuth } from 'azimuth-js';
55
66import { usePointCursor } from 'store/pointCursor';
7+import { useWallet } from 'store/wallet';
78
89import View from 'components/View';
910import Greeting from 'components/Greeting';
@@ -22,6 +23,7 @@ export default function Point() {
2223 const { pop, push, names } = useLocalRouter();
2324 const { pointCursor } = usePointCursor();
2425
26+ const { wallet } = useWallet();
2527 const point = need.point(pointCursor);
2628
2729 const {
@@ -87,10 +89,16 @@ export default function Point() {
8789 // sync the current cursor
8890 useSyncOwnedPoints([point]);
8991
92+ const address = need.addressFromWallet(wallet);
93+
9094 return (
9195 <View pop={pop} inset>
9296 <Greeting point={point} />
93− <Passport point={Just(point)} />
97+ <Passport
98+ point={Just(point)}
99+ address={Just(address)}
100+ animationMode={'slide'}
101+ />
94102 <Grid className="pt2">
95103 {inviteButton}
96104 <Grid.Item