added npm, bower, grunt. adopted to latest polymer

WebMusicDevelopersJP · May 16, 2014 · 15fe0c2 · 15fe0c2
1 parent b48a252
commit 15fe0c2
Show file tree

Hide file tree

Showing 12 changed files with 1,212 additions and 1,161 deletions.
diff --git a/.gitignore b/.gitignore
@@ -0,0 +1,6 @@
+node_modules
+bower_components
+\.sass-cache
+lib/*
+.DS_Store
+*.sublime*
diff --git a/Gruntfile.js b/Gruntfile.js
@@ -0,0 +1,50 @@
+/*global module:false*/
+module.exports = function(grunt) {
+
+  // Project configuration.
+  grunt.initConfig({
+    // Metadata.
+    pkg: grunt.file.readJSON('package.json'),
+    bower: {
+      install: {
+        options: {
+          targetDir: 'lib',
+          layout: 'byType',
+          install: true,
+          verbose: true,
+          cleanTargetDir: true,
+          cleanBowerDir: false
+        }
+      }
+    },
+    banner: '/*! <%= pkg.title || pkg.name %> - v<%= pkg.version %> - ' +
+      '<%= grunt.template.today("yyyy-mm-dd") %>\n' +
+      '<%= pkg.homepage ? "* " + pkg.homepage + "\\n" : "" %>' +
+      '* Copyright (c) <%= grunt.template.today("yyyy") %> <%= pkg.author.name %>;' +
+      ' Licensed <%= _.pluck(pkg.licenses, "type").join(", ") %> */\n',
+    connect: {
+      site: {}
+    },
+    watch: {
+      files: [
+        "js/*",
+        "css/*",
+        "*.html"
+      ],
+      tasks: ['build'],
+      options: {
+        livereload: true
+      }
+    }
+  });
+
+  // These plugins provide necessary tasks.
+  grunt.loadNpmTasks('grunt-contrib-watch');
+  grunt.loadNpmTasks('grunt-contrib-connect');
+  grunt.loadNpmTasks('grunt-bower-task');
+
+  // Default task.
+  grunt.registerTask('default', ['connect', 'watch']);
+  grunt.registerTask('install', ['bower']);
+
+};
diff --git a/js/polymer.min.js b/js/polymer.min.js
diff --git a/js/polymer.min.js.map b/js/polymer.min.js.map
diff --git a/package.json b/package.json
@@ -0,0 +1,18 @@
+{
+  "name": "webaudio-controls",
+  "version": "0.1.0",
+  "description": "GUI parts library for Web application using [Polymer] WebComponents",
+  "main": "Gruntfile.js",
+  "dependencies": {},
+  "devDependencies": {
+    "grunt-contrib-watch": "~0.5.3",
+    "grunt-contrib-connect": "^0.7.1",
+    "grunt-bower-task": "~0.3.4"
+  },
+  "scripts": {
+    "test": ""
+  },
+  "repository": "[email protected]:WebMusicDevelopersJP/webaudio-controls.git",
+  "author": "WebMusicDevelopersJP",
+  "license": "Apache2.0"
+}
diff --git a/sample1.html b/sample1.html
@@ -3,9 +3,12 @@
   <head>
     <meta charset="utf-8">
     <title>[Polymer] WebAudio-Controls Live Demo</title>
-    <script src="//cdnjs.cloudflare.com/ajax/libs/polymer/0.0.20130816/polymer.min.js"></script>
-    <link rel="import" href="webcomponents/controls.html">
+    <script src="platform/platform.js"></script>
+    <link rel="import" href="webcomponents/webaudio-controls.html">
     <style type="text/css">
+    body {
+      font-family: Helvetica;
+    }
     table {
       border: 1px solid #666;
     }

diff --git a/sample2.html b/sample2.html
@@ -3,8 +3,8 @@
   <head>
     <meta charset="utf-8">
     <title>[Polymer] WebAudio Controls Test page</title>
-    <script src="//cdnjs.cloudflare.com/ajax/libs/polymer/0.0.20130816/polymer.min.js"></script>
-		<link rel="import" href="webcomponents/controls.html">
+    <script src="platform/platform.js"></script>
+		<link rel="import" href="webcomponents/webaudio-controls.html">
     <style>
     body {
       font-family: sans-serif;

diff --git a/sample3.html b/sample3.html
@@ -1,89 +1,89 @@
 <!DOCTYPE html>
 <html>
-    <head>
-        <meta charset="utf-8">
-        <title>[Polymer] WebAudio-Controls Live Demo</title>
-        <script src="//cdnjs.cloudflare.com/ajax/libs/polymer/0.0.20130816/polymer.min.js"></script>
-        <link rel="import" href="webcomponents/controls.html">
-        <style>
-            #base {
-                color:#027;
-                position:relative;
-                background:#888;
-                background: linear-gradient(top, #444 0%, #aaa 3%,#888 97%,#444 100%);
-                background: -webkit-linear-gradient(top, #444 0%, #aaa 3%,#888 97%,#444 100%);
-                background: -moz-linear-gradient(top, #444 0%, #aaa 3%,#888 97%,#444 100%);
-                background: -ms-linear-gradient(top, #444 0%, #aaa 3%,#888 97%,#444 100%);
-                width:500px;
-                height:300px;
-                margin:30px 40px;
-                padding:0px;
-            }
-        </style>
-    </head>
+  <head>
+    <meta charset="utf-8">
+    <title>[Polymer] WebAudio-Controls Live Demo</title>
+    <script src="platform/platform.js"></script>
+    <link rel="import" href="webcomponents/webaudio-controls.html">
+    <style>
+      #base {
+        color:#027;
+        position:relative;
+        background:#888;
+        background: linear-gradient(top, #444 0%, #aaa 3%,#888 97%,#444 100%);
+        background: -webkit-linear-gradient(top, #444 0%, #aaa 3%,#888 97%,#444 100%);
+        background: -moz-linear-gradient(top, #444 0%, #aaa 3%,#888 97%,#444 100%);
+        background: -ms-linear-gradient(top, #444 0%, #aaa 3%,#888 97%,#444 100%);
+        width:500px;
+        height:300px;
+        margin:30px 40px;
+        padding:0px;
+      }
+    </style>
+  </head>
 <body style="background-color:#eee;font-family:sans-serif;position:relative">
-    <h1>WebAudio-Controls Live Demo</h1>
-    <div id="base">
-        <webaudio-knob id="knob1" diameter="48" style="position:absolute;left:50px;top:20px"></webaudio-knob>
-        <webaudio-knob id="knob2" diameter="48" style="position:absolute;left:120px;top:20px"></webaudio-knob>
-        <webaudio-param link="knob1" style="position:absolute;left:60px;top:75px"></webaudio-param>
-        <webaudio-param link="knob2" style="position:absolute;left:130px;top:75px"></webaudio-param>
-        <webaudio-slider id="slider1" width="16" height="80" style="position:absolute;left:380px;top:50px"></webaudio-slider>
-        <webaudio-slider id="slider2" direction="horz" style="position:absolute;left:240px;top:50px"></webaudio-slider>
-        <webaudio-switch id="switch1" style="position:absolute;left:220px;top:90px"></webaudio-switch>
-        <webaudio-switch id="switch2" style="position:absolute;left:260px;top:90px"></webaudio-switch>
-        <webaudio-keyboard id="key" width="400" height="100" min="48" keys="25" style="position:absolute;left:48px;top:160px"></webaudio-keyboard>
-        <webaudio-keyboard id="key2" width="160" height="20" min="36" keys="61" enable="0" colors="#000;#ccf;;#000;;#0fc;;#0fc" style="position:absolute;left:48px;top:270px"></webaudio-keyboard>
-        <span style="position:absolute;left:60px;top:100px">&lt;webaudio-knob&gt;</span>
-        <span style="position:absolute;left:60px;top:120px">&lt;webaudio-param&gt;</span>
-        <span style="position:absolute;left:270px;top:20px">&lt;webaudio-slider&gt;</span>
-        <span style="position:absolute;left:220px;top:120px">&lt;webaudio-switch&gt;</span>
-        <span style="position:absolute;left:320px;top:265px">&lt;webaudio-keyboard&gt;</span>
-	</div>
-    <div id="events" style="position:absolute;right:0;top:0;background:rgba(128,128,255,0.5);padding:10px;color:#000;text-align:left;width:300px;height:300px;overflow:scroll"></div>
+  <h1>WebAudio-Controls Live Demo</h1>
+  <div id="base">
+  <webaudio-knob id="knob1" diameter="48" style="position:absolute;left:50px;top:20px"></webaudio-knob>
+  <webaudio-knob id="knob2" diameter="48" style="position:absolute;left:120px;top:20px"></webaudio-knob>
+  <webaudio-param link="knob1" style="position:absolute;left:60px;top:75px"></webaudio-param>
+  <webaudio-param link="knob2" style="position:absolute;left:130px;top:75px"></webaudio-param>
+  <webaudio-slider id="slider1" width="16" height="80" style="position:absolute;left:380px;top:50px"></webaudio-slider>
+  <webaudio-slider id="slider2" direction="horz" style="position:absolute;left:240px;top:50px"></webaudio-slider>
+  <webaudio-switch id="switch1" style="position:absolute;left:220px;top:90px"></webaudio-switch>
+  <webaudio-switch id="switch2" style="position:absolute;left:260px;top:90px"></webaudio-switch>
+  <webaudio-keyboard id="key" width="400" height="100" min="48" keys="25" style="position:absolute;left:48px;top:160px"></webaudio-keyboard>
+  <webaudio-keyboard id="key2" width="160" height="20" min="36" keys="61" enable="0" colors="#000;#ccf;;#000;;#0fc;;#0fc" style="position:absolute;left:48px;top:270px"></webaudio-keyboard>
+  <span style="position:absolute;left:60px;top:100px">&lt;webaudio-knob&gt;</span>
+  <span style="position:absolute;left:60px;top:120px">&lt;webaudio-param&gt;</span>
+  <span style="position:absolute;left:270px;top:20px">&lt;webaudio-slider&gt;</span>
+  <span style="position:absolute;left:220px;top:120px">&lt;webaudio-switch&gt;</span>
+  <span style="position:absolute;left:320px;top:265px">&lt;webaudio-keyboard&gt;</span>
+</div>
+  <div id="events" style="position:absolute;right:0;top:0;background:rgba(128,128,255,0.5);padding:10px;color:#000;text-align:left;width:300px;height:300px;overflow:scroll"></div>
 
 <script type="text/javascript">
-    var message="";
-    var log=[];
-    var knobs = document.getElementsByTagName('webaudio-knob');
-    for(var i = 0; i < knobs.length; i++) {
-        knobs[i].addEventListener("change",Dump,false);
-        knobs[i].addEventListener("cancel",Dump,false);
-    }
-    var sliders = document.getElementsByTagName('webaudio-slider');
-    for(var i = 0; i < sliders.length; i++) {
-        sliders[i].addEventListener("change",Dump,false);
-        sliders[i].addEventListener("cancel",Dump,false);
-    }
-    var switches = document.getElementsByTagName('webaudio-switch');
-    for(var i = 0; i < switches.length; i++) {
-        switches[i].addEventListener("change",Dump,false);
-    }
-    var key=document.getElementById("key");
-    key.addEventListener('change',Dump,false);
-    key.addEventListener('note',Dump,false);
-    var key2=document.getElementById("key2");
+  var message="";
+  var log=[];
+  var knobs = document.getElementsByTagName('webaudio-knob');
+  for(var i = 0; i < knobs.length; i++) {
+    knobs[i].addEventListener("change",Dump,false);
+    knobs[i].addEventListener("cancel",Dump,false);
+  }
+  var sliders = document.getElementsByTagName('webaudio-slider');
+  for(var i = 0; i < sliders.length; i++) {
+    sliders[i].addEventListener("change",Dump,false);
+    sliders[i].addEventListener("cancel",Dump,false);
+  }
+  var switches = document.getElementsByTagName('webaudio-switch');
+  for(var i = 0; i < switches.length; i++) {
+    switches[i].addEventListener("change",Dump,false);
+  }
+  var key=document.getElementById("key");
+  key.addEventListener('change',Dump,false);
+  key.addEventListener('note',Dump,false);
+  var key2=document.getElementById("key2");
 
-    function Dump(e) {
-        var str="";
-        if(e.target.id=="key") {
-            key2.setNote(e.note[0],e.note[1]);
-            str=e.type + " : " + e.target.id + " : [" + e.note + "] ";
-        }
-        else
-            str=e.type + " : " + e.target.id + " : " + e.target.value + " ";
-        console.log(str);
-        log.unshift(str);
-        log.length=20;
-        str="";
-        for(var i=19;i>=0;--i) {
-            if(log[i])
-                str+=log[i]+"<br/>";
-        }
-        var evview=document.getElementById("events");
-        evview.innerHTML=str;
-        evview.scrollTop=evview.scrollHeight;
+  function Dump(e) {
+    var str="";
+    if(e.target.id=="key") {
+      key2.setNote(e.note[0],e.note[1]);
+      str=e.type + " : " + e.target.id + " : [" + e.note + "] ";
+    }
+    else
+      str=e.type + " : " + e.target.id + " : " + e.target.value + " ";
+    console.log(str);
+    log.unshift(str);
+    log.length=20;
+    str="";
+    for(var i=19;i>=0;--i) {
+      if(log[i])
+        str+=log[i]+"<br/>";
     }
+    var evview=document.getElementById("events");
+    evview.innerHTML=str;
+    evview.scrollTop=evview.scrollHeight;
+  }
 </script>
 </body>
 </html>
diff --git a/sample4.html b/sample4.html
@@ -3,8 +3,8 @@
 <head>
 <meta charset="utf-8">
 <title>[Polymer] WebAudio-Keyboard Test</title>
-<script src="//cdnjs.cloudflare.com/ajax/libs/polymer/0.0.20130816/polymer.min.js"></script>
-<link rel="import" href="webcomponents/controls.html">
+<script src="platform/platform.js"></script>
+<link rel="import" href="webcomponents/webaudio-controls.html">
 <script type="text/javascript" src="https://rawgithub.com/cwilso/WebMIDIAPIShim/gh-pages/WebMIDIAPI.js"></script>
 <script type="text/javascript">
 var midioutputs=null;

diff --git a/webcomponents/bower.json b/webcomponents/bower.json
@@ -0,0 +1,20 @@
+{
+  "dependencies": {
+    "polymer": "Polymer/polymer#master"
+  },
+  "name": "webaudio-controls",
+  "version": "0.1.0",
+  "private": true,
+  "main": "webcomponents/controls.html",
+  "author": "WebMusicDevelopersJP",
+  "description": "GUI parts library for Web application using [Polymer] WebComponents",
+  "license": "Apache2.0",
+  "homepage": "http://google.com/+agektmr",
+  "ignore": [
+    "**/.*",
+    "node_modules",
+    "bower_components",
+    "test",
+    "tests"
+  ]
+}