Polymer 1.0 with Firebase Document

gistfile1.txt

<link rel="import" href="../bower_components/polymer/polymer.html">
<link rel="import" href="../bower_components/more-routing/more-route.html">
<link rel="import" href="../bower_components/firebase-element/firebase-document.html">

<dom-module id="mc-player">
    <template>
        <more-route context name="player" params="{{params}}"></more-route>
        <firebase-document id="playerDocument" data="{{player}}"></firebase-document>

        <button on-tap="goBack"><</button>

        <h1>Player</h1>

        <button on-tap="levelDown"><</button>
        <span>{{player.name}}</span> - <span>{{player.level}}</span>
        <button on-tap="levelUp">></button>

    </template>

    <script>

    Polymer({
        is: 'mc-player',

        properties: {
            params: Object
        },

        observers: [
            'playerIdChanged(params.playerId)'
        ],

        playerIdChanged: function (playerId) {
            this.$.playerDocument.location = 'https://munchkincounter.firebaseio.com/games/' + this.params.gameId + '/players/' + playerId;
        },

        levelDown: function () {
            this.player.level -= 1;
            this.set('player.level', this.player.level);
        },

        levelUp: function () {
            this.player.level += 1;
            this.set('player.level', this.player.level);
        },

        goBack: function () {
            window.history.back();
        }
    });

    </script>
</dom-module>