The card view declaration

CardController.js

/**
 * The card controller
 * @extends {maria.Controller}
 */
SL.MVC.CardController = {};

maria.Controller.subclass(SL.MVC, "CardController", {
    properties: {
        onDrag: function(){
            /* 
             * When the user drag the card, get the new position of the card
             * and update model based on the (x, y) position on the screen
             */
        }
    }
});

CardView.js

/**
 * The card view
 * @extends {maria.ElementView}
 */
SL.MVC.CardView = {};
SL.MVC.CardTemplate = SL.Utils.Template.load("card"); //<div class='card'></div>

maria.ElementView.subclass(SL.MVC, "CardView", {
    uiActions: {
        'drag .card': 'onDrag'
    },
    properties: {
        buildData: function() {
            //Loads the template into a jQuery object instance
            var $templ = $(this.find(""));
            
            //Loads a card SVG and put into the template
            var cardSvg = SL.App.cardFactory.getCardSVG(this.getModel());
            $templ.html(cardSvg);

            //Transforms the div into a draggable element
            $templ.draggable();
        },

        update: function(){
            this.buildData();
        }
    }
});