public SelectUserOrRoleDialog(
      ArrayList<String> existing, final IUserRoleSelectedCallback callback) {
    super(
        Messages.getString("selectUserOrRole"),
        Messages.getString("ok"),
        Messages.getString("cancel"),
        false,
        true,
        contentTable); //$NON-NLS-1$ //$NON-NLS-2$ //$NON-NLS-3$
    usersListBox.addClickHandler(
        new ClickHandler() {
          public void onClick(ClickEvent event) {
            rolesListBox.setSelectedIndex(-1);
            okButton.setEnabled(true);
          }
        });
    rolesListBox.addClickHandler(
        new ClickHandler() {
          public void onClick(ClickEvent event) {
            usersListBox.setSelectedIndex(-1);
            okButton.setEnabled(true);
          }
        });

    setCallback(
        new IDialogCallback() {

          public void cancelPressed() {}

          public void okPressed() {
            if (getSelectedUser() != null) {
              callback.userSelected(getSelectedUser());
            } else {
              callback.roleSelected(getSelectedRole());
            }
          }
        });

    // Unique ids are important for test automation
    contentTable.getElement().setId("userOrRoleDialogContentTable");
    usersListBox.getElement().setId("userOrRoleDialogUsersList");
    rolesListBox.getElement().setId("userOrRoleDialogRolesList");
    okButton.getElement().setId("userOrRoleDialogOkButton");
    okButton.setEnabled(false);
    cancelButton.getElement().setId("userOrRoleDialogCancelButton");

    usersListBox.setVisibleItemCount(5);
    rolesListBox.setVisibleItemCount(5);
    rolesListBox.setWidth("100%"); // $NON-NLS-1$
    usersListBox.setWidth("100%"); // $NON-NLS-1$
    contentTable.clear();
    contentTable.setWidth("100%"); // $NON-NLS-1$
    contentTable.setWidget(0, 0, new Label(Messages.getString("users"))); // $NON-NLS-1$
    contentTable.setWidget(1, 0, usersListBox);
    contentTable.setWidget(2, 0, new Label(Messages.getString("roles"))); // $NON-NLS-1$
    contentTable.setWidget(3, 0, rolesListBox);
    fetchAllUsers(existing);
    fetchAllRoles(existing);
    setWidth("200px"); // $NON-NLS-1$
  }
 @Override
 public Widget cloneDisplay(Map<String, Object> data) {
   ListBox lb = new ListBox();
   populate(lb);
   addItems(getItems(), lb);
   Object input = getInputValue(data);
   String inputName = getInput() == null ? null : getInput().getName();
   if (input != null && inputName != null) {
     if (input.getClass().isArray()) {
       Object[] arr = (Object[]) input;
       for (Object obj : arr) {
         lb.addItem(obj.toString(), obj.toString());
       }
     } else if (input instanceof Collection) {
       Collection<?> col = (Collection<?>) input;
       for (Object obj : col) {
         lb.addItem(obj.toString(), obj.toString());
       }
     } else if (input instanceof Map) {
       Map<?, ?> map = (Map<?, ?>) input;
       for (Map.Entry<?, ?> entry : map.entrySet()) {
         lb.addItem(entry.getKey().toString(), entry.getValue().toString());
       }
     } else {
       String value = input.toString();
       for (int index = 0; index < lb.getItemCount(); index++) {
         if (value != null && value.equals(lb.getValue(index))) {
           lb.setSelectedIndex(index);
           break;
         }
       }
     }
   }
   super.populateActions(lb.getElement());
   return lb;
 }
  public ScheduleEditor(ScheduleDialogType type) {
    super();
    isBlockoutDialog = (type == ScheduleDialogType.BLOCKOUT);
    startTimePicker = new TimePicker();

    setStylePrimaryName("scheduleEditor"); // $NON-NLS-1$

    scheduleCombo = createScheduleCombo();
    Label l = new Label(MSGS.recurrenceColon());
    l.setStyleName(SCHEDULE_LABEL);
    add(l);
    add(scheduleCombo);

    SimplePanel hspacer = new SimplePanel();
    hspacer.setWidth("100px"); // $NON-NLS-1$

    if (!isBlockoutDialog) {
      startTimePanel = createStartTimePanel();
      add(startTimePanel);
    } else {

      // Blockout End TimePicker
      blockoutEndTimePicker = new TimePicker();
      blockoutEndTimePicker.setHour("01"); // $NON-NLS-1$
      blockoutEndTimePicker.setMinute("00"); // $NON-NLS-1$
      blockoutEndTimePicker.setTimeOfDay(TimeUtil.TimeOfDay.PM);

      // Blockout End Caption Panel
      blockoutEndTimePicker.getElement().getStyle().setDisplay(Display.NONE);

      final String[] daysList = new String[365];
      final String[] hoursList = new String[24];
      final String[] minutesList = new String[60];

      // Populate list
      for (Integer i = 0; i < 365; i++) {
        String iStr = i.toString();
        daysList[i] = iStr;

        if (i < 60) {
          minutesList[i] = iStr;
          if (i < 24) {
            hoursList[i] = iStr;
          }
        }
      }

      // Units of time Drop Down
      daysListBox = new ListBox();
      daysListBox.getElement().setId("daysListBox"); // $NON-NLS-1$
      populateListItems(daysListBox, daysList, 0, 365);

      final Label daysLabel = new Label(MSGS.dayOrDays());
      daysLabel.getElement().setAttribute("for", daysListBox.getElement().getId()); // $NON-NLS-1$

      hoursListBox = new ListBox();
      hoursListBox.getElement().setId("hoursListBox"); // $NON-NLS-1$
      populateListItems(hoursListBox, hoursList, 0, 24);

      final Label hoursLabel = new Label(MSGS.hourOrHours());
      hoursLabel.getElement().setAttribute("for", hoursListBox.getElement().getId()); // $NON-NLS-1$

      minutesListBox = new ListBox();
      minutesListBox.getElement().setId("minutesListBox"); // $NON-NLS-1$
      populateListItems(minutesListBox, minutesList, 0, 60);

      final Label minutesLabel = new Label(MSGS.minuteOrMinutes());
      minutesLabel
          .getElement()
          .setAttribute("for", minutesListBox.getElement().getId()); // $NON-NLS-1$

      final HorizontalPanel durationPanel = new HorizontalPanel();
      durationPanel.setVerticalAlignment(VerticalPanel.ALIGN_MIDDLE);
      durationPanel.setSpacing(blockoutEndTimePicker.getSpacing());
      durationPanel.add(daysListBox);
      durationPanel.add(daysLabel);
      durationPanel.add(hoursListBox);
      durationPanel.add(hoursLabel);
      durationPanel.add(minutesListBox);
      durationPanel.add(minutesLabel);

      // Bind change handler
      this.scheduleCombo.addChangeHandler(
          new ChangeHandler() {

            @Override
            public void onChange(ChangeEvent event) {
              String scheduleType = scheduleCombo.getItemText(scheduleCombo.getSelectedIndex());

              if (ScheduleType.RUN_ONCE.toString().equals(scheduleType)) {
                show(
                    true,
                    daysListBox,
                    daysLabel,
                    hoursListBox,
                    hoursLabel,
                    minutesListBox,
                    minutesLabel);

                populateListItems(daysListBox, daysList, 0, 365);
                populateListItems(hoursListBox, hoursList, 0, 24);
                populateListItems(minutesListBox, minutesList, 0, 60);

              } else if (ScheduleType.HOURS.toString().equals(scheduleType)) {
                hide(true, daysListBox, daysLabel, hoursListBox, hoursLabel);
                show(true, minutesListBox, minutesLabel);

                populateListItems(minutesListBox, minutesList, 0, 60);

              } else if (ScheduleType.DAILY.toString().equals(scheduleType)) {
                hide(true, daysListBox, daysLabel);
                show(true, hoursListBox, hoursLabel, minutesListBox, minutesLabel);

                populateListItems(hoursListBox, hoursList, 0, 24);
                populateListItems(minutesListBox, minutesList, 0, 60);

              } else if (ScheduleType.WEEKLY.toString().equals(scheduleType)) {
                show(
                    true,
                    daysListBox,
                    daysLabel,
                    hoursListBox,
                    hoursLabel,
                    minutesListBox,
                    minutesLabel);

                populateListItems(daysListBox, daysList, 0, 7);
                populateListItems(hoursListBox, hoursList, 0, 24);
                populateListItems(minutesListBox, minutesList, 0, 60);

              } else if (ScheduleType.MONTHLY.toString().equals(scheduleType)) {
                show(
                    true,
                    daysListBox,
                    daysLabel,
                    hoursListBox,
                    hoursLabel,
                    minutesListBox,
                    minutesLabel);

                populateListItems(daysListBox, daysList, 0, 28);
                populateListItems(hoursListBox, hoursList, 0, 24);
                populateListItems(minutesListBox, minutesList, 0, 60);

              } else if (ScheduleType.YEARLY.toString().equals(scheduleType)) {
                show(
                    true,
                    daysListBox,
                    daysLabel,
                    hoursListBox,
                    hoursLabel,
                    minutesListBox,
                    minutesLabel);

                populateListItems(daysListBox, daysList, 0, 365);
                populateListItems(hoursListBox, hoursList, 0, 24);
                populateListItems(minutesListBox, minutesList, 0, 60);
              }
            }
          });

      /*
       * Radio Buttons for duration
       */
      this.durationRadioButton =
          new RadioButton("durationRadioGroup", "durationRadioButton"); // $NON-NLS-1$ //$NON-NLS-2$
      this.durationRadioButton.setText(MSGS.duration());
      this.durationRadioButton.setValue(Boolean.TRUE);
      this.durationRadioButton.addClickHandler(
          new ClickHandler() {

            @Override
            public void onClick(ClickEvent event) {
              blockoutEndTimePicker.getElement().getStyle().setDisplay(Display.NONE);
              durationPanel.getElement().getStyle().clearDisplay();
            }
          });

      this.endTimeRadioButton =
          new RadioButton("durationRadioGroup", "endTimeRadioButton"); // $NON-NLS-1$ //$NON-NLS-2$
      this.endTimeRadioButton.setText(MSGS.endTime());
      this.endTimeRadioButton.addClickHandler(
          new ClickHandler() {

            @Override
            public void onClick(ClickEvent event) {
              blockoutEndTimePicker.getElement().getStyle().clearDisplay();
              durationPanel.getElement().getStyle().setDisplay(Display.NONE);
            }
          });

      // Radio Buttons Panel
      HorizontalPanel radioButtonsPanel = new HorizontalPanel();
      radioButtonsPanel.setVerticalAlignment(VerticalPanel.ALIGN_MIDDLE);
      radioButtonsPanel.add(this.durationRadioButton);
      radioButtonsPanel.add(this.endTimeRadioButton);

      // Ends Panel
      VerticalPanel endsPanel = new VerticalPanel();
      endsPanel.add(radioButtonsPanel);
      endsPanel.add(blockoutEndTimePicker);
      endsPanel.add(durationPanel);

      // Blockout period
      CaptionPanel blockoutStartCaptionPanel = new CaptionPanel(MSGS.startTime());
      HorizontalPanel blockoutStartPanel = new HorizontalPanel();
      blockoutStartPanel.add(getStartTimePicker());
      timeZonePicker = new ListBox();
      timeZonePicker.setStyleName("timeZonePicker");
      timeZonePicker.setVisibleItemCount(1);
      blockoutStartPanel.add(timeZonePicker);
      timeZonePicker.getElement().getParentElement().getStyle().setPaddingTop(5, Unit.PX);

      blockoutStartCaptionPanel.add(blockoutStartPanel);
      populateTimeZonePicker();

      // Ends Caption Panel
      CaptionPanel endCaptionPanel = new CaptionPanel(MSGS.endsCaptionTitle());
      endCaptionPanel.add(endsPanel);

      VerticalPanel blockoutPanel = new VerticalPanel();
      blockoutPanel.setWidth("100%"); // $NON-NLS-1$
      blockoutPanel.add(blockoutStartCaptionPanel);
      blockoutPanel.add(endCaptionPanel);

      add(blockoutPanel);
    }

    VerticalPanel vp = new VerticalPanel();
    vp.setWidth("100%"); // $NON-NLS-1$
    add(vp);
    setCellHeight(vp, "100%"); // $NON-NLS-1$

    runOnceEditor = new RunOnceEditor(startTimePicker);
    vp.add(runOnceEditor);
    scheduleTypeMap.put(ScheduleType.RUN_ONCE, runOnceEditor);
    runOnceEditor.setVisible(true);

    recurrenceEditor = new RecurrenceEditor(startTimePicker);
    vp.add(recurrenceEditor);
    scheduleTypeMap.put(ScheduleType.SECONDS, recurrenceEditor);
    scheduleTypeMap.put(ScheduleType.MINUTES, recurrenceEditor);
    scheduleTypeMap.put(ScheduleType.HOURS, recurrenceEditor);
    scheduleTypeMap.put(ScheduleType.DAILY, recurrenceEditor);
    scheduleTypeMap.put(ScheduleType.WEEKLY, recurrenceEditor);
    scheduleTypeMap.put(ScheduleType.MONTHLY, recurrenceEditor);
    scheduleTypeMap.put(ScheduleType.YEARLY, recurrenceEditor);
    recurrenceEditor.setVisible(false);

    cronEditor = new CronEditor();
    scheduleTypeMap.put(ScheduleType.CRON, cronEditor);
    cronEditor.setVisible(false);

    if (!isBlockoutDialog) {
      vp.add(cronEditor);

      VerticalPanel blockoutButtonPanel = new VerticalPanel();
      blockoutButtonPanel.setWidth("100%"); // $NON-NLS-1$
      // blockoutButtonPanel.setHeight("30%");
      blockoutButtonPanel.setHorizontalAlignment(VerticalPanel.ALIGN_CENTER);
      blockoutButtonPanel.setVerticalAlignment(VerticalPanel.ALIGN_MIDDLE);

      // We want to add a button to check for blockout conflicts
      blockoutCheckButton.setStyleName("pentaho-button"); // $NON-NLS-1$
      blockoutCheckButton.getElement().setId("blockout-check-button"); // $NON-NLS-1$
      blockoutCheckButton.setVisible(false);

      hspacer.setHeight("50px"); // $NON-NLS-1$
      blockoutButtonPanel.add(hspacer);
      blockoutButtonPanel.add(blockoutCheckButton);

      vp.add(hspacer);
      add(blockoutButtonPanel);
    }

    configureOnChangeHandler();
  }
  public FunctionPlotterExample() {
    presets.put("id", new String[] {"-10", "10", "function(x) {\n  return x;\n}"});
    presets.put("sine", new String[] {"-10", "10", "function(x) {\n  return Math.sin(x);\n}"});
    presets.put(
        "taylor",
        new String[] {
          "-3", "3", "function(x) {\n  return [Math.cos(x), 1 - x*x/2 + x*x*x*x/24];\n}"
        });
    presets.put(
        "sawtooth",
        new String[] {
          "-10",
          "10",
          "function(x) {\n  var y = 0;\n  for (var i = 1; i < 20; i+=2) {\n    y += Math.sin(i * x)/i;\n  }\n  var final = 1 - 2*(Math.abs(Math.floor(x / Math.PI)) % 2);\n  return [4/Math.PI * y, final];\n}"
        });

    initWidget(panel);
    panel.add(new HTML("<p><b>Equation: </b><br>"));
    textArea.setVisibleLines(10);
    textArea.setCharacterWidth(80);
    textArea.setValue(
        "function(x) {\n"
            + "  return [0.1 * x, 0.1 * x + Math.sin(x), 0.1*x + Math.cos(x)];\n"
            + "}");
    panel.add(textArea);

    presetsDD.addItem("(custom)", "custom");
    presetsDD.addItem("Identity", "id");
    presetsDD.addItem("Sine Wave", "sine");
    presetsDD.addItem("Taylor series", "taylor");
    presetsDD.addItem("Sawtooth", "sawtooth");
    presetsDD.setSelectedIndex(0);
    presetsDD.getElement().getStyle().setDisplay(Style.Display.INLINE_BLOCK);

    presetsDD.addChangeHandler(
        (event) -> {
          String value = presetsDD.getSelectedValue();
          if (value.equalsIgnoreCase("custom")) {
            return;
          }

          String[] preset = presets.get(value);
          fromTb.setValue(preset[0]);
          toTb.setValue(preset[1]);
          textArea.setValue(preset[2]);
          plot();
        });

    HorizontalPanel presetContainer = new HorizontalPanel();
    presetContainer.add(new HTML("<b>Preset functions:</b>"));
    presetContainer.add(presetsDD);
    panel.add(presetContainer);
    panel.add(new HTML("<p></p>"));
    HorizontalPanel rangeContainer = new HorizontalPanel();
    rangeContainer.add(new HTML("<b>x range:</b>"));
    fromTb.setVisibleLength(5);
    fromTb.setValue("-10");

    toTb.setVisibleLength(5);
    toTb.setValue("10");
    rangeContainer.add(fromTb);
    rangeContainer.add(new InlineLabel("to"));
    rangeContainer.add(toTb);
    panel.add(rangeContainer);
    Button plotBtn = new Button("Plot");

    plotBtn.addClickHandler((ev) -> plot());

    panel.add(new HTML("<p></p>"));
    panel.add(plotBtn);
    plot();
  }
  /** @param jobs */
  public void initUI(JsArray<JsJob> jobs) {
    if (jobs != null) {
      for (int i = 0; i < jobs.length(); i++) {
        resourceOracle.add(jobs.get(i).getShortResourceName());
      }
    }

    resourceSuggestBox.setWidth("240px");
    userListBox.setWidth("200px");
    userListBox.getElement().getStyle().setTextTransform(Style.TextTransform.CAPITALIZE);
    scheduleStateListBox.setWidth("200px");
    scheduleTypeListBox.setWidth("200px");

    // next execution filter
    CaptionPanel executionFilterCaptionPanel =
        new CaptionPanel(Messages.getString("executionTime"));
    FlexTable executionFilterPanel = new FlexTable();
    executionFilterPanel.setWidget(0, 0, beforeCheckBox);
    executionFilterPanel.setWidget(0, 1, beforeDateBox);
    executionFilterPanel.setWidget(1, 0, afterCheckBox);
    executionFilterPanel.setWidget(1, 1, afterDateBox);
    executionFilterCaptionPanel.add(executionFilterPanel);

    afterCheckBox.addValueChangeHandler(
        new ValueChangeHandler<Boolean>() {
          public void onValueChange(ValueChangeEvent<Boolean> event) {
            afterDateBox.setEnabled(event.getValue());
          }
        });

    beforeCheckBox.addValueChangeHandler(
        new ValueChangeHandler<Boolean>() {
          public void onValueChange(ValueChangeEvent<Boolean> event) {
            beforeDateBox.setEnabled(event.getValue());
          }
        });
    beforeDateBox.setEnabled(beforeCheckBox.getValue());
    afterDateBox.setEnabled(afterCheckBox.getValue());

    final String showAll = Messages.getString("showAll");
    // user filter
    int selectedIndex = getSelectedIndex(userListBox);
    userListBox.clear();
    userListBox.addItem(showAll);
    HashSet<String> uniqueUsers = new HashSet<String>();
    if (jobs != null) {
      for (int i = 0; i < jobs.length(); i++) {
        uniqueUsers.add(jobs.get(i).getUserName());
      }
    }
    for (String user : uniqueUsers) {
      userListBox.addItem(user);
    }
    userListBox.setSelectedIndex(selectedIndex);

    // state filter
    scheduleStateListBox.setVisibleItemCount(1);
    selectedIndex = getSelectedIndex(scheduleStateListBox);
    scheduleStateListBox.clear();
    // NORMAL, PAUSED, COMPLETE, ERROR, BLOCKED, UNKNOWN
    scheduleStateListBox.addItem(showAll, ScheduleStateEnum.SHOWALL.getValue());
    scheduleStateListBox.addItem(Messages.getString("normal"), ScheduleStateEnum.NORMAL.getValue());
    scheduleStateListBox.addItem(Messages.getString("paused"), ScheduleStateEnum.PAUSED.getValue());
    scheduleStateListBox.addItem(
        Messages.getString("complete"), ScheduleStateEnum.COMPLETE.getValue());
    scheduleStateListBox.addItem(Messages.getString("error"), ScheduleStateEnum.ERROR.getValue());
    scheduleStateListBox.addItem(
        Messages.getString("blocked"), ScheduleStateEnum.BLOCKED.getValue());
    scheduleStateListBox.addItem(
        Messages.getString("unknown"), ScheduleStateEnum.UNKNOWN.getValue());
    scheduleStateListBox.setSelectedIndex(selectedIndex);

    // state filter
    scheduleTypeListBox.setVisibleItemCount(1);
    selectedIndex = getSelectedIndex(scheduleTypeListBox);
    scheduleTypeListBox.clear();
    // DAILY, WEEKLY, MONTHLY, YEARLY
    scheduleTypeListBox.addItem(showAll, ScheduleStateEnum.SHOWALL.getValue());
    scheduleTypeListBox.addItem(
        Messages.getString("schedule.daily"), ScheduleTypeEnum.DAILY.getValue());
    scheduleTypeListBox.addItem(
        Messages.getString("schedule.weekly"), ScheduleTypeEnum.WEEKLY.getValue());
    scheduleTypeListBox.addItem(
        Messages.getString("schedule.monthly"), ScheduleTypeEnum.MONTHLY.getValue());
    scheduleTypeListBox.addItem(
        Messages.getString("schedule.yearly"), ScheduleTypeEnum.YEARLY.getValue());
    scheduleTypeListBox.setSelectedIndex(selectedIndex);

    FlexTable filterPanel = new FlexTable();
    filterPanel.setWidget(0, 0, new Label(Messages.getString("scheduledResource")));
    filterPanel.setWidget(1, 0, resourceSuggestBox);

    filterPanel.setWidget(2, 0, new Label(Messages.getString("_user")));
    filterPanel.setWidget(3, 0, userListBox);

    filterPanel.setWidget(4, 0, new Label(Messages.getString("scheduleState")));
    filterPanel.setWidget(5, 0, scheduleStateListBox);

    filterPanel.setWidget(6, 0, new Label(Messages.getString("scheduleType")));
    filterPanel.setWidget(7, 0, scheduleTypeListBox);

    filterPanel.setWidget(8, 0, executionFilterCaptionPanel);

    setContent(filterPanel);
  }
  // Override Widget Methods
  @Override
  public void onLoad() {

    // Create the two needed Listboxs
    final ListBox lbHourSelector = new ListBox();
    final ListBox lbMinuteSelector = new ListBox();
    final Label lblHour = new Label("h");
    final Label lblMinute = new Label("min");
    final Label lblName = new Label(this.getTimePickerName());

    // Implements the HourSelector
    lbHourSelector.addItem("00");
    lbHourSelector.addItem("01");
    lbHourSelector.addItem("02");
    lbHourSelector.addItem("03");
    lbHourSelector.addItem("04");
    lbHourSelector.addItem("05");
    lbHourSelector.addItem("06");
    lbHourSelector.addItem("07");
    lbHourSelector.addItem("08");
    lbHourSelector.addItem("09");
    lbHourSelector.addItem("10");
    lbHourSelector.addItem("11");
    lbHourSelector.addItem("12");
    lbHourSelector.addItem("13");
    lbHourSelector.addItem("14");
    lbHourSelector.addItem("15");
    lbHourSelector.addItem("16");
    lbHourSelector.addItem("17");
    lbHourSelector.addItem("18");
    lbHourSelector.addItem("19");
    lbHourSelector.addItem("20");
    lbHourSelector.addItem("21");
    lbHourSelector.addItem("22");
    lbHourSelector.addItem("23");

    // Define the number of visible elements
    lbHourSelector.setVisibleItemCount(1);
    // Define the listBox's size
    lbHourSelector.getElement().getStyle().setWidth(50, Unit.PX);

    // Implements the MinuteSelector
    lbMinuteSelector.addItem("00");
    lbMinuteSelector.addItem("01");
    lbMinuteSelector.addItem("02");
    lbMinuteSelector.addItem("03");
    lbMinuteSelector.addItem("04");
    lbMinuteSelector.addItem("05");
    lbMinuteSelector.addItem("06");
    lbMinuteSelector.addItem("07");
    lbMinuteSelector.addItem("08");
    lbMinuteSelector.addItem("09");
    lbMinuteSelector.addItem("10");
    lbMinuteSelector.addItem("11");
    lbMinuteSelector.addItem("12");
    lbMinuteSelector.addItem("13");
    lbMinuteSelector.addItem("14");
    lbMinuteSelector.addItem("15");
    lbMinuteSelector.addItem("16");
    lbMinuteSelector.addItem("17");
    lbMinuteSelector.addItem("18");
    lbMinuteSelector.addItem("19");
    lbMinuteSelector.addItem("20");
    lbMinuteSelector.addItem("21");
    lbMinuteSelector.addItem("22");
    lbMinuteSelector.addItem("23");
    lbMinuteSelector.addItem("24");
    lbMinuteSelector.addItem("25");
    lbMinuteSelector.addItem("26");
    lbMinuteSelector.addItem("27");
    lbMinuteSelector.addItem("28");
    lbMinuteSelector.addItem("29");
    lbMinuteSelector.addItem("30");
    lbMinuteSelector.addItem("31");
    lbMinuteSelector.addItem("32");
    lbMinuteSelector.addItem("33");
    lbMinuteSelector.addItem("34");
    lbMinuteSelector.addItem("35");
    lbMinuteSelector.addItem("36");
    lbMinuteSelector.addItem("37");
    lbMinuteSelector.addItem("38");
    lbMinuteSelector.addItem("39");
    lbMinuteSelector.addItem("40");
    lbMinuteSelector.addItem("41");
    lbMinuteSelector.addItem("42");
    lbMinuteSelector.addItem("43");
    lbMinuteSelector.addItem("44");
    lbMinuteSelector.addItem("45");
    lbMinuteSelector.addItem("46");
    lbMinuteSelector.addItem("47");
    lbMinuteSelector.addItem("48");
    lbMinuteSelector.addItem("49");
    lbMinuteSelector.addItem("50");
    lbMinuteSelector.addItem("51");
    lbMinuteSelector.addItem("52");
    lbMinuteSelector.addItem("53");
    lbMinuteSelector.addItem("54");
    lbMinuteSelector.addItem("55");
    lbMinuteSelector.addItem("56");
    lbMinuteSelector.addItem("57");
    lbMinuteSelector.addItem("58");
    lbMinuteSelector.addItem("59");

    // Define the number of visible elements
    lbMinuteSelector.setVisibleItemCount(1);

    // Define the listbox's size
    lbMinuteSelector.getElement().getStyle().setWidth(50, Unit.PX);

    /*
    This bloc defines th UI, set the Component Draggable
    and defines width of the contentpanel
    */
    // 1st one HorizontalPanel which horizontally plces the elements
    HorizontalPanel hpContainer = new HorizontalPanel();
    VerticalPanel vpContainer = new VerticalPanel();
    setWidgetInVPContainer(lblName);
    hpContainer.add(lbHourSelector);
    hpContainer.add(lblHour);
    hpContainer.add(lbMinuteSelector);
    hpContainer.add(lblMinute);
    setWidgetInVPContainer(hpContainer);

    // RootPanel.get().add(getVPTimerContainer());

    // Create change value handler passing index to notify a listbox change for hours
    lbHourSelector.addChangeHandler(
        new ChangeHandler() {

          @Override
          public void onChange(ChangeEvent event) {
            Integer iIndex = lbHourSelector.getSelectedIndex();
            switch (iIndex) {
              case 0:
                setSelectedHour("00");
                break;
              case 1:
                setSelectedHour("01");
                break;
              case 2:
                setSelectedHour("02");
                break;
              case 3:
                setSelectedHour("03");
                break;
              case 4:
                setSelectedHour("04");
                break;
              case 5:
                setSelectedHour("05");
                break;
              case 6:
                setSelectedHour("06");
                break;
              case 7:
                setSelectedHour("07");
                break;
              case 8:
                setSelectedHour("08");
                break;
              case 9:
                setSelectedHour("09");
                break;
              case 10:
                setSelectedHour("10");
                break;
              case 11:
                setSelectedHour("11");
                break;
              case 12:
                setSelectedHour("12");
                break;
              case 13:
                setSelectedHour("13");
                break;
              case 14:
                setSelectedHour("14");
                break;
              case 15:
                setSelectedHour("15");
                break;
              case 16:
                setSelectedHour("16");
                break;
              case 17:
                setSelectedHour("17");
                break;
              case 18:
                setSelectedHour("18");
                break;
              case 19:
                setSelectedHour("19");
                break;
              case 20:
                setSelectedHour("20");
                break;
              case 21:
                setSelectedHour("21");
                break;
              case 22:
                setSelectedHour("22");
                break;
              case 23:
                setSelectedHour("23");
                break;
            }
            setTimePickerValue();
          }
        });

    // Create change Value handler passing index to notify a lisbox change for minutes
    lbMinuteSelector.addChangeHandler(
        new ChangeHandler() {

          @Override
          public void onChange(ChangeEvent event) {
            Integer iIndex = lbMinuteSelector.getSelectedIndex();
            switch (iIndex) {
              case 0:
                setSelectedMinute("00");
                break;
              case 1:
                setSelectedMinute("01");
                break;
              case 2:
                setSelectedMinute("02");
                break;
              case 3:
                setSelectedMinute("03");
                break;
              case 4:
                setSelectedMinute("04");
                break;
              case 5:
                setSelectedMinute("05");
                break;
              case 6:
                setSelectedMinute("06");
                break;
              case 7:
                setSelectedMinute("07");
                break;
              case 8:
                setSelectedMinute("08");
                break;
              case 9:
                setSelectedMinute("09");
                break;
              case 10:
                setSelectedMinute("10");
                break;
              case 11:
                setSelectedMinute("11");
                break;
              case 12:
                setSelectedMinute("12");
                break;
              case 13:
                setSelectedMinute("13");
                break;
              case 14:
                setSelectedMinute("14");
                break;
              case 15:
                setSelectedMinute("15");
                break;
              case 16:
                setSelectedMinute("16");
                break;
              case 17:
                setSelectedMinute("17");
                break;
              case 18:
                setSelectedMinute("18");
                break;
              case 19:
                setSelectedMinute("19");
                break;
              case 20:
                setSelectedMinute("20");
                break;
              case 21:
                setSelectedMinute("21");
                break;
              case 22:
                setSelectedMinute("22");
                break;
              case 23:
                setSelectedMinute("23");
                break;
              case 24:
                setSelectedMinute("24");
                break;
              case 25:
                setSelectedMinute("25");
                break;
              case 26:
                setSelectedMinute("26");
                break;
              case 27:
                setSelectedMinute("27");
                break;
              case 28:
                setSelectedMinute("28");
                break;
              case 29:
                setSelectedMinute("29");
                break;
              case 30:
                setSelectedMinute("30");
                break;
              case 31:
                setSelectedMinute("31");
                break;
              case 32:
                setSelectedMinute("32");
                break;
              case 33:
                setSelectedMinute("33");
                break;
              case 34:
                setSelectedMinute("34");
                break;
              case 35:
                setSelectedMinute("35");
                break;
              case 36:
                setSelectedMinute("36");
                break;
              case 37:
                setSelectedMinute("37");
                break;
              case 38:
                setSelectedMinute("38");
                break;
              case 39:
                setSelectedMinute("39");
                break;
              case 40:
                setSelectedMinute("40");
                break;
              case 41:
                setSelectedMinute("41");
                break;
              case 42:
                setSelectedMinute("42");
                break;
              case 43:
                setSelectedMinute("43");
                break;
              case 44:
                setSelectedMinute("44");
                break;
              case 45:
                setSelectedMinute("45");
                break;
              case 46:
                setSelectedMinute("46");
                break;
              case 47:
                setSelectedMinute("47");
                break;
              case 48:
                setSelectedMinute("48");
                break;
              case 49:
                setSelectedMinute("49");
                break;
              case 50:
                setSelectedMinute("50");
                break;
              case 51:
                setSelectedMinute("51");
                break;
              case 52:
                setSelectedMinute("52");
                break;
              case 53:
                setSelectedMinute("53");
                break;
              case 54:
                setSelectedMinute("54");
                break;
              case 55:
                setSelectedMinute("55");
                break;
              case 56:
                setSelectedMinute("56");
                break;
              case 57:
                setSelectedMinute("57");
                break;
              case 58:
                setSelectedMinute("58");
                break;
              case 59:
                setSelectedMinute("59");
                break;
            }
            setTimePickerValue();
          }
        });
  }