Skip to content

Commit

Permalink
paging change popover with custom JS, minor code improvements in tabl…
Browse files Browse the repository at this point in the history
…e page size handling.
  • Loading branch information
1azyman committed Jun 24, 2014
1 parent ade4da5 commit 4010a7a
Show file tree
Hide file tree
Showing 21 changed files with 262 additions and 221 deletions.
Expand Up @@ -20,22 +20,8 @@
<tr>
<td wicket:id="td" style="text-align: right;">
<span wicket:id="count"/>

<button id="asdf" type="button" class="btn btn-xs btn-default">
<i class="fa fa-cog"></i>
</button>
<script>
$(document).ready(function() {
$("#asdf").popover({
placement: 'left',
html: 'true',
title : 'Page size',
content : '<div class="input-group"><input type="text" class="form-control input-sm" style="display: inline-block; width: auto;" size="1"/><span class="input-group-btn"><button class="btn btn-sm btn-success" type="button"><i class="fa fa-check"></i></button></span></div>'
});
});
</script>
<div wicket:id="pageSize"/>
</td>
</tr>

</wicket:panel>
</html>
@@ -1,7 +1,9 @@
package com.evolveum.midpoint.web.component.data;

import com.evolveum.midpoint.web.component.util.LoadableModel;
import com.evolveum.midpoint.web.component.util.VisibleEnableBehaviour;
import org.apache.wicket.AttributeModifier;
import org.apache.wicket.ajax.AjaxRequestTarget;
import org.apache.wicket.extensions.markup.html.repeater.data.table.AbstractToolbar;
import org.apache.wicket.extensions.markup.html.repeater.data.table.DataTable;
import org.apache.wicket.markup.html.WebMarkupContainer;
Expand All @@ -19,6 +21,7 @@ public class CountToolbar extends AbstractToolbar {

private static final String ID_TD = "td";
private static final String ID_COUNT = "count";
private static final String ID_PAGE_SIZE = "pageSize";

public CountToolbar(DataTable<?, ?> table) {
super(table);
Expand All @@ -41,6 +44,22 @@ public String getObject() {
Label count = new Label(ID_COUNT, createModel());
count.setRenderBodyOnly(true);
td.add(count);

PageSizePopover popover = new PageSizePopover(ID_PAGE_SIZE) {

@Override
protected void pageSizeChanged(AjaxRequestTarget target) {
CountToolbar.this.pageSizeChanged(target);
}
};
popover.add(new VisibleEnableBehaviour() {

@Override
public boolean isVisible() {
return CountToolbar.this.isPageSizePopupVisible();
}
});
td.add(popover);
}

private IModel<String> createModel() {
Expand Down Expand Up @@ -84,4 +103,11 @@ protected String load() {
}
};
}

protected void pageSizeChanged(AjaxRequestTarget target) {
}

protected boolean isPageSizePopupVisible() {
return true;
}
}
@@ -0,0 +1,42 @@
<!--
~ Copyright (c) 2010-2013 Evolveum
~
~ 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.
-->

<!DOCTYPE html>
<html xmlns:wicket="http://wicket.apache.org">
<wicket:panel>
<button wicket:id="popButton" type="button" class="btn btn-xs btn-default">
<i class="fa fa-cog"></i>
</button>

<div wicket:id="popover" class="popover fade left in">
<div class="arrow"></div>
<h3 class="popover-title"><wicket:message key="PageSizePopover.title"/></h3>
<div class="popover-content">
<form wicket:id="form">
<div class="input-group">
<input wicket:id="input" type="text" size="1" style="display: inline-block; width: auto;"
class="form-control input-sm">
<span class="input-group-btn">
<button wicket:id="button" type="button" class="btn btn-sm btn-success">
<i class="fa fa-check"></i>
</button>
</span>
</div>
</form>
</div>
</div>
</wicket:panel>
</html>
@@ -0,0 +1,109 @@
package com.evolveum.midpoint.web.component.data;

import com.evolveum.midpoint.web.component.AjaxSubmitButton;
import com.evolveum.midpoint.web.component.util.SimplePanel;
import com.evolveum.midpoint.web.session.UserProfileStorage;
import org.apache.wicket.ajax.AjaxRequestTarget;
import org.apache.wicket.markup.head.IHeaderResponse;
import org.apache.wicket.markup.head.OnDomReadyHeaderItem;
import org.apache.wicket.markup.html.WebMarkupContainer;
import org.apache.wicket.markup.html.form.Button;
import org.apache.wicket.markup.html.form.Form;
import org.apache.wicket.markup.html.form.TextField;
import org.apache.wicket.model.IModel;
import org.apache.wicket.validation.validator.RangeValidator;

/**
* @author lazyman
*/
public class PageSizePopover extends SimplePanel {

private static final String ID_POP_BUTTON = "popButton";
private static final String ID_POPOVER = "popover";
private static final String ID_FORM = "form";
private static final String ID_INPUT = "input";
private static final String ID_BUTTON = "button";

public PageSizePopover(String id) {
super(id);
setRenderBodyOnly(true);
}

@Override
public void renderHead(IHeaderResponse response) {
super.renderHead(response);

StringBuilder sb = new StringBuilder();
sb.append("initPageSizePopover('").append(get(ID_POP_BUTTON).getMarkupId());
sb.append("','").append(get(ID_POPOVER).getMarkupId());
sb.append("');");

response.render(OnDomReadyHeaderItem.forScript(sb.toString()));
}


@Override
protected void initLayout() {
Button popButton = new Button(ID_POP_BUTTON);
popButton.setOutputMarkupId(true);
add(popButton);

WebMarkupContainer popover = new WebMarkupContainer(ID_POPOVER);
popover.setOutputMarkupId(true);
add(popover);

Form form = new Form(ID_FORM);
popover.add(form);

TextField input = new TextField(ID_INPUT, createInputModel());
input.add(new RangeValidator(5, 50));
input.setLabel(createStringResource("PageSizePopover.title"));
input.setType(Integer.class);
form.add(input);

AjaxSubmitButton button = new AjaxSubmitButton(ID_BUTTON) {

@Override
protected void onError(AjaxRequestTarget target, Form<?> form) {
super.onError(target, form);
target.add(getPageBase().getFeedbackPanel());
}

@Override
protected void onSubmit(AjaxRequestTarget target, Form<?> form) {
super.onSubmit(target, form);

pageSizeChanged(target);
}
};
form.add(button);
}

private IModel<Integer> createInputModel() {
return new IModel<Integer>() {

@Override
public Integer getObject() {
TablePanel tablePanel = findParent(TablePanel.class);
UserProfileStorage.TableId tableId = tablePanel.getTableId();

return getPageBase().getSessionStorage().getUserProfile().getPagingSize(tableId);
}

@Override
public void setObject(Integer o) {
TablePanel tablePanel = findParent(TablePanel.class);
UserProfileStorage.TableId tableId = tablePanel.getTableId();

getPageBase().getSessionStorage().getUserProfile().setPagingSize(tableId, o);
}

@Override
public void detach() {
}
};
}

protected void pageSizeChanged(AjaxRequestTarget target) {
}
}
@@ -0,0 +1 @@
PageSizePopover.title=Page size
Expand Up @@ -18,9 +18,6 @@
<html xmlns:wicket="http://wicket.apache.org">
<wicket:panel>
<table class="table table-striped table-condensed" wicket:id="table" />

<div wicket:id="pagingSize" />
<div wicket:id="paging" />

</wicket:panel>
</html>
Expand Up @@ -18,8 +18,6 @@

import com.evolveum.midpoint.prism.query.ObjectPaging;
import com.evolveum.midpoint.web.component.data.paging.NavigatorPanel;
import com.evolveum.midpoint.web.component.data.paging.PagingSizePanel;
import com.evolveum.midpoint.web.component.util.LoadableModel;
import com.evolveum.midpoint.web.component.util.VisibleEnableBehaviour;
import com.evolveum.midpoint.web.page.PageBase;
import com.evolveum.midpoint.web.session.UserProfileStorage;
Expand All @@ -31,12 +29,9 @@
import org.apache.wicket.extensions.markup.html.repeater.data.table.DataTable;
import org.apache.wicket.extensions.markup.html.repeater.data.table.IColumn;
import org.apache.wicket.extensions.markup.html.repeater.data.table.ISortableDataProvider;
import org.apache.wicket.markup.html.navigation.paging.IPageable;
import org.apache.wicket.markup.html.panel.Panel;
import org.apache.wicket.markup.repeater.data.DataViewBase;
import org.apache.wicket.model.IModel;
import org.apache.wicket.model.Model;
import org.apache.wicket.model.StringResourceModel;

import java.util.List;

Expand All @@ -47,37 +42,67 @@ public class TablePanel<T> extends Panel {

private static final String ID_TABLE = "table";
private static final String ID_PAGING = "paging";
private static final String ID_PAGING_SIZE = "pagingSize";

private IModel<Boolean> showPaging = new Model<Boolean>(true);
private IModel<Boolean> showCount = new Model<Boolean>(true);
private IModel<Boolean> showPagingSize = new Model<Boolean>(false);

private UserProfileStorage.TableId tableId;

public TablePanel(String id, ISortableDataProvider provider, List<IColumn<T, String>> columns) {
this(id, provider, columns, UserProfileStorage.DEFAULT_PAGING_SIZE, null);
this(id, provider, columns, null);
}

public TablePanel(String id, ISortableDataProvider provider, List<IColumn<T, String>> columns, int itemsPerPage,
public TablePanel(String id, ISortableDataProvider provider, List<IColumn<T, String>> columns,
UserProfileStorage.TableId tableId) {
super(id);
Validate.notNull(provider, "Object type must not be null.");
Validate.notNull(columns, "Columns must not be null.");

add(AttributeModifier.prepend("style", "display: table; width: 100%;"));

initLayout(columns, itemsPerPage, provider, tableId);
this.tableId = tableId;

initLayout(columns, provider);
}

private void initLayout(List<IColumn<T, String>> columns, final int itemsPerPage, ISortableDataProvider provider,
final UserProfileStorage.TableId tableId) {
DataTable<T, String> table = new SelectableDataTable<T>(ID_TABLE, columns, provider, itemsPerPage);
@Override
protected void onInitialize() {
super.onInitialize();

DataTable table = (DataTable) get(ID_TABLE);
PageBase page = (PageBase) getPage();
UserProfileStorage userProfile = page.getSessionStorage().getUserProfile();
table.setItemsPerPage(userProfile.getPagingSize(tableId));
}

private void initLayout(List<IColumn<T, String>> columns, ISortableDataProvider provider) {
DataTable<T, String> table = new SelectableDataTable<T>(ID_TABLE, columns, provider,
UserProfileStorage.DEFAULT_PAGING_SIZE);

table.setOutputMarkupId(true);

TableHeadersToolbar headers = new TableHeadersToolbar(table, provider);
headers.setOutputMarkupId(true);
table.addTopToolbar(headers);

CountToolbar count = new CountToolbar(table);
CountToolbar count = new CountToolbar(table) {

@Override
protected void pageSizeChanged(AjaxRequestTarget target) {
PageBase page = (PageBase) getPage();
Integer pageSize = page.getSessionStorage().getUserProfile().getPagingSize(tableId);

setItemsPerPage(pageSize);
target.add(getNavigatorPanel());
target.add(getDataTable());
}

@Override
protected boolean isPageSizePopupVisible() {
return showPagingSize.getObject();
}
};
addVisibleBehaviour(count, showCount);
table.addBottomToolbar(count);

Expand All @@ -86,20 +111,10 @@ private void initLayout(List<IColumn<T, String>> columns, final int itemsPerPage
NavigatorPanel nb2 = new NavigatorPanel(ID_PAGING, table, showPagedPaging(provider));
addVisibleBehaviour(nb2, showPaging);
add(nb2);
}

PagingSizePanel pagingSizePanel = new PagingSizePanel(ID_PAGING_SIZE, tableId){

@Override
protected void pagingSizeChangePerformed(AjaxRequestTarget target){
Integer pageSize = getPagingSize();
getPageBase().getSessionStorage().getUserProfile().setPagingSize(tableId, pageSize);
setItemsPerPage(pageSize);
target.add(getNavigatorPanel());
target.add(getDataTable());
}
};
addVisibleBehaviour(pagingSizePanel, showPagingSize);
add(pagingSizePanel);
public UserProfileStorage.TableId getTableId() {
return tableId;
}

private void addVisibleBehaviour(Component comp, final IModel<Boolean> model) {
Expand All @@ -125,7 +140,7 @@ public DataTable getDataTable() {
return (DataTable) get(ID_TABLE);
}

public NavigatorPanel getNavigatorPanel(){
public NavigatorPanel getNavigatorPanel() {
return (NavigatorPanel) get(ID_PAGING);
}

Expand All @@ -148,7 +163,7 @@ public void setCurrentPage(ObjectPaging paging) {
getDataTable().setCurrentPage(page);
}

public void setShowPagingSize(boolean show){
public void setShowPagingSize(boolean show) {
this.showPagingSize.setObject(show);
}

Expand Down

0 comments on commit 4010a7a

Please sign in to comment.