Source: suxess/mockup-editor/elementDisplay.js

/**
 * Created by thomas on 11.2.2016.
 */

'use strict';

/**
 *
 * @param domAttributes
 * @constructor
 */
SUXESS.ElementDisplay = function (domAttributes) {

    SUXESS.Element.call( this, domAttributes );

};

SUXESS.ElementDisplay.prototype = Object.create( SUXESS.Element.prototype );
SUXESS.ElementDisplay.constructor = SUXESS.ElementDisplay;

/**
 *
 * @returns {DOM}
 */
SUXESS.ElementDisplay.prototype.render = function () {

    var elm = SUXESS.Renderable.prototype.render.call(this);
    var mockupElmId = 'mockup_element_' + this._lastState.id;

    if ( this._lastState.image != null ) {

        $(elm).append(
            '<img src="'+this._lastState.image.url+'" id="'+mockupElmId+'" ' +
            'style="width:100%;height:100%" />'
        );

    }

    $(elm).css('position',  'absolute');
    $(elm).css('width',     this._lastState.width);
    $(elm).css('height',    this._lastState.height);
    $(elm).css('left',      this._lastState.position.x);
    $(elm).css('top',       this._lastState.position.y);
    $(elm).css('zIndex',    this._lastState.layer);
    $(elm).addClass('editor-element');
    $(elm).attr('id', mockupElmId);

    this._lastRender = elm;
    return elm;

};