From faec41907624d7438cbbc7292f8252f35f34b662 Mon Sep 17 00:00:00 2001 From: GLSea1979 Date: Tue, 28 Mar 2017 16:31:57 -0700 Subject: [PATCH 01/22] basic start --- .babelrc | 3 ++ .eslintrc | 22 +++++++++ .gitignore | 123 ++++++++++++++++++++++++++++++++++++++++++++++ app/entry.js | 0 app/index.html | 21 ++++++++ gulpfile.js | 23 +++++++++ package.json | 42 ++++++++++++++++ reset.scss | 48 ++++++++++++++++++ webpack.config.js | 50 +++++++++++++++++++ 9 files changed, 332 insertions(+) create mode 100644 .babelrc create mode 100755 .eslintrc create mode 100755 .gitignore create mode 100644 app/entry.js create mode 100644 app/index.html create mode 100755 gulpfile.js create mode 100644 package.json create mode 100644 reset.scss create mode 100644 webpack.config.js diff --git a/.babelrc b/.babelrc new file mode 100644 index 00000000..c13c5f62 --- /dev/null +++ b/.babelrc @@ -0,0 +1,3 @@ +{ + "presets": ["es2015"] +} diff --git a/.eslintrc b/.eslintrc new file mode 100755 index 00000000..a79e0c68 --- /dev/null +++ b/.eslintrc @@ -0,0 +1,22 @@ +{ + "rules": { + "no-console": "off", + "indent": [ "error", 2 ], + "quotes": [ "error", "single" ], + "semi": ["error", "always"], + "linebreak-style": [ "error", "unix" ], + # "linebreak-style": [ "error", "windows"] + }, + "env": { + "es6": true, + "node": true, + "mocha": true, + "jasmine": true + }, + "ecmaFeatures": { + "modules": true, + "experimentalObjectRestSpread": true, + "impliedStrict": true + }, + "extends": "eslint:recommended" +} diff --git a/.gitignore b/.gitignore new file mode 100755 index 00000000..cbc44fb3 --- /dev/null +++ b/.gitignore @@ -0,0 +1,123 @@ + +# Created by https://www.gitignore.io/api/monodevelop,vim,node,windows,archlinuxpackages + +### ArchLinuxPackages ### +*.tar +*.tar.* +*.jar +*.exe +*.msi +*.zip +*.tgz +*.log +*.log.* +*.sig + +pkg/ +src/ + +### MonoDevelop ### +#User Specific +*.userprefs +*.usertasks + +#Mono Project Files +*.pidb +*.resources +test-results/ + +### Node ### +# Logs +logs +npm-debug.log* +yarn-debug.log* +yarn-error.log* + +# Runtime data +pids +*.pid +*.seed +*.pid.lock + +# Directory for instrumented libs generated by jscoverage/JSCover +lib-cov + +# Coverage directory used by tools like istanbul +coverage + +# nyc test coverage +.nyc_output + +# Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files) +.grunt + +# Bower dependency directory (https://bower.io/) +bower_components + +# node-waf configuration +.lock-wscript + +# Compiled binary addons (http://nodejs.org/api/addons.html) +build/Release +build + +# Dependency directories +node_modules/ +jspm_packages/ + +# Typescript v1 declaration files +typings/ + +# Optional npm cache directory +.npm + +# Optional eslint cache +.eslintcache + +# Optional REPL history +.node_repl_history + +# Output of 'npm pack' + +# Yarn Integrity file +.yarn-integrity + +# dotenv environment variables file +.env + + +### Vim ### +# swap +[._]*.s[a-v][a-z] +[._]*.sw[a-p] +[._]s[a-v][a-z] +[._]sw[a-p] +# session +Session.vim +# temporary +.netrwhist +*~ +# auto-generated tag files +tags + +### Windows ### +# Windows thumbnail cache files +Thumbs.db +ehthumbs.db +ehthumbs_vista.db + +# Folder config file +Desktop.ini + +# Recycle Bin used on file shares +$RECYCLE.BIN/ + +# Windows Installer files +*.cab +*.msm +*.msp + +# Windows shortcuts +*.lnk + +# End of https://www.gitignore.io/api/monodevelop,vim,node,windows,archlinuxpackages diff --git a/app/entry.js b/app/entry.js new file mode 100644 index 00000000..e69de29b diff --git a/app/index.html b/app/index.html new file mode 100644 index 00000000..5fb1bc96 --- /dev/null +++ b/app/index.html @@ -0,0 +1,21 @@ + + + + + + GLGram + + + +
+ +
+
+ + +
+ + + diff --git a/gulpfile.js b/gulpfile.js new file mode 100755 index 00000000..24190d6d --- /dev/null +++ b/gulpfile.js @@ -0,0 +1,23 @@ +'use strict'; + +const gulp = require('gulp'); +const eslint = require('gulp-eslint'); +const mocha = require('gulp-mocha'); + +gulp.task('test', function () { + gulp.src('./test/*-test.js', { read: false}) + .pipe(mocha({reporter: 'spec'})); +}); + +gulp.task('lint', function() { + return gulp.src(['**/*.js', '!node_modules']) + .pipe(eslint()) + .pipe(eslint.format()) + .pipe(eslint.failAfterError()); +}); + +gulp.task('dev', function() { + gulp.watch(['**/*.js', '!node_modules'], ['lint', 'test']); +}); + +gulp.task('default', ['dev']); diff --git a/package.json b/package.json new file mode 100644 index 00000000..92d921e6 --- /dev/null +++ b/package.json @@ -0,0 +1,42 @@ +{ + "name": "angular-routing-demo", + "version": "1.0.0", + "description": "", + "main": "index.js", + "scripts": { + "build": "./node_modules/webpack/bin/webpack.js", + "watch": "./node_modules/webpack-dev-server/bin/webpack-dev-server.js --inline --hot" + }, + "keywords": [], + "author": "Gary Lundgren", + "license": "ISC", + "dependencies": { + "angular": "^1.6.3", + "angular-animate": "^1.6.3", + "angular-route": "^1.6.3", + "angular-touch": "^1.6.3", + "angular-ui-router": "^0.4.2", + "babel-core": "^6.24.0", + "babel-loader": "^6.4.1", + "babel-preset-es2015": "^6.24.0", + "camelcase": "^4.0.0", + "clean-webpack-plugin": "^0.1.16", + "css-loader": "^0.27.3", + "dotenv": "^4.0.0", + "extract-text-webpack-plugin": "^2.1.0", + "file-loader": "^0.10.1", + "html-loader": "^0.4.5", + "html-webpack-plugin": "^2.28.0", + "node-sass": "^4.5.1", + "pascalcase": "^0.1.1", + "resolve-url-loader": "^2.0.2", + "sass-loader": "^6.0.3", + "style-loader": "^0.16.0", + "ui-router": "^1.0.0-alpha.3", + "url-loader": "^0.5.8", + "webpack": "^2.3.2" + }, + "devDependencies": { + "webpack-dev-server": "^2.4.2" + } +} diff --git a/reset.scss b/reset.scss new file mode 100644 index 00000000..ed11813c --- /dev/null +++ b/reset.scss @@ -0,0 +1,48 @@ +/* http://meyerweb.com/eric/tools/css/reset/ + v2.0 | 20110126 + License: none (public domain) +*/ + +html, body, div, span, applet, object, iframe, +h1, h2, h3, h4, h5, h6, p, blockquote, pre, +a, abbr, acronym, address, big, cite, code, +del, dfn, em, img, ins, kbd, q, s, samp, +small, strike, strong, sub, sup, tt, var, +b, u, i, center, +dl, dt, dd, ol, ul, li, +fieldset, form, label, legend, +table, caption, tbody, tfoot, thead, tr, th, td, +article, aside, canvas, details, embed, +figure, figcaption, footer, header, hgroup, +menu, nav, output, ruby, section, summary, +time, mark, audio, video { + margin: 0; + padding: 0; + border: 0; + font-size: 100%; + font: inherit; + vertical-align: baseline; +} +/* HTML5 display-role reset for older browsers */ +article, aside, details, figcaption, figure, +footer, header, hgroup, menu, nav, section { + display: block; +} +body { + line-height: 1; +} +ol, ul { + list-style: none; +} +blockquote, q { + quotes: none; +} +blockquote:before, blockquote:after, +q:before, q:after { + content: ''; + content: none; +} +table { + border-collapse: collapse; + border-spacing: 0; +} diff --git a/webpack.config.js b/webpack.config.js new file mode 100644 index 00000000..48289a3b --- /dev/null +++ b/webpack.config.js @@ -0,0 +1,50 @@ +{ + "name": "angular-routing-demo", + "version": "1.0.0", + "description": "", + "main": "index.js", + "scripts": { + "build": "./node_modules/webpack/bin/webpack.js", + "watch": "./node_modules/webpack-dev-server/bin/webpack-dev-server.js --inline --hot", + "test-watch": "./node_modules/karma/bin/karma start", + "test": "./node_modules/karma/bin/karma start --single-run" + }, + "keywords": [], + "author": "Gary Lundgren", + "license": "ISC", + "dependencies": { + "angular": "^1.6.3", + "angular-animate": "^1.6.3", + "angular-route": "^1.6.3", + "angular-touch": "^1.6.3", + "angular-ui-router": "^0.4.2", + "babel-core": "^6.24.0", + "babel-loader": "^6.4.1", + "babel-preset-es2015": "^6.24.0", + "camelcase": "^4.0.0", + "clean-webpack-plugin": "^0.1.16", + "css-loader": "^0.27.3", + "dotenv": "^4.0.0", + "extract-text-webpack-plugin": "^2.1.0", + "file-loader": "^0.10.1", + "html-loader": "^0.4.5", + "html-webpack-plugin": "^2.28.0", + "node-sass": "^4.5.1", + "pascalcase": "^0.1.1", + "resolve-url-loader": "^2.0.2", + "sass-loader": "^6.0.3", + "style-loader": "^0.16.0", + "ui-router": "^1.0.0-alpha.3", + "url-loader": "^0.5.8", + "webpack": "^2.3.2" + }, + "devDependencies": { + "angular-mocks": "^1.6.3", + "jasmine-core": "^2.5.2", + "karma": "^1.5.0", + "karma-jasmine": "^1.1.0", + "karma-phantomjs-launcher": "^1.0.4", + "karma-webpack": "^2.0.3", + "webpack-dev-server": "^2.4.2" + } +} From d61320c7005105ccd8f431bd234fb488118eef03 Mon Sep 17 00:00:00 2001 From: GLSea1979 Date: Tue, 28 Mar 2017 16:43:45 -0700 Subject: [PATCH 02/22] initial build --- app/component/login/login.html | 31 +++++++++ app/component/login/login.js | 27 ++++++++ app/component/signup/signup.html | 25 ++++++++ app/component/signup/signup.js | 25 ++++++++ app/config/router-config.js | 31 +++++++++ app/entry.js | 39 ++++++++++++ app/index.html | 18 ++---- app/scss/main.scss | 3 + app/service/auth-service.js | 88 ++++++++++++++++++++++++++ app/view/home/home-controller.js | 9 +++ app/view/home/home.html | 3 + app/view/landing/landing-controller.js | 10 +++ app/view/landing/landing.html | 25 ++++++++ 13 files changed, 320 insertions(+), 14 deletions(-) create mode 100644 app/component/login/login.html create mode 100644 app/component/login/login.js create mode 100644 app/component/signup/signup.html create mode 100644 app/component/signup/signup.js create mode 100644 app/config/router-config.js create mode 100644 app/scss/main.scss create mode 100644 app/service/auth-service.js create mode 100644 app/view/home/home-controller.js create mode 100644 app/view/home/home.html create mode 100644 app/view/landing/landing-controller.js create mode 100644 app/view/landing/landing.html diff --git a/app/component/login/login.html b/app/component/login/login.html new file mode 100644 index 00000000..8addd906 --- /dev/null +++ b/app/component/login/login.html @@ -0,0 +1,31 @@ + diff --git a/app/component/login/login.js b/app/component/login/login.js new file mode 100644 index 00000000..dec7c927 --- /dev/null +++ b/app/component/login/login.js @@ -0,0 +1,27 @@ +'use strict'; + +require('./_login.scss'); + +module.exports = { + template: require('./login.html'), + controller: ['$log', '$location', 'authService', LoginController], + controllerAs: 'loginCtrl' +}; + +function LoginController($log, $location, authService) { + $log.debug('LoginController'); + + authService.getToken() + .then( () => { + $location.url('/home'); + }); + + this.login = function() { + $log.debug('loginCtrl.login'); + + authService.login(this.user) + .then( () => { + $location.url('/home'); + }); + }; +}; diff --git a/app/component/signup/signup.html b/app/component/signup/signup.html new file mode 100644 index 00000000..44bc8764 --- /dev/null +++ b/app/component/signup/signup.html @@ -0,0 +1,25 @@ + diff --git a/app/component/signup/signup.js b/app/component/signup/signup.js new file mode 100644 index 00000000..b5923714 --- /dev/null +++ b/app/component/signup/signup.js @@ -0,0 +1,25 @@ +'use strict'; + +module.exports = { + template: require('./signup.html'), + controller: ['$log', '$location', 'authService', SignupController], + controllerAs: 'signupCtrl' +}; + +function SignupController($log, $location, authService) { + $log.debug('SignupController'); + + authService.getToken() + .then( () => { + $location.url('/home'); + }); + + this.signup = function(user) { + $log.debug('signupCtrl.signup'); + + authService.signup(user) + .then( () => { + $location.url('/home') + }); + }; +}; diff --git a/app/config/router-config.js b/app/config/router-config.js new file mode 100644 index 00000000..5357c24b --- /dev/null +++ b/app/config/router-config.js @@ -0,0 +1,31 @@ +'use strict'; + +module.exports = ['$stateProvider', '$urlRouterProvider', routerConfig]; + +function routerConfig($stateProvider, $urlRouterProvider) { + $urlRouterProvider.when('', '/join#signup'); + $urlRouterProvider.when('/', '/join#signup'); + $urlRouterProvider.when('/signup', '/join#signup'); + $urlRouterProvider.when('/login', '/join#login'); + + let states = [ + { + name: 'home', + url: '/home', + template: require('../view/home/home.html'), + controller: 'HomeController', + controllerAs: 'homeCtrl' + }, + { + name: 'landing', + url: '/join', + template: require('../view/landing/landing.html'), + controller: 'LandingController', + controllerAs: 'landingCtrl' + } + ]; + + states.forEach( state => { + $stateProvider.state(state); + }); +}; diff --git a/app/entry.js b/app/entry.js index e69de29b..358681e9 100644 --- a/app/entry.js +++ b/app/entry.js @@ -0,0 +1,39 @@ +'use strict'; + +require('./scss/main.scss'); + +const path = require('path'); +const angular = require('angular'); +const camelcase = require('camelcase'); +const pascalcase = require('pascalcase'); +const uiRouter = require('angular-ui-router'); +const ngTouch = require('angular-touch'); +const ngAnimate = require('angular-animate'); + +const cfgram = angular.module('cfgram', [ngTouch, ngAnimate, uiRouter]); + +let context = require.context('./config/', true, /\.js$/); +context.keys().forEach( key => { + cfgram.config(context(key)); +}); + +context = require.context('./view/', true, /\.js$/); +context.keys().forEach( key => { + let name = pascalcase(path.basename(key, '.js')); + let module = context(key); + cfgram.controller(name, module); +}); + +context = require.context('./service/', true, /\.js$/); +context.keys().forEach( key => { + let name = camelcase(path.basename(key, '.js')); + let module = context(key); + cfgram.service(name, module); +}); + +context = require.context('./component/', true, /\.js$/); +context.keys().forEach( key => { + let name = camelcase(path.basename(key, '.js')); + let module = context(key); + cfgram.component(name, module); +}); diff --git a/app/index.html b/app/index.html index 5fb1bc96..3c8d0430 100644 --- a/app/index.html +++ b/app/index.html @@ -1,21 +1,11 @@ - + - - GLGram + + cfgram. - -
- -
-
- - -
-
- -
+ diff --git a/app/scss/main.scss b/app/scss/main.scss new file mode 100644 index 00000000..ae844dcf --- /dev/null +++ b/app/scss/main.scss @@ -0,0 +1,3 @@ +body { + background: blue; +} diff --git a/app/service/auth-service.js b/app/service/auth-service.js new file mode 100644 index 00000000..41fe4c15 --- /dev/null +++ b/app/service/auth-service.js @@ -0,0 +1,88 @@ +'use strict'; + +module.exports = ['$q', '$log', '$http', '$window', authService]; + +function authService($q, $log, $http, $window) { + $log.debug('authService'); + + let service = {}; + let token = null; + + function setToken(_token) { + $log.debug('authService.setToken'); + + if (! _token) { + return $q.reject(new Error('no token')); + }; + + $window.localStorage.setItem('token', _token); + token = _token; + return $q.resolve(token); + } + + service.getToken = function() { + $log.debug('authService.getToken'); + if (token) { + return $q.resolve(token); + }; + + token = $window.localStorage.getItem('token'); + if (token) return $q.resolve(token); + return $q.reject(new Error('token not found')); + }; + + service.signup = function(user) { + $log.debug('authService.signup'); + + let url = `${__API_URL__}/api/signup`; + let config = { + headers: { + 'Content-Type': 'application/json', + 'Accept': 'application/json' + } + }; + + return $http.post(url, user, config) + .then( res => { + $log.log('success:', res.data); + return setToken(res.data); + }) + .catch( err => { + $log.error('failure:', err.message); + return $q.reject(err); + }); + }; + + service.logout = function() { + $log.debug('authService.logout'); + + $window.localStorage.removeItem('token'); + token = null; + return $q.resolve(); + }; + + service.login = function(user) { + $log.debug('authService.login'); + + let url = `${__API_URL__}/api/login`; + let base64 = $window.btoa(`${user.username}:${user.password}`); + let config = { + headers: { + Accept: 'application/json', + Authorization: `Basic ${base64}` + } + }; + + return $http.get(url, config) + .then( res => { + $log.log('success', res.data); + return setToken(res.data); + }) + .catch( err => { + $log.error(err.message); + return $q.reject(err); + }); + }; + + return service; +}; diff --git a/app/view/home/home-controller.js b/app/view/home/home-controller.js new file mode 100644 index 00000000..7f48d88b --- /dev/null +++ b/app/view/home/home-controller.js @@ -0,0 +1,9 @@ +'use strict'; + +require('./_home.scss'); + +module.exports = ['$log', HomeController]; + +function HomeController($log) { + $log.debug('HomeController'); +}; diff --git a/app/view/home/home.html b/app/view/home/home.html new file mode 100644 index 00000000..eeeb0858 --- /dev/null +++ b/app/view/home/home.html @@ -0,0 +1,3 @@ +
+

welcome home!

+
diff --git a/app/view/landing/landing-controller.js b/app/view/landing/landing-controller.js new file mode 100644 index 00000000..783dfec3 --- /dev/null +++ b/app/view/landing/landing-controller.js @@ -0,0 +1,10 @@ +'use strict'; + +require('./_landing.scss'); + +module.exports = ['$log', '$location', '$rootScope', 'authService', LandingController]; + +function LandingController($log, $location, authService) { + let url = $location.url(); + this.showSignup = url === '/join#signup' || url === '/join'; +}; diff --git a/app/view/landing/landing.html b/app/view/landing/landing.html new file mode 100644 index 00000000..efa4547a --- /dev/null +++ b/app/view/landing/landing.html @@ -0,0 +1,25 @@ +
+
+
+ +

already a member?

+ + sign in here. + +
+
+ +
+
+ +

want to sign up?

+ + sign up here. + +
+
+
From bf727ee1feea129e16d0d7ba96914807973e36b4 Mon Sep 17 00:00:00 2001 From: GLSea1979 Date: Tue, 28 Mar 2017 16:50:50 -0700 Subject: [PATCH 03/22] built ready for styling --- app/component/login/_login.scss | 0 app/component/signup/_signup.scss | 0 app/view/home/_home.scss | 0 app/view/landing/_landing.scss | 0 webpack.config.js | 88 ++++++++++++++----------------- 5 files changed, 40 insertions(+), 48 deletions(-) create mode 100644 app/component/login/_login.scss create mode 100644 app/component/signup/_signup.scss create mode 100644 app/view/home/_home.scss create mode 100644 app/view/landing/_landing.scss diff --git a/app/component/login/_login.scss b/app/component/login/_login.scss new file mode 100644 index 00000000..e69de29b diff --git a/app/component/signup/_signup.scss b/app/component/signup/_signup.scss new file mode 100644 index 00000000..e69de29b diff --git a/app/view/home/_home.scss b/app/view/home/_home.scss new file mode 100644 index 00000000..e69de29b diff --git a/app/view/landing/_landing.scss b/app/view/landing/_landing.scss new file mode 100644 index 00000000..e69de29b diff --git a/webpack.config.js b/webpack.config.js index 48289a3b..5125b9f7 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -1,50 +1,42 @@ -{ - "name": "angular-routing-demo", - "version": "1.0.0", - "description": "", - "main": "index.js", - "scripts": { - "build": "./node_modules/webpack/bin/webpack.js", - "watch": "./node_modules/webpack-dev-server/bin/webpack-dev-server.js --inline --hot", - "test-watch": "./node_modules/karma/bin/karma start", - "test": "./node_modules/karma/bin/karma start --single-run" +'use strict'; + +require('dotenv').load(); + +const webpack = require('webpack'); +const HTMLPlugin = require('html-webpack-plugin'); +const ExtractTextPlugin = require('extract-text-webpack-plugin'); + +module.exports = { + devtool: 'eval', + entry: `${__dirname}/app/entry.js`, + output: { + filename: 'bundle.js', + path: `${__dirname}/build` }, - "keywords": [], - "author": "Gary Lundgren", - "license": "ISC", - "dependencies": { - "angular": "^1.6.3", - "angular-animate": "^1.6.3", - "angular-route": "^1.6.3", - "angular-touch": "^1.6.3", - "angular-ui-router": "^0.4.2", - "babel-core": "^6.24.0", - "babel-loader": "^6.4.1", - "babel-preset-es2015": "^6.24.0", - "camelcase": "^4.0.0", - "clean-webpack-plugin": "^0.1.16", - "css-loader": "^0.27.3", - "dotenv": "^4.0.0", - "extract-text-webpack-plugin": "^2.1.0", - "file-loader": "^0.10.1", - "html-loader": "^0.4.5", - "html-webpack-plugin": "^2.28.0", - "node-sass": "^4.5.1", - "pascalcase": "^0.1.1", - "resolve-url-loader": "^2.0.2", - "sass-loader": "^6.0.3", - "style-loader": "^0.16.0", - "ui-router": "^1.0.0-alpha.3", - "url-loader": "^0.5.8", - "webpack": "^2.3.2" - }, - "devDependencies": { - "angular-mocks": "^1.6.3", - "jasmine-core": "^2.5.2", - "karma": "^1.5.0", - "karma-jasmine": "^1.1.0", - "karma-phantomjs-launcher": "^1.0.4", - "karma-webpack": "^2.0.3", - "webpack-dev-server": "^2.4.2" + plugins: [ + new HTMLPlugin({ + template: `${__dirname}/app/index.html` + }), + new ExtractTextPlugin('bundle.css'), + new webpack.DefinePlugin({ + __API_URL__: JSON.stringify(process.env.API_URL) + }) + ], + module: { + rules: [ + { + test: /\.js$/, + exclude: /node_modules/, + loader: 'babel-loader' + }, + { + test: /\.html$/, + loader: 'html-loader' + }, + { + test: /\.scss$/, + loader: ExtractTextPlugin.extract(['css-loader', 'sass-loader']) + } + ] } -} +}; From 23e46c2a1e97241b2f2f956e0452743b063bb175 Mon Sep 17 00:00:00 2001 From: GLSea1979 Date: Tue, 28 Mar 2017 17:30:00 -0700 Subject: [PATCH 04/22] started styling --- .../assets => app/assets/img}/cf-logo.png | Bin app/index.html | 5 ++++ app/scss/base/base.scss | 4 +++ reset.scss => app/scss/base/reset.scss | 0 app/scss/layout/content.scss | 0 app/scss/layout/footer.scss | 0 app/scss/layout/header.scss | 11 ++++++++ app/scss/main.scss | 14 ++++++++-- app/scss/theme/_vars.scss | 10 +++++++ karma.conf.js | 26 ++++++++++++++++++ webpack.config.js | 4 +++ 11 files changed, 71 insertions(+), 3 deletions(-) rename {wireframes/assets => app/assets/img}/cf-logo.png (100%) create mode 100644 app/scss/base/base.scss rename reset.scss => app/scss/base/reset.scss (100%) create mode 100644 app/scss/layout/content.scss create mode 100644 app/scss/layout/footer.scss create mode 100644 app/scss/layout/header.scss create mode 100644 app/scss/theme/_vars.scss create mode 100644 karma.conf.js diff --git a/wireframes/assets/cf-logo.png b/app/assets/img/cf-logo.png similarity index 100% rename from wireframes/assets/cf-logo.png rename to app/assets/img/cf-logo.png diff --git a/app/index.html b/app/index.html index 3c8d0430..f8cf659e 100644 --- a/app/index.html +++ b/app/index.html @@ -5,7 +5,12 @@ cfgram. +
+ +

cfgram

+
+
diff --git a/app/scss/base/base.scss b/app/scss/base/base.scss new file mode 100644 index 00000000..fd696c47 --- /dev/null +++ b/app/scss/base/base.scss @@ -0,0 +1,4 @@ +body { + background: $grey; + font-family: helvetica; +} diff --git a/reset.scss b/app/scss/base/reset.scss similarity index 100% rename from reset.scss rename to app/scss/base/reset.scss diff --git a/app/scss/layout/content.scss b/app/scss/layout/content.scss new file mode 100644 index 00000000..e69de29b diff --git a/app/scss/layout/footer.scss b/app/scss/layout/footer.scss new file mode 100644 index 00000000..e69de29b diff --git a/app/scss/layout/header.scss b/app/scss/layout/header.scss new file mode 100644 index 00000000..ce23aeca --- /dev/null +++ b/app/scss/layout/header.scss @@ -0,0 +1,11 @@ +header { + background: $darkgrey; + color: $white; + padding-top: 10px; + width: 100%; + height: 20px; +} + +div { + background-image: url('../../assets/img/cf-logo.png'); +} diff --git a/app/scss/main.scss b/app/scss/main.scss index ae844dcf..8bf3b6ca 100644 --- a/app/scss/main.scss +++ b/app/scss/main.scss @@ -1,3 +1,11 @@ -body { - background: blue; -} +// ::::: Base :::::::::// +@import "./base/reset"; +@import "./theme/vars"; +@import "./base/base"; +// ::::: Layout :::::: // +@import "./layout/header"; +@import "./layout/content"; +@import "./layout/footer"; +// ::::: Components ::::: // +@import "../component/login/login"; +@import "../component/signup/signup"; diff --git a/app/scss/theme/_vars.scss b/app/scss/theme/_vars.scss new file mode 100644 index 00000000..f963c0de --- /dev/null +++ b/app/scss/theme/_vars.scss @@ -0,0 +1,10 @@ +// Global variables // + + + +// Pallette // + +$darkgrey: rgb(68, 77, 86); +$grey: rgb(209, 213, 218); +$white: rgb(255, 255, 255); +$black: rgb(0, 0, 0); diff --git a/karma.conf.js b/karma.conf.js new file mode 100644 index 00000000..b174dbe3 --- /dev/null +++ b/karma.conf.js @@ -0,0 +1,26 @@ +const webpackConfig = require('./webpack.config.js'); +webpackConfig.entry = {}; + +module.exports = function(config) { + config.set({ + webpack: webpackConfig, + basePath: '', + frameworks: ['jasmine'], + files: [ + 'test/**/*-test.js' + ], + exclude: [ + ], + preprocessors: { + 'test/**/*-test.js': ['webpack'] + }, + reporters: ['mocha'], + port: 9876, + colors: true, + logLevel: config.LOG_INFO, + autoWatch: true, + browsers: ['PhantomJS'], + singleRun: false, + concurrency: Infinity + }); +}; diff --git a/webpack.config.js b/webpack.config.js index 5125b9f7..e0db6fce 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -36,6 +36,10 @@ module.exports = { { test: /\.scss$/, loader: ExtractTextPlugin.extract(['css-loader', 'sass-loader']) + }, + { + test: /\.png$/, + loader: 'url-loader' } ] } From 611417bca2e55d9793498e39dcb9cda3529f1a3a Mon Sep 17 00:00:00 2001 From: GLSea1979 Date: Tue, 28 Mar 2017 22:37:25 -0700 Subject: [PATCH 05/22] fixed sign up styling --- app/component/signup/_signup.scss | 23 +++++++++++++++++++++ app/component/signup/signup.html | 3 ++- app/index.html | 14 +++++++------ app/scss/base/base.scss | 10 +++++++++ app/scss/layout/footer.scss | 9 ++++++++ app/scss/layout/header.scss | 20 ++++++++++++++---- app/scss/main.scss | 3 +++ app/scss/theme/_vars.scss | 4 ++++ app/{assets => scss/theme}/img/cf-logo.png | Bin app/view/landing/_landing.scss | 22 ++++++++++++++++++++ 10 files changed, 97 insertions(+), 11 deletions(-) rename app/{assets => scss/theme}/img/cf-logo.png (100%) diff --git a/app/component/signup/_signup.scss b/app/component/signup/_signup.scss index e69de29b..79a2b368 100644 --- a/app/component/signup/_signup.scss +++ b/app/component/signup/_signup.scss @@ -0,0 +1,23 @@ +h2 { + padding: $gutter 0 $gutter-sm 0; + margin-left: $gutter; + font-size: 1.3vw; +} + +.input-std { + width: 90%; + margin: 0 $gutter $gutter; + height: 3vw; + + +} + +::-webkit-input-placeholder { + text-indent: $gutter-sm; + font-size: 1.1vw; +} + +.btn-std { + float: right; + margin-right: $gutter; +} diff --git a/app/component/signup/signup.html b/app/component/signup/signup.html index 44bc8764..801dfeb1 100644 --- a/app/component/signup/signup.html +++ b/app/component/signup/signup.html @@ -1,11 +1,12 @@ diff --git a/app/component/navbar/_navbar.scss b/app/component/navbar/_navbar.scss index 197ccc09..bd279631 100644 --- a/app/component/navbar/_navbar.scss +++ b/app/component/navbar/_navbar.scss @@ -4,3 +4,16 @@ float: right; margin-right: $gutter; } + +.logo { + display: inline-block; + float: left; + margin: 0 $gutter; + height: 3vw; + width: 3vw; + background: $white; +} + +h2 { + float: left; +} diff --git a/app/config/log-config.js b/app/config/log-config.js index c84d58c8..01068985 100644 --- a/app/config/log-config.js +++ b/app/config/log-config.js @@ -4,4 +4,4 @@ module.exports = ['$logProvider', logConfig]; function logConfig($logProvider) { $logProvider.debugEnabled(__DEBUG__); -}; +} diff --git a/app/scss/base/base.scss b/app/scss/base/base.scss index 90ec4b61..ea439b3f 100644 --- a/app/scss/base/base.scss +++ b/app/scss/base/base.scss @@ -23,8 +23,8 @@ body { background: $white; color: $darkgrey; border-radius: 3px; - font-size: 1vw; - padding: 1vw 3vw; + font-size: 1.2vw; + padding: 1vw 5vw; } input { diff --git a/app/scss/layout/header.scss b/app/scss/layout/header.scss index fb3530d2..b9231fdf 100644 --- a/app/scss/layout/header.scss +++ b/app/scss/layout/header.scss @@ -6,16 +6,5 @@ header { height: 5vw; font-size: 2.7vw; - .logo { - display: inline-block; - float: left; - margin: 0 $gutter; - height: 3vw; - width: 3vw; - background: $white; - } - - h2 { - float: left; - } + } diff --git a/app/service/gallery-service.js b/app/service/gallery-service.js index 02c2fd04..355f1c1e 100644 --- a/app/service/gallery-service.js +++ b/app/service/gallery-service.js @@ -77,5 +77,66 @@ function galleryService($q, $log, $http, authService) { }); }; + service.updateGallery = function(galleryID, galleryData) { + $log.debug('galleryService.updateGallery'); + + return authService.getToken() + .then( token => { + let url = `${__API_URL__}/api/gallery/${galleryID}`; + let config = { + headers: { + Accept: 'application/json', + Authorization: `Bearer ${token}`, + 'Content-Type': 'application/json' + } + }; + + return $http.put(url, galleryData, config); + }) + .then( res => { + for (let i = 0; i < service.galleries.length; i++) { + let current = service.galleries[i]; + if (current._id === galleryID) { + service.galleries[i] = res.data; + break; + } + } + return res.data; + }) + .catch( err => { + $log.error(err.message); + return $q.reject(err); + }); + }; + + service.deleteGallery = function(galleryID) { + $log.debug('service.deleteGallery'); + + return authService.getToken() + .then( token => { + let url = `${__API_URL__}/api/gallery/${galleryID}`; + let config = { + headers: { + Authorization: `Bearer ${token}` + } + }; + + return $http.delete(url, config); + }) + .then( res => { + for (let i=0; i < service.galleries.length; i++) { + let current = service.galleries[i]; + if (current._id === galleryID) { + service.galleris.splice(i, 1); + break; + } + } + }) + .catch( err => { + $log.error(err.message); + return $q.reject(err); + }); + }; + return service; }; diff --git a/app/view/home/home.html b/app/view/home/home.html index 9c023fb5..f523fcf5 100644 --- a/app/view/home/home.html +++ b/app/view/home/home.html @@ -1,11 +1,7 @@
-
    -
  • - name: {{ gallery.name }} - description: {{ gallery.desc }} - id: {{ gallery._id }} -
    • +
      Galleries +
From dc3acc2d9b7b642aea6b92edbd26a66e9a883db5 Mon Sep 17 00:00:00 2001 From: GLSea1979 Date: Mon, 3 Apr 2017 13:41:42 -0700 Subject: [PATCH 13/22] initial build --- .../_thumbnail-container.scss | 0 .../thumbnail-container.html | 10 +++++ .../thumbnail-container.js | 11 +++++ .../gallery/thumbnail/_thumbnail.scss | 0 .../gallery/thumbnail/thumbnail.html | 5 +++ app/component/gallery/thumbnail/thumbnail.js | 20 +++++++++ .../gallery/upload-pic/_upload-pic.scss | 0 .../gallery/upload-pic/upload-pic.html | 23 ++++++++++ .../gallery/upload-pic/upload-pic.js | 27 ++++++++++++ app/entry.js | 3 +- app/service/pic-service.js | 43 +++++++++++++++++++ app/view/home/home-controller.js | 7 +++ app/view/home/home.html | 9 +++- package.json | 1 + 14 files changed, 157 insertions(+), 2 deletions(-) create mode 100644 app/component/gallery/thumbnail-container/_thumbnail-container.scss create mode 100644 app/component/gallery/thumbnail-container/thumbnail-container.html create mode 100644 app/component/gallery/thumbnail-container/thumbnail-container.js create mode 100644 app/component/gallery/thumbnail/_thumbnail.scss create mode 100644 app/component/gallery/thumbnail/thumbnail.html create mode 100644 app/component/gallery/thumbnail/thumbnail.js create mode 100644 app/component/gallery/upload-pic/_upload-pic.scss create mode 100644 app/component/gallery/upload-pic/upload-pic.html create mode 100644 app/component/gallery/upload-pic/upload-pic.js create mode 100644 app/service/pic-service.js diff --git a/app/component/gallery/thumbnail-container/_thumbnail-container.scss b/app/component/gallery/thumbnail-container/_thumbnail-container.scss new file mode 100644 index 00000000..e69de29b diff --git a/app/component/gallery/thumbnail-container/thumbnail-container.html b/app/component/gallery/thumbnail-container/thumbnail-container.html new file mode 100644 index 00000000..6bc8582c --- /dev/null +++ b/app/component/gallery/thumbnail-container/thumbnail-container.html @@ -0,0 +1,10 @@ +
+

{{ thumbnailContainerCtrl.gallery.name }}

+ + + +
+ + +
+
diff --git a/app/component/gallery/thumbnail-container/thumbnail-container.js b/app/component/gallery/thumbnail-container/thumbnail-container.js new file mode 100644 index 00000000..18bf16d4 --- /dev/null +++ b/app/component/gallery/thumbnail-container/thumbnail-container.js @@ -0,0 +1,11 @@ +'use strict'; + +require('./_thumbnail-container.scss'); + +module.exports = { + template: require('./thumbnail-container.html'), + controllerAs: 'thumbnailContainerCtrl', + bindings: { + gallery: '<' + } +}; diff --git a/app/component/gallery/thumbnail/_thumbnail.scss b/app/component/gallery/thumbnail/_thumbnail.scss new file mode 100644 index 00000000..e69de29b diff --git a/app/component/gallery/thumbnail/thumbnail.html b/app/component/gallery/thumbnail/thumbnail.html new file mode 100644 index 00000000..11ddbbd2 --- /dev/null +++ b/app/component/gallery/thumbnail/thumbnail.html @@ -0,0 +1,5 @@ +
+ {{ thumbnailCtrl.pic.desc }} + delete + +
diff --git a/app/component/gallery/thumbnail/thumbnail.js b/app/component/gallery/thumbnail/thumbnail.js new file mode 100644 index 00000000..fe96846a --- /dev/null +++ b/app/component/gallery/thumbnail/thumbnail.js @@ -0,0 +1,20 @@ +'use strict'; + +require('./_thumbnail.scss'); + +module.exports = { + template: require('./thumbnail.html'), + controller: ['$log', 'picService', ThumbnailController], + controllerAs: 'thumbnailCtrl', + bindings: { + pic: '<' + } +}; + +function ThumbnailController($log, picService) { + $log.debug('ThumbnailController'); + + this.deletePic = function() { + $log.debug('thumbnailCtrl.deletePic'); + }; +}; diff --git a/app/component/gallery/upload-pic/_upload-pic.scss b/app/component/gallery/upload-pic/_upload-pic.scss new file mode 100644 index 00000000..e69de29b diff --git a/app/component/gallery/upload-pic/upload-pic.html b/app/component/gallery/upload-pic/upload-pic.html new file mode 100644 index 00000000..3b0f90ca --- /dev/null +++ b/app/component/gallery/upload-pic/upload-pic.html @@ -0,0 +1,23 @@ +
+
+ +

upload a new pic

+ +
+ + +
+ +
+

+ select a pic to upload +

+ + +
+
+
diff --git a/app/component/gallery/upload-pic/upload-pic.js b/app/component/gallery/upload-pic/upload-pic.js new file mode 100644 index 00000000..ff32a526 --- /dev/null +++ b/app/component/gallery/upload-pic/upload-pic.js @@ -0,0 +1,27 @@ +'use strict'; + +require('./_upload-pic.scss'); + +module.exports ={ + template: require('./upload-pic.html'), + controller: ['$log', 'picService', UploadPicController], + controllerAs: 'uploadPicCtrl', + bindings: { + gallery: '<' + } +}; + +function UploadPicController($log, picService) { + $log.debug('UploadPicController'); + + this.pic = {}; + + this.uploadPic = function() { + picService.uploadGalleryPic(this.gallery, this.pic) + .then( () => { + this.pic.name = null; + this.pic.desc = null; + this.pic.file = null; + }); + }; +}; diff --git a/app/entry.js b/app/entry.js index 358681e9..f8762a51 100644 --- a/app/entry.js +++ b/app/entry.js @@ -9,8 +9,9 @@ const pascalcase = require('pascalcase'); const uiRouter = require('angular-ui-router'); const ngTouch = require('angular-touch'); const ngAnimate = require('angular-animate'); +const ngFileUpload = require('ng-file-upload'); -const cfgram = angular.module('cfgram', [ngTouch, ngAnimate, uiRouter]); +const cfgram = angular.module('cfgram', [ngTouch, ngAnimate, uiRouter, ngFileUpload]); let context = require.context('./config/', true, /\.js$/); context.keys().forEach( key => { diff --git a/app/service/pic-service.js b/app/service/pic-service.js new file mode 100644 index 00000000..e350091d --- /dev/null +++ b/app/service/pic-service.js @@ -0,0 +1,43 @@ +'use strict'; + +module.exports['$q', '$log', '$http', 'Upload', 'authService', picService]; + +function picService($q, $log, $http, Upload, authService) { + $log.debug('picService'); + + let service = {}; + + service.uploadGalleryPic = function(galleryData, picData) { + $log.debug('service.uploadGalleryPic'); + + return authService.getToken() + .then( token => { + let url = `${__API_URL__}/api/gallery/${galleryData._id}/pic`; + let headers = { + Authorization: `Bearer ${token}`, + Accept: 'application/json' + }; + + return Upload.upload({ + url, + headers, + method: 'POST', + data: { + name: picData.name, + desc: picData.desc, + file: picData.file + } + }); + }) + .then( res => { + galleryData.pics.unshift(res.data); + return res.data; + }) + .catch( err => { + $log.log(err.message); + return $q.reject(err); + }) + } + + return service; +} diff --git a/app/view/home/home-controller.js b/app/view/home/home-controller.js index 43e3232b..737d2bc5 100644 --- a/app/view/home/home-controller.js +++ b/app/view/home/home-controller.js @@ -11,9 +11,16 @@ function HomeController($log, $rootScope, galleryService) { galleryService.fetchGalleries() .then( galleries => { this.galleries = galleries; + this.currentGallery = galleries[0]; }); }; + this.galleryDeleteDone = function(gallery) { + if (this.currentGallery._id === gallery._id) { + this.currentGallery = null; + } + }; + this.fetchGalleries(); $rootScope.$on('$locationChangeSuccess', () => { diff --git a/app/view/home/home.html b/app/view/home/home.html index f523fcf5..43b1ca0a 100644 --- a/app/view/home/home.html +++ b/app/view/home/home.html @@ -2,6 +2,13 @@
    Galleries - +
+ + diff --git a/package.json b/package.json index f49d0104..07e385ab 100644 --- a/package.json +++ b/package.json @@ -28,6 +28,7 @@ "file-loader": "^0.10.1", "html-loader": "^0.4.5", "html-webpack-plugin": "^2.28.0", + "ng-file-upload": "^12.2.13", "node-sass": "^4.5.1", "pascalcase": "^0.1.1", "resolve-url-loader": "^2.0.2", From 63cc35e0ae07d65678d044c18198cdc94a607595 Mon Sep 17 00:00:00 2001 From: GLSea1979 Date: Mon, 3 Apr 2017 16:03:51 -0700 Subject: [PATCH 14/22] pics will upload --- .../gallery/thumbnail-container/thumbnail-container.html | 2 +- app/component/gallery/thumbnail/thumbnail.html | 2 +- app/component/gallery/upload-pic/upload-pic.html | 6 +++--- app/component/gallery/upload-pic/upload-pic.js | 2 ++ app/service/pic-service.js | 6 ++++-- app/view/home/home.html | 4 ++-- 6 files changed, 13 insertions(+), 9 deletions(-) diff --git a/app/component/gallery/thumbnail-container/thumbnail-container.html b/app/component/gallery/thumbnail-container/thumbnail-container.html index 6bc8582c..1a86d3c8 100644 --- a/app/component/gallery/thumbnail-container/thumbnail-container.html +++ b/app/component/gallery/thumbnail-container/thumbnail-container.html @@ -1,7 +1,7 @@

{{ thumbnailContainerCtrl.gallery.name }}

- +
diff --git a/app/component/gallery/thumbnail/thumbnail.html b/app/component/gallery/thumbnail/thumbnail.html index 11ddbbd2..6490ebab 100644 --- a/app/component/gallery/thumbnail/thumbnail.html +++ b/app/component/gallery/thumbnail/thumbnail.html @@ -1,5 +1,5 @@
- {{ thumbnailCtrl.pic.desc }} + {{ thumbnailCtrl.pic.desc }} delete
diff --git a/app/component/gallery/upload-pic/upload-pic.html b/app/component/gallery/upload-pic/upload-pic.html index 3b0f90ca..9b434998 100644 --- a/app/component/gallery/upload-pic/upload-pic.html +++ b/app/component/gallery/upload-pic/upload-pic.html @@ -6,13 +6,13 @@

upload a new pic

- - + +

select a pic to upload

diff --git a/app/component/gallery/upload-pic/upload-pic.js b/app/component/gallery/upload-pic/upload-pic.js index ff32a526..14ee542b 100644 --- a/app/component/gallery/upload-pic/upload-pic.js +++ b/app/component/gallery/upload-pic/upload-pic.js @@ -17,8 +17,10 @@ function UploadPicController($log, picService) { this.pic = {}; this.uploadPic = function() { + $log.log('insider', this.pic) picService.uploadGalleryPic(this.gallery, this.pic) .then( () => { + this.pic.name = null; this.pic.desc = null; this.pic.file = null; diff --git a/app/service/pic-service.js b/app/service/pic-service.js index e350091d..18649794 100644 --- a/app/service/pic-service.js +++ b/app/service/pic-service.js @@ -1,6 +1,6 @@ 'use strict'; -module.exports['$q', '$log', '$http', 'Upload', 'authService', picService]; +module.exports = ['$q', '$log', '$http', 'Upload', 'authService', picService]; function picService($q, $log, $http, Upload, authService) { $log.debug('picService'); @@ -9,7 +9,8 @@ function picService($q, $log, $http, Upload, authService) { service.uploadGalleryPic = function(galleryData, picData) { $log.debug('service.uploadGalleryPic'); - + $log.log('ugp galleryData', galleryData); + $log.log('ugp picData', picData); return authService.getToken() .then( token => { let url = `${__API_URL__}/api/gallery/${galleryData._id}/pic`; @@ -31,6 +32,7 @@ function picService($q, $log, $http, Upload, authService) { }) .then( res => { galleryData.pics.unshift(res.data); + $log.log('res.data', res.data); return res.data; }) .catch( err => { diff --git a/app/view/home/home.html b/app/view/home/home.html index 43b1ca0a..cfc46a59 100644 --- a/app/view/home/home.html +++ b/app/view/home/home.html @@ -6,9 +6,9 @@ ng-repeat="item in homeCtrl.galleries" gallery="item" delete-done="homeCtrl.galleryDeleteDone(galleryData)" - ng-click="homeCtrl.currentGallery= item" + ng-click="homeCtrl.currentGallery = item" > - + From bb0d5daccdfcc81b8d53e1361e827e991ec01baf Mon Sep 17 00:00:00 2001 From: GLSea1979 Date: Tue, 4 Apr 2017 15:50:43 -0700 Subject: [PATCH 15/22] tuesday build --- .../create-gallery/_create-gallery.scss | 2 +- .../gallery/edit-gallery/_edit-gallery.scss | 1 + .../gallery/edit-gallery/edit-gallery.html | 1 + .../_thumbnail-container.scss | 1 + .../gallery/thumbnail/_thumbnail.scss | 1 + .../gallery/upload-pic/_upload-pic.scss | 5 +++ .../gallery/upload-pic/upload-pic.html | 1 + app/entry.js | 10 ++--- app/index.html | 6 +-- app/scss/base/base.scss | 6 +++ app/view/home/home.html | 1 + karma.conf.js | 11 +++-- package.json | 10 +++-- test/auth-service-test.js | 31 ++++++++++++++ test/example-test.js | 7 ++++ test/gallery-service-test.js | 41 +++++++++++++++++++ 16 files changed, 119 insertions(+), 16 deletions(-) create mode 100644 test/auth-service-test.js create mode 100644 test/example-test.js create mode 100644 test/gallery-service-test.js diff --git a/app/component/gallery/create-gallery/_create-gallery.scss b/app/component/gallery/create-gallery/_create-gallery.scss index 7e1ef2bc..235963b9 100644 --- a/app/component/gallery/create-gallery/_create-gallery.scss +++ b/app/component/gallery/create-gallery/_create-gallery.scss @@ -1 +1 @@ -@import "../../../scss/theme/vars"; +@import "../../../scss/main"; diff --git a/app/component/gallery/edit-gallery/_edit-gallery.scss b/app/component/gallery/edit-gallery/_edit-gallery.scss index e69de29b..235963b9 100644 --- a/app/component/gallery/edit-gallery/_edit-gallery.scss +++ b/app/component/gallery/edit-gallery/_edit-gallery.scss @@ -0,0 +1 @@ +@import "../../../scss/main"; diff --git a/app/component/gallery/edit-gallery/edit-gallery.html b/app/component/gallery/edit-gallery/edit-gallery.html index 37a562e1..80a4a590 100644 --- a/app/component/gallery/edit-gallery/edit-gallery.html +++ b/app/component/gallery/edit-gallery/edit-gallery.html @@ -1,3 +1,4 @@ +
{ - cfgram.config(context(key)); + glgram.config(context(key)); }); context = require.context('./view/', true, /\.js$/); context.keys().forEach( key => { let name = pascalcase(path.basename(key, '.js')); let module = context(key); - cfgram.controller(name, module); + glgram.controller(name, module); }); context = require.context('./service/', true, /\.js$/); context.keys().forEach( key => { let name = camelcase(path.basename(key, '.js')); let module = context(key); - cfgram.service(name, module); + glgram.service(name, module); }); context = require.context('./component/', true, /\.js$/); context.keys().forEach( key => { let name = camelcase(path.basename(key, '.js')); let module = context(key); - cfgram.component(name, module); + glgram.component(name, module); }); diff --git a/app/index.html b/app/index.html index e398f906..c381ec13 100644 --- a/app/index.html +++ b/app/index.html @@ -1,14 +1,14 @@ - + - cfgram. + glgram.
-

cfgram

+

glgram

diff --git a/app/scss/base/base.scss b/app/scss/base/base.scss index ea439b3f..105baf9c 100644 --- a/app/scss/base/base.scss +++ b/app/scss/base/base.scss @@ -11,6 +11,12 @@ body { padding-bottom: 5vw; } +.clearfix { + height: 0px; + width: 100%; + clear: both; +} + .btn-std { background: $darkgrey; color: $white; diff --git a/app/view/home/home.html b/app/view/home/home.html index cfc46a59..3abeb76c 100644 --- a/app/view/home/home.html +++ b/app/view/home/home.html @@ -1,6 +1,7 @@
+
    Galleries { + angular.mock.module('glgram'); + angular.mock.inject(($rootScope, authService, $window, $httpBackend) => { + this.$window = $window; + this.$rootScope = $rootScope; + this.authService = authService; + this.$httpBackend = $httpBackend; + }); + }); + + describe('authService.getToken', () => { + it('should return a token()', () => { + this.authService.token = null; + this.$window.localStorage.setItem('token', 'test token'); + + this.authService.getToken() + .then( token => { + expect(token).toEqual('test token'); + }) + .catch( err => { + expect(err).toEqual(null); + }); + + this.$rootScope.$apply(); + }); + }); +}); diff --git a/test/example-test.js b/test/example-test.js new file mode 100644 index 00000000..23ae19f5 --- /dev/null +++ b/test/example-test.js @@ -0,0 +1,7 @@ +'use strict'; + +describe('Example Test', function() { + it('should pass this test', () => { + expect(true).toEqual(true); + }); +}); diff --git a/test/gallery-service-test.js b/test/gallery-service-test.js new file mode 100644 index 00000000..a5153017 --- /dev/null +++ b/test/gallery-service-test.js @@ -0,0 +1,41 @@ +'use strict'; + +describe('Gallery Service', function() { + + beforeEach(() => { + angular.mock.module('glgram'); + angular.mock.inject(($rootScope, authService, galleryService, $window, $httpBackend) => { + this.$window = $window; + this.$rootScope = $rootScope; + this.authService = authService; + this.galleryService = galleryService; + this.$httpBackend = $httpBackend; + }); + }); + + describe('galleryService.createGallery', () => { + it('should create a new gallery', () => { + let galleryData = { + name: 'example gallery', + desc: 'example description' + }; + let headers = { + 'Content-Type': 'application/json', + Accept: 'application/json', + Authorization: 'Bearer test token' + }; + + this.$httpBackend.expectPOST('http://localhost:5000/api/gallery', galleryData, headers) + .respond(200, { + username: 'testuser', + name: galleryData.name, + desc: galleryData.desc, + pics: [] + }); + + this.galleryService.createGallery(galleryData); + this.$httpBackend.flush(); + this.$rootScope.$apply(); + }); + }); +}); From 0636bb063f32f53677981585dabf44473cad0911 Mon Sep 17 00:00:00 2001 From: GLSea1979 Date: Wed, 5 Apr 2017 13:40:05 -0700 Subject: [PATCH 16/22] 7 initial tests passing --- test/edit-gallery-component-test.js | 72 +++++++++++++++++++++++++++++ test/gallery-item-component-test.js | 62 +++++++++++++++++++++++++ 2 files changed, 134 insertions(+) create mode 100644 test/edit-gallery-component-test.js create mode 100644 test/gallery-item-component-test.js diff --git a/test/edit-gallery-component-test.js b/test/edit-gallery-component-test.js new file mode 100644 index 00000000..50a05661 --- /dev/null +++ b/test/edit-gallery-component-test.js @@ -0,0 +1,72 @@ +'use strict'; + +describe('Edit Gallery Component', function() { + + beforeEach(() => { + angular.mock.module('glgram'); + angular.mock.inject(($rootScope, $componentController, $httpBackend, authService) => { + this.$rootScope = $rootScope; + this.$componentController = $componentController; + this.$httpBackend = $httpBackend; + this.authService = authService; + }); + }); + + it('should contain the proper component bindings', () => { + let mockBindings = { + gallery: { + name: 'test gallery name', + desc: 'test gallery description' + } + }; + + let editGalleryCtrl = this.$componentController('editGallery', null, mockBindings); + expect(editGalleryCtrl.gallery.name).toEqual(mockBindings.gallery.name); + expect(editGalleryCtrl.gallery.desc).toEqual(mockBindings.gallery.desc); + + this.$rootScope.$apply(); + }); + + describe('editGalleryCtrl.updateGallery()', () => { + it('should make a valid PUT request', () => { + let url = 'http://localhost:5000/api/gallery/12345'; + let headers = { + Authorization: 'Bearer test token', + Accept: 'application/json', + 'Content-Type': 'application/json' + }; + + this.$httpBackend.expectPUT(url, { + _id: '12345', + name: 'updated name', + desc: 'updated description' + }, headers).respond(200); + + let mockBindings = { + gallery: { + _id: '12345', + name: 'updated name', + desc: 'updated description' + }, + }; + + let editGalleryCtrl = this.$componentController('editGallery', null, mockBindings); + editGalleryCtrl.gallery.name = 'updated name'; + editGalleryCtrl.gallery.desc = 'updated description'; + editGalleryCtrl.updateGallery(); + + this.$httpBackend.flush(); + this.$rootScope.$apply(); + }); + }); +}); + + + + + + + + + + // it('should contain the proper component') diff --git a/test/gallery-item-component-test.js b/test/gallery-item-component-test.js new file mode 100644 index 00000000..df4409e8 --- /dev/null +++ b/test/gallery-item-component-test.js @@ -0,0 +1,62 @@ +'use strict'; + +describe('Gallery Item Component', function() { + beforeEach(() => { + angular.mock.module('glgram'); + angular.mock.inject(($rootScope, $componentController, $httpBackend, authService) => { + this.$rootScope = $rootScope; + this.$componentController = $componentController; + this.$httpBackend = $httpBackend; + this.authService = authService; + }); + }); + + describe('galleryItemCtrl.deleteDone()', () => { + it('should call deleteDone', () => { + let mockBindings = { + gallery: { + _id: '12345', + name: 'test name', + desc: 'test description', + pics: [] + }, + deleteDone: function(data) { + expect(data.galleryData._id).toEqual('12345'); + } + }; + + let galleryItemCtrl = this.$componentController('galleryItem', null, mockBindings); + galleryItemCtrl.deleteDone({galleryData: galleryItemCtrl.gallery}); + + this.$rootScope.$apply(); + }); + }); + + it('should call deleteDone with gallery after galleryDelete', () => { + let url = 'http://localhost:5000/api/gallery/12345'; + let headers = { + Authorization: 'Bearer test token', + Accept: 'application/json, text/plain, */*' + }; + + let mockBindings = { + gallery: { + _id: '12345', + name: 'test name', + desc: 'test description', + pics: [] + }, + deleteDone: function(data) { + expect(data.galleryData._id).toEqual(mockBindings.gallery._id); + } + }; + + this.$httpBackend.expectDELETE(url, headers).respond(204); + + let galleryItemCtrl = this.$componentController('galleryItem', null, mockBindings); + galleryItemCtrl.deleteGallery(); + + this.$httpBackend.flush(); + this.$rootScope.$apply(); + }); +}); From bd34cdec277215110d1cd510b2f20890d64dc881 Mon Sep 17 00:00:00 2001 From: GLSea1979 Date: Thu, 6 Apr 2017 09:30:05 -0700 Subject: [PATCH 17/22] hmm --- test/edit-gallery-component-test.js | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/test/edit-gallery-component-test.js b/test/edit-gallery-component-test.js index 50a05661..9f429638 100644 --- a/test/edit-gallery-component-test.js +++ b/test/edit-gallery-component-test.js @@ -12,6 +12,8 @@ describe('Edit Gallery Component', function() { }); }); + + it('should contain the proper component bindings', () => { let mockBindings = { gallery: { @@ -27,6 +29,7 @@ describe('Edit Gallery Component', function() { this.$rootScope.$apply(); }); + describe('editGalleryCtrl.updateGallery()', () => { it('should make a valid PUT request', () => { let url = 'http://localhost:5000/api/gallery/12345'; @@ -55,6 +58,9 @@ describe('Edit Gallery Component', function() { editGalleryCtrl.gallery.desc = 'updated description'; editGalleryCtrl.updateGallery(); + expect(editGalleryCtrl.gallery.name).toEqual(mockBindings.gallery.name); + expect(editGalleryCtrl.gallery.desc).toEqual(mockBindings.gallery.desc); + this.$httpBackend.flush(); this.$rootScope.$apply(); }); From 98ee24b5ceef0a5cb87ebe20018934432fe69057 Mon Sep 17 00:00:00 2001 From: GLSea1979 Date: Mon, 10 Apr 2017 11:42:18 -0700 Subject: [PATCH 18/22] added bootstrap dep --- app/entry.js | 3 ++- app/filter/shout.js | 20 ++++++++++++++++++++ package.json | 2 ++ 3 files changed, 24 insertions(+), 1 deletion(-) create mode 100644 app/filter/shout.js diff --git a/app/entry.js b/app/entry.js index 49957347..7bd40491 100644 --- a/app/entry.js +++ b/app/entry.js @@ -9,9 +9,10 @@ const pascalcase = require('pascalcase'); const uiRouter = require('angular-ui-router'); const ngTouch = require('angular-touch'); const ngAnimate = require('angular-animate'); +const uiBootstrap = require('angular-ui-bootstrap'); const ngFileUpload = require('ng-file-upload'); -const glgram = angular.module('glgram', [ngTouch, ngAnimate, uiRouter, ngFileUpload]); +const glgram = angular.module('glgram', [ngTouch, ngAnimate, uiRouter, uiBootstrap, ngFileUpload]); let context = require.context('./config/', true, /\.js$/); context.keys().forEach( key => { diff --git a/app/filter/shout.js b/app/filter/shout.js new file mode 100644 index 00000000..3f92f4ae --- /dev/null +++ b/app/filter/shout.js @@ -0,0 +1,20 @@ +'use strict'; + + +// TODO MAKE A SHOUTING FILTER AND ANOTHER ONE AND PLUG THEM IN, ALSO ICONS + +module.exports = function() { + return function(galleries, searchTerm) { + let shoutedRegex = generateFuzzyRegex(searchTerm); + + return galleries.filter(gallery => { + return shoutedRegex.test(gallery.name.toUpperCase()); + }); + }; +}; + +function generateFuzzyRegex(input) { + if (!input) return /.*/; + let shoutedString = '.*' + input.toUpperCase().split('').join('.*') + '.*'; + return new RegExp(shoutedString); +}; diff --git a/package.json b/package.json index 771149b7..8cf27e15 100644 --- a/package.json +++ b/package.json @@ -18,10 +18,12 @@ "angular-animate": "^1.6.3", "angular-route": "^1.6.3", "angular-touch": "^1.6.3", + "angular-ui-bootstrap": "^2.5.0", "angular-ui-router": "^0.4.2", "babel-core": "^6.24.0", "babel-loader": "^6.4.1", "babel-preset-es2015": "^6.24.0", + "bootstrap-sass": "^3.3.7", "camelcase": "^4.0.0", "clean-webpack-plugin": "^0.1.16", "css-loader": "^0.27.3", From d6e8af04958fc599286dd3fc951f2a10ea1067c1 Mon Sep 17 00:00:00 2001 From: GLSea1979 Date: Mon, 10 Apr 2017 13:13:40 -0700 Subject: [PATCH 19/22] added dropdown and accordion --- app/component/navbar/navbar.html | 10 + app/filter/shout.js | 2 +- .../bootstrap/_custom-bootstrap-vars.scss | 874 ++++++++++++++++++ app/scss/bootstrap/_custom-bootstrap.scss | 50 + app/scss/main.scss | 3 + app/view/landing/landing.html | 19 + 6 files changed, 957 insertions(+), 1 deletion(-) create mode 100644 app/scss/bootstrap/_custom-bootstrap-vars.scss create mode 100644 app/scss/bootstrap/_custom-bootstrap.scss diff --git a/app/component/navbar/navbar.html b/app/component/navbar/navbar.html index dc3fa27c..4ad6e4d0 100644 --- a/app/component/navbar/navbar.html +++ b/app/component/navbar/navbar.html @@ -1,5 +1,15 @@
    +
    + + + +
+ +
+
+ +

+ Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. +

+

+ Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. +

+

+ Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. +

+

+ Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. +

+ +
+
From e7f58c7ef120554423312bd8ba60d5409c395dce Mon Sep 17 00:00:00 2001 From: GLSea1979 Date: Tue, 11 Apr 2017 06:15:16 -0700 Subject: [PATCH 20/22] rebuilt styles --- .../create-gallery/_create-gallery.scss | 13 +++- .../gallery/edit-gallery/_edit-gallery.scss | 9 ++- .../gallery/gallery-item/_gallery-item.scss | 42 ++++++++++- .../gallery/gallery-item/gallery-item.html | 5 +- .../_thumbnail-container.scss | 11 ++- .../gallery/thumbnail/_thumbnail.scss | 18 ++++- .../gallery/upload-pic/_upload-pic.scss | 28 ++++++- app/component/landing/login/_login.scss | 14 +++- app/component/landing/signup/_signup.scss | 20 +++-- app/component/navbar/_navbar.scss | 39 ++++++---- app/scss/base/base.scss | 42 ----------- app/scss/layout/footer.scss | 10 --- app/scss/layout/header.scss | 10 --- app/scss/lib/base/base.scss | 74 +++++++++++++++++++ app/scss/{ => lib}/base/reset.scss | 0 .../bootstrap/_custom-bootstrap-vars.scss | 0 .../bootstrap/_custom-bootstrap.scss | 0 app/scss/lib/layout/_footer.scss | 5 ++ app/scss/lib/layout/_header.scss | 4 + app/scss/lib/layout/_layout.scss | 5 ++ app/scss/lib/theme/_vars.scss | 21 ++++++ app/scss/main.scss | 32 +++++--- app/scss/theme/_vars.scss | 14 ---- app/view/home/_home.scss | 2 +- app/view/home/home.html | 47 +++++++++++- app/view/landing/_landing.scss | 31 ++++---- app/view/landing/landing.html | 3 + app/scss/layout/content.scss => trial.html | 0 28 files changed, 357 insertions(+), 142 deletions(-) delete mode 100644 app/scss/base/base.scss delete mode 100644 app/scss/layout/footer.scss delete mode 100644 app/scss/layout/header.scss create mode 100644 app/scss/lib/base/base.scss rename app/scss/{ => lib}/base/reset.scss (100%) rename app/scss/{ => lib}/bootstrap/_custom-bootstrap-vars.scss (100%) rename app/scss/{ => lib}/bootstrap/_custom-bootstrap.scss (100%) create mode 100644 app/scss/lib/layout/_footer.scss create mode 100644 app/scss/lib/layout/_header.scss create mode 100644 app/scss/lib/layout/_layout.scss create mode 100644 app/scss/lib/theme/_vars.scss delete mode 100644 app/scss/theme/_vars.scss rename app/scss/layout/content.scss => trial.html (100%) diff --git a/app/component/gallery/create-gallery/_create-gallery.scss b/app/component/gallery/create-gallery/_create-gallery.scss index 235963b9..42e59cf8 100644 --- a/app/component/gallery/create-gallery/_create-gallery.scss +++ b/app/component/gallery/create-gallery/_create-gallery.scss @@ -1 +1,12 @@ -@import "../../../scss/main"; +@import "../../../scss/lib/theme/vars"; + +.create-gallery { + input[type="text"] { + margin-bottom: $gutter-sm; + } + + button { + float: right; + padding: 2% 6%; + } +} diff --git a/app/component/gallery/edit-gallery/_edit-gallery.scss b/app/component/gallery/edit-gallery/_edit-gallery.scss index 235963b9..f8a2d9cd 100644 --- a/app/component/gallery/edit-gallery/_edit-gallery.scss +++ b/app/component/gallery/edit-gallery/_edit-gallery.scss @@ -1 +1,8 @@ -@import "../../../scss/main"; +@import "../../../scss/lib/theme/vars"; + +.edit { + .item-lable { + margin-bottom: 1vw; + display: block; + } +} diff --git a/app/component/gallery/gallery-item/_gallery-item.scss b/app/component/gallery/gallery-item/_gallery-item.scss index 235963b9..519d171b 100644 --- a/app/component/gallery/gallery-item/_gallery-item.scss +++ b/app/component/gallery/gallery-item/_gallery-item.scss @@ -1 +1,41 @@ -@import "../../../scss/main"; +@import "../../../scss/lib/theme/vars"; + +.gallery-item-container { + clear: both; + padding-top: $gutter-std; + + .gallery-item { + margin: $gutter-std 0 1% 0; + padding: $gutter-sm; + background: $app-secondary; + font-size: 3vw; + border-radius: $btn-radius; + } + + .edit-btns { + text-align: right; + + span { + display: inline-block; + + .del-btn { + color: $black; + background: $app-secondary; + } + } + } + + .current-item { + div { + margin-bottom: $gutter-sm; + + &:last-child { + margin-bottom: 1vw; + } + + .item-label { + font-weight: bold; + } + } + } +} diff --git a/app/component/gallery/gallery-item/gallery-item.html b/app/component/gallery/gallery-item/gallery-item.html index bcfb9956..5511a411 100644 --- a/app/component/gallery/gallery-item/gallery-item.html +++ b/app/component/gallery/gallery-item/gallery-item.html @@ -13,12 +13,11 @@
- -
+ +
  • edit delete -
    • diff --git a/app/component/gallery/thumbnail-container/_thumbnail-container.scss b/app/component/gallery/thumbnail-container/_thumbnail-container.scss index 235963b9..3d264c12 100644 --- a/app/component/gallery/thumbnail-container/_thumbnail-container.scss +++ b/app/component/gallery/thumbnail-container/_thumbnail-container.scss @@ -1 +1,10 @@ -@import "../../../scss/main"; +@import "../../../scss/lib/theme/vars"; + +.thumbnail-container { + margin-top: 7.5%; + + h3 { + height: 5vw; + text-transform: capitalize; + } +} diff --git a/app/component/gallery/thumbnail/_thumbnail.scss b/app/component/gallery/thumbnail/_thumbnail.scss index 235963b9..223b0c26 100644 --- a/app/component/gallery/thumbnail/_thumbnail.scss +++ b/app/component/gallery/thumbnail/_thumbnail.scss @@ -1 +1,17 @@ -@import "../../../scss/main"; +@import "../../../scss/lib/theme/vars"; + +.thumbnail { + margin-top: $gutter-std * 2; + + img { + width: 100%; + margin-bottom: $gutter-sm; + } + + span { + display: block; + float: right; + padding-top: 1.5vw; + padding-bottom: 1.5vw; + } +} diff --git a/app/component/gallery/upload-pic/_upload-pic.scss b/app/component/gallery/upload-pic/_upload-pic.scss index 198a2627..302dd9cf 100644 --- a/app/component/gallery/upload-pic/_upload-pic.scss +++ b/app/component/gallery/upload-pic/_upload-pic.scss @@ -1,5 +1,29 @@ -@import "../../../scss/main"; +@import "../../../scss/lib/theme/vars"; .upload-pic { - background: blue; + h3 { + font-size: 2.5vw; + text-decoration: underline; + margin-bottom: 0; + } + + fieldset { + margin-top: 0; + + input { + margin-bottom: $gutter-sm; + } + } + + div { + text-align: right; + + .grab-img { + float: left; + margin-top: 1vw; + margin-right: $gutter-sm; + font-size: 2.5vw; + text-decoration: underline; + } + } } diff --git a/app/component/landing/login/_login.scss b/app/component/landing/login/_login.scss index bd0d7c5d..70ed9e8c 100644 --- a/app/component/landing/login/_login.scss +++ b/app/component/landing/login/_login.scss @@ -1 +1,13 @@ -@import "../signup/signup"; +@import "../../../scss/theme/vars"; + +.login-form { + .input-std { + margin-bottom: $gutter-sm; + } + + button { + float: right; + padding-top: 1.5vw; + padding-bottom: 1.5vw; + } +} diff --git a/app/component/landing/signup/_signup.scss b/app/component/landing/signup/_signup.scss index 2f8b0745..3e90ad49 100644 --- a/app/component/landing/signup/_signup.scss +++ b/app/component/landing/signup/_signup.scss @@ -1,15 +1,13 @@ @import "../../../scss/theme/vars"; -// .clearfix { -// clear: both; -// } +.signup { + .input-std { + margin-bottom: $gutter-sm; + } -::-webkit-input-placeholder { - text-indent: $gutter-sm; - font-size: 1.1vw; -} - -.btn-std { - float: right; - margin-right: $gutter; + button { + float: right; + padding-top: 1.5vw; + padding-bottom: 1.5vw; + } } diff --git a/app/component/navbar/_navbar.scss b/app/component/navbar/_navbar.scss index bd279631..60888e38 100644 --- a/app/component/navbar/_navbar.scss +++ b/app/component/navbar/_navbar.scss @@ -1,19 +1,30 @@ @import "../../scss/theme/vars"; -.btn-alt { - float: right; - margin-right: $gutter; -} +.navbar { + img { + width: 5.5vw; + float: left; + margin-top: 1vw; + margin-left: 1%; + } -.logo { - display: inline-block; - float: left; - margin: 0 $gutter; - height: 3vw; - width: 3vw; - background: $white; -} + h2 { + float: left; + font-size: 3vw; + color: $white; + margin-top: 2.25vw; + margin-left: 1vw; + } + + button { + float: right; + margin-top: 2vw; + margin-right: 1%; + font-size: 1.5vw; + } -h2 { - float: left; + .dropdown { + position: absolute; + right: 0; + } } diff --git a/app/scss/base/base.scss b/app/scss/base/base.scss deleted file mode 100644 index 105baf9c..00000000 --- a/app/scss/base/base.scss +++ /dev/null @@ -1,42 +0,0 @@ -html { - height: 100%; -} -body { - background: $grey; - font-family: helvetica; - width: 80%; - margin: 0 auto; - min-height: 800px; - position: relative; - padding-bottom: 5vw; -} - -.clearfix { - height: 0px; - width: 100%; - clear: both; -} - -.btn-std { - background: $darkgrey; - color: $white; - border-radius: 3px; - font-size: 1.2vw; - padding: 1vw 5vw; -} - -.btn-alt { - background: $white; - color: $darkgrey; - border-radius: 3px; - font-size: 1.2vw; - padding: 1vw 5vw; -} - -input { - width: 90%; - margin: 0 $gutter $gutter; - height: 3vw; - border-radius: 3px; - text-indent: $gutter-sm; -} diff --git a/app/scss/layout/footer.scss b/app/scss/layout/footer.scss deleted file mode 100644 index 8401e236..00000000 --- a/app/scss/layout/footer.scss +++ /dev/null @@ -1,10 +0,0 @@ -footer { - position: absolute; - height: 5vw; - clear: both; - left: 0; right: 0; bottom: 0; - background: $darkgrey; - color: $white; - width: 100%; - font-size: 2.7vw; -} diff --git a/app/scss/layout/header.scss b/app/scss/layout/header.scss deleted file mode 100644 index b9231fdf..00000000 --- a/app/scss/layout/header.scss +++ /dev/null @@ -1,10 +0,0 @@ -header { - background: $darkgrey; - color: $white; - padding-top: 10px; - width: 100%; - height: 5vw; - font-size: 2.7vw; - - -} diff --git a/app/scss/lib/base/base.scss b/app/scss/lib/base/base.scss new file mode 100644 index 00000000..167323e4 --- /dev/null +++ b/app/scss/lib/base/base.scss @@ -0,0 +1,74 @@ +html, body { + background: $app-primary; + font-family: $font-std; + width: 100%; + height: 100% + color: $app-color; +} + +a { + text-decoration: none; + color: $black; + font-weight: 700; +} + +h1 { + font-size: 5vw; + margin-bottom: $gutter-sm; +} + +h2 { + font-size: 4vw; + margin: $gutter-sm/ 2.0; +} + +h3 { + font-size: 3vw; + margin-bottom: $gutter-sm; +} + +button { + padding: 1% 5%; + background: $btn-primary; + color: $white; + font-size: 2vw; + border: none; + border-radius: $btn-radius; + cursor: pointer; + transition: 350ms all; +} + +.btn-std { + @extend button; +} + +input[type="text"] { + width: 100%; + padding: 1.5vw 2vw; + font-size: 2vw; + border: solid 1px $app-primary; + border-radius: $btn-radius; + box-sizing: border-box; + + &:focus { + background: $app-primary; + color: $white; + } +} + +input[type="password"] { + @extend input[type="text"]; +} + +input[disabled="disabled"] { + background: $disabled; +} + +.input-std { + @extend input[type="text"]; + display: inline-block; +} + +fieldset { + margin: 2% 0; +} diff --git a/app/scss/base/reset.scss b/app/scss/lib/base/reset.scss similarity index 100% rename from app/scss/base/reset.scss rename to app/scss/lib/base/reset.scss diff --git a/app/scss/bootstrap/_custom-bootstrap-vars.scss b/app/scss/lib/bootstrap/_custom-bootstrap-vars.scss similarity index 100% rename from app/scss/bootstrap/_custom-bootstrap-vars.scss rename to app/scss/lib/bootstrap/_custom-bootstrap-vars.scss diff --git a/app/scss/bootstrap/_custom-bootstrap.scss b/app/scss/lib/bootstrap/_custom-bootstrap.scss similarity index 100% rename from app/scss/bootstrap/_custom-bootstrap.scss rename to app/scss/lib/bootstrap/_custom-bootstrap.scss diff --git a/app/scss/lib/layout/_footer.scss b/app/scss/lib/layout/_footer.scss new file mode 100644 index 00000000..88468ba3 --- /dev/null +++ b/app/scss/lib/layout/_footer.scss @@ -0,0 +1,5 @@ +footer { + height: 10vw; + background: $app-secondary; + margin-top: $gutter-std * 2; +} diff --git a/app/scss/lib/layout/_header.scss b/app/scss/lib/layout/_header.scss new file mode 100644 index 00000000..ad0e5164 --- /dev/null +++ b/app/scss/lib/layout/_header.scss @@ -0,0 +1,4 @@ +header { + background: $app-primary; + height: 8vw; +} diff --git a/app/scss/lib/layout/_layout.scss b/app/scss/lib/layout/_layout.scss new file mode 100644 index 00000000..cb94f019 --- /dev/null +++ b/app/scss/lib/layout/_layout.scss @@ -0,0 +1,5 @@ +main { + width: 90%; + margin: 5%; + min-height: 600px; +} diff --git a/app/scss/lib/theme/_vars.scss b/app/scss/lib/theme/_vars.scss new file mode 100644 index 00000000..9fbded1f --- /dev/null +++ b/app/scss/lib/theme/_vars.scss @@ -0,0 +1,21 @@ +// Global variables // + +// Pallette // +$app-primary: #444; +$app-color: $app-primary / 2; +$app-secondary: $app-primary * 2; +$btn-primary: $app-primary / 2; +$white: #fff; +$black: #000; +$disabled: #e3e3e3; + +// spacing // +$gutter-std: 5%; +$gutter-sm: $gutter-std / 2; + +// font // +$font-std: helvetica; +$font-secondary: monospace; + +// other // +$btn-radius: 5px; diff --git a/app/scss/main.scss b/app/scss/main.scss index b24dadda..c4285297 100644 --- a/app/scss/main.scss +++ b/app/scss/main.scss @@ -1,12 +1,24 @@ -@import "./base/reset"; -// global variables // +// ::: Reset :::: // +@import "./lib/base/reset"; -@import "bootstrap/custom-bootstrap"; - -@import "./theme/vars"; -// ::::: Base :::::::::// -@import "./base/base"; +// bring in bootstrap componentes +@import "./lib/bootstrap/custom-bootstrap"; +// ::::: Base and Theme:::::::::// +@import "./lib/theme/vars"; +@import "./lib/base/base"; // ::::: Layout :::::: // -@import "./layout/header"; -@import "./layout/content"; -@import "./layout/footer"; +@import "./lib/layout/header"; +@import "./lib/layout/content"; +@import "./lib/layout/footer"; + +@import "../view/landing/landing"; + +// ::::: Components ::::::// +@import "../component/landing/login/login"; +@import "../component/landing/signup/signup"; +@import "../component/gallery/create-gallery/create-gallery"; +@import "../component/gallery/edit-gallery/edit-gallery"; +@import "../component/gallery/gallery-item/gallery-item"; +@import "../component/gallery/thumbnail/thumbnail"; +@import "../compenent/gallery/thumbnail-container/thumbnail-container"; +@import "../compenent/gallery/upload-pic/upload-pic"; diff --git a/app/scss/theme/_vars.scss b/app/scss/theme/_vars.scss deleted file mode 100644 index c13771a4..00000000 --- a/app/scss/theme/_vars.scss +++ /dev/null @@ -1,14 +0,0 @@ -// Global variables // - - - -// Pallette // - -$darkgrey: rgb(68, 77, 86); -$grey: rgb(209, 213, 218); -$white: rgb(255, 255, 255); -$black: rgb(0, 0, 0); - -// spacing // -$gutter: 5%; -$gutter-sm: $gutter / 2; diff --git a/app/view/home/_home.scss b/app/view/home/_home.scss index 386c3212..8b137891 100644 --- a/app/view/home/_home.scss +++ b/app/view/home/_home.scss @@ -1 +1 @@ -// @import '../landing/home'; + diff --git a/app/view/home/home.html b/app/view/home/home.html index 3abeb76c..6ce3aff6 100644 --- a/app/view/home/home.html +++ b/app/view/home/home.html @@ -11,5 +11,50 @@ > - + + + diff --git a/app/view/landing/_landing.scss b/app/view/landing/_landing.scss index e9902064..071d1710 100644 --- a/app/view/landing/_landing.scss +++ b/app/view/landing/_landing.scss @@ -1,23 +1,18 @@ @import '../../scss/theme/vars'; -.landing { +.join-inner { - color: $darkgrey; - p { - padding-top: $gutter-sm / 2; - margin-left: 71%; - margin-right: $gutter-sm; - clear: both; - display: inline; - float: left; - } + div:last-child { + margin-top: 1.75vw; + text-align: right; + font-size: 2vw; - a { - display: inline; - float: left; - padding-top: $gutter-sm / 2; - margin-right: $gutter; - text-decoration: none; - color: $black; - } + p { + display: inline; + margin-right: 1vw; + } + a { + margin-right: 1.5vw; + } + } } diff --git a/app/view/landing/landing.html b/app/view/landing/landing.html index fcddcb6d..e72dd9ae 100644 --- a/app/view/landing/landing.html +++ b/app/view/landing/landing.html @@ -24,6 +24,7 @@ +
    @@ -41,4 +42,6 @@

    + +
    diff --git a/app/scss/layout/content.scss b/trial.html similarity index 100% rename from app/scss/layout/content.scss rename to trial.html From d6baf61271a88e0d6aa955cb9e339ea19e1eccb7 Mon Sep 17 00:00:00 2001 From: GLSea1979 Date: Tue, 11 Apr 2017 06:28:44 -0700 Subject: [PATCH 21/22] fixed some typos --- app/component/landing/login/_login.scss | 2 +- app/component/landing/signup/_signup.scss | 2 +- app/component/navbar/_navbar.scss | 2 +- app/scss/lib/base/base.scss | 2 +- app/scss/main.scss | 8 ++++---- app/view/landing/_landing.scss | 2 +- 6 files changed, 9 insertions(+), 9 deletions(-) diff --git a/app/component/landing/login/_login.scss b/app/component/landing/login/_login.scss index 70ed9e8c..fb9e6494 100644 --- a/app/component/landing/login/_login.scss +++ b/app/component/landing/login/_login.scss @@ -1,4 +1,4 @@ -@import "../../../scss/theme/vars"; +@import "../../../scss/lib/theme/vars"; .login-form { .input-std { diff --git a/app/component/landing/signup/_signup.scss b/app/component/landing/signup/_signup.scss index 3e90ad49..691be8f0 100644 --- a/app/component/landing/signup/_signup.scss +++ b/app/component/landing/signup/_signup.scss @@ -1,4 +1,4 @@ -@import "../../../scss/theme/vars"; +@import "../../../scss/lib/theme/vars"; .signup { .input-std { diff --git a/app/component/navbar/_navbar.scss b/app/component/navbar/_navbar.scss index 60888e38..3a4a2b76 100644 --- a/app/component/navbar/_navbar.scss +++ b/app/component/navbar/_navbar.scss @@ -1,4 +1,4 @@ -@import "../../scss/theme/vars"; +@import "../../scss/lib/theme/vars"; .navbar { img { diff --git a/app/scss/lib/base/base.scss b/app/scss/lib/base/base.scss index 167323e4..903df77b 100644 --- a/app/scss/lib/base/base.scss +++ b/app/scss/lib/base/base.scss @@ -2,7 +2,7 @@ html, body { background: $app-primary; font-family: $font-std; width: 100%; - height: 100% + height: 100%; color: $app-color; } diff --git a/app/scss/main.scss b/app/scss/main.scss index c4285297..69da6562 100644 --- a/app/scss/main.scss +++ b/app/scss/main.scss @@ -4,11 +4,11 @@ // bring in bootstrap componentes @import "./lib/bootstrap/custom-bootstrap"; // ::::: Base and Theme:::::::::// -@import "./lib/theme/vars"; +@import "lib/theme/vars"; @import "./lib/base/base"; // ::::: Layout :::::: // @import "./lib/layout/header"; -@import "./lib/layout/content"; +@import "./lib/layout/layout"; @import "./lib/layout/footer"; @import "../view/landing/landing"; @@ -20,5 +20,5 @@ @import "../component/gallery/edit-gallery/edit-gallery"; @import "../component/gallery/gallery-item/gallery-item"; @import "../component/gallery/thumbnail/thumbnail"; -@import "../compenent/gallery/thumbnail-container/thumbnail-container"; -@import "../compenent/gallery/upload-pic/upload-pic"; +@import "../component/gallery/thumbnail-container/thumbnail-container"; +@import "../component/gallery/upload-pic/upload-pic"; diff --git a/app/view/landing/_landing.scss b/app/view/landing/_landing.scss index 071d1710..53563e42 100644 --- a/app/view/landing/_landing.scss +++ b/app/view/landing/_landing.scss @@ -1,4 +1,4 @@ -@import '../../scss/theme/vars'; +@import '../../scss/lib/theme/vars'; .join-inner { div:last-child { From d1e5e686e1a37afd1ddb793213e6c20f62e52e1a Mon Sep 17 00:00:00 2001 From: GLSea1979 Date: Tue, 11 Apr 2017 10:25:09 -0700 Subject: [PATCH 22/22] built server --- .travis.yml | 7 +++++++ package.json | 5 ++++- server.js | 11 +++++++++++ 3 files changed, 22 insertions(+), 1 deletion(-) create mode 100644 .travis.yml create mode 100644 server.js diff --git a/.travis.yml b/.travis.yml new file mode 100644 index 00000000..22b0a2cf --- /dev/null +++ b/.travis.yml @@ -0,0 +1,7 @@ +language: node_js +node_js: + - 'stable' +sudo: required +before_script: npm i +script: + - npm run test diff --git a/package.json b/package.json index 8cf27e15..d720e561 100644 --- a/package.json +++ b/package.json @@ -8,7 +8,9 @@ "build-watch": "./node_modules/webpack-dev-server/bin/webpack-dev-server.js --inline --hot", "lint": "eslint .", "test": "./node_modules/karma/bin/karma start --single-run", - "test-watch": "./node_modules/karma/bin/karma start" + "test-watch": "./node_modules/karma/bin/karma start", + "start": "node server.js", + "heroku-postbuild": "webpack -p --progress" }, "keywords": [], "author": "Gary Lundgren", @@ -28,6 +30,7 @@ "clean-webpack-plugin": "^0.1.16", "css-loader": "^0.27.3", "dotenv": "^4.0.0", + "express": "^4.15.2", "extract-text-webpack-plugin": "^2.1.0", "file-loader": "^0.10.1", "html-loader": "^0.4.5", diff --git a/server.js b/server.js new file mode 100644 index 00000000..907833e4 --- /dev/null +++ b/server.js @@ -0,0 +1,11 @@ +'use strict'; + +const express = require('express'); +const app = express(); +const PORT = process.env.PORT || 8080; + +app.use(express.static(`${__dirname}/build`)); + +app.listen(PORT, function() { + console.log('server up: ' PORT); +})