first commit

.bowerrc

@@ -0,0 +1,3 @@
+{
+	"directory": "vendor"
+}

.gitignore

@@ -0,0 +1,3 @@
+vendor
+node_modules
+build

bower.json

@@ -0,0 +1,13 @@
+{
+  "name": "themestore-web",
+  "dependencies": {
+    "angular": "~1.3",
+    "angular-resource": "~1.3",
+    "angular-sanitize": "~1.2.23",
+    "angular-ui-router": "~0.2.10",
+    "jquery": "~2.1.1",
+    "lodash": "~2.4.1",
+    "angular-loading-bar": "~0.5.2",
+    "foundation": "5.4.2"
+  }
+}

demo/entry1/index.json

@@ -0,0 +1,11 @@
+{
+	"id": "entry1",
+	"title": "CORPORATE HEADQUARTERS",
+	"body": "AB's Home",
+	"header": "/demo/entry1/image.jpg",
+	"images": [
+		"/demo/entry1/image.jpg",
+		"/demo/entry1/image.jpg",
+		"/demo/entry1/image.jpg"
+	]
+}

demo/index.json

@@ -0,0 +1,9 @@
+[
+	{
+		"id": "entry1",
+		"title": "CORPORATE HEADQUARTERS",
+		"body": "AB's Home",
+		"image": "/demo/entry1/image.jpg",
+		"more": true
+	}
+]

gulpfile.js

@@ -0,0 +1,151 @@
+var gulp        = require('gulp');
+var clean       = require('gulp-clean');
+var concat      = require('gulp-concat');
+var uglify      = require('gulp-uglify');
+var ngAnnotate  = require('gulp-ng-annotate');
+var sourcemaps  = require('gulp-sourcemaps');
+var templates   = require('gulp-angular-templatecache');
+var streams     = require('event-stream');
+var sass        = require('gulp-sass');
+var plumber     = require('gulp-plumber');
+
+gulp.task('default', ['build']);
+
+gulp.task('build', ['js', 'vendor', 'html', 'styles', 'assets']);
+
+gulp.task('clean', function() {
+    gulp.src('build')
+        .pipe(clean());
+});
+
+gulp.task('vendor', function() {
+    gulp.src([
+            'vendor/jquery/dist/jquery.min.js',
+            'vendor/angular/angular.min.js',
+            'vendor/angular-loading-bar/build/loading-bar.js',
+            'vendor/angular-resource/angular-resource.js',
+            'vendor/angular-sanitize/angular-sanitize.js',
+            'vendor/angular-ui-router/release/angular-ui-router.js',
+            'vendor/lodash/dist/lodash.js'
+        ])
+        .pipe(sourcemaps.init({loadMaps: true}))
+        .pipe(concat('vendor.js'))
+        .pipe(sourcemaps.write({sourceRoot: '/vendor'}))
+        .pipe(gulp.dest('build'));
+});
+
+gulp.task('js', function() {
+    var html = gulp.src(['src/**/*.html', '!src/index.html'])
+        .pipe(sourcemaps.init())
+        .pipe(templates({ standalone: true }));
+
+    var js = gulp.src(['src/**/imdex.js', 'src/**/*.js'])
+        .pipe(plumber())
+        .pipe(sourcemaps.init())
+        .pipe(concat('src.js'))
+        .pipe(ngAnnotate())
+        .pipe(uglify());
+
+    streams.merge(html, js)
+        .pipe(concat('app.js'))
+        .pipe(sourcemaps.write({sourceRoot: '/src'}))
+        .pipe(gulp.dest('build'));
+});
+
+gulp.task('styles', function() {
+    var processWinPath = function(file) {
+        var path = require('path');
+        if (process.platform === 'win32') {
+            file.path = path.relative('.', file.path);
+            file.path = file.path.replace(/\\/g, '/');
+        }
+    };
+
+    gulp.src([
+            'src/styles/styles.scss',
+        ])
+        .on('data', processWinPath)
+        .pipe(plumber())
+        .pipe(sass({
+            includePaths: [
+                'vendor/foundation/scss',
+            ],
+//            sourceComments: 'map'
+        }))
+        .pipe(sourcemaps.init({loadMaps: true}))
+        .pipe(concat('styles.css'))
+        .pipe(sourcemaps.write({sourceRoot: '/src/../'}))
+        .pipe(gulp.dest('build'));
+});
+
+gulp.task('html', function() {
+    gulp.src('src/index.html')
+        .pipe(gulp.dest('build'));
+});
+
+gulp.task('assets', function() {
+    gulp.src('src/assets/**/*')
+        .pipe(gulp.dest('build/assets'));
+});
+
+gulp.task('watch', ['js'], function() {
+    gulp.watch('src/**/*.js', ['js']);
+});
+
+function startExpress() {
+    var express = require('express');
+    var request = require('request');
+    var fs = require('fs');
+    var app = express();
+
+    app.use(require('connect-livereload')());
+
+    app.use('/api', express.static(__dirname + '/demo', {
+        index: ['index.json']
+    }));
+    app.use('/demo', express.static(__dirname + '/demo'));
+    app.use(express.static('build'));
+
+/*
+    app.all('/api/*', function(req, res) {
+        var url = 'http://localhost:8080' + req.url;
+        req.pipe(request(url)).pipe(res);
+    });
+*/
+
+    app.all('/*', function(req, res) {
+        res.sendFile('index.html', { root: 'build' });
+    });
+
+    app.listen(5000);
+}
+
+var lr;
+
+function startLiveReload() {
+    lr = require('tiny-lr')();
+    lr.listen(35729);
+}
+
+function notifyLiveReload(event) {
+    var filename = require('path').relative('build', event.path);
+
+    lr.changed({
+        body: {
+            files: [filename]
+        }
+    });
+}
+
+gulp.task('server', ['build'], function() {
+    startExpress();
+    startLiveReload();
+
+    gulp.watch(['src/**/*.js', 'src/**/*.html'], ['js', 'html']);
+    gulp.watch('src/**/*.scss', ['styles']);
+    gulp.watch('vendor/**/*', ['vendor', 'styles']);
+    gulp.watch('src/assets/**/*', ['assets']);
+    gulp.watch('build/**/*', notifyLiveReload);
+});
+
+

package.json

@@ -0,0 +1,21 @@
+{
+  "name": "biomed-frontend",
+  "version": "0.0.1",
+  "devDependencies": {
+    "bower": "^1.3.9",
+    "connect-livereload": "^0.4.0",
+    "event-stream": "^3.1.7",
+    "express": "^4.8.5",
+    "gulp": "^3.8.7",
+    "gulp-angular-templatecache": "^1.3.0",
+    "gulp-clean": "^0.3.1",
+    "gulp-concat": "^2.3.4",
+    "gulp-ng-annotate": "^0.3.0",
+    "gulp-plumber": "^0.6.5",
+    "gulp-sass": "^0.7.3",
+    "gulp-sourcemaps": "^1.1.1",
+    "gulp-uglify": "^0.3.1",
+    "request": "^2.40.0",
+    "tiny-lr": "^0.1.0"
+  }
+}

src/app/details.html

@@ -0,0 +1,6 @@
+<img ng-src="{{post.header}}">
+<div class="title">{{post.title}}</div>
+<div class="body">{{post.body}}</div>
+<div class="images">
+	<img ng-repeat="image in images track by $index" ng-src="{{image}}">
+</div>

src/app/index.js

@@ -0,0 +1,48 @@
+angular.module('biomed-frontend', [
+    'templates',
+    'ui.router',
+    'ngResource',
+    'angular-loading-bar'
+])
+.factory('Posts', function($resource) {
+	return $resource('/api/:id',
+		{ id: '@id' }
+	);
+})
+.config(function($urlRouterProvider, $locationProvider) {
+    $locationProvider.html5Mode(true);
+})
+.config(function($stateProvider, $urlRouterProvider) {
+    $stateProvider
+    	.state('site', {
+    		abstract: true,
+    		templateUrl: 'app/layout.html'
+    	})
+        .state('site.list', {
+            url: '/',
+            templateUrl: 'app/list.html',
+            resolve: {
+                posts: function(Posts) {
+                    return Posts.query();
+                }
+            },
+            controller: function($scope, posts, $timeout) {
+                $scope.posts = posts;
+            }
+        })
+        .state('site.details', {
+            url: '/posts/:id',
+            templateUrl: 'app/details.html',
+            resolve: {
+                post: function(Posts, $stateParams) {
+                    return Posts.get($stateParams);
+                }
+            },
+            controller: function($scope, post) {
+            	post.$promise.then(function() {
+            		$scope.post = post;
+            		$scope.images = post.images;
+            	});
+            }
+        });
+});

src/app/layout.html

@@ -0,0 +1,3 @@
+<h1>Much Header</h1>
+<div ui-view></div>
+<h2>Very Footer</h2>

src/app/list.html

@@ -0,0 +1,6 @@
+<div ng-repeat="post in posts">
+	<img ng-src="{{post.image}}">
+	<div class="title">{{post.title}}</div>
+	<div class="body">{{post.body}}</div>
+	<a ui-sref="site.details(post)" ng-show="post.more">Show More</a>
+</div>

src/index.html

@@ -0,0 +1,15 @@
+<!DOCTYPE html>
+<html lang="en" ng-app="biomed-frontend">
+    <head>
+        <base href="/">
+        <meta charset="utf-8">
+        <meta name="viewport" content="width=device-width, initial-scale=1.0">
+        <title>Atlantic Biomedical</title>
+        <link href="/styles.css" rel="stylesheet">
+    </head>
+    <body>
+        <div ui-view></div>
+        <script src="/vendor.js"></script>
+        <script src="/app.js"></script>
+    </body>
+</html>

src/styles/_biomed.scss

@@ -0,0 +1,9 @@
+// Put biomed styles in here
+
+@import "components/loading-bar";
+
+
+img {
+	width: 200px;
+	height: 200px;
+}

src/styles/_settings.scss

@@ -0,0 +1,2 @@
+// You can override any foundation settings in this file.
+// See vendor/foundation/scss/foundation/_settings.scss

src/styles/components/_loading-bar.scss

@@ -0,0 +1,105 @@
+
+$loading-bar-color: #2c3e50 !default;
+
+#loading-bar,
+#loading-bar-spinner {
+  pointer-events: none;
+  -webkit-pointer-events: none;
+  -webkit-transition: 350ms linear all;
+  -moz-transition: 350ms linear all;
+  -o-transition: 350ms linear all;
+  transition: 350ms linear all;
+}
+
+#loading-bar.ng-enter,
+#loading-bar.ng-leave.ng-leave-active,
+#loading-bar-spinner.ng-enter,
+#loading-bar-spinner.ng-leave.ng-leave-active {
+  opacity: 0;
+}
+
+#loading-bar.ng-enter.ng-enter-active,
+#loading-bar.ng-leave,
+#loading-bar-spinner.ng-enter.ng-enter-active,
+#loading-bar-spinner.ng-leave {
+  opacity: 1;
+}
+
+#loading-bar .bar {
+  -webkit-transition: width 350ms;
+  -moz-transition: width 350ms;
+  -o-transition: width 350ms;
+  transition: width 350ms;
+
+  background: $loading-bar-color;
+  position: fixed;
+  z-index: 10002;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 2px;
+  border-bottom-right-radius: 1px;
+  border-top-right-radius: 1px;
+}
+
+/* Fancy blur effect */
+#loading-bar .peg {
+  position: absolute;
+  width: 70px;
+  right: 0;
+  top: 0;
+  height: 2px;
+  opacity: .45;
+  -moz-box-shadow: $loading-bar-color 1px 0 6px 1px;
+  -ms-box-shadow: $loading-bar-color 1px 0 6px 1px;
+  -webkit-box-shadow: $loading-bar-color 1px 0 6px 1px;
+  box-shadow: $loading-bar-color 1px 0 6px 1px;
+  -moz-border-radius: 100%;
+  -webkit-border-radius: 100%;
+  border-radius: 100%;
+}
+
+#loading-bar-spinner {
+  display: block;
+  position: fixed;
+  z-index: 10002;
+  top: 10px;
+  left: 10px;
+}
+
+#loading-bar-spinner .spinner-icon {
+  width: 14px;
+  height: 14px;
+
+  border:  solid 2px transparent;
+  border-top-color:  $loading-bar-color;
+  border-left-color: $loading-bar-color;
+  border-radius: 10px;
+
+  -webkit-animation: loading-bar-spinner 400ms linear infinite;
+  -moz-animation:    loading-bar-spinner 400ms linear infinite;
+  -ms-animation:     loading-bar-spinner 400ms linear infinite;
+  -o-animation:      loading-bar-spinner 400ms linear infinite;
+  animation:         loading-bar-spinner 400ms linear infinite;
+}
+
+@-webkit-keyframes loading-bar-spinner {
+  0%   { -webkit-transform: rotate(0deg);   transform: rotate(0deg); }
+  100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); }
+}
+@-moz-keyframes loading-bar-spinner {
+  0%   { -moz-transform: rotate(0deg);   transform: rotate(0deg); }
+  100% { -moz-transform: rotate(360deg); transform: rotate(360deg); }
+}
+@-o-keyframes loading-bar-spinner {
+  0%   { -o-transform: rotate(0deg);   transform: rotate(0deg); }
+  100% { -o-transform: rotate(360deg); transform: rotate(360deg); }
+}
+@-ms-keyframes loading-bar-spinner {
+  0%   { -ms-transform: rotate(0deg);   transform: rotate(0deg); }
+  100% { -ms-transform: rotate(360deg); transform: rotate(360deg); }
+}
+@keyframes loading-bar-spinner {
+  0%   { transform: rotate(0deg);   transform: rotate(0deg); }
+  100% { transform: rotate(360deg); transform: rotate(360deg); }
+}

src/styles/styles.scss

@@ -0,0 +1,5 @@
+
+@import "settings";
+@import "normalize";
+@import "foundation";
+@import "biomed";