init

simplajs · May 23, 2017 · a47469e · a47469e
commit a47469e
Show file tree

Hide file tree

Showing 16 changed files with 773 additions and 0 deletions.
diff --git a/.babelrc b/.babelrc
@@ -0,0 +1,13 @@
+{
+  "presets": [
+    [
+      "env",
+      {
+        "modules": false
+      }
+    ]
+  ],
+  "plugins": [
+    "external-helpers"
+  ]
+}
diff --git a/.eslintrc b/.eslintrc
@@ -0,0 +1,38 @@
+{
+  "parser": "babel-eslint",
+  "env": {
+    "browser": true,
+    "node": true,
+    "es6": true
+  },
+  "globals": {
+    "Polymer": true
+  },
+  "rules": {
+    "no-cond-assign": 0,
+    "no-console": 0,
+    "no-extra-parens": 2,
+
+    "block-scoped-var": 2,
+    "eqeqeq": [2, "smart"],
+    "no-else-return": 2,
+    "no-floating-decimal": 2,
+    "wrap-iife": [2, "inside"],
+    "no-use-before-define": 1,
+
+    "brace-style": 2,
+    "new-cap": 0,
+    "no-lonely-if": 2,
+    "keyword-spacing": 2,
+    "space-in-brackets": 0,
+    "space-infix-ops": 2,
+    "valid-jsdoc": 2,
+
+    "strict": [2, "never"],
+    "indent": [2, 2, {"VariableDeclarator": { "var": 2, "let": 2, "const": 3 }}],
+    "quotes": [2, "single"],
+    "one-var": [2, {
+      "let": "always"
+    }]
+  }
+}
diff --git a/.gitignore b/.gitignore
@@ -0,0 +1,10 @@
+# Deps
+node_modules
+bower_components
+
+# Runtime
+.DS_Store
+*.log
+
+# Testing
+.test
diff --git a/.travis.yml b/.travis.yml
@@ -0,0 +1,15 @@
+dist: trusty
+language: node_js
+node_js:
+- '6'
+before_script:
+- npm install -g bower web-component-tester
+- bower install
+script: xvfb-run wct
+addons:
+  firefox: latest
+  apt:
+    sources:
+      - google-chrome
+    packages:
+      - google-chrome-stable
diff --git a/LICENSE b/LICENSE
@@ -0,0 +1,21 @@
+The MIT License (MIT)
+
+Copyright (c) 2017 Simpla &lt;[email protected]&gt;
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in
+all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+THE SOFTWARE.
diff --git a/README.md b/README.md
@@ -0,0 +1,45 @@
+# simpla-article
+![Version][bower-badge] [![Build status][travis-badge]][travis-url] [![Bower dependencies][bowerdeps-badge]][bowerdeps-url] ![Size][size-badge] [![Published][webcomponents-badge]][webcomponents-url]
+
+Write longform, rich-media articles seamlessly inline
+
+## Installation & usage
+
+Install simpla-article with Bower
+
+```sh
+$ bower install SimplaElements/simpla-article --save
+```
+
+Import it into the `<head>` of your page
+
+```html
+<link rel="import" href="/bower_components/simpla-article/simpla-article.html">
+```
+
+Then use simpla-article in your project
+
+```html
+<simpla-article></simpla-article>
+```
+
+### Polyfills for cross-browser support
+simpla-article> relies on emerging standards, for full cross-browser support include the [Web Components Lite](https://github.com/webcomponents/webcomponentsjs) polyfill. 
+
+```html
+<script src="https://cdnjs.cloudflare.com/ajax/libs/webcomponentsjs/0.7.24/webcomponents-lite.min.js"></script>
+```
+
+---
+
+MIT © Simpla &lt;[email protected]&gt;
+
+[bower-badge]: https://img.shields.io/bower/v/simpla-article.svg
+[bowerlicense-badge]: https://img.shields.io/bower/l/simpla-article.svg
+[travis-badge]: https://img.shields.io/travis/SimplaElements/simpla-article.svg
+[travis-url]: https://travis-ci.org/SimplaElements/simpla-article
+[bowerdeps-badge]: https://img.shields.io/gemnasium/SimplaElements/simpla-article.svg
+[bowerdeps-url]: https://gemnasium.com/bower/simpla-article
+[size-badge]: https://badges.herokuapp.com/size/github/SimplaElements/simpla-article/master/simpla-article.html?gzip=true
+[webcomponents-badge]: https://img.shields.io/badge/webcomponents.org-published-blue.svg
+[webcomponents-url]: https://www.webcomponents.org/element/SimplaElements/simpla-article
diff --git a/bower.json b/bower.json
@@ -0,0 +1,39 @@
+{
+  "name": "simpla-article",
+  "version": "0.0.0",
+  "authors": [
+    "Simpla <[email protected]>"
+  ],
+  "description": "Write longform, rich-media articles seamlessly inline",
+  "keywords": [
+    "simpla",
+    "web-components",
+    "custom-element",
+    "article",
+    "editor",
+    "cms",
+    "content-management"
+  ],
+  "main": "simpla-article.html",
+  "license": "MIT",
+  "homepage": "https://github.com/SimplaElements/simpla-article/",
+  "demos": {
+    "Demo": "demo/index.html"
+  },
+  "ignore": [
+    "*",
+    "!src",
+    "!*.html",
+    "!LICENSE"
+  ],
+  "dependencies": {
+    "polymer": "^1.8.0",
+    "simpla-demo-helper": "^0.1.3",
+    "simpla-element-behavior": "^0.2.1",
+    "simpla-richtext-behavior": "^0.2.0"
+  },
+  "devDependencies": {
+    "iron-demo-helpers": "PolymerElements/iron-demo-helpers#^1.2.5",
+    "web-component-tester": "^4.0.0"
+  }
+}
diff --git a/demo/index.html b/demo/index.html
@@ -0,0 +1,64 @@
+<!doctype html>
+<html>
+  <head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
+    <title>simpla-article Demo</title>
+
+    <!-- Setup demo page -->
+    <script src="https://unpkg.com/webcomponents.js@^0.7.24/webcomponents-lite.min.js"></script>
+    <script>
+      window.Polymer = { dom: 'shadow' };
+    </script>
+    <link rel="import" href="../../iron-demo-helpers/demo-snippet.html">
+    <link rel="import" href="../../simpla-demo-helper/simpla-demo-helper.html">
+
+    <!-- Import simpla-article -->
+    <link rel="import" href="../simpla-article.html">
+
+    <!-- Demo styles -->
+    <style>
+      /* Page styles */
+      body {
+        font-family: sans-serif;
+        color: #303c46
+      }
+
+      .wrapper {
+        width: 90%;
+        max-width: 38rem;
+        margin: 2rem auto;
+      }
+
+      .demo {
+        display: inline-block;
+        width: 100%;
+        margin: 2rem 0;
+      }
+
+      .demo__title {
+        font-size: 1.4rem;
+        font-weight: 400;
+      }
+
+      /* Add element styles here */
+    </style>
+  </head>
+
+  <body>
+    <div class="wrapper">
+
+      <simpla-demo-helper></simpla-demo-helper>
+
+      <div class="demo">
+        <h1 class="demo__title">Basic demo</h1>
+        <demo-snippet>
+          <template>
+            <simpla-article path="/basic"></simpla-article>
+          </template>
+        </demo-snippet>
+      </div>
+
+    </div>
+  </body>
+</html>
diff --git a/gulpfile.babel.js b/gulpfile.babel.js
@@ -0,0 +1,120 @@
+/*eslint one-var: 0 */
+
+// Core deps
+// Use require() because of rollup
+const gulp = require('gulp');
+const notify = require('gulp-notify');
+const gulpif = require('gulp-if');
+const size = require('gulp-size');
+const plumber = require('gulp-plumber');
+const gulprun = require('run-sequence');
+const yargs = require('yargs');
+const browserSync = require('browser-sync');
+const wct = require('web-component-tester');
+
+// HTML
+const inline = require('gulp-inline-source');
+const processInline = require('gulp-process-inline');
+const minify = require('gulp-htmlmin');
+
+// JS
+const eslint = require('gulp-eslint');
+const rollup = require('gulp-rollup-file');
+const rollupif = require('rollup-plugin-conditional');
+const resolve = require('rollup-plugin-node-resolve');
+const commonJs = require('rollup-plugin-commonjs');
+const babel = require('rollup-plugin-babel');
+const uglify = require('rollup-plugin-uglify');
+const uglifyHarmony = require('uglify-js-harmony').minify;
+
+// CSS
+const postcss = require('gulp-postcss');
+const autoprefixer = require('autoprefixer');
+
+const bs = browserSync.create(),
+      argv = yargs.boolean(['debug']).argv,
+      errorNotifier = () => plumber({ errorHandler: notify.onError('Error: <%= error.message %>') }),
+      OPTIONS = {
+        rollup: {
+          plugins: [
+            resolve({ main: true, browser: true }),
+            commonJs(),
+            babel({
+              exclude: 'node_modules/**/*'
+            }),
+            rollupif(!argv.debug, [
+              uglify({}, uglifyHarmony )
+            ])
+          ],
+          format: 'iife'
+        },
+        postcss: [
+          autoprefixer()
+        ],
+        inline: {
+          compress: false,
+          swallowErrors: true
+        },
+        HTMLmin: {
+          removeComments: true,
+          removeCommentsFromCDATA: true,
+          collapseWhitespace: true,
+          conservativeCollapse: true,
+          caseSensitive: true,
+          keepClosingSlash: true,
+          customAttrAssign: [/\$=/],
+          minifyCSS: true,
+          minifyJS: false
+        },
+        browserSync: {
+          server: {
+            baseDir: './',
+            index: 'demo/index.html',
+            routes: {
+              '/': './bower_components'
+            }
+          },
+          open: false,
+          notify: false
+        }
+      };
+
+gulp.task('build', () => {
+  let styles = processInline(),
+      scripts = processInline();
+
+  return gulp.src(['src/*.html'])
+          .pipe(errorNotifier())
+
+          // Inline assets
+          .pipe(inline(OPTIONS.inline))
+
+          // JS
+          .pipe(scripts.extract('script'))
+            .pipe(eslint())
+            .pipe(eslint.format())
+            .pipe(gulpif(!argv.debug, eslint.failAfterError()))
+            .pipe(rollup(OPTIONS.rollup))
+          .pipe(scripts.restore())
+
+          // CSS
+          .pipe(styles.extract('style'))
+            .pipe(postcss(OPTIONS.postcss))
+          .pipe(styles.restore())
+
+          .pipe(gulpif(!argv.debug, minify(OPTIONS.HTMLmin)))
+
+          .pipe(size({ gzip: true }))
+        .pipe(gulp.dest('.'))
+});
+
+wct.gulp.init(gulp);
+
+gulp.task('serve', () => bs.init(OPTIONS.browserSync));
+gulp.task('refresh', () => bs.reload());
+
+gulp.task('test', ['build', 'test:local']);
+
+gulp.task('watch', () => gulp.watch(['src/**/*'], () => gulprun('build', 'refresh')));
+
+gulp.task('default', ['build', 'serve', 'watch']);