Add svg -> iconset generator

Use public MD icons github repo

.gitignore

@@ -0,0 +1,2 @@
+util/node_modules
+material-design-icons

update-icons.sh

@@ -0,0 +1,138 @@
+#!/bin/bash
+#
+# @license
+# Copyright (c) 2014 The Polymer Project Authors. All rights reserved.
+# This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
+# The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
+# The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
+# Code distributed by Google as part of the polymer project is also
+# subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
+#
+set -e
+
+ICONSRC="material-design-icons/"
+ORIGIN="git://github.com/google/material-design-icons.git"
+
+# bootstrap a sparse SVG only checkout
+bootstrap() {
+  mkdir -p ${ICONSRC}
+  pushd ${ICONSRC}
+  git init
+  git config core.sparsecheckout true
+  echo "*/svg/*_24px.svg" >> .git/info/sparse-checkout
+  git remote add -f origin ${ORIGIN}
+  popd
+}
+
+header() {
+cat > $1 <<ENDL
+<!--
+Copyright (c) 2014 The Polymer Project Authors. All rights reserved.
+This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
+The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
+The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
+Code distributed by Google as part of the polymer project is also
+subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
+-->
+
+<link rel="import" href="../core-icon/core-icon.html">
+<link rel="import" href="../core-iconset-svg/core-iconset-svg.html">
+<core-iconset-svg id="$2" iconSize="24">
+<svg><defs>
+ENDL
+}
+
+footer(){
+cat >> $1 <<ENDL
+</defs></svg>
+</core-iconset-svg>
+ENDL
+}
+
+contains() {
+  local e
+  for e in "${@:2}"; do [[ "$e" == "$1" ]] && return 0; done
+  return 1;
+}
+
+build() {
+# dirname of path to current script
+local runfrom="${0%[/\\]*}"
+local folder="$1"
+
+# put these sets into one big "icons" set
+local default=(action alert content file navigation toggle)
+
+local name="icons"
+local file="../core-icons.html"
+
+# special docs header for core-icons.html
+cat > $file <<'ENDL'
+<!--
+Copyright (c) 2014 The Polymer Project Authors. All rights reserved.
+This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
+The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
+The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
+Code distributed by Google as part of the polymer project is also
+subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
+-->
+<!--
+
+`core-icons` is a utitliy import that includes the definition for the `core-icon` element, `core-iconset-svg` element, as well as an import for the default icon set.
+
+The `core-icons` directory also includes imports for additional icon sets that can be loaded into your project.
+
+Example loading icon set:
+
+    <link rel="import" href="../core-icons/maps-icons.html">
+
+To use an icon from one of these sets, first prefix your `core-icon` with the icon set name, followed by a colon, ":", and then the icon id.
+
+Example using the directions-bus icon from the maps icon set:
+
+    <core-icon icon="maps:directions-bus"></core-icon>
+
+
+See [core-icon](#core-icon) for more information about working with icons.
+
+See [core-iconset](#core-iconset) and [core-iconset-svg](#core-iconset-svg) for more information about how to create a custom iconset.
+
+@group Polymer Core Elements
+@element core-icons
+@homepage polymer.github.io
+-->
+<link rel="import" href="../core-icon/core-icon.html">
+<link rel="import" href="../core-iconset-svg/core-iconset-svg.html">
+<core-iconset-svg id="icons" iconSize="24">
+<svg><defs>
+ENDL
+
+# find all the default icons, sort by basename (in perl), run concat
+find "${default[@]/#/$folder}" -name "*24px.svg" | xargs $runfrom/concat-svg.js | sort >> $file
+
+footer $file
+
+local dir
+for dir in $folder/*/; do
+  if contains "`basename $dir`" "${default[@]}"; then
+    continue
+  fi
+  echo $dir
+  name=`basename $dir`
+  file="../$name-icons.html"
+  header $file $name
+  find $dir -name "*24px.svg" | xargs $runfrom/concat-svg.js | sort >> $file
+  footer $file
+done
+}
+
+[ -d ${ICONSRC} ] || bootstrap
+
+pushd ${ICONSRC}
+git pull origin master
+popd
+
+pushd util
+npm install
+build ../${ICONSRC}
+popd

util/compile-icon-sets.sh

@@ -0,0 +1,73 @@
+#!/bin/bash
+#
+# @license
+# Copyright (c) 2014 The Polymer Project Authors. All rights reserved.
+# This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
+# The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
+# The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
+# Code distributed by Google as part of the polymer project is also
+# subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
+#
+
+# dirname of path to current script
+runfrom="${0%[/\\]*}"
+FOLDER="$1"
+
+# put these sets into one big "icons" set
+DEFAULT=(action alert content file navigation toggle)
+
+# there are no icons here
+BLACKLIST=(moticons common_cfg proprietary)
+
+header() {
+cat > $FILE <<ENDL
+<!--
+Copyright (c) 2014 The Polymer Project Authors. All rights reserved.
+This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
+The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
+The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
+Code distributed by Google as part of the polymer project is also
+subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
+-->
+
+<link rel="import" href="../core-icon/core-icon.html">
+<link rel="import" href="../core-iconset-svg/core-iconset-svg.html">
+<core-iconset-svg id="$NAME" iconSize="24">
+<svg><defs>
+ENDL
+}
+
+footer(){
+cat >> $FILE <<ENDL
+</defs></svg>
+</core-iconset-svg>
+ENDL
+}
+
+contains() {
+  local e
+  for e in "${@:2}"; do [[ "$e" == "$1" ]] && return 0; done
+  return 1;
+}
+
+NAME="icons"
+FILE="core-icons.html"
+header
+# find all the default icons, sort by basename (in perl), run concat
+find "${DEFAULT[@]/#/$FOLDER}" -name "*24px.svg" | perl -le 'print sort{($p=$a)=~s|.*/||; ($q=$b)=~s|.*/||; lc($p) cmp lc($q)} <>' | xargs $runfrom/concat-svg.js >> $FILE
+footer
+
+for dir in $FOLDER/*/; do
+  if contains "`basename $dir`" "${DEFAULT[@]}"; then
+    continue
+  fi
+  if contains "`basename $dir`" "${BLACKLIST[@]}"; then
+    continue
+  fi
+  echo $dir
+  NAME=`basename $dir`
+  FILE="$NAME-icons.html"
+  header
+  find $dir -name "*24px.svg" | sort | xargs $runfrom/concat-svg.js >> $FILE
+  footer
+done

util/concat-svg.js

@@ -0,0 +1,64 @@
+#!/usr/bin/env node
+/*
+ * @license
+ * Copyright (c) 2014 The Polymer Project Authors. All rights reserved.
+ * This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
+ * The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
+ * The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
+ * Code distributed by Google as part of the polymer project is also
+ * subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
+ */
+
+var fs = require('fs');
+var cheerio = require('cheerio');
+var path = require('path');
+
+var cheerioOptions = {xmlMode: true};
+var files = process.argv.slice(2);
+
+function read(file) {
+  var content = fs.readFileSync(file, 'utf8');
+  return cheerio.load(content, cheerioOptions);
+}
+
+function transmogrify($, name) {
+  var node = $('svg');
+  // remove spacer rectangles
+  node.find('[fill=none]').remove();
+  // remove fill colors
+  node.find('[fill]').each(function() {
+    var e = $(this);
+    var color = e.attr('fill');
+    // some "white" nodes are extraneous
+    if (color === '#FFFFFF') {
+      e.remove();
+    } else {
+      e.removeAttr('fill');
+    }
+  });
+  // remove adobe "save for web" elements
+  node.find('sfw, metadata').remove();
+  // remove empty groups
+  var innerHTML = $.xml(node.find('*').filter(':not(g)'));
+  // remove extraneous whitespace
+  innerHTML = innerHTML.replace(/\t|\r|\n/g, '');
+  // add parent group with icon name as id
+  var output = '<g id="' + name + '">' + innerHTML + '</g>';
+  // print icon svg
+  console.log(output);
+}
+
+function path2IconName(file) {
+  parts = path.basename(file).split('_');
+  // remove ic_
+  parts.shift();
+  // remove _24px.svg
+  parts.pop();
+  return parts.join('-');
+}
+
+files.forEach(function(file) {
+  var name = path2IconName(file);
+  var $ = read(file);
+  transmogrify($, name);
+});

util/package.json

@@ -0,0 +1,9 @@
+{
+  "name": "concat-svg",
+  "version": "0.0.0",
+  "description": "",
+  "main": "concat-svg.js",
+  "dependencies": {
+    "cheerio": "^0.15.0"
+  }
+}