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 });