001package gwt.material.design.client.ui;
002
003/*
004 * #%L
005 * GwtMaterial
006 * %%
007 * Copyright (C) 2015 GwtMaterialDesign
008 * %%
009 * Licensed under the Apache License, Version 2.0 (the "License");
010 * you may not use this file except in compliance with the License.
011 * You may obtain a copy of the License at
012 * 
013 *      http://www.apache.org/licenses/LICENSE-2.0
014 * 
015 * Unless required by applicable law or agreed to in writing, software
016 * distributed under the License is distributed on an "AS IS" BASIS,
017 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
018 * See the License for the specific language governing permissions and
019 * limitations under the License.
020 * #L%
021 */
022
023import com.google.gwt.dom.client.Document;
024import com.google.gwt.dom.client.Element;
025import com.google.gwt.event.dom.client.ClickEvent;
026import com.google.gwt.event.dom.client.ClickHandler;
027import com.google.gwt.event.dom.client.HasClickHandlers;
028import com.google.gwt.event.shared.HandlerRegistration;
029import gwt.material.design.client.base.HasAxis;
030import gwt.material.design.client.base.HasType;
031import gwt.material.design.client.base.MaterialWidget;
032import gwt.material.design.client.base.mixin.CssNameMixin;
033import gwt.material.design.client.base.mixin.CssTypeMixin;
034import gwt.material.design.client.constants.Axis;
035import gwt.material.design.client.constants.FABType;
036
037//@formatter:off
038
039/**
040 * Floating action buttons are used for a promoted action. They
041 * are distinguished by a circled icon floating above the UI and
042 * have motion behaviors that include morphing, launching, and a
043 * transferring anchor point.
044 *
045 * <h3>UiBinder Usage:</h3>
046 * <pre>
047 *{@code
048 *<m:MaterialFAB>
049 *   <m:MaterialButton type="FLOATING" backgroundColor="blue" iconType="POLYMER" size="LARGE"/>
050 *   <m:MaterialFABList>
051 *     <m:MaterialButton type="FLOATING" backgroundColor="red" iconType="POLYMER"/>
052 *     <m:MaterialButton type="FLOATING" backgroundColor="orange" iconType="POLYMER"/>
053 *     <m:MaterialButton type="FLOATING" backgroundColor="white" iconType="POLYMER" iconColor="black"/>
054 *   </m:MaterialFABList>
055 * </m:MaterialFAB>}
056 * </pre>
057 * </p>
058 *
059 * @author kevzlou7979
060 * @see <a href="http://gwt-material-demo.herokuapp.com/#buttons">Material FAB</a>
061 */
062//@formatter:on
063public class MaterialFAB extends MaterialWidget implements HasType<FABType>, HasAxis, HasClickHandlers {
064
065    private final CssTypeMixin<FABType, MaterialFAB> typeMixin = new CssTypeMixin<>(this);
066    private final CssNameMixin<MaterialFAB, Axis> axisMixin = new CssNameMixin<>(this);
067    private boolean toggle = true;
068
069    public MaterialFAB() {
070        super(Document.get().createDivElement(), "fixed-action-btn");
071    }
072
073    @Override
074    protected void onLoad() {
075        super.onLoad();
076        if(getType() == FABType.CLICK_ONLY) {
077            addClickHandler(new ClickHandler() {
078                @Override
079                public void onClick(ClickEvent event) {
080                    if(toggle) {
081                        openFAB();
082                        toggle = false;
083                    }else{
084                        closeFAB();
085                        toggle = true;
086                    }
087                }
088            });
089        }
090    }
091
092    @Override
093    public void setType(FABType type) {
094        typeMixin.setType(type);
095    }
096
097    @Override
098    public FABType getType() {
099        return typeMixin.getType();
100    }
101
102    @Override
103    public void setAxis(Axis axis) {
104        axisMixin.setCssName(axis);
105    }
106
107    @Override
108    public Axis getAxis() {
109        return axisMixin.getCssName();
110    }
111
112    /**
113     * Open the FAB programmatically
114     */
115    public void openFAB() {
116        openFAB(getElement());
117    }
118
119    public native void openFAB(Element e) /*-{
120        $wnd.jQuery(e).openFAB();
121    }-*/;
122
123    /**
124     * Close the FAB programmatically
125     */
126    public void closeFAB() {
127        closeFAB(getElement());
128    }
129
130    public native void closeFAB(Element e) /*-{
131        $wnd.jQuery(e).closeFAB();
132    }-*/;
133
134    @Override
135    public HandlerRegistration addClickHandler(final ClickHandler handler) {
136        return addDomHandler(new ClickHandler() {
137            @Override
138            public void onClick(ClickEvent event) {
139                if(isEnabled()){
140                    handler.onClick(event);
141                }
142            }
143        }, ClickEvent.getType());
144    }
145}