001/* 002 * #%L 003 * GwtMaterial 004 * %% 005 * Copyright (C) 2015 - 2017 GwtMaterialDesign 006 * %% 007 * Licensed under the Apache License, Version 2.0 (the "License"); 008 * you may not use this file except in compliance with the License. 009 * You may obtain a copy of the License at 010 * 011 * http://www.apache.org/licenses/LICENSE-2.0 012 * 013 * Unless required by applicable law or agreed to in writing, software 014 * distributed under the License is distributed on an "AS IS" BASIS, 015 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. 016 * See the License for the specific language governing permissions and 017 * limitations under the License. 018 * #L% 019 */ 020package gwt.material.design.addins.client.bubble; 021 022import com.google.gwt.dom.client.Document; 023import gwt.material.design.addins.client.MaterialAddins; 024import gwt.material.design.addins.client.base.constants.AddinsCssName; 025import gwt.material.design.addins.client.bubble.js.JsBubbleOptions; 026import gwt.material.design.client.MaterialDesignBase; 027import gwt.material.design.client.base.HasPosition; 028import gwt.material.design.client.base.JsLoader; 029import gwt.material.design.client.base.MaterialWidget; 030import gwt.material.design.client.base.helper.ColorHelper; 031import gwt.material.design.client.base.mixin.CssNameMixin; 032import gwt.material.design.client.constants.Color; 033import gwt.material.design.client.constants.Position; 034 035import static gwt.material.design.addins.client.bubble.js.JsBubble.$; 036 037//@formatter:off 038 039/** 040 * Bubble component used on chat module 041 * <p> 042 * <h3>XML Namespace Declaration</h3> 043 * <pre> 044 * {@code 045 * xmlns:ma='urn:import:gwt.material.design.addins.client' 046 * } 047 * </pre> 048 * <p> 049 * <h3>UiBinder Usage:</h3> 050 * <pre> 051 * {@code 052 * <ma:bubble.MaterialBubble backgroundColor="white darken-1" position="LEFT" float="LEFT"> 053 * <m:MaterialLabel text="I love Material Design"/> 054 * <m:MaterialLabel text="Dec 12, 2015" fontSize="0.8" textColor="grey"/> 055 * </ma:bubble.MaterialBubble> 056 * } 057 * </pre> 058 * 059 * @author kevzlou7979 060 * @see <a href="http://gwtmaterialdesign.github.io/gwt-material-demo/#bubble">Material Bubble</a> 061 */ 062//@formatter:on 063public class MaterialBubble extends MaterialWidget implements JsLoader, HasPosition { 064 065 private MaterialWidget triangle = new MaterialWidget(Document.get().createDivElement()); 066 private CssNameMixin<MaterialWidget, Position> positionMixin; 067 private JsBubbleOptions options = new JsBubbleOptions(); 068 069 static { 070 if (MaterialAddins.isDebug()) { 071 MaterialDesignBase.injectDebugJs(MaterialBubbleDebugClientBundle.INSTANCE.bubbleJsDebug()); 072 MaterialDesignBase.injectCss(MaterialBubbleDebugClientBundle.INSTANCE.bubbleCssDebug()); 073 } else { 074 MaterialDesignBase.injectJs(MaterialBubbleClientBundle.INSTANCE.bubbleJs()); 075 MaterialDesignBase.injectCss(MaterialBubbleClientBundle.INSTANCE.bubbleCss()); 076 } 077 } 078 079 public MaterialBubble() { 080 super(Document.get().createSpanElement(), AddinsCssName.BUBBLE); 081 triangle.setStyleName(AddinsCssName.TRIANGLE); 082 getPositionMixin().setCssName(Position.LEFT); 083 add(triangle); 084 setShadow(1); 085 } 086 087 public MaterialBubble(Color textColor, Color backgroundColor) { 088 this(); 089 setTextColor(textColor); 090 setBackgroundColor(backgroundColor); 091 } 092 093 public MaterialBubble(Color textColor, Color backgroundColor, Position position) { 094 this(textColor, backgroundColor); 095 setPosition(position); 096 } 097 098 @Override 099 protected void onLoad() { 100 super.onLoad(); 101 102 load(); 103 } 104 105 @Override 106 public void load() { 107 $(getElement()).bubble(options); 108 } 109 110 @Override 111 protected void onUnload() { 112 super.onUnload(); 113 114 unload(); 115 } 116 117 @Override 118 public void unload() {} 119 120 @Override 121 public void reload() { 122 unload(); 123 load(); 124 } 125 126 @Override 127 public void setBackgroundColor(Color bgColor) { 128 super.setBackgroundColor(bgColor); 129 options.color = ColorHelper.setupComputedBackgroundColor(bgColor); 130 reload(); 131 } 132 133 @Override 134 public Position getPosition() { 135 return options.position != null ? Position.fromStyleName(options.position) : null; 136 } 137 138 @Override 139 public void setPosition(Position position) { 140 options.position = position.getCssName(); 141 getPositionMixin().setCssName(position); 142 reload(); 143 } 144 145 public MaterialWidget getTriangle() { 146 return triangle; 147 } 148 149 protected CssNameMixin<MaterialWidget, Position> getPositionMixin() { 150 if (positionMixin == null) { 151 positionMixin = new CssNameMixin<>(triangle); 152 } 153 return positionMixin; 154 } 155}