Initialize the project

skhilko · Mar 24, 2015 · a5261d4 · a5261d4
1 parent 6321f5d
commit a5261d4
Show file tree

Hide file tree

Showing 17 changed files with 625 additions and 0 deletions.
diff --git a/.bowerrc b/.bowerrc
@@ -0,0 +1,3 @@
+{
+  "directory": "bower_components"
+}
diff --git a/.editorconfig b/.editorconfig
@@ -0,0 +1,25 @@
+# EditorConfig helps developers define and maintain consistent
+# coding styles between different editors and IDEs
+# editorconfig.org
+
+root = true
+
+
+[*]
+
+# change these settings to your own preference
+indent_style = space
+indent_size = 4
+
+# we recommend you to keep these unchanged
+end_of_line = lf
+charset = utf-8
+trim_trailing_whitespace = true
+insert_final_newline = true
+
+[*.md]
+trim_trailing_whitespace = false
+
+[{package,bower}.json]
+indent_style = space
+indent_size = 2
diff --git a/.gitattributes b/.gitattributes
@@ -0,0 +1 @@
+* text=auto
diff --git a/.gitignore b/.gitignore
@@ -0,0 +1,6 @@
+node_modules
+dist
+.tmp
+.sass-cache
+bower_components
+test/bower_components
diff --git a/.jshintrc b/.jshintrc
@@ -0,0 +1,19 @@
+{
+  "browser": true,
+  "node": true,
+  "esnext": true,
+  "bitwise": true,
+  "camelcase": true,
+  "curly": true,
+  "eqeqeq": true,
+  "immed": true,
+  "indent": 2,
+  "latedef": true,
+  "newcap": true,
+  "noarg": true,
+  "quotmark": "single",
+  "undef": true,
+  "unused": true,
+  "strict": true,
+  "jquery": true
+}
diff --git a/.yo-rc.json b/.yo-rc.json
@@ -0,0 +1,3 @@
+{
+  "generator-mocha": {}
+}
diff --git a/bower.json b/bower.json
@@ -0,0 +1,7 @@
+{
+  "name": "stickies",
+  "private": true,
+  "devDependencies": {
+    "normalize.css": "~3.0.2"
+  }
+}
diff --git a/demo/index.html b/demo/index.html
@@ -0,0 +1,137 @@
+<!doctype html>
+<html>
+
+<head>
+    <meta charset="utf-8">
+    <meta name="description" content="">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <title>stickies</title>
+    <link rel="stylesheet" href="/bower_components/normalize.css/normalize.css">
+    <link rel="stylesheet" href="styles/demo.css">
+    <link rel="stylesheet" href="styles/main.css">
+</head>
+
+<body>
+    <!--[if lt IE 10]>
+          <p class="browserupgrade">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p>
+        <![endif]-->
+    <header>
+        <h1>Stickies Demo</h1>
+    </header>
+    <section>
+        <div class="list">
+            <div class="category">
+                <h4 class="header">List 1</h4>
+                <div class="item">item 1</div>
+                <div class="item">item 2</div>
+                <div class="item">item 3</div>
+                <div class="item">item 4</div>
+                <div class="item">item 5</div>
+                <div class="item">item 6</div>
+                <div class="item">item 7</div>
+                <div class="item">item 8</div>
+                <div class="item">item 9</div>
+                <div class="item">item 10</div>
+                <div class="item">item 11</div>
+                <div class="item">item 12</div>
+            </div>
+            <div class="category">
+                <h4 class="header">List 2</h4>
+                <div class="item">item 1</div>
+                <div class="item">item 2</div>
+                <div class="item">item 3</div>
+                <div class="item">item 4</div>
+                <div class="item">item 5</div>
+                <div class="item">item 6</div>
+                <div class="item">item 7</div>
+                <div class="item">item 8</div>
+                <div class="item">item 9</div>
+                <div class="item">item 10</div>
+                <div class="item">item 11</div>
+                <div class="item">item 12</div>
+            </div>
+            <div class="category">
+                <h4 class="header">List 3</h4>
+                <div class="item">item 1</div>
+                <div class="item">item 2</div>
+                <div class="item">item 3</div>
+                <div class="item">item 4</div>
+                <div class="item">item 5</div>
+                <div class="item">item 6</div>
+                <div class="item">item 7</div>
+                <div class="item">item 8</div>
+                <div class="item">item 9</div>
+                <div class="item">item 10</div>
+                <div class="item">item 11</div>
+                <div class="item">item 12</div>
+            </div>
+            <div class="category">
+                <h4 class="header">List 4</h4>
+                <div class="item">item 1</div>
+                <div class="item">item 2</div>
+                <div class="item">item 3</div>
+                <div class="item">item 4</div>
+                <div class="item">item 5</div>
+                <div class="item">item 6</div>
+                <div class="item">item 7</div>
+                <div class="item">item 8</div>
+                <div class="item">item 9</div>
+                <div class="item">item 10</div>
+                <div class="item">item 11</div>
+                <div class="item">item 12</div>
+            </div>
+            <div class="category">
+                <h4 class="header">List 5</h4>
+                <div class="item">item 1</div>
+                <div class="item">item 2</div>
+                <div class="item">item 3</div>
+                <div class="item">item 4</div>
+                <div class="item">item 5</div>
+                <div class="item">item 6</div>
+                <div class="item">item 7</div>
+                <div class="item">item 8</div>
+                <div class="item">item 9</div>
+                <div class="item">item 10</div>
+                <div class="item">item 11</div>
+                <div class="item">item 12</div>
+            </div>
+            <div class="category">
+                <h4 class="header">List 6</h4>
+                <div class="item">item 1</div>
+                <div class="item">item 2</div>
+                <div class="item">item 3</div>
+                <div class="item">item 4</div>
+                <div class="item">item 5</div>
+                <div class="item">item 6</div>
+                <div class="item">item 7</div>
+                <div class="item">item 8</div>
+                <div class="item">item 9</div>
+                <div class="item">item 10</div>
+                <div class="item">item 11</div>
+                <div class="item">item 12</div>
+            </div>
+            <div class="category">
+                <h4 class="header">List 7</h4>
+                <div class="item">item 1</div>
+                <div class="item">item 2</div>
+                <div class="item">item 3</div>
+                <div class="item">item 4</div>
+                <div class="item">item 5</div>
+                <div class="item">item 6</div>
+                <div class="item">item 7</div>
+                <div class="item">item 8</div>
+                <div class="item">item 9</div>
+                <div class="item">item 10</div>
+                <div class="item">item 11</div>
+                <div class="item">item 12</div>
+            </div>
+        </div>
+    </section>
+    <footer>
+        <p>♥ from Siarhei Khilko</p>
+    </footer>
+    </div>
+    <script src="scripts/main.js"></script>
+</body>
+
+</html>
diff --git a/demo/styles/demo.scss b/demo/styles/demo.scss
@@ -0,0 +1,55 @@
+html,
+body {
+    font-size: 100%;
+}
+
+header,
+footer,
+section {
+    max-width: 62.5rem;
+    padding-left: 15px;
+    padding-right: 15px;
+    margin: 0 auto;
+}
+
+body {
+    padding-top: 20px;
+    padding-bottom: 20px;
+    background: #fff;
+    color: #444;
+    font-weight: normal;
+    font-style: normal;
+    line-height: 1.5;
+}
+
+footer {
+    margin-top: 60px;
+    padding-top: 19px;
+    color: #777;
+    border-top: 1px solid #e5e5e5;
+}
+
+.browserupgrade {
+    margin: 0.2em 0;
+    background: #ccc;
+    color: #000;
+    padding: 0.2em 0;
+}
+
+
+
+/* Responsive: Portrait tablets and up */
+
+@media screen and (min-width: 768px) {
+    header,
+    section,
+    footer {
+        padding-left: 0;
+        padding-right: 0;
+    }
+    /* Space out the masthead */
+
+    header {
+        margin-bottom: 30px;
+    }
+}
diff --git a/gulpfile.js b/gulpfile.js
@@ -0,0 +1,112 @@
+/*global -$ */
+'use strict';
+
+var gulp = require('gulp');
+var plugins = require('gulp-load-plugins')();
+var browserSync = require('browser-sync');
+var reload = browserSync.reload;
+
+function processStyles (src) {
+    return function () {
+        return gulp.src(src)
+            .pipe(plugins.sourcemaps.init())
+            .pipe(plugins.sass({
+                outputStyle: 'nested', // libsass doesn't support expanded yet
+                precision: 10,
+                includePaths: ['.'],
+                onError: console.error.bind(console, 'Sass error:')
+            }))
+            .pipe(plugins.postcss([
+                require('autoprefixer-core')({
+                    browsers: ['last 1 version']
+                })
+            ]))
+            .pipe(plugins.sourcemaps.write())
+            .pipe(gulp.dest('.tmp/styles'))
+            .pipe(reload({
+                stream: true
+            }));
+    };
+}
+
+gulp.task('styles', processStyles('src/styles/main.scss'));
+
+gulp.task('styles-demo', processStyles('demo/styles/demo.scss'));
+
+gulp.task('jshint', function() {
+    return gulp.src('app/scripts/**/*.js')
+        .pipe(reload({
+            stream: true,
+            once: true
+        }))
+        .pipe(plugins.jshint())
+        .pipe(plugins.jshint.reporter('jshint-stylish'))
+        .pipe(plugins.if(!browserSync.active, plugins.jshint.reporter('fail')));
+});
+
+gulp.task('html', ['styles'], function() {
+    var assets = plugins.useref.assets({
+        searchPath: ['.tmp', '.']
+    });
+
+    return gulp.src('demo/*.html')
+        .pipe(assets)
+        .pipe(plugins.if('*.js', plugins.uglify()))
+        .pipe(plugins.if('*.css', plugins.csso()))
+        .pipe(assets.restore())
+        .pipe(plugins.useref())
+        .pipe(plugins.if('*.html', plugins.minifyHtml({
+            conditionals: true,
+            loose: true
+        })))
+        .pipe(gulp.dest('dist'));
+});
+
+gulp.task('extras', function() {
+    return gulp.src([
+        'demo/*.*',
+        '!demo/*.html'
+    ], {
+        dot: true
+    }).pipe(gulp.dest('dist'));
+});
+
+gulp.task('clean', require('del').bind(null, ['.tmp', 'dist']));
+
+gulp.task('serve', ['styles', 'styles-demo'], function() {
+    browserSync({
+        notify: false,
+        port: 9000,
+        server: {
+            baseDir: ['.tmp', 'src', 'demo'],
+            routes: {
+                '/bower_components': 'bower_components'
+            }
+        }
+    });
+
+    // watch for changes
+    gulp.watch([
+        'demo/*.html',
+        'src/scripts/**/*.js'
+    ]).on('change', reload);
+
+    gulp.watch([
+        'src/styles/**/*.scss',
+        ], ['styles']);
+
+    gulp.watch([
+        'demo/styles/**/*.scss'
+        ], ['styles-demo']);
+});
+
+gulp.task('build', ['jshint', 'styles', 'extras'], function() {
+    return gulp.src('dist/**/*').pipe(plugins.size({
+        title: 'build',
+        gzip: true
+    }));
+});
+
+gulp.task('default', ['clean'], function() {
+    gulp.start('build');
+});