// Copyright 2012 Google Inc. All Rights Reserved.
//
// 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.
package com.google.collide.client.ui.dropdown;
import com.google.collide.client.common.BaseResources;
import com.google.collide.client.ui.button.ImageButton2;
import com.google.collide.client.ui.list.SimpleList;
import com.google.collide.client.util.Elements;
import com.google.gwt.resources.client.CssResource;
import com.google.gwt.resources.client.ImageResource;
import elemental.html.DivElement;
import elemental.html.Element;
import elemental.html.InputElement;
import elemental.html.SpanElement;
/**
* A collection of widgets for creating dropdowns
*/
public class DropdownWidgets {
public interface Css extends CssResource {
// Dropdown Button
public String button();
public String buttonLabel();
public String buttonArrow();
// Dropdown Input
public String inputContainer();
public String input();
public String inputArrow();
public String inputArrowActive();
// Split Button
public String splitButtonLabel();
public String splitButtonArrow();
}
public interface Resources extends BaseResources.Resources, SimpleList.Resources {
@Source("DropdownWidgets.css")
Css dropdownWidgetsCss();
}
/**
* Creates a button which functions as a dropdown.
*
*/
public static class DropdownButton {
private final DivElement button;
private final DivElement label;
public DropdownButton(Resources res) {
Css css = res.dropdownWidgetsCss();
button = Elements.createDivElement(css.button());
button.addClassName(res.baseCss().button());
label = Elements.createDivElement(css.buttonLabel());
button.appendChild(label);
Element arrow = Elements.createDivElement(css.buttonArrow());
button.appendChild(arrow);
}
public DivElement getButton() {
return button;
}
public DivElement getLabel() {
return label;
}
}
/**
* An input box that displays with a clickable dropdown arrow. This is not modeled as a proper UI
* component since it is fairly light weight.
*
*/
public static class DropdownInput {
private final DivElement container;
private final InputElement inputElement;
private final SpanElement indicatorArrow;
public DropdownInput(Resources res) {
Css css = res.dropdownWidgetsCss();
container = Elements.createDivElement(css.inputContainer());
indicatorArrow = Elements.createSpanElement(css.inputArrow());
indicatorArrow.setTextContent("\u00A0");
container.appendChild(indicatorArrow);
inputElement = Elements.createInputTextElement(res.baseCss().textInput());
inputElement.addClassName(res.dropdownWidgetsCss().input());
container.appendChild(inputElement);
}
public DivElement getContainer() {
return container;
}
public SpanElement getButton() {
return indicatorArrow;
}
public InputElement getInput() {
return inputElement;
}
}
/**
* Creates a split button which has an image in the left and right. The left side is considered
* the label and the right side is typically a trigger for a dropdown menu.
*/
public static class SplitDropdownButton {
private final ImageButton2 labelButton;
private final ImageButton2 triggerButton;
public SplitDropdownButton(Resources res, Element container, ImageResource labelImage) {
BaseResources.Css baseCss = res.baseCss();
Css css = res.dropdownWidgetsCss();
labelButton = new ImageButton2(res, labelImage);
labelButton.getButtonElement().addClassName(css.splitButtonLabel());
container.appendChild(labelButton.getButtonElement());
triggerButton = new ImageButton2(res, res.disclosureArrowDkGreyDown());
triggerButton.getButtonElement().addClassName(css.splitButtonArrow());
container.appendChild(triggerButton.getButtonElement());
}
public void initializeAfterAttachedToDom() {
labelButton.initializeAfterAttachedToDom();
triggerButton.initializeAfterAttachedToDom();
}
public ImageButton2 getLabelButton() {
return labelButton;
}
public ImageButton2 getTriggerButton() {
return triggerButton;
}
}
private DropdownWidgets() {
// can't instantiate this class
}
}