├── .bowerrc ├── .editorconfig ├── .gitattributes ├── .gitignore ├── .jscsrc ├── .jshintrc ├── LICENSE.md ├── README.md ├── app ├── elements │ ├── app-theme.html │ ├── elements.html │ ├── my-greeting │ │ └── my-greeting.html │ ├── my-list │ │ └── my-list.html │ └── routing.html ├── favicon.ico ├── favicon.ico.png ├── images │ └── touch │ │ ├── apple-touch-icon.png │ │ ├── chrome-touch-icon-192x192.png │ │ ├── icon-128x128.png │ │ ├── ms-icon-144x144.png │ │ └── ms-touch-icon-144x144-precomposed.png ├── index.html ├── manifest.json ├── precache.json ├── robots.txt ├── scripts │ └── app.js ├── styles │ └── main.css ├── sw-import.js └── test │ ├── index.html │ ├── my-greeting-basic.html │ └── my-list-basic.html ├── bower.json ├── gulpfile.js ├── package.json └── wct.conf.js /.bowerrc: -------------------------------------------------------------------------------- 1 | { 2 | "directory": "bower_components" 3 | } 4 | -------------------------------------------------------------------------------- /.editorconfig: -------------------------------------------------------------------------------- 1 | # EditorConfig helps developers define and maintain consistent 2 | # coding styles between different editors and IDEs 3 | # editorconfig.org 4 | 5 | root = true 6 | 7 | 8 | [*] 9 | 10 | # Change these settings to your own preference 11 | indent_style = space 12 | indent_size = 2 13 | 14 | # We recommend you to keep these unchanged 15 | end_of_line = lf 16 | charset = utf-8 17 | trim_trailing_whitespace = true 18 | insert_final_newline = true 19 | 20 | [*.md] 21 | trim_trailing_whitespace = false 22 | -------------------------------------------------------------------------------- /.gitattributes: -------------------------------------------------------------------------------- 1 | * text=auto -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | node_modules 2 | dist 3 | test/temp 4 | bower_components 5 | .tmp 6 | test/bower_components/ 7 | -------------------------------------------------------------------------------- /.jscsrc: -------------------------------------------------------------------------------- 1 | { 2 | "preset": "google", 3 | "disallowSpacesInAnonymousFunctionExpression": null, 4 | "excludeFiles": ["node_modules/**"] 5 | } 6 | -------------------------------------------------------------------------------- /.jshintrc: -------------------------------------------------------------------------------- 1 | { 2 | "node": true, 3 | "browser": true, 4 | "esnext": true, 5 | "bitwise": true, 6 | "camelcase": true, 7 | "curly": true, 8 | "eqeqeq": true, 9 | "immed": true, 10 | "indent": 2, 11 | "latedef": true, 12 | "noarg": true, 13 | "quotmark": "single", 14 | "undef": true, 15 | "unused": true, 16 | "globals": { 17 | "wrap": true, 18 | "unwrap": true, 19 | "Polymer": true, 20 | "Platform": true, 21 | "page": true, 22 | "app": true 23 | } 24 | } 25 | -------------------------------------------------------------------------------- /LICENSE.md: -------------------------------------------------------------------------------- 1 | # License 2 | 3 | Everything in this repo is BSD style license unless otherwise specified. 4 | 5 | Copyright (c) 2015 The Polymer Authors. All rights reserved. 6 | 7 | Redistribution and use in source and binary forms, with or without modification, are permitted provided that the following conditions are met: 8 | 9 | * Redistributions of source code must retain the above copyright 10 | notice, this list of conditions and the following disclaimer. 11 | * Redistributions in binary form must reproduce the above 12 | copyright notice, this list of conditions and the following disclaimer 13 | in the documentation and/or other materials provided with the 14 | distribution. 15 | * Neither the name of Google Inc. nor the names of its 16 | contributors may be used to endorse or promote products derived from 17 | this software without specific prior written permission. 18 | 19 | THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE. -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | ![](https://cloud.githubusercontent.com/assets/110953/7877439/6a69d03e-0590-11e5-9fac-c614246606de.png) 2 | ## Polymer Starter Kit 3 | 4 | > A starting point for building web applications with Polymer 1.0 5 | 6 | ### Included out of the box: 7 | 8 | * [Polymer](http://polymer-project.org), Paper and Iron elements 9 | * [Material Design](http://www.google.com/design/spec/material-design/introduction.html) layout 10 | * Routing with [Page.js](https://visionmedia.github.io/page.js/) 11 | * Unit testing with Web Component Tester 12 | * Offline-first setup through Service Worker elements 13 | * End-to-end Build Tooling (including [Vulcanize](https://github.com/Polymer/vulcanize)) 14 | 15 | ## Getting Started 16 | 17 | To take advantage of Polymer Starter Kit you need to: 18 | 19 | 1. Get a copy of the code. 20 | 2. Install the dependencies if you don't already have them. 21 | 3. Modify the application to your liking. 22 | 4. Deploy your production code. 23 | 24 | ## Getting the code 25 | 26 | [Download](https://github.com/polymerelements/polymer-starter-kit/releases/latest) and extract Polymer Starter Kit to where you want to work. 27 | 28 | ### Install dependencies 29 | 30 | With [Node.js](http://nodejs.org) and npm installed, run the following one liner from the root of your Polymer Starter Kit download: 31 | 32 | ```sh 33 | $ npm install -g gulp && npm install -g bower && npm install && bower install 34 | ``` 35 | 36 | This will install the element sets (Paper, Iron, Platinum) and tools 37 | we will use to serve and build apps. 38 | 39 | ### Serve / watch 40 | 41 | ```sh 42 | $ gulp serve 43 | ``` 44 | 45 | This outputs an IP address you can use to locally test and another that can be used on devices connected to your network. 46 | 47 | ### Run tests 48 | 49 | ```sh 50 | $ gulp test:local 51 | ``` 52 | 53 | This runs the unit tests defined in the `app/test` directory through [web-component-tester](https://github.com/Polymer/web-component-tester). 54 | 55 | ### Build & Vulcanize 56 | 57 | ```sh 58 | $ gulp 59 | ``` 60 | 61 | Build and optimize the current project, ready for deployment. This includes linting as well as vulcanization, image, script, stylesheet and HTML optimization and minification. 62 | 63 | ## Application Theming 64 | 65 | Polymer 1.0 introduces a shim for CSS custom properties. We take advantage of this in `app/elements/app-theme.html` to provide theming for your application. You can also find our presets for Material Design breakpoints in this file. 66 | 67 | ## Unit Testing 68 | 69 | Web apps built with Polymer Starter Kit come configured with support for [Web Component Tester](https://github.com/Polymer/web-component-tester) - Polymer's preferred tool for authoring and running unit tests. This makes testing your element based applications a pleasant experience. 70 | 71 | ## Dependency Management 72 | 73 | Polymer uses [Bower](http://bower.io) for package management. This makes it easy to keep your elements up to date and versioned. For tooling, we use NPM to manage Node-based dependencies. 74 | 75 | ## Service Worker 76 | 77 | Polymer Starter Kit offers an offline-first experience thanks to Service Worker and the [Platinum Service Worker elements](https://github.com/PolymerElements/platinum-sw). New to Service Worker? Read the following [introduction](http://www.html5rocks.com/en/tutorials/service-worker/introduction/) to understand how it works. 78 | 79 | Our default offline setup should work well for relatively simple applications. For more complex apps, we recommend learning how Service Worker works so that you can make the most of the Platinum Service Worker element abstractions. 80 | 81 | #### Filing bugs in the right place 82 | 83 | If you experience an issue with Service Worker support in your application, check the origin of the issue and use the appropriate issue tracker: 84 | 85 | * [sw-toolbox](https://github.com/GoogleChrome/sw-toolbox/issues) 86 | * [platinum-sw](https://github.com/PolymerElements/platinum-sw/issues) 87 | * [platinum-push-notifications-manager](https://github.com/PolymerElements/push-notification-manager/) 88 | * For all other issues, feel free to file them [here](https://github.com/polymerelements/polymer-starter-kit/issues). 89 | 90 | #### I get an error message about "Only secure origins are allowed" 91 | 92 | Service Workers are only available to "secure origins" (HTTPS sites, basically) in line with a policy to prefer secure origins for powerful new features. However http://localhost is also considered a secure origin, so if you can, developing on localhost is an easy way to avoid this error. For production, your site will need to support HTTPS. 93 | 94 | #### How do I debug Service Worker? 95 | 96 | If you need to debug the event listener wire-up use `chrome://serviceworker-internals`. 97 | 98 | #### What are those buttons on chrome://serviceworker-internals? 99 | 100 | This page shows your registered workers and provides some basic operations. 101 | 102 | * Unregister: Unregisters the worker. 103 | * Start: Starts the worker. This would happen automatically when you navigate to a page in the worker's scope. 104 | * Stop: Stops the worker. 105 | * Sync: Dispatches a 'sync' event to the worker. If you don't handle this event, nothing will happen. 106 | * Push: Dispatches a 'push' event to the worker. If you don't handle this event, nothing will happen. 107 | * Inspect: Opens the worker in the Inspector. 108 | 109 | #### Development flow 110 | 111 | In order to guarantee that the latest version of your Service Worker script is being used, follow these instructions: 112 | 113 | * After you made changes to your service worker script, close all but one of the tabs pointing to your web application 114 | * Hit shift-reload to bypass the service worker as to ensure that the remaining tab isn't under the control of a service worker 115 | * Hit reload to let the newer version of the Service Worker control the page. 116 | 117 | If you find anything to still be stale, you can also try navigating to `chrome:serviceworker-internals` (in Chrome), finding the relevant Service Worker entry for your application and clicking 'Unregister' before refreshing your app. This will (of course) only clear it from the local development machine. If you have already deployed to production then further work will be necessary to remove it from your user's machines. 118 | 119 | #### Not yet ready for Service Worker support? 120 | 121 | If for any reason you decide that Service Worker support isn't for you, you can disable it from your Polymer Starter Kit project using these 3 steps: 122 | 123 | * Remove 'precache' from the list in the 'default' gulp task ([gulpfile.js](https://github.com/PolymerElements/polymer-starter-kit/blob/master/gulpfile.js)) 124 | * Remove the two Platinum Service Worker elements (platinum-sw/..) in [app/elements/elements.html](https://github.com/PolymerElements/polymer-starter-kit/blob/master/app/elements/elements.html) 125 | * Remove references to the platinum-sw elements from your application [index](https://github.com/PolymerElements/polymer-starter-kit/blob/master/app/index.html). 126 | 127 | You will also want to navigate to `chrome://serviceworker-internals` and unregister any Service Workers registered by Polymer Starter Kit for your app just in case there's a copy of it cached. 128 | 129 | ## Contributing 130 | 131 | Polymer Starter Kit is a new project and is an ongoing effort by the Web Component community. We welcome your bug reports, PRs for improvements, docs and anything you think would improve the experience for other Polymer developers. 132 | 133 | Simplified Chinese - [简体中文](https://github.com/unbug/polymer-starter-kit/blob/zh/README.md) 134 | -------------------------------------------------------------------------------- /app/elements/app-theme.html: -------------------------------------------------------------------------------- 1 | 10 | 11 | 226 | -------------------------------------------------------------------------------- /app/elements/elements.html: -------------------------------------------------------------------------------- 1 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | -------------------------------------------------------------------------------- /app/elements/my-greeting/my-greeting.html: -------------------------------------------------------------------------------- 1 | 10 | 11 | 12 | 23 | 29 | 30 | 45 | -------------------------------------------------------------------------------- /app/elements/my-list/my-list.html: -------------------------------------------------------------------------------- 1 | 10 | 11 | 12 | 17 | 24 | 25 | 26 | 49 | -------------------------------------------------------------------------------- /app/elements/routing.html: -------------------------------------------------------------------------------- 1 | 10 | 11 | 12 | 42 | -------------------------------------------------------------------------------- /app/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/unbug/polymer-starter-kit/34614438ef5d7e60cb30c3dc2a4c289316fd442b/app/favicon.ico -------------------------------------------------------------------------------- /app/favicon.ico.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/unbug/polymer-starter-kit/34614438ef5d7e60cb30c3dc2a4c289316fd442b/app/favicon.ico.png -------------------------------------------------------------------------------- /app/images/touch/apple-touch-icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/unbug/polymer-starter-kit/34614438ef5d7e60cb30c3dc2a4c289316fd442b/app/images/touch/apple-touch-icon.png -------------------------------------------------------------------------------- /app/images/touch/chrome-touch-icon-192x192.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/unbug/polymer-starter-kit/34614438ef5d7e60cb30c3dc2a4c289316fd442b/app/images/touch/chrome-touch-icon-192x192.png -------------------------------------------------------------------------------- /app/images/touch/icon-128x128.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/unbug/polymer-starter-kit/34614438ef5d7e60cb30c3dc2a4c289316fd442b/app/images/touch/icon-128x128.png -------------------------------------------------------------------------------- /app/images/touch/ms-icon-144x144.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/unbug/polymer-starter-kit/34614438ef5d7e60cb30c3dc2a4c289316fd442b/app/images/touch/ms-icon-144x144.png -------------------------------------------------------------------------------- /app/images/touch/ms-touch-icon-144x144-precomposed.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/unbug/polymer-starter-kit/34614438ef5d7e60cb30c3dc2a4c289316fd442b/app/images/touch/ms-touch-icon-144x144-precomposed.png -------------------------------------------------------------------------------- /app/index.html: -------------------------------------------------------------------------------- 1 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | Polymer Starter Kit 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | 53 | 54 | 55 | 56 | 57 | 58 | 59 | 162 | 163 | 164 | 165 | 166 | 167 | 168 | 169 | -------------------------------------------------------------------------------- /app/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "Polymer Starter Kit", 3 | "short_name": "Polymer Starter Kit", 4 | "icons": [{ 5 | "src": "images/touch/icon-128x128.png", 6 | "sizes": "128x128" 7 | }, { 8 | "src": "images/touch/apple-touch-icon.png", 9 | "sizes": "152x152" 10 | }, { 11 | "src": "images/touch/ms-touch-icon-144x144-precomposed.png", 12 | "sizes": "144x144" 13 | }, { 14 | "src": "images/touch/chrome-touch-icon-192x192.png", 15 | "sizes": "192x192" 16 | }], 17 | "start_url": "/#!/", 18 | "display": "standalone" 19 | } 20 | -------------------------------------------------------------------------------- /app/precache.json: -------------------------------------------------------------------------------- 1 | [] 2 | -------------------------------------------------------------------------------- /app/robots.txt: -------------------------------------------------------------------------------- 1 | # robotstxt.org 2 | 3 | User-agent: * 4 | Disallow: 5 | -------------------------------------------------------------------------------- /app/scripts/app.js: -------------------------------------------------------------------------------- 1 | /* 2 | Copyright (c) 2015 The Polymer Project Authors. All rights reserved. 3 | This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt 4 | The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt 5 | The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt 6 | Code distributed by Google as part of the polymer project is also 7 | subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt 8 | */ 9 | 10 | (function (document) { 11 | 'use strict'; 12 | 13 | // Grab a reference to our auto-binding template 14 | // and give it some initial binding values 15 | // Learn more about auto-binding templates at http://goo.gl/Dx1u2g 16 | var app = document.querySelector('#app'); 17 | 18 | app.displayInstalledToast = function() { 19 | document.querySelector('#caching-complete').show(); 20 | }; 21 | 22 | // Listen for template bound event to know when bindings 23 | // have resolved and content has been stamped to the page 24 | app.addEventListener('template-bound', function() { 25 | console.log('Our app is ready to rock!'); 26 | }); 27 | 28 | // See https://github.com/Polymer/polymer/issues/1381 29 | window.addEventListener('WebComponentsReady', function() { 30 | document.querySelector('body').removeAttribute('unresolved'); 31 | 32 | // Ensure the drawer is hidden on desktop/tablet 33 | var drawerPanel = document.querySelector('#paperDrawerPanel'); 34 | drawerPanel.forceNarrow = true; 35 | }); 36 | 37 | // Close drawer after menu item is selected if drawerPanel is narrow 38 | app.onMenuSelect = function() { 39 | var drawerPanel = document.querySelector('#paperDrawerPanel'); 40 | if (drawerPanel.narrow) { 41 | drawerPanel.closeDrawer(); 42 | } 43 | }; 44 | 45 | })(document); 46 | 47 | // TODO: Decide if we still want to suggest wrapping as it requires 48 | // using webcomponents.min.js. 49 | // wrap document so it plays nice with other libraries 50 | // http://www.polymer-project.org/platform/shadow-dom.html#wrappers 51 | // )(wrap(document)); 52 | -------------------------------------------------------------------------------- /app/styles/main.css: -------------------------------------------------------------------------------- 1 | /* 2 | Copyright (c) 2015 The Polymer Project Authors. All rights reserved. 3 | This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt 4 | The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt 5 | The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt 6 | Code distributed by Google as part of the polymer project is also 7 | subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt 8 | */ 9 | 10 | body { 11 | background: #fafafa; 12 | font-family: 'Roboto', 'Helvetica Neue', Helvetica, Arial, sans-serif; 13 | color: #333; 14 | } 15 | -------------------------------------------------------------------------------- /app/sw-import.js: -------------------------------------------------------------------------------- 1 | /* 2 | Copyright (c) 2015 The Polymer Project Authors. All rights reserved. 3 | This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt 4 | The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt 5 | The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt 6 | Code distributed by Google as part of the polymer project is also 7 | subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt 8 | */ 9 | 10 | importScripts('bower_components/platinum-sw/service-worker.js'); 11 | -------------------------------------------------------------------------------- /app/test/index.html: -------------------------------------------------------------------------------- 1 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | Elements Test Runner 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 28 | 29 | 30 | 31 | 32 | 33 | -------------------------------------------------------------------------------- /app/test/my-greeting-basic.html: -------------------------------------------------------------------------------- 1 | 10 | 11 | 12 | 13 | 14 | 15 | my-greeting-basic 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 33 | 34 | 35 | 51 | 52 | 53 | 54 | -------------------------------------------------------------------------------- /app/test/my-list-basic.html: -------------------------------------------------------------------------------- 1 | 10 | 11 | 12 | 13 | 14 | 15 | my-list-basic 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 33 | 34 | 35 | 66 | 67 | 68 | 69 | -------------------------------------------------------------------------------- /bower.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "polymer-starter-kit", 3 | "version": "0.0.0", 4 | "license": "http://polymer.github.io/LICENSE.txt", 5 | "dependencies": { 6 | "iron-elements": "PolymerElements/iron-elements#1.0.0", 7 | "paper-elements": "PolymerElements/paper-elements#1.0.1", 8 | "platinum-elements": "PolymerElements/platinum-elements#1.0.0", 9 | "page": "visionmedia/page.js#~1.6.3" 10 | }, 11 | "devDependencies": { 12 | "web-component-tester": "*", 13 | "test-fixture": "PolymerElements/test-fixture#^1.0.0" 14 | }, 15 | "resolutions": { 16 | "polymer": "^1.0.0", 17 | "webcomponentsjs": "^0.7.2", 18 | "iron-ajax": "^1.0.0", 19 | "promise-polyfill": "^1.0.0", 20 | "iron-autogrow-textarea": "^1.0.0", 21 | "iron-validatable-behavior": "^1.0.0", 22 | "iron-behaviors": "^1.0.0", 23 | "iron-a11y-keys-behavior": "^1.0.0", 24 | "iron-collapse": "^1.0.0", 25 | "iron-component-page": "^1.0.0", 26 | "paper-toolbar": "^1.0.0", 27 | "paper-header-panel": "^1.0.0", 28 | "paper-styles": "^1.0.0", 29 | "iron-doc-viewer": "^1.0.1", 30 | "marked-element": "^1.0.0", 31 | "prism-element": "^1.0.2", 32 | "iron-fit-behavior": "^1.0.0", 33 | "iron-flex-layout": "^1.0.0", 34 | "iron-icon": "^1.0.0", 35 | "iron-icons": "^1.0.0", 36 | "iron-iconset": "^1.0.0", 37 | "iron-iconset-svg": "^1.0.0", 38 | "iron-image": "^1.0.0", 39 | "iron-input": "^1.0.0", 40 | "iron-jsonp-library": "^1.0.0", 41 | "iron-localstorage": "^1.0.0", 42 | "iron-media-query": "^1.0.0", 43 | "iron-meta": "^1.0.0", 44 | "iron-overlay-behavior": "^1.0.0", 45 | "iron-pages": "^1.0.0", 46 | "iron-resizable-behavior": "^1.0.0", 47 | "iron-selector": "^1.0.0", 48 | "iron-signals": "^1.0.0", 49 | "iron-test-helpers": "^1.0.0", 50 | "paper-behaviors": "^1.0.0", 51 | "paper-button": "^1.0.0", 52 | "paper-checkbox": "^1.0.0", 53 | "paper-dialog-scrollable": "^1.0.0", 54 | "paper-drawer-panel": "^1.0.0", 55 | "paper-fab": "^1.0.0", 56 | "paper-icon-button": "^1.0.0", 57 | "paper-input": "^1.0.0", 58 | "iron-form-element-behavior": "^1.0.0", 59 | "paper-item": "^1.0.0", 60 | "paper-material": "^1.0.0", 61 | "paper-menu": "^1.0.0", 62 | "iron-menu-behavior": "^1.0.0", 63 | "paper-radio-button": "^1.0.0", 64 | "paper-radio-group": "^1.0.0", 65 | "paper-ripple": "^1.0.0", 66 | "paper-spinner": "^1.0.0", 67 | "paper-tabs": "^1.0.0", 68 | "paper-toast": "^1.0.0", 69 | "iron-a11y-announcer": "^1.0.0", 70 | "paper-toggle-button": "^1.0.0", 71 | "platinum-sw": "~1.0.0" 72 | } 73 | } 74 | -------------------------------------------------------------------------------- /gulpfile.js: -------------------------------------------------------------------------------- 1 | /* 2 | Copyright (c) 2015 The Polymer Project Authors. All rights reserved. 3 | This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt 4 | The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt 5 | The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt 6 | Code distributed by Google as part of the polymer project is also 7 | subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt 8 | */ 9 | 10 | 'use strict'; 11 | 12 | // Include Gulp & Tools We'll Use 13 | var gulp = require('gulp'); 14 | var $ = require('gulp-load-plugins')(); 15 | var del = require('del'); 16 | var runSequence = require('run-sequence'); 17 | var browserSync = require('browser-sync'); 18 | var reload = browserSync.reload; 19 | var merge = require('merge-stream'); 20 | var path = require('path'); 21 | var fs = require('fs'); 22 | var glob = require('glob'); 23 | 24 | var AUTOPREFIXER_BROWSERS = [ 25 | 'ie >= 10', 26 | 'ie_mob >= 10', 27 | 'ff >= 30', 28 | 'chrome >= 34', 29 | 'safari >= 7', 30 | 'opera >= 23', 31 | 'ios >= 7', 32 | 'android >= 4.4', 33 | 'bb >= 10' 34 | ]; 35 | 36 | var styleTask = function (stylesPath, srcs) { 37 | return gulp.src(srcs.map(function(src) { 38 | return path.join('app', stylesPath, src); 39 | })) 40 | .pipe($.changed(stylesPath, {extension: '.css'})) 41 | .pipe($.autoprefixer(AUTOPREFIXER_BROWSERS)) 42 | .pipe(gulp.dest('.tmp/' + stylesPath)) 43 | .pipe($.if('*.css', $.cssmin())) 44 | .pipe(gulp.dest('dist/' + stylesPath)) 45 | .pipe($.size({title: stylesPath})); 46 | }; 47 | 48 | // Compile and Automatically Prefix Stylesheets 49 | gulp.task('styles', function () { 50 | return styleTask('styles', ['**/*.css']); 51 | }); 52 | 53 | gulp.task('elements', function () { 54 | return styleTask('elements', ['**/*.css']); 55 | }); 56 | 57 | // Lint JavaScript 58 | gulp.task('jshint', function () { 59 | return gulp.src([ 60 | 'app/scripts/**/*.js', 61 | 'app/elements/**/*.js', 62 | 'app/elements/**/*.html' 63 | ]) 64 | .pipe(reload({stream: true, once: true})) 65 | .pipe($.jshint.extract()) // Extract JS from .html files 66 | .pipe($.jshint()) 67 | .pipe($.jshint.reporter('jshint-stylish')) 68 | .pipe($.if(!browserSync.active, $.jshint.reporter('fail'))); 69 | }); 70 | 71 | // Optimize Images 72 | gulp.task('images', function () { 73 | return gulp.src('app/images/**/*') 74 | .pipe($.cache($.imagemin({ 75 | progressive: true, 76 | interlaced: true 77 | }))) 78 | .pipe(gulp.dest('dist/images')) 79 | .pipe($.size({title: 'images'})); 80 | }); 81 | 82 | // Copy All Files At The Root Level (app) 83 | gulp.task('copy', function () { 84 | var app = gulp.src([ 85 | 'app/*', 86 | '!app/test', 87 | '!app/precache.json', 88 | 'node_modules/apache-server-configs/dist/.htaccess' 89 | ], { 90 | dot: true 91 | }).pipe(gulp.dest('dist')); 92 | 93 | var bower = gulp.src([ 94 | 'bower_components/**/*' 95 | ]).pipe(gulp.dest('dist/bower_components')); 96 | 97 | var elements = gulp.src(['app/elements/**/*.html']) 98 | .pipe(gulp.dest('dist/elements')); 99 | 100 | var swBootstrap = gulp.src(['bower_components/platinum-sw/bootstrap/*.js']) 101 | .pipe(gulp.dest('dist/elements/bootstrap')); 102 | 103 | var swToolbox = gulp.src(['bower_components/sw-toolbox/*.js']) 104 | .pipe(gulp.dest('dist/sw-toolbox')); 105 | 106 | var vulcanized = gulp.src(['app/elements/elements.html']) 107 | .pipe($.rename('elements.vulcanized.html')) 108 | .pipe(gulp.dest('dist/elements')); 109 | 110 | return merge(app, bower, elements, vulcanized, swBootstrap, swToolbox) 111 | .pipe($.size({title: 'copy'})); 112 | }); 113 | 114 | // Copy Web Fonts To Dist 115 | gulp.task('fonts', function () { 116 | return gulp.src(['app/fonts/**']) 117 | .pipe(gulp.dest('dist/fonts')) 118 | .pipe($.size({title: 'fonts'})); 119 | }); 120 | 121 | // Scan Your HTML For Assets & Optimize Them 122 | gulp.task('html', function () { 123 | var assets = $.useref.assets({searchPath: ['.tmp', 'app', 'dist']}); 124 | 125 | return gulp.src(['app/**/*.html', '!app/{elements,test}/**/*.html']) 126 | // Replace path for vulcanized assets 127 | .pipe($.if('*.html', $.replace('elements/elements.html', 'elements/elements.vulcanized.html'))) 128 | .pipe(assets) 129 | // Concatenate And Minify JavaScript 130 | .pipe($.if('*.js', $.uglify({preserveComments: 'some'}))) 131 | // Concatenate And Minify Styles 132 | // In case you are still using useref build blocks 133 | .pipe($.if('*.css', $.cssmin())) 134 | .pipe(assets.restore()) 135 | .pipe($.useref()) 136 | // Minify Any HTML 137 | .pipe($.if('*.html', $.minifyHtml({ 138 | quotes: true, 139 | empty: true, 140 | spare: true 141 | }))) 142 | // Output Files 143 | .pipe(gulp.dest('dist')) 144 | .pipe($.size({title: 'html'})); 145 | }); 146 | 147 | // Vulcanize imports 148 | gulp.task('vulcanize', function () { 149 | var DEST_DIR = 'dist/elements'; 150 | 151 | return gulp.src('dist/elements/elements.vulcanized.html') 152 | .pipe($.vulcanize({ 153 | dest: DEST_DIR, 154 | strip: true, 155 | inlineCss: true, 156 | inlineScripts: true 157 | })) 158 | .pipe(gulp.dest(DEST_DIR)) 159 | .pipe($.size({title: 'vulcanize'})); 160 | }); 161 | 162 | // Generate a list of files that should be precached when serving from 'dist'. 163 | // The list will be consumed by the element. 164 | gulp.task('precache', function (callback) { 165 | var dir = 'dist'; 166 | 167 | glob('{elements,scripts,styles}/**/*.*', {cwd: dir}, function(error, files) { 168 | if (error) { 169 | callback(error); 170 | } else { 171 | files.push('index.html', './', 'bower_components/webcomponentsjs/webcomponents.min.js'); 172 | var filePath = path.join(dir, 'precache.json'); 173 | fs.writeFile(filePath, JSON.stringify(files), callback); 174 | } 175 | }); 176 | }); 177 | 178 | // Clean Output Directory 179 | gulp.task('clean', del.bind(null, ['.tmp', 'dist'])); 180 | 181 | // Watch Files For Changes & Reload 182 | gulp.task('serve', ['styles', 'elements', 'images'], function () { 183 | browserSync({ 184 | notify: false, 185 | // Run as an https by uncommenting 'https: true' 186 | // Note: this uses an unsigned certificate which on first access 187 | // will present a certificate warning in the browser. 188 | // https: true, 189 | server: { 190 | baseDir: ['.tmp', 'app'], 191 | routes: { 192 | '/bower_components': 'bower_components' 193 | } 194 | } 195 | }); 196 | 197 | gulp.watch(['app/**/*.html'], reload); 198 | gulp.watch(['app/styles/**/*.{css}'], ['styles', reload]); 199 | gulp.watch(['app/elements/**/*.{css}'], ['elements', reload]); 200 | gulp.watch(['app/{scripts,elements}/**/*.js'], ['jshint']); 201 | gulp.watch(['app/images/**/*'], reload); 202 | }); 203 | 204 | // Build and serve the output from the dist build 205 | gulp.task('serve:dist', ['default'], function () { 206 | browserSync({ 207 | notify: false, 208 | // Run as an https by uncommenting 'https: true' 209 | // Note: this uses an unsigned certificate which on first access 210 | // will present a certificate warning in the browser. 211 | // https: true, 212 | server: 'dist' 213 | }); 214 | }); 215 | 216 | // Build Production Files, the Default Task 217 | gulp.task('default', ['clean'], function (cb) { 218 | runSequence( 219 | ['copy', 'styles'], 220 | 'elements', 221 | ['jshint', 'images', 'fonts', 'html'], 222 | 'vulcanize', 'precache', 223 | cb); 224 | }); 225 | 226 | // Load tasks for web-component-tester 227 | // Adds tasks for `gulp test:local` and `gulp test:remote` 228 | try { require('web-component-tester').gulp.init(gulp); } catch (err) {} 229 | 230 | // Load custom tasks from the `tasks` directory 231 | try { require('require-dir')('tasks'); } catch (err) {} 232 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "polymer-starter-kit", 3 | "version": "0.0.0", 4 | "dependencies": {}, 5 | "devDependencies": { 6 | "apache-server-configs": "^2.7.1", 7 | "browser-sync": "^2.6.4", 8 | "del": "^1.1.1", 9 | "glob": "^5.0.6", 10 | "gulp": "^3.8.5", 11 | "gulp-autoprefixer": "^2.1.0", 12 | "gulp-cache": "^0.2.8", 13 | "gulp-changed": "^1.0.0", 14 | "gulp-cssmin": "^0.1.6", 15 | "gulp-flatten": "0.0.4", 16 | "gulp-if": "^1.2.1", 17 | "gulp-imagemin": "^2.2.1", 18 | "gulp-jshint": "^1.6.3", 19 | "gulp-load-plugins": "^0.10.0", 20 | "gulp-minify-html": "^1.0.2", 21 | "gulp-rename": "^1.2.0", 22 | "gulp-replace": "^0.5.3", 23 | "gulp-size": "^1.0.0", 24 | "gulp-uglify": "^1.2.0", 25 | "gulp-uncss": "^1.0.1", 26 | "gulp-useref": "^1.1.2", 27 | "gulp-vulcanize": "^6.0.0", 28 | "jshint-stylish": "^1.0.1", 29 | "merge-stream": "^0.1.7", 30 | "opn": "^1.0.0", 31 | "require-dir": "^0.3.0", 32 | "run-sequence": "^1.0.2", 33 | "vulcanize": ">= 1.4.2", 34 | "web-component-tester": "git://github.com/Polymer/web-component-tester.git#master" 35 | }, 36 | "engines": { 37 | "node": ">=0.10.0" 38 | } 39 | } 40 | -------------------------------------------------------------------------------- /wct.conf.js: -------------------------------------------------------------------------------- 1 | /* 2 | Copyright (c) 2015 The Polymer Project Authors. All rights reserved. 3 | This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt 4 | The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt 5 | The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt 6 | Code distributed by Google as part of the polymer project is also 7 | subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt 8 | */ 9 | 10 | module.exports = { 11 | root: 'app', 12 | suites: ['test'] 13 | }; 14 | --------------------------------------------------------------------------------