1 // ========================================================================== 2 // Project: The M-Project - Mobile HTML5 Application Framework 3 // Copyright: (c) 2010 M-Way Solutions GmbH. All rights reserved. 4 // (c) 2011 panacoda GmbH. All rights reserved. 5 // Creator: Dominik 6 // Date: 02.11.2010 7 // License: Dual licensed under the MIT or GPL Version 2 licenses. 8 // http://github.com/mwaylabs/The-M-Project/blob/master/MIT-LICENSE 9 // http://github.com/mwaylabs/The-M-Project/blob/master/GPL-LICENSE 10 // ========================================================================== 11 12 /** 13 * A constant value for hyperlink of type email. 14 * 15 * @type String 16 */ 17 M.HYPERLINK_EMAIL = 'mail'; 18 19 /** 20 * A constant value for hyperlink of type website. 21 * 22 * @type String 23 */ 24 M.HYPERLINK_WEBSITE = 'website'; 25 26 /** 27 * A constant value for hyperlink of type phone number. 28 * 29 * @type String 30 */ 31 M.HYPERLINK_PHONE = 'phone'; 32 33 /** 34 * @class 35 * 36 * The is the prototype of any label view. It basically renders a simple plain 37 * text can be styled using several properties of M.LabelView or providing one 38 * ore more css classes. 39 * 40 * @extends M.View 41 */ 42 M.LabelView = M.View.extend( 43 /** @scope M.LabelView.prototype */ { 44 45 /** 46 * The type of this object. 47 * 48 * @type String 49 */ 50 type: 'M.LabelView', 51 52 /** 53 * Determines whether a new line '\n' within the label's value should be transformed 54 * into a line break '<br/>' before it is rendered. Default: YES. 55 * 56 * @type Boolean 57 */ 58 newLineToBreak: YES, 59 60 /** 61 * Determines whether a tabulator '\t' within the label's value should be transformed 62 * into four spaces ' ' before it is rendered. Default: YES. 63 * 64 * @type Boolean 65 */ 66 tabToSpaces: YES, 67 68 /** 69 * This property can be used to specify a certain hyperlink type for this label. It only 70 * works in combination with the hyperlinkTarget property. 71 * 72 * @type String 73 */ 74 hyperlinkType: null, 75 76 /** 77 * This property can be used to specify a hyperlink target for this label. It only 78 * works in combination with the hyperlinkType property. 79 * 80 * @type String 81 */ 82 hyperlinkTarget: null, 83 84 /** 85 * This property specifies the recommended events for this type of view. 86 * 87 * @type Array 88 */ 89 recommendedEvents: ['tap'], 90 91 /** 92 * Renders a label view as a div tag with corresponding data-role attribute and inner 93 * text defined by value. 94 * 95 * @private 96 * @returns {String} The image view's styling as html representation. 97 */ 98 render: function() { 99 this.computeValue(); 100 this.html += '<div id="' + this.id + '"' + this.style() + '>'; 101 102 if(this.hyperlinkTarget && this.hyperlinkType) { 103 switch (this.hyperlinkType) { 104 case M.HYPERLINK_EMAIL: 105 this.html += '<a rel="external" href="mailto:' + this.hyperlinkTarget + '">'; 106 break; 107 case M.HYPERLINK_WEBSITE: 108 this.html += '<a rel="external" target="_blank" href="' + this.hyperlinkTarget + '">'; 109 break; 110 case M.HYPERLINK_PHONE: 111 this.html += '<a rel="external" href="tel:' + this.hyperlinkTarget + '">'; 112 break; 113 } 114 } 115 116 this.html += this.newLineToBreak ? this.nl2br(this.tabToSpaces ? this.tab2space(this.value) : this.value) : (this.tabToSpaces ? this.tab2space(this.value) : this.value); 117 118 if(this.hyperlinkTarget && this.hyperlinkType) { 119 this.html += '</a>'; 120 } 121 122 this.html += '</div>'; 123 124 return this.html; 125 }, 126 127 /** 128 * Updates the value of the label with DOM access by jQuery. 129 * 130 * @private 131 */ 132 renderUpdate: function() { 133 this.computeValue(); 134 $('#' + this.id).html(this.newLineToBreak ? this.nl2br(this.value) : this.value); 135 }, 136 137 /** 138 * Applies some style-attributes to the label. 139 * 140 * @private 141 * @returns {String} The label's styling as html representation. 142 */ 143 style: function() { 144 var html = ''; 145 if(this.isInline) { 146 html += ' style="display:inline;"'; 147 } 148 if(this.cssClass) { 149 html += ' class="' + this.cssClass + '"'; 150 } 151 return html; 152 }, 153 154 /** 155 * This method sets the label's value and initiates its re-rendering. 156 * 157 * @param {String} value The value to be applied to the label view. 158 */ 159 setValue: function(value) { 160 this.value = value; 161 this.renderUpdate(); 162 } 163 164 });