package com.digitbit.effects.client;

import org.gwtwidgets.client.wrap.Effect;

import com.google.gwt.user.client.Timer;
import com.google.gwt.user.client.ui.ClickListener;
import com.google.gwt.user.client.ui.Composite;
import com.google.gwt.user.client.ui.FlowPanel;
import com.google.gwt.user.client.ui.HasHorizontalAlignment;
import com.google.gwt.user.client.ui.Image;
import com.google.gwt.user.client.ui.Label;
import com.google.gwt.user.client.ui.MouseListener;
import com.google.gwt.user.client.ui.VerticalPanel;
import com.google.gwt.user.client.ui.Widget;

/*
* Copyright 2007 Chris Fong <fongcn AT gmail.com>
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
*    http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/

public class EffectPanel extends Composite {

	
	private Image panelImage;
	private Label panelLabel;
	private String effectOptionsDescription;
	private FlowPanel flowPanel;
	
	public EffectPanel(String imageName, String labelText)
	{
		// We put everything in a flow panel because slideDown() and
		// slideUp() only works inside of it.
		flowPanel = new FlowPanel();
		flowPanel.addStyleName("effectPanel");
		VerticalPanel vertPanel = new VerticalPanel();
//		vertPanel.addStyleName("effectPanel");
		initWidget(flowPanel);
		vertPanel.setSpacing(5);
		vertPanel.setWidth("100px");

		vertPanel.setHorizontalAlignment(HasHorizontalAlignment.ALIGN_CENTER);
		panelImage = new Image() {
			public String toString()
			{
				return effectOptionsDescription;
			}
		};
		panelImage.setUrl("images/"+imageName);
		panelLabel = new Label(labelText) {
			public String toString()
			{
				return effectOptionsDescription;
			}
		};
		panelLabel.addStyleName("panelLabel");

		vertPanel.add(panelImage);
		vertPanel.add(panelLabel);
		flowPanel.add(vertPanel);
	}
	
	public void addMouseListener(MouseListener listener)
	{
		panelImage.addMouseListener(listener);
		panelLabel.addMouseListener(listener);
	}

	public EffectPanel fade() 
	{
		class MyEffect implements ClickListener
		{
			public void onClick(Widget sender) {
				Effect.fade(flowPanel);
				reappear(2000);
			}
		}
		effectOptionsDescription = "<strong>fade</strong> options" +
				"<ul><li><em>from</em> - (defaults to current opacity or 1.0)</li>" +
				"<li><em>to</em> - (defaults to 0.0)</li>" +
				"</ul>";
		panelImage.addClickListener(new MyEffect());
		panelLabel.addClickListener(new MyEffect());
		return this;
	}

	public EffectPanel blindDown() {
		class MyEffect implements ClickListener
		{
			public void onClick(Widget sender) {
				Effect.blindDown(flowPanel);
			}
		}
		effectOptionsDescription = "<strong>blindDown</strong> options" +
		"<ul><li><em>scaleX</em> - true, <strong>false</strong></li>" +
		"<li><em>scaleY</em> - <strong>true</strong>, false</li>" +
		"<li><em>scaleContent</em> - <strong>true</strong>, false</li>" +
		"<li><em>scaleFromCenter</em> - true, <strong>false</strong></li>" +
		"<li><em>scaleMode</em> - <strong>'box'</strong>,'contents'</li>" +
		"<li><em>scaleFrom</em> - <strong>100.0</strong> (0%-100%)</li>" +
		"<li><em>scaleTo</em> - <strong>0</strong> (0%-100%)</li>" +
		"<li><em>duration</em> - <strong>1</strong></li>" +
		"</ul>";
		panelImage.addClickListener(new MyEffect());
		panelLabel.addClickListener(new MyEffect());
		return this;
	}
	
	public EffectPanel blindUp() {
		class MyEffect implements ClickListener
		{
			public void onClick(Widget sender) {
				Effect.blindUp(flowPanel);
				reappear(2000);
			}
		}
		effectOptionsDescription = "<strong>blindUp</strong> options" +
		"<ul><li><em>scaleX</em> - true, <strong>false</strong></li>" +
		"<li><em>scaleY</em> - <strong>true</strong>, false</li>" +
		"<li><em>scaleContent</em> - <strong>true</strong>, false</li>" +
		"<li><em>scaleFromCenter</em> - true, <strong>false</strong></li>" +
		"<li><em>scaleMode</em> - <strong>'box'</strong>,'contents'</li>" +
		"<li><em>scaleFrom</em> - <strong>100.0</strong> (0%-100%)</li>" +
		"<li><em>scaleTo</em> - <strong>0</strong> (0%-100%)</li>" +
		"<li><em>duration</em> - <strong>1</strong></li>" +
		"</ul>";
		panelImage.addClickListener(new MyEffect());
		panelLabel.addClickListener(new MyEffect());
		return this;
	}
	
	public EffectPanel switchOff() {
		class MyEffect implements ClickListener
		{
			public void onClick(Widget sender) {
				Effect.switchOff(flowPanel);
				reappear(2000);
			}
		}
		
		effectOptionsDescription = "<strong>switchOff</strong> options" +
		"<ul><li>None found</li>" +
		"</ul>";
		panelImage.addClickListener(new MyEffect());
		panelLabel.addClickListener(new MyEffect());
		return this;
	}
	
	public EffectPanel slideDown() {
		class MyEffect implements ClickListener
		{
			public void onClick(Widget sender) {
				Effect.slideDown(flowPanel);
			}
		}
		
		effectOptionsDescription = "<strong>slideDown</strong> options" +
		"<ul><li><em>scaleX</em> - true, <strong>false</strong></li>" +
		"<li><em>scaleY</em> - <strong>true</strong>, false</li>" +
		"<li><em>scaleContent</em> - <strong>true</strong>, false</li>" +
		"<li><em>scaleFromCenter</em> - true, <strong>false</strong></li>" +
		"<li><em>scaleMode</em> - <strong>'box'</strong>,'contents'</li>" +
		"<li><em>scaleFrom</em> - <strong>100.0</strong> (0%-100%)</li>" +
		"<li><em>scaleTo</em> - <strong>0</strong> (0%-100%)</li>" +
		"<li><em>duration</em> - <strong>1</strong></li>" +
		"</ul>";
		panelImage.addClickListener(new MyEffect());
		panelLabel.addClickListener(new MyEffect());
		return this;
	}
	
	public EffectPanel slideUp() {
		class MyEffect implements ClickListener
		{
			public void onClick(Widget sender) {
				Effect.slideUp(flowPanel);
				reappear(2000);
			}
		}
		
		effectOptionsDescription = "<strong>slideUp</strong> options" +
		"<ul><li><em>scaleX</em> - true, <strong>false</strong></li>" +
		"<li><em>scaleY</em> - <strong>true</strong>, false</li>" +
		"<li><em>scaleContent</em> - <strong>true</strong>, false</li>" +
		"<li><em>scaleFromCenter</em> - true, <strong>false</strong></li>" +
		"<li><em>scaleMode</em> - <strong>'box'</strong>,'contents'</li>" +
		"<li><em>scaleFrom</em> - <strong>100.0</strong> (0%-100%)</li>" +
		"<li><em>scaleTo</em> - <strong>0</strong> (0%-100%)</li>" +
		"<li><em>duration</em> - <strong>1</strong></li>" +
		"</ul>";
		panelImage.addClickListener(new MyEffect());
		panelLabel.addClickListener(new MyEffect());
		return this;
	}
	
	public EffectPanel dropOut() {
		class MyEffect implements ClickListener
		{
			public void onClick(Widget sender) {
				Effect.dropOut(flowPanel);
				reappear(2000);
			}
		}
		effectOptionsDescription = "<strong>dropOut</strong> options" +
		"<ul><li>None found</li>" +
		"</ul>";
		panelImage.addClickListener(new MyEffect());
		panelLabel.addClickListener(new MyEffect());
		return this;
	}
	
	public EffectPanel shake() {
		class MyEffect implements ClickListener
		{
			public void onClick(Widget sender) {
				Effect.shake(flowPanel);
			}
		}
		effectOptionsDescription = "<strong>shake</strong> options" +
		"<ul><li>None found</li>" +
		"</ul>";
		panelImage.addClickListener(new MyEffect());
		panelLabel.addClickListener(new MyEffect());
		return this;
	}
	
	public EffectPanel highlight() {
		class MyEffect implements ClickListener
		{
			public void onClick(Widget sender) {
				Effect.highlight(flowPanel);
			}
		}
		effectOptionsDescription = "<strong>highlight</strong> options" +
		"<ul><li><em>startcolor</em> - Sets the color of first frame of the highlight the highlight. Defaults to '#ffff99' (light yellow)</li>" +
		"<li><em>endcolor</em> - Sets the color of the last frame of the highlight. This is best set to the background color of the highlighted element. Defaults to '#ffffff' (white)</li>" +
		"<li><em>restorecolor</em> - Sets the background color of the element after the highlight has finished. Defaults to the current background-color of the highlighted element</li>" +
		"</ul>";
		panelImage.addClickListener(new MyEffect());
		panelLabel.addClickListener(new MyEffect());
		return this;
	}
	
	public EffectPanel pulsate() {
		class MyEffect implements ClickListener
		{
			public void onClick(Widget sender) {
				Effect.pulsate(flowPanel);
			}
		}
		effectOptionsDescription = "<strong>pulsate</strong> options" +
		"<ul><li><em>duration</em> - Number of seconds after which to stop the effect.</li>" +
		"<li><em>from</em> - The minimal opacity during the pulsate, in a value between 0 and 1. For example, use 0.7 for a mild pulsate.</li>" +
		"</ul>";
		panelImage.addClickListener(new MyEffect());
		panelLabel.addClickListener(new MyEffect());
		return this;
	}
	
	public EffectPanel squish() {
		class MyEffect implements ClickListener
		{
			public void onClick(Widget sender) {
				Effect.squish(flowPanel);
				reappear(2000);
			}
		}
		effectOptionsDescription = "<strong>squish</strong> options" +
		"<ul><li>None found</li>" +
		"</ul>";
		panelImage.addClickListener(new MyEffect());
		panelLabel.addClickListener(new MyEffect());
		return this;
	}
	
	public EffectPanel fold() {
		class MyEffect implements ClickListener
		{
			public void onClick(Widget sender) {
				Effect.fold(flowPanel);
				reappear(3000);
			}
		}
		effectOptionsDescription = "<strong>fold</strong> options" +
		"<ul><li>None found</li>" +
		"</ul>";
		panelImage.addClickListener(new MyEffect());
		panelLabel.addClickListener(new MyEffect());
		return this;
	}
	
	public EffectPanel grow() {
		class MyEffect implements ClickListener
		{
			public void onClick(Widget sender) {
				Effect.grow(flowPanel);
			}
		}
		effectOptionsDescription = "<strong>grow</strong> options" +
		"<ul><li><em>direction</em> - this parameter can accept the following values: top-left, top-right, bottom-left, bottom-right, and center</li>" +
		"</ul>";
		panelImage.addClickListener(new MyEffect());
		panelLabel.addClickListener(new MyEffect());
		return this;
	}
	
	public EffectPanel shrink() {
		class MyEffect implements ClickListener
		{
			public void onClick(Widget sender) {
				Effect.shrink(flowPanel);
				reappear(2000);
			}
		}
		effectOptionsDescription = "<strong>shrink</strong> options" +
		"<ul><li>None found</li>" +
		"</ul>";
		panelImage.addClickListener(new MyEffect());
		panelLabel.addClickListener(new MyEffect());
		return this;
	}
	
	public EffectPanel puff() {
		class MyEffect implements ClickListener
		{
			public void onClick(Widget sender) {
				Effect.puff(flowPanel);
				reappear(2000);
			}
		}
		effectOptionsDescription = "<strong>puff</strong> options" +
		"<ul><li><em>duration</em> - <strong>1.0</strong> (in seconds)</li>" +
		"<li><em>from</em> - <strong>0.0</strong>-1.0 (percent of animation to start)</li>"+
		"<li><em>to</em> - 0.0-<strong>1.0</strong> (percent of animation to end)</li>"+
		"</ul>";
		panelImage.addClickListener(new MyEffect());
		panelLabel.addClickListener(new MyEffect());
		return this;
	}
	
	/**
	 * Allows our EffectPanel to reappear after a short delay.
	 * @param time
	 */
	private void reappear(int delay) {
		Timer t = new Timer() {
			public void run()
			{
				Effect.appear(flowPanel);
			}
		};
		t.schedule(delay);
	}
}