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.Imagetransition =
 24 {
 25 	getName: function()
 26 	{
 27 		return 'appcelerator imagetransition';
 28 	},
 29 	getDescription: function()
 30 	{
 31 		return 'imagetransition widget';
 32 	},
 33 	getVersion: function()
 34 	{
 35 		return '1.0.1';
 36 	},
 37 	getSpecVersion: function()
 38 	{
 39 		return 1.0;
 40 	},
 41 	getAuthor: function()
 42 	{
 43 		return 'Hamed Hashemi';
 44 	},
 45 	getModuleURL: function ()
 46 	{
 47 		return 'http://www.appcelerator.org';
 48 	},
 49 	isWidget: function ()
 50 	{
 51 		return true;
 52 	},
 53 	getWidgetName: function()
 54 	{
 55 		return 'app:imagetransition';
 56 	},
 57 	getActions: function()
 58 	{
 59 		return ['execute'];
 60 	},	
 61 	getAttributes: function()
 62 	{
 63         return [{
 64             name: 'on',
 65             optional: true,
 66 			type: Appcelerator.Types.onExpr,
 67             description: "May be used to execute a new transition"
 68         }, {
 69             name: 'initial',
 70             optional: true,
 71 			type: Appcelerator.Types.identifier,
 72             description: "The initial image URL"
 73         }, {
 74             name: 'effect',
 75             optional: true,
 76 			defaultValue: 'appear',
 77 			type: Appcelerator.Types.identifier,
 78             description: "The type of effect to use"
 79         }, {
 80 			name: 'width',
 81 			optional: false,
 82 			type: Appcelerator.Types.cssDimension,
 83 			description: "Width of the container"
 84         }, {
 85 			name: 'height',
 86 			optional: false,
 87 			type: Appcelerator.Types.cssDimension,
 88 			description: "Height of the container"
 89         }, {
 90 			name: 'property',
 91 			optional: true,
 92 			defaultValue: 'image',
 93 			type: Appcelerator.Types.identifier,
 94 			description: "Property used in the on expression that defines the image URL"
 95 		}];
 96 	},
 97 	execute: function(id,parameterMap,data,scope,version,customdata,direction,type)
 98 	{
 99 		var propertyName = parameterMap['property'];
100 		var image = data[propertyName];
101 		var divElement = $(parameterMap['id']);
102 		var imageElement = $(parameterMap['id']+'_image');
103 		
104 		if (image)
105 		{
106 			if (imageElement.src)
107 			{
108 				Element.setStyle(divElement, {backgroundImage : "url('"+imageElement.src+"')"});
109 				Element.setStyle(divElement, {display: 'block'});
110 			}
111 			else
112 			{
113 				Element.setStyle(divElement, {backgroundImage : "url('"+image+"')"});
114 				new Effect.Appear(divElement, { duration: .5, from: 0.0, to: 1.0 } );
115 			}
116 			imageElement.src = image;
117 			Element.setStyle(imageElement, {display: 'none'});
118 			
119 			switch (parameterMap['effect'])
120 			{
121 				case 'appear':
122 				case 'fade':
123 				{
124 					new Effect.Appear(imageElement, { duration: .5, from: 0.0, to: 1.0 } );
125 				}
126 			}
127 		}
128 	},
129 	buildWidget: function(element,parameters)
130 	{
131 		var html = '';
132 		var style = '';
133 		
134 		if (parameters['initial'])
135 		{
136 			style += 'background-image: url(\'' + parameters['initial'] + '\');';
137 		}
138 		else
139 		{
140 			style += 'display: none;';
141 		}
142 		if (parameters['width'])
143 		{
144 			style += 'width: ' + parameters['width'] + 'px;';
145 		}
146 		if (parameters['height'])
147 		{
148 			style += 'height: ' + parameters['height'] + 'px;';
149 		}
150 		
151 		html += '<div id="' + parameters['id'] +'" style="'+style+'">';
152 		html += '<img ';
153 		if (parameters['initial'])
154 		{
155 			html += ' src="' + parameters['initial'] + '"';
156 		}
157 		html += ' id="' + parameters['id'] + '_image"/>';
158 		html += '</div>';
159 		
160 		return {
161 			'position' : Appcelerator.Compiler.POSITION_REPLACE,
162 			'presentation' : html
163 	   };
164 	}
165 };
166 
167 Appcelerator.Widget.register('app:imagetransition',Appcelerator.Widget.Imagetransition);
168