1 /*
  2  * This file is part of Appcelerator.
  3  *
  4  * Copyright (C) 2006-2008 by Appcelerator, Inc. All Rights Reserved.
  5  * For more information, please visit http://www.appcelerator.org
  6  *
  7  * Appcelerator is free software: you can redistribute it and/or modify
  8  * it under the terms of the GNU General Public License as published by
  9  * the Free Software Foundation, either version 3 of the License, or
 10  * (at your option) any later version.
 11  *
 12  * This program is distributed in the hope that it will be useful,
 13  * but WITHOUT ANY WARRANTY; without even the implied warranty of
 14  * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
 15  * GNU General Public License for more details.
 16  * 
 17  * You should have received a copy of the GNU General Public License
 18  * along with this program.  If not, see <http://www.gnu.org/licenses/>.
 19  *
 20  */
 21 
 22 
 23 Appcelerator.Widget.ProgressBar =
 24 {
 25 	getName: function()
 26 	{
 27 		return 'appcelerator progressbar';
 28 	},
 29 	getDescription: function()
 30 	{
 31 		return 'progressbar widget';
 32 	},
 33 	setPath: function(path)
 34 	{
 35 		this.modulePath = path;
 36 	},
 37 	getVersion: function()
 38 	{
 39 		return 1.0;
 40 	},
 41 	getSpecVersion: function()
 42 	{
 43 		return 1.0;
 44 	},
 45 	getAuthor: function()
 46 	{
 47 		return 'Martin Robinson';
 48 	},
 49 	getModuleURL: function ()
 50 	{
 51 		return 'http://www.appcelerator.org';
 52 	},
 53 	isWidget: function ()
 54 	{
 55 		return true;
 56 	},
 57 	getWidgetName: function()
 58 	{
 59 		return 'app:progressbar';
 60 	},
 61     getAttributes: function()
 62     {
 63 		var T = Appcelerator.Types;
 64         return [{name: 'borderClassName', optional: true, defaultValue: '', type: T.cssClass},
 65                 {name: 'fillClassName', optional: true, defaultValue: '', type: T.cssClass},
 66                 {name: 'width', optional: true, defaultValue: '500px', type: T.cssDimension},
 67                 {name: 'height', optional: true, defaultValue: '30px', type: T.cssDimension},
 68                 {name: 'message', optional: true, type: T.messageReceive},
 69                 {name: 'property', optional: true, type: T.identifier},
 70                 {name: 'animate', optional: true, defaultValue: 'true', type: T.bool}];
 71     },
 72 	compileWidget: function(params)
 73 	{
 74 		var id = params['id'];
 75 		var animate = params['animate'] == 'true';
 76 		var element = $(id);
 77 		
 78 		var progressbar_border = $(id+'_progressbar_border');
 79 		var progressbar_fill = $(id+'_progressbar_fill');
 80 		
 81 		Appcelerator.Compiler.addTrash(element,function()
 82 		{
 83 		});
 84 
 85 		var message = params['message'];
 86 		if (message)
 87 		{
 88 			message = Appcelerator.Compiler.convertMessageType(message);
 89 
 90 			var property = params['property'];
 91 			
 92 			$MQL(message,
 93 			function (type, data, datatype, direction)
 94 			{
 95 				$D('received message = '+direction+':'+type+',data='+Object.toJSON(data));
 96 				var value = property ? Object.getNestedProperty(data,property) : data;
 97                 value = Math.max(0, value);
 98                 value = Math.min(100, value);
 99 
100                 if (animate) {
101                     $(id+'_progressbar_fill').morph('width: ' + value + '%');
102                 } else {
103 				    progressbar_fill.style.width = value + "%";
104                 }
105 			},
106 			element.scope, element);
107 		}		
108 	},
109 	buildWidget: function(element, parameters)
110 	{
111 		var borderClassName = parameters['borderClassName'];
112 		var fillClassName = parameters['fillClassName'];
113 		var width = parameters['width'];
114 		var height = parameters['height'];
115 		var id = element.id;
116 
117 		var html = '';
118 
119 		var borderstyle = '"width: ' + width + '; height: ' + height + '"';
120 		var borderid = '"' + id + '_progressbar_border"';
121 		html += '<div style=' + borderstyle + ' id=' + borderid;
122 
123 		if (borderClassName != '') {
124 			html += ' class="' + borderClassName + '">';
125         } else {
126 			html += ' class="progressbar_border">'
127         }
128 
129 		var fillstyle = '"height: 100%; width: 0%;"';
130 		var fillid = '"' + id + '_progressbar_fill"';
131 		html += '<div style=' + fillstyle + ' id=' + fillid;
132 
133 		if (fillClassName != '') {
134 			html += ' class="' + fillClassName + '">';
135         } else {
136 			html += ' class="progressbar_fill">';
137         }
138 
139 		html += '</div></div>';
140 		
141 		parameters['id'] = element.id;
142 		
143 		return {
144 			'presentation' : html,
145 			'position' : Appcelerator.Compiler.POSITION_REPLACE,
146 			'compile' : true,
147 			'wire' : true
148 		};
149 	}
150 };
151 
152 
153 Appcelerator.Core.loadModuleCSS('app:progressbar','progressbar.css');
154 Appcelerator.Widget.register('app:progressbar',Appcelerator.Widget.ProgressBar);
155