예제 #1
0
  @Override
  public Widget asWidget() {
    // reduce the padding on text element as we have widgets in the cells
    SafeStyles textStyles = SafeStylesUtils.fromTrustedString("padding: 1px 3px;");

    ColumnConfig<Plant, String> cc1 =
        new ColumnConfig<Plant, String>(properties.name(), 100, "Name");
    // IMPORTANT we want the text element (cell parent) to only be as wide as the cell and not fill
    // the cell
    cc1.setColumnTextClassName(CommonStyles.get().inlineBlock());
    cc1.setColumnTextStyle(textStyles);

    TextButtonCell button = new TextButtonCell();
    button.addSelectHandler(
        new SelectHandler() {

          @Override
          public void onSelect(SelectEvent event) {
            Context c = event.getContext();
            int row = c.getIndex();
            Plant p = store.get(row);
            Info.display("Event", "The " + p.getName() + " was clicked.");
          }
        });
    cc1.setCell(button);

    DateCell dateCell = new DateCell();
    dateCell.setPropertyEditor(
        new DateTimePropertyEditor(DateTimeFormat.getFormat(PredefinedFormat.DATE_SHORT)));

    ColumnConfig<Plant, Date> cc2 =
        new ColumnConfig<Plant, Date>(properties.available(), 100, "Date");
    cc2.setColumnTextStyle(textStyles);
    cc2.setCell(dateCell);

    List<ColumnConfig<Plant, ?>> l = new ArrayList<ColumnConfig<Plant, ?>>();
    l.add(cc1);
    l.add(cc2);
    ColumnModel<Plant> cm = new ColumnModel<Plant>(l);

    store = new ListStore<Plant>(properties.key());
    store.addAll(TestData.getPlants());

    Grid<Plant> grid = new Grid<Plant>(store, cm);
    grid.getView().setForceFit(true);

    ContentPanel cp = new ContentPanel();
    cp.setHeadingText("Cell Grid");
    cp.setWidget(grid);
    cp.setPixelSize(500, 400);
    cp.addStyleName("margin-10");
    return cp;
  }
예제 #2
0
 private void onClick(Category cat) {
   FlowLayoutContainer vp = created.get(cat);
   if (vp == null) {
     vp = createButtons(cat);
     created.put(cat, vp);
   }
   con.setActiveWidget(vp);
   cp.setHeadingText(cat.getText());
 }
예제 #3
0
  public ProfileEditorViewImpl() {
    ContentPanel panel = new ContentPanel();
    panel.setShadow(true);
    panel.setHeadingText("Your Profile");

    FlowLayoutContainer container = new FlowLayoutContainer();

    container.add(new FieldLabel(username, "username"));
    container.add(new FieldLabel(displayName, "display name"));
    container.add(new FieldLabel(organization, "organization"));
    container.add(new FieldLabel(description, "about me"));
    description.setHeight(100);
    compiledTodayCount.setReadOnly(true);
    compiledTodayCount.setEnabled(false);
    container.add(new FieldLabel(compiledTodayCount, "times compiled today"));

    panel.add(container, new MarginData(10));

    panel.addButton(
        new TextButton(
            "Back",
            new SelectHandler() {
              @Override
              public void onSelect(SelectEvent event) {
                getPresenter().back();
              }
            }));
    panel.addButton(
        new TextButton(
            "Save",
            new SelectHandler() {
              @Override
              public void onSelect(SelectEvent event) {
                getPresenter().save();
              }
            }));

    driver.initialize(this);

    CenterLayoutContainer center = new CenterLayoutContainer();
    center.setWidget(panel);

    initWidget(center);
  }
예제 #4
0
  @Override
  public Widget asWidget() {
    if (cp == null) {
      ExampleResources bundle = GWT.create(ExampleResources.class);

      this.style = bundle.style();
      this.style.ensureInjected();

      cp = new ContentPanel(GWT.<ContentPanelAppearance>create(FramedPanelAppearance.class));
      cp.addStyleName("margin-10");
      cp.setPixelSize(500, 400);
      cp.getBody().getStyle().setBackgroundColor("white");
      cp.getBody().addClassName(ThemeStyles.getStyle().border());

      con = new CardLayoutContainer();
      cp.add(con);

      ToggleGroup group = new ToggleGroup();

      for (Category cat : Category.values()) {
        final ToggleButton btn = new ToggleButton(cat.desc);
        btn.setData("cat", cat);
        btn.addValueChangeHandler(
            new ValueChangeHandler<Boolean>() {

              @Override
              public void onValueChange(ValueChangeEvent<Boolean> event) {
                if (event.getValue() == true) {
                  onClick((Category) btn.getData("cat"));
                }
              }
            });

        group.add(btn);
        cp.addButton(btn);
      }

      ToggleButton normal = (ToggleButton) cp.getButtonBar().getWidget(0);
      normal.setValue(true, true);
    }
    return cp;
  }
  @Override
  public Widget asWidget() {
    final Window complex = new Window();
    complex.setMaximizable(true);
    complex.setHeadingText("Accordion Window");
    complex.setWidth(200);
    complex.setHeight(350);

    AccordionLayoutContainer con = new AccordionLayoutContainer();
    con.setExpandMode(ExpandMode.SINGLE_FILL);
    complex.add(con);

    AccordionLayoutAppearance appearance =
        GWT.<AccordionLayoutAppearance>create(AccordionLayoutAppearance.class);

    ContentPanel cp = new ContentPanel(appearance);
    cp.setAnimCollapse(false);
    cp.setHeadingText("Online Users");
    cp.getHeader().addStyleName(ThemeStyles.getStyle().borderTop());
    con.add(cp);
    con.setActiveWidget(cp);

    TreeStore<NameImageModel> store = new TreeStore<NameImageModel>(NameImageModel.KP);

    Tree<NameImageModel, String> tree =
        new Tree<NameImageModel, String>(
            store,
            new ValueProvider<NameImageModel, String>() {

              @Override
              public String getValue(NameImageModel object) {
                return object.getName();
              }

              @Override
              public void setValue(NameImageModel object, String value) {}

              @Override
              public String getPath() {
                return "name";
              }
            });

    tree.setIconProvider(
        new IconProvider<NameImageModel>() {
          public ImageResource getIcon(NameImageModel model) {
            if (null == model.getImage()) {
              return null;
            } else if ("user-girl" == model.getImage()) {
              return ExampleImages.INSTANCE.userFemale();
            } else if ("user-kid" == model.getImage()) {
              return ExampleImages.INSTANCE.userKid();
            } else {
              return ExampleImages.INSTANCE.user();
            }
          }
        });

    NameImageModel m = newItem("Family", null);
    store.add(m);

    store.add(m, newItem("Darrell", "user"));
    store.add(m, newItem("Maro", "user-girl"));
    store.add(m, newItem("Lia", "user-kid"));
    store.add(m, newItem("Alec", "user-kid"));
    store.add(m, newItem("Andrew", "user-kid"));

    tree.setExpanded(m, true);

    m = newItem("Friends", null);
    store.add(m);

    store.add(m, newItem("Bob", "user"));
    store.add(m, newItem("Mary", "user-girl"));
    store.add(m, newItem("Sally", "user-girl"));
    store.add(m, newItem("Jack", "user"));

    tree.setExpanded(m, true);

    cp.add(tree);

    cp = new ContentPanel(appearance);
    cp.setAnimCollapse(false);
    cp.setBodyStyleName("pad-text");
    cp.setHeadingText("Settings");
    cp.add(new Label(TestData.DUMMY_TEXT_SHORT));
    con.add(cp);

    cp = new ContentPanel(appearance);
    cp.setAnimCollapse(false);
    cp.setBodyStyleName("pad-text");
    cp.setHeadingText("Stuff");
    cp.add(new Label(TestData.DUMMY_TEXT_SHORT));
    con.add(cp);

    cp = new ContentPanel(appearance);
    cp.setAnimCollapse(false);
    cp.setBodyStyleName("pad-text");
    cp.setHeadingText("More Stuff");
    cp.add(new Label(TestData.DUMMY_TEXT_SHORT));
    con.add(cp);

    TextButton b = new TextButton("Open");
    b.addSelectHandler(
        new SelectHandler() {

          @Override
          public void onSelect(SelectEvent event) {
            complex.show();
          }
        });

    VerticalPanel vp = new VerticalPanel();
    vp.setSpacing(10);
    vp.add(b);
    return vp;
  }
예제 #6
0
  @Override
  public Widget asWidget() {
    if (buttons == null) {
      // Simple
      final Dialog simple = new Dialog();
      simple.setHeadingText("Dialog Test");
      simple.setPredefinedButtons(PredefinedButton.YES, PredefinedButton.NO);
      simple.setBodyStyleName("pad-text");
      simple.add(new Label(TestData.DUMMY_TEXT_SHORT));
      simple.getBody().addClassName("pad-text");
      simple.setHideOnButtonClick(true);
      simple.setWidth(300);

      // Layout
      final Dialog complex = new Dialog();
      complex.setBodyBorder(false);
      complex.getHeader().setIcon(Resources.IMAGES.side_list());
      complex.setHeadingText("BorderLayout Dialog");
      complex.setWidth(400);
      complex.setHeight(225);
      complex.setHideOnButtonClick(true);

      BorderLayoutContainer layout = new BorderLayoutContainer();
      complex.add(layout);

      // Layout - west
      ContentPanel panel = new ContentPanel();
      panel.setHeadingText("West");
      BorderLayoutData data = new BorderLayoutData(150);
      data.setMargins(new Margins(0, 5, 0, 0));
      panel.setLayoutData(data);
      layout.setWestWidget(panel);

      // Layout - center
      panel = new ContentPanel();
      panel.setHeadingText("Center");
      layout.setCenterWidget(panel);

      // Auto Size - See the JavaDoc for Window for more information on auto size
      final FlowLayoutContainer flc = new FlowLayoutContainer();
      flc.add(new HTML("Press Add or Remove to modify content"));
      final Dialog autoSize = new Dialog();
      autoSize.setBodyBorder(false);
      autoSize.setHeadingText("Auto Size Dialog");
      autoSize.setHideOnButtonClick(true);
      autoSize.setWidget(flc);
      autoSize.setPixelSize(-1, -1);
      autoSize.setMinWidth(0);
      autoSize.setMinHeight(0);
      autoSize.setResizable(false);
      autoSize.setShadow(true);
      autoSize.addButton(
          new TextButton(
              "Add",
              new SelectHandler() {
                @Override
                public void onSelect(SelectEvent event) {
                  addAutoSizeContent(flc);
                  autoSize.forceLayout();
                }
              }));
      autoSize.addButton(
          new TextButton(
              "Remove",
              new SelectHandler() {
                @Override
                public void onSelect(SelectEvent event) {
                  int lastWidget = flc.getWidgetCount() - 1;
                  if (lastWidget > 0) {
                    flc.remove(lastWidget);
                    autoSize.forceLayout();
                  }
                }
              }));

      // Buttons
      buttons = new ButtonBar();
      buttons.setWidth(400);
      buttons.getElement().setMargins(10);

      TextButton b = new TextButton("Simple");
      b.addSelectHandler(
          new SelectHandler() {
            @Override
            public void onSelect(SelectEvent event) {
              simple.show();
            }
          });
      buttons.add(b);

      b = new TextButton("Layout");
      b.addSelectHandler(
          new SelectHandler() {
            @Override
            public void onSelect(SelectEvent event) {
              complex.show();
            }
          });
      buttons.add(b);

      b = new TextButton("Auto Size");
      b.addSelectHandler(
          new SelectHandler() {
            @Override
            public void onSelect(SelectEvent event) {
              autoSize.show();
            }
          });

      buttons.add(b);

      // Add some basic content to begin with
      for (int i = 0; i < 5; i++) {
        addAutoSizeContent(flc);
      }
    }

    return buttons;
  }
예제 #7
0
  @Override
  public Widget asWidget() {
    final ListStore<Data> store = new ListStore<Data>(dataAccess.nameKey());
    store.addAll(TestData.getData(12, 20, 100));

    final Chart<Data> chart = new Chart<Data>();
    chart.setStore(store);
    chart.setShadowChart(true);

    NumericAxis<Data> axis = new NumericAxis<Data>();
    axis.setPosition(Position.BOTTOM);
    axis.addField(dataAccess.data1());
    axis.addField(dataAccess.data2());
    axis.addField(dataAccess.data3());
    TextSprite title = new TextSprite("Number of Hits");
    title.setFontSize(18);
    axis.setTitleConfig(title);
    axis.setDisplayGrid(true);
    axis.setMinimum(0);
    axis.setMaximum(100);
    chart.addAxis(axis);

    CategoryAxis<Data, String> catAxis = new CategoryAxis<Data, String>();
    catAxis.setPosition(Position.LEFT);
    catAxis.setField(dataAccess.name());
    title = new TextSprite("Month of the Year");
    title.setFontSize(18);
    catAxis.setTitleConfig(title);
    chart.addAxis(catAxis);

    final BarSeries<Data> bar = new BarSeries<Data>();
    bar.setYAxisPosition(Position.BOTTOM);
    bar.addYField(dataAccess.data1());
    bar.addYField(dataAccess.data2());
    bar.addYField(dataAccess.data3());
    bar.addColor(new RGB(148, 174, 10));
    bar.addColor(new RGB(17, 95, 166));
    bar.addColor(new RGB(166, 17, 32));
    chart.addSeries(bar);

    final Legend<Data> legend = new Legend<Data>();
    legend.setPosition(Position.RIGHT);
    legend.setItemHighlighting(true);
    legend.setItemHiding(true);
    chart.setLegend(legend);

    TextButton regenerate = new TextButton("Reload Data");
    regenerate.addSelectHandler(
        new SelectHandler() {
          @Override
          public void onSelect(SelectEvent event) {
            store.clear();
            store.addAll(TestData.getData(12, 0, 100));
            chart.redrawChart();
          }
        });

    ToggleButton animation = new ToggleButton("Animate");
    animation.addValueChangeHandler(
        new ValueChangeHandler<Boolean>() {
          @Override
          public void onValueChange(ValueChangeEvent<Boolean> event) {
            chart.setAnimated(event.getValue());
          }
        });
    animation.setValue(true, true);
    ToggleButton shadow = new ToggleButton("Shadow");
    shadow.addValueChangeHandler(
        new ValueChangeHandler<Boolean>() {
          @Override
          public void onValueChange(ValueChangeEvent<Boolean> event) {
            chart.setShadowChart(event.getValue());
            chart.redrawChart();
          }
        });
    shadow.setValue(true);

    ToolBar toolBar = new ToolBar();
    toolBar.add(regenerate);
    toolBar.add(animation);
    toolBar.add(shadow);

    ContentPanel panel = new FramedPanel();
    panel.getElement().getStyle().setMargin(10, Unit.PX);
    panel.setCollapsible(true);
    panel.setHeadingText("Grouped Bar Chart");
    panel.setPixelSize(620, 500);
    panel.setBodyBorder(true);

    final Resizable resize = new Resizable(panel, Dir.E, Dir.SE, Dir.S);
    resize.setMinHeight(400);
    resize.setMinWidth(400);

    panel.addExpandHandler(
        new ExpandHandler() {
          @Override
          public void onExpand(ExpandEvent event) {
            resize.setEnabled(true);
          }
        });
    panel.addCollapseHandler(
        new CollapseHandler() {
          @Override
          public void onCollapse(CollapseEvent event) {
            resize.setEnabled(false);
          }
        });

    new Draggable(panel, panel.getHeader()).setUseProxy(false);

    VerticalLayoutContainer layout = new VerticalLayoutContainer();
    panel.add(layout);

    toolBar.setLayoutData(new VerticalLayoutData(1, -1));
    layout.add(toolBar);

    chart.setLayoutData(new VerticalLayoutData(1, 1));
    layout.add(chart);

    return panel;
  }
예제 #8
0
 @Override
 protected void onEnsureDebugId(String baseID) {
   super.onEnsureDebugId(baseID);
   grid.ensureDebugId(baseID + AppsModule.Ids.APP_GRID);
   acm.ensureDebugId(baseID + AppsModule.Ids.APP_GRID);
 }
예제 #9
0
  private ContentPanel createContent() {
    TEXT_AREA.setReadOnly(true);

    final TextButton refreshButton = new TextButton("Refresh");
    refreshButton.addSelectHandler(
        new SelectEvent.SelectHandler() {
          @Override
          public void onSelect(SelectEvent event) {
            refresh();
          }
        });

    final TextButton newPatButton = new TextButton("Obtain new PAT token");
    newPatButton.addSelectHandler(
        new SelectEvent.SelectHandler() {
          @Override
          public void onSelect(SelectEvent event) {
            final ProgressDialog progressDialog = new ProgressDialog("Perform operation...");
            progressDialog.show();
            getService()
                .obtainNewPat(
                    new AsyncCallback<String>() {
                      @Override
                      public void onFailure(Throwable caught) {
                        progressDialog.hide();
                        handleException(caught);
                        GwtUtils.showError("Unable to obtain new PAT token.");
                        refresh();
                      }

                      @Override
                      public void onSuccess(String result) {
                        progressDialog.hide();
                        GwtUtils.showInformation("PAT token is obtained successfully.");
                        refresh();
                      }
                    });
          }
        });

    final TextButton clearButton = new TextButton("Clear");
    clearButton.addSelectHandler(
        new SelectEvent.SelectHandler() {
          @Override
          public void onSelect(SelectEvent event) {
            getService()
                .clearLogs(
                    new AsyncCallback<Void>() {
                      @Override
                      public void onFailure(Throwable p_throwable) {
                        handleException(p_throwable);
                        GwtUtils.showError("Unable to clear logs.");
                      }

                      @Override
                      public void onSuccess(Void p_void) {
                        TEXT_AREA.setValue("");
                      }
                    });
          }
        });

    final HBoxLayoutContainer h = new HBoxLayoutContainer();
    h.add(refreshButton, new BoxLayoutContainer.BoxLayoutData(DEFAULT_MARGINS));
    h.add(clearButton, new BoxLayoutContainer.BoxLayoutData(DEFAULT_MARGINS));
    h.add(newPatButton, new BoxLayoutContainer.BoxLayoutData(DEFAULT_MARGINS));

    final VerticalLayoutContainer v = new VerticalLayoutContainer();
    v.add(h, new VerticalLayoutContainer.VerticalLayoutData(1, -1, DEFAULT_MARGINS));
    v.add(TEXT_AREA, new VerticalLayoutContainer.VerticalLayoutData(1, 1, DEFAULT_MARGINS));

    final ContentPanel cp = new ContentPanel();
    cp.setHeadingText("Resource Server Monitor");
    cp.add(v);
    return cp;
  }
  @Override
  public Widget asWidget() {
    if (panel == null) {
      final NumberFormat number = NumberFormat.getFormat("0.00");
      final String desc =
          "Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Sed metus nibh, sodales a, porta at, vulputate eget, dui. Pellentesque ut nisl. Maecenas tortor turpis, interdum non, sodales non, iaculis ac, lacus. Vestibulum auctor, tortor quis iaculis malesuada, libero lectus bibendum purus, sit amet tincidunt quam turpis vel lacus. In pellentesque nisl non sem. Suspendisse nunc sem, pretium eget, cursus a, fringilla vel, urna.<br/><br/>Aliquam commodo ullamcorper erat. Nullam vel justo in neque porttitor laoreet. Aenean lacus dui, consequat eu, adipiscing eget, nonummy non, nisi. Morbi nunc est, dignissim non, ornare sed, luctus eu, massa. Vivamus eget quam. Vivamus tincidunt diam nec urna. Curabitur velit.";

      RowExpander<Stock> expander =
          new RowExpander<Stock>(
              new AbstractCell<Stock>() {
                @Override
                public void render(Context context, Stock value, SafeHtmlBuilder sb) {
                  sb.appendHtmlConstant(
                      "<p style='margin: 5px 5px 10px'><b>Company:</b>" + value.getName() + "</p>");
                  sb.appendHtmlConstant("<p style='margin: 5px 5px 10px'><b>Summary:</b> " + desc);
                }
              });

      ColumnConfig<Stock, String> nameCol =
          new ColumnConfig<Stock, String>(props.name(), 200, "Company");
      ColumnConfig<Stock, String> symbolCol =
          new ColumnConfig<Stock, String>(props.symbol(), 100, "Symbol");
      ColumnConfig<Stock, Double> lastCol =
          new ColumnConfig<Stock, Double>(props.last(), 75, "Last");

      ColumnConfig<Stock, Double> changeCol =
          new ColumnConfig<Stock, Double>(props.change(), 100, "Change");
      changeCol.setCell(
          new AbstractCell<Double>() {

            @Override
            public void render(Context context, Double value, SafeHtmlBuilder sb) {
              String style = "style='color: " + (value < 0 ? "red" : "green") + "'";
              String v = number.format(value);
              sb.appendHtmlConstant(
                  "<span " + style + " qtitle='Change' qtip='" + v + "'>" + v + "</span>");
            }
          });

      ColumnConfig<Stock, Date> lastTransCol =
          new ColumnConfig<Stock, Date>(props.lastTrans(), 100, "Last Updated");
      lastTransCol.setCell(new DateCell(DateTimeFormat.getFormat("MM/dd/yyyy")));

      List<ColumnConfig<Stock, ?>> l = new ArrayList<ColumnConfig<Stock, ?>>();
      l.add(expander);
      l.add(nameCol);
      l.add(symbolCol);
      l.add(lastCol);
      l.add(changeCol);
      l.add(lastTransCol);
      ColumnModel<Stock> cm = new ColumnModel<Stock>(l);

      ListStore<Stock> store = new ListStore<Stock>(props.key());
      store.addAll(TestData.getStocks());

      panel = new ContentPanel();
      panel.setHeadingText("RowExpander Grid");
      panel.getHeader().setIcon(ExampleImages.INSTANCE.table());
      panel.setPixelSize(600, 320);
      panel.addStyleName("margin-10");

      final Grid<Stock> grid = new Grid<Stock>(store, cm);
      grid.getView().setAutoExpandColumn(nameCol);
      grid.setBorders(false);
      grid.getView().setStripeRows(true);
      grid.getView().setColumnLines(true);

      expander.initPlugin(grid);
      panel.setWidget(grid);
    }

    return panel;
  }
예제 #11
0
 @Override
 protected void onDetach() {
   timer.cancel();
   super.onDetach();
 }
  @Override
  public Widget asWidget() {
    if (panel == null) {
      panel = new ContentPanel();
      panel.setHeadingText("Cell Action Tree");
      panel.setPixelSize(315, 400);
      panel.addStyleName("margin-10");

      VerticalLayoutContainer con = new VerticalLayoutContainer();
      panel.add(con);

      TreeStore<BaseDto> store = new TreeStore<BaseDto>(new KeyProvider());

      FolderDto root = TestData.getMusicRootFolder();
      for (BaseDto base : root.getChildren()) {
        store.add(base);
        if (base instanceof FolderDto) {
          processFolder(store, (FolderDto) base);
        }
      }

      SimpleSafeHtmlCell<String> cell =
          new SimpleSafeHtmlCell<String>(SimpleSafeHtmlRenderer.getInstance(), "click") {
            @Override
            public void onBrowserEvent(
                Context context,
                Element parent,
                String value,
                NativeEvent event,
                ValueUpdater<String> valueUpdater) {
              super.onBrowserEvent(context, parent, value, event, valueUpdater);
              if ("click".equals(event.getType())) {
                Info.display("Click", "You clicked \"" + value + "\"!");
              }
            }
          };

      final Tree<BaseDto, String> tree =
          new Tree<BaseDto, String>(
              store,
              new ValueProvider<BaseDto, String>() {

                @Override
                public String getValue(BaseDto object) {
                  return object.getName();
                }

                @Override
                public void setValue(BaseDto object, String value) {}

                @Override
                public String getPath() {
                  return "name";
                }
              });
      tree.setCell(cell);
      tree.setWidth(300);
      tree.getStyle().setLeafIcon(ExampleImages.INSTANCE.music());

      ToolBar buttonBar = new ToolBar();

      buttonBar.add(
          new TextButton(
              "Expand All",
              new SelectHandler() {

                @Override
                public void onSelect(SelectEvent event) {
                  tree.expandAll();
                }
              }));
      buttonBar.add(
          new TextButton(
              "Collapse All",
              new SelectHandler() {
                @Override
                public void onSelect(SelectEvent event) {
                  tree.collapseAll();
                }
              }));

      con.add(buttonBar, new VerticalLayoutData(1, -1));
      con.add(tree, new VerticalLayoutData(1, 1));
    }

    return panel;
  }
예제 #13
0
 public static void setPlainHeader(ContentPanel panel) {
   Style style = panel.getHeader().getElement().getStyle();
   String color = ThemeStyles.getStyle().borderColor();
   style.setProperty("backgroundImage", "none");
   style.setProperty("borderTop", "1px solid " + color);
 }
예제 #14
0
  public Widget asWidget() {
    final Chart<Site> chart = new Chart<Site>(600, 400);
    chart.setDefaultInsets(20);

    final ListStore<Site> store = new ListStore<Site>(siteAccess.nameKey());
    Date initial = f.parse("Feb 1");
    for (int i = 0; i < 7; i++) {
      store.add(
          new Site(initial, Math.random() * 20 + 80, Math.random() * 20 + 40, Math.random() * 20));
      initial = CalendarUtil.copyDate(initial);
      CalendarUtil.addDaysToDate(initial, 1);
    }
    chart.setStore(store);

    NumericAxis<Site> axis = new NumericAxis<Site>();
    axis.setPosition(Position.LEFT);
    axis.addField(siteAccess.visits());
    TextSprite title = new TextSprite("Number of Hits");
    title.setFontSize(18);
    axis.setTitleConfig(title);
    axis.setDisplayGrid(true);
    axis.setMinimum(0);
    axis.setMaximum(100);
    chart.addAxis(axis);

    final TimeAxis<Site> time = new TimeAxis<Site>();
    time.setField(siteAccess.date());
    time.setStartDate(f.parse("Feb 1"));
    time.setEndDate(f.parse("Feb 7"));
    time.setLabelProvider(
        new LabelProvider<Date>() {
          @Override
          public String getLabel(Date item) {
            return f.format(item);
          }
        });
    chart.addAxis(time);

    LineSeries<Site> series = new LineSeries<Site>();
    series.setYAxisPosition(Position.LEFT);
    series.setYField(siteAccess.visits());
    series.setStroke(new RGB(148, 174, 10));
    series.setShowMarkers(true);
    series.setMarkerIndex(1);
    Sprite marker = Primitives.circle(0, 0, 6);
    marker.setFill(new RGB(148, 174, 10));
    series.setMarkerConfig(marker);
    chart.addSeries(series);

    series = new LineSeries<Site>();
    series.setYAxisPosition(Position.LEFT);
    series.setYField(siteAccess.views());
    series.setStroke(new RGB(17, 95, 166));
    series.setShowMarkers(true);
    series.setMarkerIndex(1);
    marker = Primitives.cross(0, 0, 6);
    marker.setFill(new RGB(17, 95, 166));
    series.setMarkerConfig(marker);
    chart.addSeries(series);

    series = new LineSeries<Site>();
    series.setYAxisPosition(Position.LEFT);
    series.setYField(siteAccess.veins());
    series.setStroke(new RGB(166, 17, 32));
    series.setShowMarkers(true);
    series.setMarkerIndex(1);
    marker = Primitives.diamond(0, 0, 6);
    marker.setFill(new RGB(166, 17, 32));
    series.setMarkerConfig(marker);
    chart.addSeries(series);

    update =
        new Timer() {
          @Override
          public void run() {
            Date startDate = CalendarUtil.copyDate(time.getStartDate());
            Date endDate = CalendarUtil.copyDate(time.getEndDate());
            CalendarUtil.addDaysToDate(startDate, 1);
            CalendarUtil.addDaysToDate(endDate, 1);
            chart
                .getStore()
                .add(
                    new Site(
                        endDate,
                        Math.random() * 20 + 80,
                        Math.random() * 20 + 40,
                        Math.random() * 20));
            time.setStartDate(startDate);
            time.setEndDate(endDate);
            chart.redrawChart();
          }
        };

    update.scheduleRepeating(1000);

    ToggleButton animation = new ToggleButton("Animate");
    animation.addValueChangeHandler(
        new ValueChangeHandler<Boolean>() {
          @Override
          public void onValueChange(ValueChangeEvent<Boolean> event) {
            chart.setAnimated(event.getValue());
          }
        });
    animation.setValue(true, true);

    ToolBar toolBar = new ToolBar();
    toolBar.add(animation);

    ContentPanel panel = new FramedPanel();
    panel.getElement().getStyle().setMargin(10, Unit.PX);
    panel.setCollapsible(true);
    panel.setHeadingText("Live Chart");
    panel.setPixelSize(620, 500);
    panel.setBodyBorder(true);

    VerticalLayoutContainer layout = new VerticalLayoutContainer();
    panel.add(layout);

    toolBar.setLayoutData(new VerticalLayoutData(1, -1));
    layout.add(toolBar);

    chart.setLayoutData(new VerticalLayoutData(1, 1));
    layout.add(chart);

    panel.addAttachHandler(
        new AttachEvent.Handler() {
          @Override
          public void onAttachOrDetach(AttachEvent event) {
            if (event.isAttached() == false) {
              update.cancel();
            }
          }
        });

    return panel;
  }