(function() {
    var Ext = window.Ext4 || window.Ext;

    /**
     * The Ext.XTemplate used to render the status components and column in the grid for artifacts.
     *
     * Will look for a containing grid row, if it does not find one it uses the event target el
     */
    Ext.define('Rally.ui.renderer.template.status.StatusTemplate', {
        requires: [
            'Rally.ui.popover.PopoverFactory',
            'Rally.util.Ref'
        ],
        extend: 'Ext.XTemplate',

        inheritableStatics: {
            onClick: function(event, ref, popoverConfig) {
                var oid = Rally.util.Ref.getOidFromRef(ref);
                var target = Ext.get(event.target || event.srcElement);
                Rally.ui.popover.PopoverFactory.bake(Ext.apply({
                    target: target.up('.' + Ext.baseCSSPrefix + 'grid-row') || target,
                    oid: oid,
                    type: Rally.util.Ref.getTypeFromRef(ref),
                    placement: ['bottom', 'top'],
                    offsetFromTarget: [
                        {x: 0, y: -5},
                        {x: 5, y: 0},
                        {x: 0, y: 5},
                        {x: -5, y: 0}
                    ]
                }, popoverConfig));
                return false;
            }
        }
    });

})();