1 // ========================================================================== 2 // Project: The M-Project - Mobile HTML5 Application Framework 3 // Copyright: (c) 2010 M-Way Solutions GmbH. All rights reserved. 4 // Creator: Dominik 5 // Date: 02.11.2010 6 // License: Dual licensed under the MIT or GPL Version 2 licenses. 7 // http://github.com/mwaylabs/The-M-Project/blob/master/MIT-LICENSE 8 // http://github.com/mwaylabs/The-M-Project/blob/master/GPL-LICENSE 9 // ========================================================================== 10 11 /** 12 * @class 13 * 14 * The is the prototype of any label view. It basically renders a simple plain 15 * text can be styled using several properties of M.LabelView or providing one 16 * ore more css classes. 17 * 18 * @extends M.View 19 */ 20 M.LabelView = M.View.extend( 21 /** @scope M.LabelView.prototype */ { 22 23 /** 24 * The type of this object. 25 * 26 * @type String 27 */ 28 type: 'M.LabelView', 29 30 /** 31 * Determines whether a new line '\n' within the label's value should be transformed 32 * into a line break '<br/>' before it is rendered. Default: YES. 33 * 34 * @type Boolean 35 */ 36 newLineToBreak: YES, 37 38 /** 39 * Renders a label view as a div tag with corresponding data-role attribute and inner 40 * text defined by value. 41 * 42 * @private 43 * @returns {String} The image view's styling as html representation. 44 */ 45 render: function() { 46 this.computeValue(); 47 this.html += '<div id="' + this.id + '"' + this.style() + '>'; 48 this.html += this.newLineToBreak ? this.nl2br(this.value) : this.value; 49 this.html += '</div>'; 50 51 return this.html; 52 }, 53 54 /** 55 * Updates the value of the label with DOM access by jQuery. 56 * 57 * @private 58 */ 59 renderUpdate: function() { 60 this.computeValue(); 61 $('#' + this.id).html(this.newLineToBreak ? this.nl2br(this.value) : this.value); 62 }, 63 64 /** 65 * Applies some style-attributes to the label. 66 * 67 * @private 68 * @returns {String} The label's styling as html representation. 69 */ 70 style: function() { 71 var html = ''; 72 if(this.isInline) { 73 html += ' style="display:inline;"'; 74 } 75 if(this.cssClass) { 76 html += ' class="' + this.cssClass + '"'; 77 } 78 return html; 79 } 80 81 });