scancode.html

<link rel="import" href="lib/polymer.html">
<script type="text/javascript" src="lib/jquery.min.js"></script>
<script type="text/javascript" src="lib/jquery-barcode.min.js"></script>
<script type="text/javascript" src="lib/qrcode.js"></script>

<polymer-element name="scan-code">

  <dom-module id="scan-code">
    <template>
      <div id='scancode' style="text-align:center;"></div>
    </template>
  </dom-module>

  <script>
  Polymer({
    is: "scan-code",
    properties: {
      data:         { type: String, observer: 'dataChanged'},
      type:         { type: String, observer: 'typeChanged'},
      format:       { type: String, observer: 'formatChanged'},
      height:       { type: String, observer: 'heightChanged'},
      width:        { type: String, observer: 'widthChanged'},
      colordark:    { type: String, observer: 'colorDarkChanged'},
      colorlight:   { type: String, observer: 'colorLightChanged'}
    },

    ready: function(){
      this.generate();
    },

    dataChanged: function () {
        this.generate();
    },

    typeChanged: function () {
        this.generate();
    },

    formatChanged: function () {
      this.generate();
    },

    heightChanged: function () {
        this.generate();
    },

    widthChanged: function () {
        this.generate();
        console.log("changed");
    },

    colorDarkChanged: function () {
      console.log("changed");
        this.generate();
    },

    colorLightChanged: function () {
      console.log("changed");

        this.generate();
    },

    generate : function(){
      //console.dir(this.type);
      try{
        if (this.type === 'barcode') {
            this.generateBarcode();
        }
        else if (this.type === 'qrcode'){
            this.generateQRcode()
        }
        else{
          console.log("Not Rendering scancode");
          var el = this.$.scancode;
          el.innerHTML = "";
        }
      }
      catch(err) {
        console.dir(err);
      }
    },

    generateQRcode: function(){
      var el = this.$.scancode;
      el.innerHTML = "";
      //console.log(this.colorDark);
      var qrcode = new QRCode(el, {
          text: this.data,
          width: this.width,
          height: this.height,
          colorDark : this.colordark || "#000000",
          colorLight : this.colorlight || "#ffffff",
          correctLevel : QRCode.CorrectLevel.H
      });
    },

    generateBarcode: function(){
      var el = this.$.scancode;
      $(el).barcode(
        {
          code: this.data,
          crc:false
        },
        this.format || "codabar",
        {
          barWidth:this.width,
          barHeight:this.height
        }
      );
    }

  });
  </script>
</polymer-element>