How to properly use JS with Polymer?

[dadatawajue]

I'm trying to integrate bricks.js (https://jsfiddle.net/939ppbj4/13/) into a polymer project, but I can't quite figure out how to do it..

I've tried to go through the snippets in this repo but it seems javascript is always written as:

Polymer({
      is: 'test',
      properties: {
        blablabla
      },
});

which I find a little confusing..

I believe the closest thing I've gotten to being correct is as its written below, but it results in a bricks.min.js error saying

Uncaught TypeError: Cannot read property 'style' of null

(I don't get this error if I run same code outside polymer (like in the jsfiddle)

<dom-module id="test">
  <template>
    <section class="grid" >
      <div data-packed>
        <img src="http://lorempixel.com/150/340/">
      </div>
      <div data-packed>
        <img src="http://lorempixel.com/150/240/">
      </div>
      <div data-packed>
        <img src="http://lorempixel.com/150/540/">
      </div>
      <div data-packed>
        <img src="http://lorempixel.com/150/140/">
      </div>
      <div data-packed>
        <img src="http://lorempixel.com/150/320/">
      </div>
      <div data-packed>
        <img src="http://lorempixel.com/150/108/">
      </div>
      <div data-packed>
        <img src="http://lorempixel.com/150/340/">
      </div>
    </section>
  </template>

  <script src="../../scripts/bricks.min.js"></script>

  <script type="text/javascript">
    var sizes = [
      { columns: 2, gutter: 10 },
      { mq: '48em', columns: 3, gutter: 10 },
      { mq: '64em', columns: 4, gutter: 10 }
    ];

    var brickInstance = Bricks({
      container: '.grid',
      packed: 'data-packed',
      sizes: sizes,
    });

    window.onresize = function() {
      brickInstance.pack()
    };
  </script>
</dom-module>

Any help/suggestions would be much appreciated :3