diff --git a/CNAME b/CNAME index 72463a4..fdfbefb 100644 --- a/CNAME +++ b/CNAME @@ -1 +1 @@ -onboarding.making-sense.eu \ No newline at end of file +onboarding.iscape.smartcitizen.me \ No newline at end of file diff --git a/bower.json b/bower.json index 4c9878c..8c0a717 100644 --- a/bower.json +++ b/bower.json @@ -6,28 +6,32 @@ "license": "MIT", "private": true, "dependencies": { - "angular": "~1.5.0", - "angular-route": "~1.5.0", - "angular-loader": "~1.5.0", - "angular-mocks": "~1.5.0", - "html5-boilerplate": "^5.3.0", - "angular-ui-router": "^0.3.1", - "bootstrap-sass": "bootstrap-sass-official#^3.3.7", - "font-awesome": "fontawesome#^4.6.3", - "angular-material": "^1.0.9", - "angular-messages": "^1.5.8", + "angular": "^1.6.10", + "angular-route": "^1.6.10", + "angular-loader": "^1.6.10", + "angular-mocks": "^1.6.10", + "html5-boilerplate": "^6.0.1", + "angular-ui-router": "^1.0.15", + "bootstrap-sass": "^3.3.7", + "font-awesome": "^5.0.10", + "angular-material": "^1.1.8", + "angular-messages": "^1.6.10", "ngGeolocation": "^0.0.8", - "angular-google-maps": "^2.3.3", - "ngmap": "^1.17.3", + "angular-google-maps": "^2.4.1", + "ngmap": "^1.18.4", "angularjs-geolocation": "^0.1.1", "angular-google-places-autocomplete": "^0.2.7", - "restangular": "^1.5.2", + "restangular": "^1.6.1", + "socket.io-client": "^2.1.0", "angular-socket-io": "^0.7.0", - "socket.io-client": "^1.6.0" + "angular-lazy-img": "^1.5.1" + }, + "resolutions": { + "angular": "^1.6.10" }, "overrides": { "socket.io-client": { - "main": "socket.io.js" + "main": ["./dist/socket.io.js"] } } -} +} \ No newline at end of file diff --git a/package.json b/package.json index 63efb8a..2384ad8 100644 --- a/package.json +++ b/package.json @@ -2,8 +2,8 @@ "name": "angular-seed", "private": true, "version": "0.0.0", - "description": "A starter project for AngularJS", - "repository": "https://github.com/angular/angular-seed", + "description": "Smart Citizen Onboarding App", + "repository": "https://github.com/fablabbcn/smartcitizen-onboarding-app", "license": "MIT", "devDependencies": { "angular": "^1.5.8", diff --git a/src/app/app.js b/src/app/app.js index ba386a8..0f1a596 100644 --- a/src/app/app.js +++ b/src/app/app.js @@ -9,17 +9,6 @@ angular.module('app', [ 'uiGmapgoogle-maps', 'google.places', 'restangular', - 'btford.socket-io' - ]) - .controller('formController', function($scope) { - - // we will store all of our form data in this object - $scope.formData = {}; - - console.log($scope.formData); - - // function to process the form - $scope.processForm = function() { - alert('awesome!'); - }; - }); \ No newline at end of file + 'btford.socket-io', + 'angularLazyImg' + ]); \ No newline at end of file diff --git a/src/app/images/1.png b/src/app/images/1.png new file mode 100755 index 0000000..9296879 Binary files /dev/null and b/src/app/images/1.png differ diff --git a/src/app/images/2.png b/src/app/images/2.png new file mode 100755 index 0000000..8ee0478 Binary files /dev/null and b/src/app/images/2.png differ diff --git a/src/app/images/3.png b/src/app/images/3.png new file mode 100755 index 0000000..2287850 Binary files /dev/null and b/src/app/images/3.png differ diff --git a/src/app/images/4.png b/src/app/images/4.png new file mode 100755 index 0000000..2f73a7e Binary files /dev/null and b/src/app/images/4.png differ diff --git a/src/app/images/alert.svg b/src/app/images/alert.svg old mode 100644 new mode 100755 index 5eebf72..27fe1e1 --- a/src/app/images/alert.svg +++ b/src/app/images/alert.svg @@ -1,14 +1,33 @@ - - - - alert - Created with Sketch. - - - - - alert - - - - \ No newline at end of file + + + + + + + + + + diff --git a/src/app/images/back.svg b/src/app/images/back.svg new file mode 100755 index 0000000..25affb8 --- /dev/null +++ b/src/app/images/back.svg @@ -0,0 +1,24 @@ + + + + + + diff --git a/src/app/images/bg_l.png b/src/app/images/bg_l.png new file mode 100755 index 0000000..144a0db Binary files /dev/null and b/src/app/images/bg_l.png differ diff --git a/src/app/images/bg_m.png b/src/app/images/bg_m.png new file mode 100755 index 0000000..e588beb Binary files /dev/null and b/src/app/images/bg_m.png differ diff --git a/src/app/images/bg_s.png b/src/app/images/bg_s.png new file mode 100755 index 0000000..195e2f7 Binary files /dev/null and b/src/app/images/bg_s.png differ diff --git a/src/app/images/check.png b/src/app/images/check.png index 296e476..13371da 100644 Binary files a/src/app/images/check.png and b/src/app/images/check.png differ diff --git a/src/app/images/check.svg b/src/app/images/check.svg new file mode 100755 index 0000000..5aa9c27 --- /dev/null +++ b/src/app/images/check.svg @@ -0,0 +1,21 @@ + + + + + + + + diff --git a/src/app/images/cheers-34.svg b/src/app/images/cheers-34.svg new file mode 100755 index 0000000..e51f3d0 --- /dev/null +++ b/src/app/images/cheers-34.svg @@ -0,0 +1,50 @@ + + + + + + + + + + + diff --git a/src/app/images/favicon.ico b/src/app/images/favicon.ico index b41cb24..29ca462 100644 Binary files a/src/app/images/favicon.ico and b/src/app/images/favicon.ico differ diff --git a/src/app/images/forgot_pass.svg b/src/app/images/forgot_pass.svg new file mode 100755 index 0000000..307325b --- /dev/null +++ b/src/app/images/forgot_pass.svg @@ -0,0 +1,33 @@ + + + + + + + + + diff --git a/src/app/images/hardware_board.png b/src/app/images/hardware_board.png new file mode 100755 index 0000000..041a7e6 Binary files /dev/null and b/src/app/images/hardware_board.png differ diff --git a/src/app/images/help.svg b/src/app/images/help.svg new file mode 100755 index 0000000..8c3b14a --- /dev/null +++ b/src/app/images/help.svg @@ -0,0 +1,32 @@ + + + + + + + + + + diff --git a/src/app/images/info.svg b/src/app/images/info.svg new file mode 100755 index 0000000..e1367a4 --- /dev/null +++ b/src/app/images/info.svg @@ -0,0 +1,23 @@ + + + + + + + + diff --git a/src/app/images/mail.svg b/src/app/images/mail.svg new file mode 100755 index 0000000..4a54210 --- /dev/null +++ b/src/app/images/mail.svg @@ -0,0 +1,29 @@ + + + + + + + + diff --git a/src/app/images/main_board.png b/src/app/images/main_board.png new file mode 100755 index 0000000..924c970 Binary files /dev/null and b/src/app/images/main_board.png differ diff --git a/src/app/images/oops.svg b/src/app/images/oops.svg new file mode 100755 index 0000000..10430b1 --- /dev/null +++ b/src/app/images/oops.svg @@ -0,0 +1,34 @@ + + + + + + + diff --git a/src/app/images/pass.svg b/src/app/images/pass.svg new file mode 100755 index 0000000..17c970b --- /dev/null +++ b/src/app/images/pass.svg @@ -0,0 +1,11 @@ + + + + + + diff --git a/src/app/images/place.svg b/src/app/images/place.svg new file mode 100755 index 0000000..db10955 --- /dev/null +++ b/src/app/images/place.svg @@ -0,0 +1,30 @@ + + + + + + + + + + diff --git a/src/app/images/retry.svg b/src/app/images/retry.svg new file mode 100755 index 0000000..6b79183 --- /dev/null +++ b/src/app/images/retry.svg @@ -0,0 +1,35 @@ + + + + + + + + + + + + + + + + + diff --git a/src/app/images/sck.png b/src/app/images/sck.png new file mode 100644 index 0000000..bc4ec6f Binary files /dev/null and b/src/app/images/sck.png differ diff --git a/src/app/images/sck_case.png b/src/app/images/sck_case.png new file mode 100755 index 0000000..f08e306 Binary files /dev/null and b/src/app/images/sck_case.png differ diff --git a/src/app/images/sck_case2.png b/src/app/images/sck_case2.png new file mode 100755 index 0000000..7eff291 Binary files /dev/null and b/src/app/images/sck_case2.png differ diff --git a/src/app/images/sck_placeall.png b/src/app/images/sck_placeall.png new file mode 100755 index 0000000..884eeda Binary files /dev/null and b/src/app/images/sck_placeall.png differ diff --git a/src/app/images/sck_sealthecover.png b/src/app/images/sck_sealthecover.png new file mode 100755 index 0000000..11a1fad Binary files /dev/null and b/src/app/images/sck_sealthecover.png differ diff --git a/src/app/images/scklogo.png b/src/app/images/scklogo.png new file mode 100644 index 0000000..6028858 Binary files /dev/null and b/src/app/images/scklogo.png differ diff --git a/src/app/images/seepass.svg b/src/app/images/seepass.svg new file mode 100755 index 0000000..3e501cb --- /dev/null +++ b/src/app/images/seepass.svg @@ -0,0 +1,13 @@ + + + + + + + + + diff --git a/src/app/images/sensor_board.png b/src/app/images/sensor_board.png new file mode 100755 index 0000000..30654e3 Binary files /dev/null and b/src/app/images/sensor_board.png differ diff --git a/src/app/images/smartcitizen_logo.svg b/src/app/images/smartcitizen_logo.svg new file mode 100755 index 0000000..efec23e --- /dev/null +++ b/src/app/images/smartcitizen_logo.svg @@ -0,0 +1,31 @@ + + + + + + + + + + + + diff --git a/src/app/images/soundwave.svg b/src/app/images/soundwave.svg new file mode 100755 index 0000000..56cddad --- /dev/null +++ b/src/app/images/soundwave.svg @@ -0,0 +1,27 @@ + + + + + + diff --git a/src/app/images/speaker.svg b/src/app/images/speaker.svg new file mode 100755 index 0000000..29c9353 --- /dev/null +++ b/src/app/images/speaker.svg @@ -0,0 +1,31 @@ + + + + + + + + + + + + + diff --git a/src/app/images/tag.svg b/src/app/images/tag.svg new file mode 100755 index 0000000..0863a02 --- /dev/null +++ b/src/app/images/tag.svg @@ -0,0 +1,27 @@ + + + + + + diff --git a/src/app/images/user-33.svg b/src/app/images/user-33.svg new file mode 100755 index 0000000..15fff10 --- /dev/null +++ b/src/app/images/user-33.svg @@ -0,0 +1,29 @@ + + + + + + + + + diff --git a/src/app/images/web.png b/src/app/images/web.png new file mode 100644 index 0000000..c8caa28 Binary files /dev/null and b/src/app/images/web.png differ diff --git a/src/app/images/welldone.svg b/src/app/images/welldone.svg new file mode 100755 index 0000000..8c88359 --- /dev/null +++ b/src/app/images/welldone.svg @@ -0,0 +1,40 @@ + + + + + + + + + + + diff --git a/src/app/images/wifi.svg b/src/app/images/wifi.svg new file mode 100755 index 0000000..26bd85f --- /dev/null +++ b/src/app/images/wifi.svg @@ -0,0 +1,22 @@ + + + + + + + + + + + diff --git a/src/app/styles/_colors.scss b/src/app/styles/_colors.scss index ac19464..1797e25 100644 --- a/src/app/styles/_colors.scss +++ b/src/app/styles/_colors.scss @@ -1,8 +1,14 @@ //Colors +$SCK2-yellow: #FFCE00; +$SCK2-darkGrey: #333333; +$SCK2-lightGrey: #f9f9fb; +$SCK2-blue: #001fff; +$SCK2-red: #ff3d4c; + $msNavy: #212B32; $msNavy2: #27353D; $msOrange: #FBA200; -$msRed: #EF5854; +$msRed: $SCK2-red; $msGreen: #61CD72; $msBlue: #4AA3DF; $msGrey: #A5ACB2; @@ -20,3 +26,4 @@ $SCKgrey: #8DB2BA; $SCKgrey2: #C8E6ED; $SCKwhite: #ffffff; + diff --git a/src/app/styles/_doorbell.scss b/src/app/styles/_doorbell.scss index de24cfe..4fb1e78 100644 --- a/src/app/styles/_doorbell.scss +++ b/src/app/styles/_doorbell.scss @@ -7,7 +7,7 @@ width: auto; border: 0; //background: #61CD72; - background: $SCKblue; + background: $SCK2-darkGrey; text-transform: uppercase; color: #FFF; padding: 10px 20px; diff --git a/src/app/styles/_form.scss b/src/app/styles/_form.scss index 15550f1..ecd8c6f 100644 --- a/src/app/styles/_form.scss +++ b/src/app/styles/_form.scss @@ -3,7 +3,7 @@ margin: 50px 0 ; .inputTitle, .inputError { - color: $SCKnavy; + color: $SCK2-darkGrey; } .inputContainer { @@ -12,7 +12,7 @@ border: none; border-radius: 4px; - background-color: $SCKgrey; + background-color: $SCK2-lightGrey; @media screen and (max-width: 450px) { padding: 0; } @@ -25,14 +25,14 @@ } &.focus { - background-color: $SCKgrey; + background-color: $SCK2-lightGrey; } .ss_input{ margin: 0 25px; svg { path { - fill: $SCKwhite !important; + fill: $SCK2-darkGrey !important; } } } @@ -45,13 +45,13 @@ margin: 0; border: none; .md-placeholder{ - color: $msGrey; + color: $SCK2-darkGrey; } input { padding: 0; height: 80px; border: none; - color: $msWhite; + color: $SCK2-darkGrey; font: 100% 'Roboto Condensed', sans-serif !important; font-size: 42px !important; @media screen and (max-width: 450px) { @@ -67,16 +67,16 @@ // LOL HIDEOUS VVVVV md-input-container.md-default-theme:not(.md-input-invalid).md-input-focused label, md-input-container:not(.md-input-invalid).md-input-focused label, md-input-container.md-default-theme:not(.md-input-invalid).md-input-focused md-icon, md-input-container:not(.md-input-invalid).md-input-focused md-icon { - color: $SCKnavy; + color: $SCK2-darkGrey; } md-input-container.md-default-theme.md-input-invalid label, md-input-container.md-input-invalid label, md-input-container.md-default-theme.md-input-invalid .md-input-message-animation, md-input-container.md-input-invalid .md-input-message-animation, md-input-container.md-default-theme.md-input-invalid .md-char-counter, md-input-container.md-input-invalid .md-char-counter { color: $msRed; } md-input-container.md-default-theme label, md-input-container label, md-input-container.md-default-theme .md-placeholder, md-input-container .md-placeholder{ - color: $SCKnavy; + color: $SCK2-darkGrey; } md-input-container.md-default-theme:not(.md-input-invalid).md-input-has-value label, md-input-container:not(.md-input-invalid).md-input-has-value label { - color: $SCKnavy; + color: $SCK2-darkGrey; } //.md-block{ @@ -97,10 +97,10 @@ } .selection { - background-color: $msNavy; + background-color: $SCK2-darkGrey; .md-text.ng-binding { font-size: 42px; - color: $msGrey; + color: $SCK2-darkGrey; //.selectMenu{ // height: 80px !important; @@ -118,7 +118,7 @@ } md-content { - background-color: $msNavy !important; + background-color: $SCK2-darkGrey !important; } form{ diff --git a/src/app/styles/_handshake.scss b/src/app/styles/_handshake.scss index 896c7f1..ad6a22e 100644 --- a/src/app/styles/_handshake.scss +++ b/src/app/styles/_handshake.scss @@ -1,6 +1,6 @@ $handshakeBarHeight: 200px; -$handshakeBarBackgroundColor: rgba(79,164,220, .2); -$handshakeBarColor: $msGreen; +$handshakeBarBackgroundColor: $SCK2-lightGrey; +$handshakeBarColor: $SCK2-blue; .backgroundProgressLoader { position: absolute; diff --git a/src/app/styles/_media_queries.scss b/src/app/styles/_media_queries.scss index e69de29..f7693c7 100644 --- a/src/app/styles/_media_queries.scss +++ b/src/app/styles/_media_queries.scss @@ -0,0 +1,9 @@ +@media +(-webkit-max-device-pixel-ratio: 1.25), +(max-resolution: 120dpi){ + /* Retina-specific stuff here */ + body { + font: 80% $font; + } +} +// https://css-tricks.com/snippets/css/retina-display-media-query/ \ No newline at end of file diff --git a/src/app/styles/_modal.scss b/src/app/styles/_modal.scss index 9ed9480..911c4ba 100644 --- a/src/app/styles/_modal.scss +++ b/src/app/styles/_modal.scss @@ -52,7 +52,7 @@ #modalContent { z-index: 3; #modalBox{ - border-radius: $divRadius; + width: 1000px; min-height: 200px; @media screen and (min-width: $break-sm) { @@ -65,7 +65,7 @@ h2 { text-align: left; - color: $SCKnavy; + color: $SCK2-lightGrey; @media screen and (max-width: 960px) { text-align: center; } @@ -78,7 +78,7 @@ } } &.red{ - background-color: $msRed; + background-color: $SCK2-red; #partImage{ width: 200px; height: 200px; @@ -92,7 +92,7 @@ } } &.green{ - background-color: $msGreen; + background-color: $SCK2-blue; #partImage { @media screen and (min-width: $break-sm) { @@ -128,10 +128,10 @@ padding: 15px 20px; font-size: 26px !important; - background: $SCKblue; + background: $SCK2-lightGrey; border-radius: 40px; - border: 5px solid $SCKblue; - color: $SCKwhite; + border: 5px solid $SCK2-lightGrey; + color: $SCK2-darkGrey; } } } diff --git a/src/app/styles/_navigation.scss b/src/app/styles/_navigation.scss index c32a572..db5dbaa 100644 --- a/src/app/styles/_navigation.scss +++ b/src/app/styles/_navigation.scss @@ -1,11 +1,11 @@ @keyframes segueError { 0%{ - border: 5px solid $SCKwhite; + border: 2px solid $SCKwhite; color: $SCKwhite; background-color: $msNavy; } 1% { - border: 5px solid $msRed; + border: 2px solid $msRed; } 50% { background-color: $msRed; @@ -18,7 +18,7 @@ animation-timing-function: ease-in; color: white; background-color: $msRed; - border: 5px solid $msRed; + border: 2px solid $msRed; } } @@ -28,7 +28,7 @@ // 1% { // animation-timing-function: ease-out; // background-color: $msRed; -// border: 5px solid $msRed; +// border: 2px solid $msRed; // } // 50% { // color: $msRed; @@ -38,7 +38,7 @@ // color: rgba(0, 0, 0, 0); // } // 100% { -// border: 5px solid $msNavy2; +// border: 2px solid $msNavy2; // color: white; // } //} @@ -109,11 +109,12 @@ $button-height: $segueWrapperHeight / 2.75; .segueButton { height: $button-height; width: auto; - padding: 5px 15px; + padding: 5px 40px; border-radius: 40px; - color: $SCKblue; + color: $SCK2-blue; background: $SCKwhite; - border-color: $SCKblue; + border-color: $SCK2-blue; + text-transform: capitalize; #segueContent { overflow: hidden; @@ -121,18 +122,17 @@ $button-height: $segueWrapperHeight / 2.75; font-weight: 500 !important; font-size: 20px; position: relative; - top: -14px; - padding-left: 5px; - text-transform: uppercase; + top: -12px; + //padding-left: 5px; } #nextSVG { position: relative; - top: -13px; + top: -12px; left: 3px; display: inline; padding-right: 10px; path { - fill: $SCKblue; + fill: $SCK2-blue; } } #closeSVG{ @@ -143,19 +143,25 @@ $button-height: $segueWrapperHeight / 2.75; width: 0; } &.ready { - border: 5px solid $msGreen; + border: 2px solid $SCK2-blue; &:hover{ - background-color: $msGreen; - color: $SCKwhite; + background-color: $SCK2-lightGrey; + color: $SCK2-blue; #nextSVG { path { - fill: $SCKwhite; + fill: $SCK2-blue; } } } } &.blocked { - border: 5px solid $msWhite; + border: 2px solid $SCK2-darkGrey; + color: $SCK2-darkGrey; + #nextSVG { + path { + fill: $SCK2-darkGrey; + } + } } &.hide { display: none; @@ -166,7 +172,7 @@ $button-height: $segueWrapperHeight / 2.75; animation-name: segueError; animation-duration: $errorTimer; animation-fill-mode: forwards; - border: 5px solid $msRed; + border: 2px solid $SCK2-red; #segueContent{ -webkit-animation-name: updateContent; @@ -194,11 +200,10 @@ $button-height: $segueWrapperHeight / 2.75; .errorButton{ height: $button-height; width: 0; - text-transform: uppercase; - background: $SCKgrey2; + background: $SCK2-lightGrey; border-radius: 40px; - color: $SCKnavy2; - border: 5px solid $SCKgrey2; + color: $SCK2-darkGrey; + border: 2px solid $SCK2-lightGrey; opacity: 0; font-size: 20px; &.show{ @@ -224,17 +229,16 @@ $button-height: $segueWrapperHeight / 2.75; .backButton { height: $button-height; width: $button-height; - text-transform: uppercase; background: none; border-radius: 40px; color: $msNavy2; - border: 5px solid $msNavy2; + border: 2px solid $msNavy2; opacity: .12; svg { position: relative; } tspan { - fill: $SCKblue; + fill: $SCK2-blue; } &.blocked { tspan { @@ -251,11 +255,10 @@ $button-height: $segueWrapperHeight / 2.75; .forwardButton { height: $button-height; width: $button-height; - text-transform: uppercase; background: none; border-radius: 40px; color: $msNavy2; - border: 5px solid $msNavy2; + border: 2px solid $msNavy2; opacity: .12; svg { position: relative; @@ -263,7 +266,7 @@ $button-height: $segueWrapperHeight / 2.75; left: 8px; } tspan { - fill: $SCKblue; + fill: $SCK2-blue; } &.blocked { tspan { diff --git a/src/app/styles/_progress.scss b/src/app/styles/_progress.scss index 0d859f5..213ac3c 100644 --- a/src/app/styles/_progress.scss +++ b/src/app/styles/_progress.scss @@ -1,6 +1,6 @@ $barHeight: 15px; -$barBackgroundColor: rgba(56,206,243, .2); -$barColor: rgb(56,206,243); +$barBackgroundColor: white; +$barColor: $SCK2-yellow; $labelMargin: 50px; #progress{ @@ -26,22 +26,24 @@ $labelMargin: 50px; -ms-transition: color 0.75s cubic-bezier(0.86, 0, 0.07, 1); -o-transition: color 0.75s cubic-bezier(0.86, 0, 0.07, 1); transition: color 0.75s cubic-bezier(0.86, 0, 0.07, 1); - color: $SCKnavy; + color: $SCK2-darkGrey; } #left{ margin-left: $labelMargin; text-align: left; + text-transform: uppercase; } #right{ margin-right: $labelMargin; text-align: right; + text-transform: uppercase; } } &:hover, &.blue{ #progressLabels{ p { - color: $SCKnavy2; + color: $SCK2-darkGrey; } } } diff --git a/src/app/styles/_tags.scss b/src/app/styles/_tags.scss index cf78663..c8743ad 100644 --- a/src/app/styles/_tags.scss +++ b/src/app/styles/_tags.scss @@ -1,11 +1,11 @@ .tag { font: 100% $font !important; padding: 10px 15px; - color: $msWhite; + color: $SCK2-darkGrey; height: 60px; line-height: 60px; - background-color: $SCKnavy; + background-color: $SCK2-lightGrey; text-transform: lowercase; border: none; border-radius: 30px; @@ -25,7 +25,15 @@ margin-right: 10px; } + tspan { + fill: $SCK2-darkGrey; + } + &.active, &:hover { - background-color: $SCKblue; + background-color: $SCK2-blue; + color: $SCK2-lightGrey; + tspan { + fill: $SCK2-lightGrey; + } } } \ No newline at end of file diff --git a/src/app/styles/_tooltip.scss b/src/app/styles/_tooltip.scss index b536f6b..005a2ef 100644 --- a/src/app/styles/_tooltip.scss +++ b/src/app/styles/_tooltip.scss @@ -151,7 +151,7 @@ /* Tooltip content*/ .tooltip-text { - font-size: 34px; + font-size: 2.125em; line-height: 170px; display: block; color: #fff; diff --git a/src/app/styles/main.scss b/src/app/styles/main.scss index ffdab0a..88f6025 100644 --- a/src/app/styles/main.scss +++ b/src/app/styles/main.scss @@ -1,7 +1,11 @@ @import url(https://fonts.googleapis.com/css?family=Roboto+Condensed:300,400,700&subset=latin-ext); +@import url(https://fonts.googleapis.com/css?family=Roboto+Condensed:300,400,700&subset=latin-ext); +@import url(https://fonts.googleapis.com/css?family=Kanit:300,400,700,800,900&subset=latin-ext); /** -- CONSTANTS -- **/ $font: 'Roboto Condensed', sans-serif; +$font2: 'Kanit', sans-serif; + $divRadius: 15px; $errorTimer: .5s; @@ -25,86 +29,92 @@ $break-sm: 960px; @import "smart_citizen"; @import "tags"; @import "handshake"; -@import "media_queries"; @import "doorbell"; @import "_loader.scss"; +/* MEDIA QUERY IS AT END OF THIS FILE */ + html, body { margin: 0; padding: 0; } canvas {vertical-align: top; z-index: 0} body { height:auto; overflow:auto; - font: 100% $font !important; + font: 100% $font; background-color: $SCKwhite !important; display: flex; min-height: 100vh; + border: 10px $SCK2-darkGrey solid; h1, h2, h3, h4, h6, p { text-align: center; } h1{ + font: 100% $font2; font-weight: 900; - font-size: 72px; - color: $SCKblue; + font-size: 4.5em; + color: $SCK2-darkGrey; line-height: 70px; - text-transform: uppercase; @media screen and (max-width: 450px) { - font-size: 52px; + font-size: 3.25em; line-height: 46px; } } h2{ - font-weight: 400; - font-size: 45px; //fallback - color: $SCKblack; + font: 100% $font2; + font-weight: 800; + font-size: 2.875em; + color: $SCK2-darkGrey; + text-transform: uppercase; @media screen and (max-width: 450px) { - font-size: 32px; + font-size: 2em; } } h3{ font-weight: 400; - font-size: 30px; - color: $SCKgrey; + font-size: 1.875em; + color: $SCK2-darkGrey; @media screen and (max-width: 450px) { - font-size: 22px; + font-size: 1.375em; } em{ font-style: normal !important; &.green{ color: $msGreen; - } &.orange{ color: $msOrange; } + &.blue{ + color: $SCK2-blue; + } } } h4, p{ font-weight: 400; - font-size: 28px; - color: $SCKgrey; + font-size: 1.75em; + color: $SCK2-darkGrey; @media screen and (max-width: 450px) { - font-size: 20px; + font-size: 1.75em; } } h5{ font: 100% $font; font-weight: 400; - font-size: 28px; + font-size: 1.65em; color: $msWhite; @media screen and (max-width: 450px) { - font-size: 20px; + font-size: 1.15em; } } h6{ font-weight: 400; - font-size: 28px; + font-size: 1.75em; color: $msGrey; } button{ font-weight: 500; - font-size: 24px; + font-size: 1.5em; color: white; text-transform: capitalize; &:focus { @@ -130,7 +140,7 @@ body { margin: 0 auto; padding: 0 25px; max-width: 1150px; - overflow: hidden; + overflow: visible; &.ng-enter { -webkit-animation:slideInRight 0.5s both ease; @@ -146,9 +156,9 @@ body { .selectionRow { .selection { height: 400px; - background: $SCKnavy2; - border-radius: $divRadius; - border: 5px solid $SCKblue; + background: $SCK2-lightGrey; + border: 5px $SCK2-darkGrey solid; + &.nested{ width: 300px; @@ -197,7 +207,7 @@ body { transition: top 0.2s; top: 0; tspan { - fill: $SCKnavy2; + fill: $SCK2-darkGrey; } .shadow{ height: 0; @@ -220,11 +230,11 @@ body { } } .selectionText { - color: $SCKgrey2; + color: $SCK2-darkGrey; } } &:hover, &:active, &.active { - background-color: $SCKblue; + background-color: $SCK2-darkGrey; .selectionIcon, .selectionImage { position:relative; top: -10px; @@ -236,7 +246,7 @@ body { } } .selectionText { - color: $msWhite; + color: $SCK2-lightGrey; } } &.active{ @@ -301,13 +311,14 @@ body { width: auto; margin: 15px auto; padding: 0 15px; + padding-bottom: 10px; text-transform: uppercase; - background: $SCKblue; + background: $msBlack; border-radius: 40px; - border: 5px solid $SCKblue; + border: 5px solid $msBlack; color: $SCKwhite; - font-size: 20px; + font-size: 1.25em; svg{ margin: 0 10px; position: relative; @@ -315,7 +326,7 @@ body { } @media screen and (max-width: 450px) { - font-size: 14px; + font-size: .875em; padding-top: 0; line-height: 30px; svg{ @@ -330,9 +341,9 @@ body { padding-right: 20px; font: 100% 'Roboto Condensed', sans-serif !important; - font-size: 24px !important; + font-size: 1.5em !important; @media screen and (max-width: 450px) { - font-size: 20px !important; + font-size: 1.25em !important; padding: 0 5px; svg{ top: 7px; @@ -342,12 +353,12 @@ body { } .promptedText{ - background-color: $SCKblue; + background-color: $SCK2-lightGrey; border-radius: $divRadius * 2; padding: 15px 45px; //max-width: 400px; h2{ - color: $SCKnavy; + color: $SCK2-darkGrey; } } @@ -368,3 +379,5 @@ body { } } } + +@import "media_queries"; \ No newline at end of file diff --git a/src/app/wizard/basic2.html b/src/app/wizard/basic2.html index 203979f..100a16a 100644 --- a/src/app/wizard/basic2.html +++ b/src/app/wizard/basic2.html @@ -1,5 +1,5 @@
- +

{{payload.h2}}

diff --git a/src/app/wizard/basic3.html b/src/app/wizard/basic3.html index a1f4501..c5946d1 100644 --- a/src/app/wizard/basic3.html +++ b/src/app/wizard/basic3.html @@ -1,5 +1,5 @@
- +
diff --git a/src/app/wizard/casing.html b/src/app/wizard/casing.html index e39df1d..d740778 100644 --- a/src/app/wizard/casing.html +++ b/src/app/wizard/casing.html @@ -1,5 +1,5 @@
- +

{{payload.h2}}

diff --git a/src/app/wizard/collaborators.html b/src/app/wizard/collaborators.html index 5799290..b85646a 100644 --- a/src/app/wizard/collaborators.html +++ b/src/app/wizard/collaborators.html @@ -1,5 +1,5 @@
- +

{{payload.h2}}

diff --git a/src/app/wizard/confirm.html b/src/app/wizard/confirm.html index 08578a6..c361b02 100644 --- a/src/app/wizard/confirm.html +++ b/src/app/wizard/confirm.html @@ -1,7 +1,7 @@
- - + +
diff --git a/src/app/wizard/final.html b/src/app/wizard/final.html index 89b01b9..e5daa3f 100644 --- a/src/app/wizard/final.html +++ b/src/app/wizard/final.html @@ -1,10 +1,5 @@
- - - - 🎉 - - + cheers-34

{{payload.h1}}

diff --git a/src/app/wizard/handshake.html b/src/app/wizard/handshake.html index c37205b..0254222 100644 --- a/src/app/wizard/handshake.html +++ b/src/app/wizard/handshake.html @@ -7,8 +7,8 @@

{{payload.h4}}

-
-

{{payload.handshakeLabel}}

+
+

{{payload.handshakeLabel}}

diff --git a/src/app/wizard/kitbuild1.html b/src/app/wizard/kitbuild1.html index d1656a2..115c9c9 100644 --- a/src/app/wizard/kitbuild1.html +++ b/src/app/wizard/kitbuild1.html @@ -1,5 +1,5 @@
- +

{{payload.h2}}

diff --git a/src/app/wizard/kitbuild2.html b/src/app/wizard/kitbuild2.html index f0a91b1..742dc94 100644 --- a/src/app/wizard/kitbuild2.html +++ b/src/app/wizard/kitbuild2.html @@ -1,5 +1,5 @@
- +

{{payload.h2}}

diff --git a/src/app/wizard/kitbuild3.html b/src/app/wizard/kitbuild3.html index 015a236..3f511c3 100644 --- a/src/app/wizard/kitbuild3.html +++ b/src/app/wizard/kitbuild3.html @@ -1,5 +1,5 @@
- +

{{payload.h2}}

diff --git a/src/app/wizard/kitbuild4.html b/src/app/wizard/kitbuild4.html index 352e6e0..e1c0e6a 100644 --- a/src/app/wizard/kitbuild4.html +++ b/src/app/wizard/kitbuild4.html @@ -1,5 +1,5 @@
- +

{{payload.h2}}

diff --git a/src/app/wizard/landing.html b/src/app/wizard/landing.html index e82fc73..d0d75db 100644 --- a/src/app/wizard/landing.html +++ b/src/app/wizard/landing.html @@ -1,5 +1,5 @@
- +

{{payload.h1}}

diff --git a/src/app/wizard/location_prep.html b/src/app/wizard/location_prep.html index a8ded67..d5dde47 100644 --- a/src/app/wizard/location_prep.html +++ b/src/app/wizard/location_prep.html @@ -1,11 +1,6 @@
- - - - location - - + place
diff --git a/src/app/wizard/login.html b/src/app/wizard/login.html index bb079f4..73aa6db 100644 --- a/src/app/wizard/login.html +++ b/src/app/wizard/login.html @@ -34,18 +34,18 @@

{{payload.h4}}

- - - - - - - - - - - - +
+ +
\ No newline at end of file diff --git a/src/app/wizard/prompted_entry.html b/src/app/wizard/prompted_entry.html index 0b9c6d3..19973d2 100644 --- a/src/app/wizard/prompted_entry.html +++ b/src/app/wizard/prompted_entry.html @@ -7,6 +7,6 @@

{{payload.promptedText}}

-

{{payload.h3}} h

+

{{payload.h3}}

{{payload.h4}}

\ No newline at end of file diff --git a/src/app/wizard/prompted_entry2_image.html b/src/app/wizard/prompted_entry2_image.html index 5cbabb4..548230e 100644 --- a/src/app/wizard/prompted_entry2_image.html +++ b/src/app/wizard/prompted_entry2_image.html @@ -2,7 +2,7 @@

{{payload.h2}}

- +
diff --git a/src/app/wizard/scripts/accesspointController.js b/src/app/wizard/scripts/accesspointController.js index 5993a67..40bb601 100644 --- a/src/app/wizard/scripts/accesspointController.js +++ b/src/app/wizard/scripts/accesspointController.js @@ -28,9 +28,9 @@ angular.module('app').controller('accesspointController', function ($scope, scop $scope.$parent.segueControl = 'ready'; $scope.$parent.smartCitizenToggle = ''; if ($scope.$parent.payload.url == "accesspoint_1") { - $scope.bindable = $sce.trustAsHtml($scope.$parent.payload.h3_1 + "" + $scope.$parent.payload.em_1 + "" + $scope.$parent.payload.h3_2 + "" + $scope.$parent.payload.em_2 + "" + $scope.$parent.payload.h3_3); + $scope.bindable = $sce.trustAsHtml($scope.$parent.payload.h3_1 + "" + $scope.$parent.payload.em_1 + "" + $scope.$parent.payload.h3_2 + "" + $scope.$parent.payload.em_2 + "" + $scope.$parent.payload.h3_3); } else if ($scope.$parent.payload.url == "accesspoint_2") { - $scope.bindable = $sce.trustAsHtml($scope.$parent.payload.h3_1 + "" + $scope.$parent.payload.em_1 + ""); - console.log($scope.$parent.payload.h3_1 + "" + $scope.$parent.payload.em_1 + ""); + $scope.bindable = $sce.trustAsHtml($scope.$parent.payload.h3_1 + "" + $scope.$parent.payload.em_1 + ""); + console.log($scope.$parent.payload.h3_1 + "" + $scope.$parent.payload.em_1 + ""); } }); \ No newline at end of file diff --git a/src/app/wizard/scripts/accountController.js b/src/app/wizard/scripts/accountController.js index af4a2df..7a673a0 100644 --- a/src/app/wizard/scripts/accountController.js +++ b/src/app/wizard/scripts/accountController.js @@ -2,7 +2,7 @@ /** * Created by Lucian on 10/12/16. */ -angular.module('app').controller('accountController', function ($scope, scopePayload, AnimationService, platform, $timeout, $rootScope, $stateParams) { +angular.module('app').controller('accountController', function ($scope, scopePayload, AnimationService, platform, $timeout, $rootScope, $stateParams, session) { $scope.$parent.payload = scopePayload; AnimationService.animate(scopePayload.index); @@ -13,6 +13,12 @@ angular.module('app').controller('accountController', function ($scope, scopePay $scope.given_email = ( $scope.$parent.submittedData.user.email == ' ' ? '' : $scope.$parent.submittedData.user.email); $scope.given_username = ( $scope.$parent.submittedData.user.username == ' ' ? '' : $scope.$parent.submittedData.user.username); + $scope.$parent.submittedData.deviceData = { + device_token: session.device_token + }; + + console.log($scope.$parent.submittedData.deviceData); + /********** Watchers **********/ $scope.accountListener = function () { @@ -34,8 +40,8 @@ angular.module('app').controller('accountController', function ($scope, scopePay console.log('returned', data); loginAndBakeDevice(); }, function (res) { - if (res.data.errors.password) { - console.error("Password " + res.data.errors.password[0]) + if (res.status == -1) { //TODO: The '-1' is temporary due to Restangular / CORS weird issue + //console.error("Password " + res.data.errors.password[0]) } //blockSegue(); }); @@ -64,9 +70,9 @@ angular.module('app').controller('accountController', function ($scope, scopePay platform.createUser($scope.$parent.submittedData.user).then(function (data) { //Do nothing }, function (res) { - if (res.data.errors.username) { + if (res.status == -1) { //TODO: The '-1' is temporary due to Restangular / CORS weird issue // Username has already been taken - console.error("Username " + res.data.errors.username[0]); + // console.error("Username " + res.data.errors.username[0]); blockSegue(); } else { prepSegue(); @@ -111,12 +117,17 @@ angular.module('app').controller('accountController', function ($scope, scopePay }; $scope.forgotPassword = function () { - window.open("", '_blank'); + platform.resetPassword($scope.$parent.submittedData.user.email).then(function(data) { + $scope.$parent.resetEmailSent(); + }, function(data){ + console.error('There was a problem sending the reset password email'); + }); }; /********** Functions **********/ function loginAndBakeDevice() { + print($scope.$parent.submittedData.user); platform.login($scope.$parent.submittedData.user).then(function (data) { platform.setAuth(data); console.log("logged in successful"); @@ -125,7 +136,7 @@ angular.module('app').controller('accountController', function ($scope, scopePay console.log("baked successful", data); $timeout(function () { $scope.$parent.submittedData.deviceData.id = data.id; - //prepSegue(); + prepSegue(); $rootScope.$broadcast('forceSegue', { target: 'wizard.final', params: {lang: $stateParams.lang} @@ -155,17 +166,14 @@ angular.module('app').controller('accountController', function ($scope, scopePay } function prepSegue() { - // debugger; $scope.$parent.segueControl = 'ready'; } function blockSegue() { - // debugger; $scope.$parent.segueControl = 'blocked'; } function checkSegue() { - // debugger; if ( ($scope.$parent.payload.url == 'email') && (validateEmail($scope.given_email)) || ($scope.$parent.payload.url == 'username') && ($scope.given_username) diff --git a/src/app/wizard/scripts/landingController.js b/src/app/wizard/scripts/landingController.js index c4bdae7..21b0fcb 100644 --- a/src/app/wizard/scripts/landingController.js +++ b/src/app/wizard/scripts/landingController.js @@ -10,7 +10,6 @@ angular.module('app').controller('landingController', function($scope, scopePayl var buttonTargets = []; targets(scopePayload); - console.log(buttonTargets); function targets(payload){ if (payload.contextButton1 == "ENGLISH") { diff --git a/src/app/wizard/scripts/location.js b/src/app/wizard/scripts/location.js index d68a767..33d492c 100644 --- a/src/app/wizard/scripts/location.js +++ b/src/app/wizard/scripts/location.js @@ -6,7 +6,7 @@ angular.module('app').config(function (uiGmapGoogleMapApiProvider) { v: '3.20', libraries: 'weather,geometry,visualization' }); -}).controller('locationController', function ($scope, uiGmapIsReady, $geolocation, scopePayload, AnimationService) { +}).controller('locationController', function ($scope, uiGmapIsReady, $geolocation, scopePayload, AnimationService, tags) { // Tags must be on this list https://api.smartcitizen.me/v0/tags @@ -14,29 +14,21 @@ angular.module('app').config(function (uiGmapGoogleMapApiProvider) { $scope.$parent.payload = scopePayload; - $scope.locationTags = [ - 'park', - 'beach', - 'school', - 'street', - 'woods', - 'residential', - 'commercial', - 'plaza', - 'rural', - 'busy', - 'calm', - 'terrace', - 'balcony', - 'window', - 'garden', - 'bicycle' - ]; + + var tagList = []; + for(var i = 0; i < tags.length; i++) { + var obj = tags[i]; + + var name = obj.name; + tagList.push(name); + } + + $scope.locationTags=tagList.slice(0); + console.log($scope.locationTags); $scope.tagStates = Array.apply(null, Array($scope.locationTags.length)).map(String.prototype.valueOf, ''); if ($scope.$parent.payload.url = "location_tags") { - $scope.locationTags = scopePayload.tags; $scope.$parent.segueControl = 'ready'; } else { $scope.$parent.segueControl = 'blocked'; @@ -54,9 +46,9 @@ angular.module('app').config(function (uiGmapGoogleMapApiProvider) { AnimationService.animate(scopePayload.index); - uiGmapIsReady.promise(1).then(function () { // Double check issue when browser back + // uiGmapIsReady.promise(1).then(function () { // Double check issue when browser back //setInitialPosition(); - }); + // }); $geolocation.watchPosition({ diff --git a/src/app/wizard/scripts/platform.js b/src/app/wizard/scripts/platform.js index c4fbc5e..65abd5b 100644 --- a/src/app/wizard/scripts/platform.js +++ b/src/app/wizard/scripts/platform.js @@ -1,8 +1,14 @@ 'use strict'; -angular.module('app').factory('platform', function($rootScope, SegueService, Restangular) { +angular.module('app').factory('platformNotify', function (socketFactory) { + return socketFactory({ + ioSocket: io.connect('wss://ws.smartcitizen.me') + }); +}); - var sessionHeaders = {}, socket; +angular.module('app').factory('platform', function($rootScope, SegueService, Restangular, platformNotify) { + + var sessionHeaders = {}; function setSession(session) { sessionHeaders.OnboardingSession = session.onboarding_session; @@ -24,13 +30,12 @@ angular.module('app').factory('platform', function($rootScope, SegueService, Res } function bakeDevice(data) { - console.log('calling bake'); - return Restangular.all('onboarding/register').post({}); + return Restangular.all('onboarding/register').post(data); } - function checkEmail(emailString) { + function checkEmail(identity) { var data = { - email: emailString + email: identity }; return Restangular.all('onboarding/user').post(data); } @@ -43,13 +48,9 @@ angular.module('app').factory('platform', function($rootScope, SegueService, Res return Restangular.all('users').post(signupData); } - function connect(){ - socket = io.connect('wss://smartcitizen.xyz'); - } function listenDevices(then){ - if (!socket) connect(); - socket.on('data-received', then); + platformNotify.on('data-received', then); } function listenDevice(id, scope){ @@ -59,8 +60,7 @@ angular.module('app').factory('platform', function($rootScope, SegueService, Res } function listenTokens(then){ - if (!socket) connect(); - socket.on('token-received', then); + platformNotify.on('token-received', then); } function listenToken(token, scope){ @@ -69,6 +69,21 @@ angular.module('app').factory('platform', function($rootScope, SegueService, Res }) } + function resetPassword(emailString){ + var data = { + email_or_username: emailString + }; + return Restangular.all('password_resets').post(data); + } + + function getTags() { + return Restangular.all('tags') + .getList({'per_page': 100}) + // We add .plain() because we don't need full CRUD on Tags. + .then(function(fetchedTags){ + return fetchedTags.plain(); + }); + } return { setSession: setSession, @@ -80,7 +95,9 @@ angular.module('app').factory('platform', function($rootScope, SegueService, Res login: login, createUser: createUser, listenDevice: listenDevice, - listenToken: listenToken + listenToken: listenToken, + resetPassword: resetPassword, + getTags: getTags }; }); \ No newline at end of file diff --git a/src/app/wizard/scripts/router.js b/src/app/wizard/scripts/router.js index d7c1507..23ae30d 100644 --- a/src/app/wizard/scripts/router.js +++ b/src/app/wizard/scripts/router.js @@ -33,23 +33,23 @@ angular.module('app').config(function ($stateProvider, $urlRouterProvider, $loca } } }) - .state('wizard.making_sense', { - url: '/making_sense?lang', - templateUrl: 'app/wizard/collaborators.html', - controller: 'baseController', - resolve: { - scopePayload: function (SegueService, $stateParams) { - return SegueService.prep(1, $stateParams.lang); - } - } - }) + // .state('wizard.making_sense', { + // url: '/making_sense?lang', + // templateUrl: 'app/wizard/collaborators.html', + // controller: 'baseController', + // resolve: { + // scopePayload: function (SegueService, $stateParams) { + // return SegueService.prep(1, $stateParams.lang); + // } + // } + // }) .state('wizard.smart_citizen', { url: '/smart_citizen?lang', templateUrl: 'app/wizard/collaborators.html', controller: 'smartCitizenController', resolve: { scopePayload: function (SegueService, $stateParams) { - return SegueService.prep(2, $stateParams.lang); + return SegueService.prep(1, $stateParams.lang); } } }) @@ -59,7 +59,7 @@ angular.module('app').config(function ($stateProvider, $urlRouterProvider, $loca controller: 'smartCitizenController', resolve: { scopePayload: function (SegueService, $stateParams) { - return SegueService.prep(3, $stateParams.lang); + return SegueService.prep(2, $stateParams.lang); } } }) @@ -69,7 +69,7 @@ angular.module('app').config(function ($stateProvider, $urlRouterProvider, $loca controller: 'smartCitizenController', resolve: { scopePayload: function (SegueService, $stateParams) { - return SegueService.prep(4, $stateParams.lang); + return SegueService.prep(3, $stateParams.lang); } } }) @@ -166,16 +166,16 @@ angular.module('app').config(function ($stateProvider, $urlRouterProvider, $loca } } }) - // .state('wizard.case2', { - // url: '/case_2?lang', - // templateUrl: 'app/wizard/casing.html', - // controller: 'baseController', - // resolve: { - // scopePayload: function (SegueService, $stateParams) { - // return SegueService.prep(19, $stateParams.lang); - // } - // } - // }) + .state('wizard.case2', { + url: '/case_2?lang', + templateUrl: 'app/wizard/casing.html', + controller: 'baseController', + resolve: { + scopePayload: function (SegueService, $stateParams) { + return SegueService.prep(19, $stateParams.lang); + } + } + }) .state('wizard.confirm_build', { url: '/confirm_build?lang', @@ -183,7 +183,7 @@ angular.module('app').config(function ($stateProvider, $urlRouterProvider, $loca controller: 'baseController', resolve: { scopePayload: function (SegueService, $stateParams) { - return SegueService.prep(19, $stateParams.lang); + return SegueService.prep(20, $stateParams.lang); } } }) @@ -263,6 +263,14 @@ angular.module('app').config(function ($stateProvider, $urlRouterProvider, $loca resolve: { scopePayload: function (SegueService, $stateParams) { return SegueService.prep(50, $stateParams.lang); + }, + tags: function (platform, $state) { + return platform.getTags().then(function (tags) { + return tags; + }, function () { + $state.go('unavailable'); + //return true; + }); } } }) @@ -273,6 +281,14 @@ angular.module('app').config(function ($stateProvider, $urlRouterProvider, $loca resolve: { scopePayload: function (SegueService, $stateParams) { return SegueService.prep(51, $stateParams.lang); + }, + tags: function (platform, $state) { + return platform.getTags().then(function (tags) { + return tags; + }, function () { + $state.go('unavailable'); + //return true; + }); } } }) @@ -283,6 +299,14 @@ angular.module('app').config(function ($stateProvider, $urlRouterProvider, $loca resolve: { scopePayload: function (SegueService, $stateParams) { return SegueService.prep(52, $stateParams.lang); + }, + tags: function (platform, $state) { + return platform.getTags().then(function (tags) { + return tags; + }, function () { + $state.go('unavailable'); + //return true; + }); } } }) diff --git a/src/app/wizard/scripts/services.js b/src/app/wizard/scripts/services.js index 3f0464d..575cc78 100644 --- a/src/app/wizard/scripts/services.js +++ b/src/app/wizard/scripts/services.js @@ -11,7 +11,7 @@ angular.module('app').service('SegueService', function () { "part": 1, "template": "landing", "url": "landing", - "h1": "Welcome to the Making Sense pilot!", + "h1": "Welcome to the Smart Citizen Kit Onboarding!", "h4": "Let’s get you set up with a Smart Citizen kit, and sensing in no time", "segueButton": "Continue in English", "contextButton1": "CASTELLANO", @@ -21,38 +21,28 @@ angular.module('app').service('SegueService', function () { "index": 1, "part": 2, "template": "collaborators", - "url": "making_sense", - "companyLogo": "app/images/MS LOGO.png", - "h2": "Making Sense is a project to help people make sense of their environment.", - "h4": "We want to help you deploy sensors to help understand sound pollution. By making sense of the issue, we might be able to address it.", - "segueButton": "SOUNDS GOOD!" - }, - { - "index": 2, - "part": 3, - "template": "collaborators", "url": "smart_citizen", - "companyLogo": "app/images/SCK LOGO.png", + "companyLogo": "app/images/scklogo.png", "h2": "Smart Citizen is a movement for civic participation in a modern world", "h4": "Smart Citizen creates open tools for citizens to be better informed about the world around them.", "segueButton": "CONTINUE" }, { - "index": 3, - "part": 4, + "index": 2, + "part": 3, "template": "basic2", "url": "smart_citizen_brief", - "image": "app/images/sck_glow.png", + "image": "app/images/sck.png", "h2": "The Smart Citizen Kit", "h4": "This sensor is a Smart Citizen Kit for environmental sensing. It measures sound, air quality, humidity, and lots of other things", "segueButton": "CONTINUE" }, { - "index": 4, - "part": 5, + "index": 3, + "part": 4, "template": "basic2", "url": "smart_citizen_brief2", - "image": "app/images/SCK_macbook.png", + "image": "app/images/web.png", "h2": "smartcitizen.me", "h4": "The kit sends all the measurements to the Smart Citizen website. It's open and free for all to see, question and play with...", "segueButton": "LET'S DO THIS" @@ -171,21 +161,21 @@ angular.module('app').service('SegueService', function () { "url": "case_1", "h2": "Next, we'll place it all in the casing", "text": "Make sure you place it with the battery cable towards the bottom of the casing", - "image": "app/images/BOARDS-CUTOUT_0007_FRONT-eclosureBattSensor.png", + "image": "app/images/sck_placeall.png", "segueButton": "CONTINUE" }, - // { - // "index": 19, - // "part": 10, - // "template": "casing", - // "url": "case_2", - // "h2": "... and to finish, seal the cover", - // "text": "Place the transparent plastic on the front of the case and fix it in place with the two white plugs.", - // "image": "app/images/BOARDS-CUTOUT_0007_FRONT-eclosure-wShineclasps.png", - // "segueButton": "CONTINUE" - // }, { "index": 19, + "part": 10, + "template": "casing", + "url": "case_2", + "h2": "... and to finish, seal the cover", + "text": "Place the transparent plastic on the front of the case and fix it in place with the two white plugs.", + "image": "app/images/sck_sealthecover.png", + "segueButton": "CONTINUE" + }, + { + "index": 20, "part": 11, "template": "comfirm", "url": "confirm_build", @@ -232,6 +222,10 @@ angular.module('app').service('SegueService', function () { "url": "wifi_check", "h2": "Oops, something went wrong...", "h4": "It seems there is a problem. Notice that the Kit light is red, please retry the Wi-Fi name and password", + "input1": "Name of Wi-Fi", + "input1_error": "A name is required to connect to a network", + "input2": "Password", + "input2_error": "", "segueButtonError": "CHECK THE FIELDS", "contextButton": "Try another way", "contextButton2": "Ask for Help", @@ -356,26 +350,7 @@ angular.module('app').service('SegueService', function () { "h2": "Is there anything we should know about location?", "h4": "Selecting from the tags below can help us make sense of the data, and compare it more accurately", "segueButton": "All SET", - "continueButton": "All SET", - "tags": ["Inside", - "Outside", - "Ground Floor", - "First Floor", - "Second Floor", - "Third Floor", - "Fourth Floor", - "Fifth Floor", - "Terrace", - "Garden", - "Balcony", - "Window", - "Residential", - "Commercial", - "Kitchen", - "Bedroom", - "Living Room", - "Bathroom" - ] + "continueButton": "All SET" }, { "index": 53, @@ -474,25 +449,15 @@ angular.module('app').service('SegueService', function () { "index": 1, "part": 2, "template": "collaborators", - "url": "making_sense", - "companyLogo": "app/images/MS LOGO.png", - "h2": "Making Sense es un proyecto que ayuda a las personas a entender su entorno.", - "h4": "Queremos ayudarte a instalar sensores para entender la contaminación acústica. Tomando conciencia del problema, seremos capaces de abordarlo.", - "segueButton": "SUENA BIEN!" - }, - { - "index": 2, - "part": 3, - "template": "collaborators", "url": "smart_citizen", - "companyLogo": "app/images/SCK LOGO.png", + "companyLogo": "app/images/scklogo.png", "h2": "Smart Citizen es un movimiento para la participación ciudadana utilizando las últimas tecnologías.", "h4": "Smart Citizen crea herramientas abiertas para que los ciudadanos están mejor informado acerca del mundo a su alrededor.", "segueButton": "CONTINÚA" }, { - "index": 3, - "part": 4, + "index": 2, + "part": 3, "template": "basic2", "url": "smart_citizen_brief", "image": "app/images/sck_glow.png", @@ -501,11 +466,11 @@ angular.module('app').service('SegueService', function () { "segueButton": "CONTINÚA" }, { - "index": 4, - "part": 5, + "index": 3, + "part": 4, "template": "basic2", "url": "smart_citizen_brief2", - "image": "app/images/SCK_macbook.png", + "image": "app/images/web.png", "h2": "smartcitizen.me", "h4": "El Kit envía todos los datos a la web de Smart Citizen. Es abierta y gratuita para todos, para ver, preguntar y jugar con ella...", "segueButton": "VAMOS" @@ -624,21 +589,21 @@ angular.module('app').service('SegueService', function () { "url": "case_1", "h2": "Después, colocalo todo dentro de la carcasa", "text": "Asegurate de colocar el Kit con el cable de la batería hacia la parte inferior de la carcasa", - "image": "app/images/BOARDS-CUTOUT_0007_FRONT-eclosureBattSensor.png", + "image": "app/images/sck_placeall.png", "segueButton": "CONTINÚA" }, - // { - // "index": 19, - // "part": 10, - // "template": "casing", - // "url": "case_2", - // "h2": "... y para terminar, cierra la tapa", - // "text": "Coloca el plástico transparente en la parte delantera de la caja y fijalo en su lugar con las dos fijaciones blancas", - // "image": "app/images/BOARDS-CUTOUT_0007_FRONT-eclosure-wShineclasps.png", - // "segueButton": "CONTINÚA" - // }, { "index": 19, + "part": 10, + "template": "casing", + "url": "case_2", + "h2": "... y para terminar, cierra la tapa", + "text": "Coloca el plástico transparente en la parte delantera de la caja y fijalo en su lugar con las dos fijaciones blancas", + "image": "app/images/sck_sealthecover.png", + "segueButton": "CONTINÚA" + }, + { + "index": 20, "part": 11, "template": "comfirm", "url": "confirm_build", @@ -809,26 +774,7 @@ angular.module('app').service('SegueService', function () { "h2": "Selecciona las palabras que mejor describen la ubicación de tu sensor.", "h4": "Esto ayudarà a otros usuarios entender mejor los datos que estás midiendo", "segueButton": "TODO CONFIGURADO", - "continueButton": "TODO CONFIGURADO", - "tags": ["Inside", - "Outside", - "Ground Floor", - "First Floor", - "Second Floor", - "Third Floor", - "Fourth Floor", - "Fifth Floor", - "Terrace", - "Garden", - "Balcony", - "Window", - "Residential", - "Commercial", - "Kitchen", - "Bedroom", - "Living Room", - "Bathroom" - ] + "continueButton": "TODO CONFIGURADO" }, { "index": 53, @@ -927,38 +873,28 @@ angular.module('app').service('SegueService', function () { "index": 1, "part": 2, "template": "collaborators", - "url": "making_sense", - "companyLogo": "app/images/MS LOGO.png", - "h2": "Making Sense és un projecte per ajudar a la gent a entendre millor el seu entorn.", - "h4": "Volem ajudar-te a instal·lar sensors per entendre millor la contaminació acústica. Prenent conciència del problema serem capaços de resoldre'l.", - "segueButton": "SONA BÉ!" - }, - { - "index": 2, - "part": 3, - "template": "collaborators", "url": "smart_citizen", - "companyLogo": "app/images/SCK LOGO.png", + "companyLogo": "app/images/scklogo.png", "h2": "Smart Citizen és un moviment per la participació ciutadana utilitzant les últimes tecnologies.", "h4": "Smart Citizen crea eines obertes per ajudar els ciutadans a entendre millor el seu entorn.", "segueButton": "CONTINUA" }, { - "index": 3, - "part": 4, + "index": 2, + "part": 3, "template": "basic2", "url": "smart_citizen_brief", - "image": "app/images/sck_glow.png", + "image": "app/images/sck.png", "h2": "Smart Citizen Kit", "h4": "Aquest sensors és un Smart Citizen Kit. Mesura soroll, qualitat de l'aire, humitat, i moltes coses més.", "segueButton": "CONTINUA" }, { - "index": 4, - "part": 5, + "index": 3, + "part": 4, "template": "basic2", "url": "smart_citizen_brief2", - "image": "app/images/SCK_macbook.png", + "image": "app/images/web.png", "h2": "smartcitizen.me", "h4": "El sensor envia totes les mesures a la web d'Smart Citizen. És lliure i oberta perquè tothom pugui veure i qüestionar les dades...", "segueButton": "FEM-HO" @@ -1077,21 +1013,21 @@ angular.module('app').service('SegueService', function () { "url": "case_1", "h2": "A continuació posa-ho tot dins la carcassa", "text": "Assegura't de col·locar el Kit amb el cable de la bateria cap a la part inferior de la carcassa", - "image": "app/images/BOARDS-CUTOUT_0007_FRONT-eclosureBattSensor.png", + "image": "app/images/sck_placeall.png", "segueButton": "CONTINUA" }, - // { - // "index": 19, - // "part": 10, - // "template": "casing", - // "url": "case_2", - // "h2": "... i per acabar, posa la tapa.", - // "text": "Col·loca el plàstic transparent damunt la caixa i fixa'l al seu lloc amb les dues fixacions blanques", - // "image": "app/images/BOARDS-CUTOUT_0007_FRONT-eclosure-wShineclasps.png", - // "segueButton": "CONTINUA" - // }, { "index": 19, + "part": 10, + "template": "casing", + "url": "case_2", + "h2": "... i per acabar, posa la tapa.", + "text": "Col·loca el plàstic transparent damunt la caixa i fixa'l al seu lloc amb les dues fixacions blanques", + "image": "app/images/sck_sealthecover.png", + "segueButton": "CONTINUA" + }, + { + "index": 20, "part": 11, "template": "comfirm", "url": "confirm_build", @@ -1262,26 +1198,7 @@ angular.module('app').service('SegueService', function () { "h2": "Selecciona les paraules que millor descriuen el lloc on has instal·lat el Kit", "h4": "Això ens ajudarà a saber el que estàs medint", "segueButton": "TOT APUNT", - "continueButton": "TOT APUNT", - "tags": ["Inside", - "Outside", - "Ground Floor", - "First Floor", - "Second Floor", - "Third Floor", - "Fourth Floor", - "Fifth Floor", - "Terrace", - "Garden", - "Balcony", - "Window", - "Residential", - "Commercial", - "Kitchen", - "Bedroom", - "Living Room", - "Bathroom" - ] + "continueButton": "TOT APUNT" }, { "index": 53, @@ -1417,18 +1334,15 @@ angular.module('app').service('SegueService', function () { var langValue = 0; //default eng if (lang == "esp") { langValue = 1; - console.log("loading Spanish"); } else if (lang == "cat") { langValue = 2; - console.log("loading Catalan"); } else { - console.log("loading English"); } return payloadGenerate(getPageContent(val, langValue), langValue) }; this.nextPage = function (val, accountPresent) { - if (val == 4) { + if (val == 3) { return ('whats_in_the_box'); } else if (val == 19) { return getPageContent(val + 2).url; @@ -1483,6 +1397,14 @@ angular.module('app').service('SegueService', function () { }; function payloadGenerate(content, value) { + + // Ensure all the buttons copy is in lowercase to later postprocess in css at your taste + for (var key in content) { + if (key.indexOf('Button') !== -1) { + content[key] = content[key].toLowerCase(); + } + } + if (value == undefined) { value = 0; } @@ -1493,7 +1415,6 @@ angular.module('app').service('SegueService', function () { var index = pC.findIndex(function (item, i) { return item.index === payload.index; }); - // console.log(index); payload.progressLeftLabel = setupProgressLeft(payload.index).toString() + " / 6"; payload.progressRightLabel = setupProgressRight(payload.index).toString() + " step #" + payload.part; @@ -1541,9 +1462,9 @@ angular.module('app').service('SegueService', function () { }; function setupProgressLeft(index) { - if (index <= 4) { + if (index <= 3) { return 1; - } else if (index <= 19) { + } else if (index <= 20) { return 2; } else if (index <= 34) { return 3; @@ -1557,9 +1478,9 @@ angular.module('app').service('SegueService', function () { } function setupProgressRight(index) { - if (index <= 4) { + if (index <= 3) { return "Introduction"; - } else if (index <= 19) { + } else if (index <= 20) { return "What's in the Box"; } else if (index <= 33) { return "Handshake"; diff --git a/src/app/wizard/scripts/statesController.js b/src/app/wizard/scripts/statesController.js index d14f908..e0c5c41 100644 --- a/src/app/wizard/scripts/statesController.js +++ b/src/app/wizard/scripts/statesController.js @@ -119,11 +119,11 @@ angular.module('app').controller('stateCtlr', function($scope, $rootScope, scope var data = [{ "title": $scope.payload.part1, "body": $scope.payload.part1_desc, - "image": "app/images/BOARDS-CUTOUT_0003_SENSOR-BOARD-BLUE.png" + "image": "app/images/sensor_board.png" }, { "title": $scope.payload.part2, "body": $scope.payload.part2_desc, - "image": "app/images/BOARDS-CUTOUT_0002_HARDWARE-BOARD-WHITE.png" + "image": "app/images/main_board.png" }, { "title": $scope.payload.part3, "body": $scope.payload.part3_desc, @@ -131,11 +131,11 @@ angular.module('app').controller('stateCtlr', function($scope, $rootScope, scope }, { "title": $scope.payload.part4, "body": $scope.payload.part4_desc, - "image": "app/images/BOARDS-CUTOUT_0005_USBgreen.png" + "image": "app/images/BOARDS-CUTOUT_0005_USB.png" }, { "title": $scope.payload.part5, "body": $scope.payload.part5_desc, - "image": "app/images/BOARDS-CUTOUT_0008_ANGLED.png" + "image": "app/images/sck_case2.png" }, { "title": $scope.payload.part6, "body": $scope.payload.part6_desc, diff --git a/src/app/wizard/scripts/wizard.js b/src/app/wizard/scripts/wizard.js index 80c324d..1904793 100644 --- a/src/app/wizard/scripts/wizard.js +++ b/src/app/wizard/scripts/wizard.js @@ -11,15 +11,16 @@ angular.module('app').controller('wizardCtrl', function($scope, $location, $sce, $scope.submittedData.user = {}; + console.log('Your session:' , session); + $scope.submittedData.deviceData = { device_token: session.device_token, - description: 'Making Sense Pilot #1', + description: 'iSCAPE Citizen Kit', exposure: 'outdoor', - kit_id: 11 + kit_id: 18 }; - console.log( $scope.submittedData.deviceData.user_tags_array); - $scope.submittedData.deviceData.user_tags_array = ["MakingSense", "Barcelona", "Plaça del sol", "MS1"]; + $scope.submittedData.deviceData.user_tags_array = ["iSCAPE"]; $scope.onboarding_session = session.onboarding_session; @@ -29,11 +30,10 @@ angular.module('app').controller('wizardCtrl', function($scope, $location, $sce, $scope.handShakeState = false; $scope.handShakeRepeats = 0; - $scope.handShakeRetries = 4; + $scope.handShakeRetries = 2; /** Base Navigation **/ $scope.seque = function() { - console.log($scope.payload.template); if ($scope.segueControl == 'ready') { switch ($scope.payload.template) { case 'handshake': @@ -79,7 +79,7 @@ angular.module('app').controller('wizardCtrl', function($scope, $location, $sce, AnimationService.leaving(true); $scope.payload.progressShow = 'blue'; $timeout(function() { - console.log($scope.payload.index); + console.log('Next slide:', $scope.payload.index); $location.path('/wizard/' + SegueService.nextPage($scope.payload.index, $scope.pre_made)); $window.scrollTo(0, 0); $scope.payload.progressShow = ' '; @@ -103,7 +103,7 @@ angular.module('app').controller('wizardCtrl', function($scope, $location, $sce, $timeout(function() { $scope.segueControl = 'ready'; //debugger; - console.log($scope.payload.index); + console.log('Prev slide:', $scope.payload.index); $location.path('/wizard/' + SegueService.previousPage($scope.payload.index, $scope.pre_made)); $window.scrollTo(0, 0); $scope.payload.progressShow = ' '; @@ -111,7 +111,7 @@ angular.module('app').controller('wizardCtrl', function($scope, $location, $sce, } function handleError() { - console.log($scope.payload.template); + console.log('User error:', $scope.payload.template); if ( ($scope.payload.template == 'wifi_enter') || ($scope.payload.template == 'sensorName') || @@ -201,6 +201,18 @@ angular.module('app').controller('wizardCtrl', function($scope, $location, $sce, $rootScope.$broadcast('modal'); }; + $scope.resetEmailSent = function() { + $scope.modalBox = 'green'; + var data = { + title: "Email sent!", + body: "We have sent the email out! Check out your email in a new tab then return to put in your new password!", + button: "Ok", + action: "retry" + }; + $scope.modalContent = data; + $rootScope.$broadcast('modal'); + }; + /** -- MODAL-- **/ $scope.modalClick = function() { @@ -219,7 +231,7 @@ angular.module('app').controller('wizardCtrl', function($scope, $location, $sce, $scope.seque; break; case 'restart': - $state.go('wizard.landing'); + $state.go('wizard.landing'); break; default: $scope.seque; @@ -232,7 +244,7 @@ angular.module('app').controller('wizardCtrl', function($scope, $location, $sce, }); Restangular.setErrorInterceptor(function(response, deferred, responseHandler) { - if ([204, 422, 403, 404].indexOf(response.status) > -1) { + if ([-1, 204, 422, 403, 404].indexOf(response.status) > -1) { // TODO: '-1' is temporary fix for restangular / CORS issue console.warn(response); return true; // We don't catch errors 422 and 403 since we use them on user login } else { diff --git a/src/app/wizard/selectparts.html b/src/app/wizard/selectparts.html index b826453..1f5a5e0 100644 --- a/src/app/wizard/selectparts.html +++ b/src/app/wizard/selectparts.html @@ -13,17 +13,17 @@

{{payload.h4}}

- +
- +
- +
-
{{payload.part1}}
+
{{payload.part1}}
@@ -32,14 +32,14 @@
{{payload.part1}}
- +
- +
- +
{{payload.part2}}
@@ -50,14 +50,14 @@
{{payload.part2}}
- +
- +
- +
{{payload.part3}}
@@ -68,14 +68,14 @@
{{payload.part3}}
- +
- +
- +
{{payload.part4}}
diff --git a/src/app/wizard/selectparts2.html b/src/app/wizard/selectparts2.html index 337e7ef..dd53bf2 100644 --- a/src/app/wizard/selectparts2.html +++ b/src/app/wizard/selectparts2.html @@ -13,15 +13,15 @@

{{payload.h4}}

- +
- +
- +
{{payload.part5}}
@@ -31,15 +31,15 @@
{{payload.part5}}
- +
- +
- +
{{payload.part6}}
@@ -49,15 +49,15 @@
{{payload.part6}}
- +
- +
- +
{{payload.part7}}
@@ -67,15 +67,15 @@
{{payload.part7}}
- +
- +
- +
{{payload.part8}}
diff --git a/src/app/wizard/wifi_check.html b/src/app/wizard/wifi_check.html index 93ab18e..53302b3 100644 --- a/src/app/wizard/wifi_check.html +++ b/src/app/wizard/wifi_check.html @@ -21,10 +21,10 @@

{{payload.h4}}

- +
-
Tienes que introducir el nombre de tu red.
+
{{payload.input1_error}}
@@ -44,7 +44,7 @@

{{payload.h4}}

- +
diff --git a/src/app/wizard/wizard.html b/src/app/wizard/wizard.html index c425b52..7c993d8 100644 --- a/src/app/wizard/wizard.html +++ b/src/app/wizard/wizard.html @@ -36,12 +36,7 @@ {{ payload.segueButton }} - - - Created with Sketch. - - - +
@@ -72,7 +67,7 @@

{{modalContent.title}}

{{modalContent.body}}
- +
diff --git a/src/index.html b/src/index.html index e2aa978..888a603 100644 --- a/src/index.html +++ b/src/index.html @@ -8,7 +8,7 @@ - Making Sense + Smart Citizen Onboarding