Change-Id: Iff797c3bf90a6021099a3ed4082cfca3a6fb3540tags/7.6.0.alpha3^2
border-left: none; | border-left: none; | ||||
} | } | ||||
} | } | ||||
.#{$primaryStyleName}-editor-cells.frozen > div { | |||||
@include box-shadow(1px 0 2px rgba(0,0,0,.1)); | |||||
border-right: $v-grid-cell-vertical-border; | |||||
border-left: none; | |||||
} | |||||
.#{$primaryStyleName}-row-stripe > td { | .#{$primaryStyleName}-row-stripe > td { | ||||
background-color: $v-grid-row-stripe-background-color; | background-color: $v-grid-row-stripe-background-color; | ||||
.#{$primaryStyleName}-editor-cells { | .#{$primaryStyleName}-editor-cells { | ||||
position: relative; | position: relative; | ||||
white-space: nowrap; | white-space: nowrap; | ||||
&.frozen { | |||||
z-index: 2; | |||||
} | |||||
> div { | > div { | ||||
display: inline-block; | display: inline-block; |
private DivElement editorOverlay = DivElement.as(DOM.createDiv()); | private DivElement editorOverlay = DivElement.as(DOM.createDiv()); | ||||
private DivElement cellWrapper = DivElement.as(DOM.createDiv()); | private DivElement cellWrapper = DivElement.as(DOM.createDiv()); | ||||
private DivElement frozenCellWrapper = DivElement.as(DOM.createDiv()); | |||||
private DivElement messageAndButtonsWrapper = DivElement.as(DOM | private DivElement messageAndButtonsWrapper = DivElement.as(DOM | ||||
.createDiv()); | .createDiv()); | ||||
}); | }); | ||||
gridElement.appendChild(editorOverlay); | gridElement.appendChild(editorOverlay); | ||||
editorOverlay.appendChild(frozenCellWrapper); | |||||
editorOverlay.appendChild(cellWrapper); | editorOverlay.appendChild(cellWrapper); | ||||
editorOverlay.appendChild(messageAndButtonsWrapper); | editorOverlay.appendChild(messageAndButtonsWrapper); | ||||
int frozenColumns = grid.getVisibleFrozenColumnCount(); | |||||
double frozenColumnsWidth = 0; | |||||
double cellHeight = 0; | |||||
for (int i = 0; i < tr.getCells().getLength(); i++) { | for (int i = 0; i < tr.getCells().getLength(); i++) { | ||||
Element cell = createCell(tr.getCells().getItem(i)); | Element cell = createCell(tr.getCells().getItem(i)); | ||||
cellWrapper.appendChild(cell); | |||||
cellHeight = Math.max(cellHeight, WidgetUtil | |||||
.getRequiredHeightBoundingClientRectDouble(tr | |||||
.getCells().getItem(i))); | |||||
Column<?, T> column = grid.getVisibleColumn(i); | Column<?, T> column = grid.getVisibleColumn(i); | ||||
if (i < frozenColumns) { | |||||
frozenCellWrapper.appendChild(cell); | |||||
frozenColumnsWidth += WidgetUtil | |||||
.getRequiredWidthBoundingClientRectDouble(tr | |||||
.getCells().getItem(i)); | |||||
} else { | |||||
cellWrapper.appendChild(cell); | |||||
} | |||||
if (column.isEditable()) { | if (column.isEditable()) { | ||||
Widget editor = getHandler().getWidget(column); | Widget editor = getHandler().getWidget(column); | ||||
} | } | ||||
} | } | ||||
setBounds(frozenCellWrapper, 0, 0, frozenColumnsWidth, 0); | |||||
setBounds(cellWrapper, frozenColumnsWidth, 0, tr.getOffsetWidth() | |||||
- frozenColumnsWidth, cellHeight); | |||||
// Only add these elements once | // Only add these elements once | ||||
if (!messageAndButtonsWrapper.isOrHasChild(messageWrapper)) { | if (!messageAndButtonsWrapper.isOrHasChild(messageWrapper)) { | ||||
messageAndButtonsWrapper.appendChild(messageWrapper); | messageAndButtonsWrapper.appendChild(messageWrapper); | ||||
editorOverlay.removeAllChildren(); | editorOverlay.removeAllChildren(); | ||||
cellWrapper.removeAllChildren(); | cellWrapper.removeAllChildren(); | ||||
frozenCellWrapper.removeAllChildren(); | |||||
editorOverlay.removeFromParent(); | editorOverlay.removeFromParent(); | ||||
scrollHandler.removeHandler(); | scrollHandler.removeHandler(); | ||||
editorOverlay.removeClassName(styleName); | editorOverlay.removeClassName(styleName); | ||||
cellWrapper.removeClassName(styleName + "-cells"); | cellWrapper.removeClassName(styleName + "-cells"); | ||||
frozenCellWrapper.removeClassName(styleName + "-cells"); | |||||
messageAndButtonsWrapper.removeClassName(styleName + "-footer"); | messageAndButtonsWrapper.removeClassName(styleName + "-footer"); | ||||
messageWrapper.removeClassName(styleName + "-message"); | messageWrapper.removeClassName(styleName + "-message"); | ||||
editorOverlay.setClassName(styleName); | editorOverlay.setClassName(styleName); | ||||
cellWrapper.setClassName(styleName + "-cells"); | cellWrapper.setClassName(styleName + "-cells"); | ||||
frozenCellWrapper.setClassName(styleName + "-cells frozen"); | |||||
messageAndButtonsWrapper.setClassName(styleName + "-footer"); | messageAndButtonsWrapper.setClassName(styleName + "-footer"); | ||||
messageWrapper.setClassName(styleName + "-message"); | messageWrapper.setClassName(styleName + "-message"); | ||||
private void updateHorizontalScrollPosition() { | private void updateHorizontalScrollPosition() { | ||||
double scrollLeft = grid.getScrollLeft(); | double scrollLeft = grid.getScrollLeft(); | ||||
cellWrapper.getStyle().setLeft(-scrollLeft, Unit.PX); | |||||
cellWrapper.getStyle().setLeft( | |||||
frozenCellWrapper.getOffsetWidth() - scrollLeft, Unit.PX); | |||||
} | } | ||||
protected void setGridEnabled(boolean enabled) { | protected void setGridEnabled(boolean enabled) { | ||||
} | } | ||||
private void updateFrozenColumns() { | private void updateFrozenColumns() { | ||||
int numberOfColumns = frozenColumnCount; | |||||
escalator.getColumnConfiguration().setFrozenColumnCount( | |||||
getVisibleFrozenColumnCount()); | |||||
} | |||||
private int getVisibleFrozenColumnCount() { | |||||
int numberOfColumns = getFrozenColumnCount(); | |||||
// for the escalator the hidden columns are not in the frozen column | // for the escalator the hidden columns are not in the frozen column | ||||
// count, but for grid they are. thus need to convert the index | // count, but for grid they are. thus need to convert the index | ||||
} else if (selectionColumn != null) { | } else if (selectionColumn != null) { | ||||
numberOfColumns++; | numberOfColumns++; | ||||
} | } | ||||
escalator.getColumnConfiguration() | |||||
.setFrozenColumnCount(numberOfColumns); | |||||
return numberOfColumns; | |||||
} | } | ||||
/** | /** |
/* | |||||
* Copyright 2000-2014 Vaadin Ltd. | |||||
* | |||||
* 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.vaadin.tests.components.grid; | |||||
import com.vaadin.tests.util.PersonContainer; | |||||
import com.vaadin.ui.Grid; | |||||
public class GridEditorFrozenColumnsUI extends GridEditorUI { | |||||
@Override | |||||
protected Grid createGrid(PersonContainer container) { | |||||
Grid grid = super.createGrid(container); | |||||
grid.setFrozenColumnCount(2); | |||||
grid.setWidth("600px"); | |||||
return grid; | |||||
} | |||||
@Override | |||||
protected Integer getTicketNumber() { | |||||
return 16727; | |||||
} | |||||
@Override | |||||
protected String getTestDescription() { | |||||
return "Frozen columns should also freeze cells in editor."; | |||||
} | |||||
} |
/* | |||||
* Copyright 2000-2014 Vaadin Ltd. | |||||
* | |||||
* 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.vaadin.tests.components.grid; | |||||
import java.io.IOException; | |||||
import org.junit.Test; | |||||
import org.openqa.selenium.By; | |||||
import org.openqa.selenium.JavascriptExecutor; | |||||
import org.openqa.selenium.WebDriver; | |||||
import org.openqa.selenium.WebElement; | |||||
import org.openqa.selenium.interactions.Actions; | |||||
import com.vaadin.testbench.elements.GridElement; | |||||
import com.vaadin.testbench.elements.GridElement.GridCellElement; | |||||
import com.vaadin.testbench.parallel.TestCategory; | |||||
import com.vaadin.tests.tb3.MultiBrowserTest; | |||||
@TestCategory("grid") | |||||
public class GridEditorFrozenColumnsUITest extends MultiBrowserTest { | |||||
@Test | |||||
public void testEditorWithFrozenColumns() throws IOException { | |||||
openTestURL(); | |||||
openEditor(10); | |||||
compareScreen("noscroll"); | |||||
scrollGridHorizontallyTo(100); | |||||
compareScreen("scrolled"); | |||||
} | |||||
private void openEditor(int rowIndex) { | |||||
GridElement grid = $(GridElement.class).first(); | |||||
GridCellElement cell = grid.getCell(rowIndex, 1); | |||||
new Actions(driver).moveToElement(cell).doubleClick().build().perform(); | |||||
} | |||||
private void scrollGridHorizontallyTo(double px) { | |||||
executeScript("arguments[0].scrollLeft = " + px, | |||||
getGridHorizontalScrollbar()); | |||||
} | |||||
private Object executeScript(String script, WebElement element) { | |||||
final WebDriver driver = getDriver(); | |||||
if (driver instanceof JavascriptExecutor) { | |||||
final JavascriptExecutor je = (JavascriptExecutor) driver; | |||||
return je.executeScript(script, element); | |||||
} else { | |||||
throw new IllegalStateException("current driver " | |||||
+ getDriver().getClass().getName() + " is not a " | |||||
+ JavascriptExecutor.class.getSimpleName()); | |||||
} | |||||
} | |||||
private WebElement getGridHorizontalScrollbar() { | |||||
return getDriver() | |||||
.findElement( | |||||
By.xpath("//div[contains(@class, \"v-grid-scroller-horizontal\")]")); | |||||
} | |||||
} |
protected void setup(VaadinRequest request) { | protected void setup(VaadinRequest request) { | ||||
PersonContainer container = PersonContainer.createWithTestData(); | PersonContainer container = PersonContainer.createWithTestData(); | ||||
addComponent(createGrid(container)); | |||||
} | |||||
protected Grid createGrid(PersonContainer container) { | |||||
Grid grid = new Grid(container); | Grid grid = new Grid(container); | ||||
// Don't use address since there's no converter | // Don't use address since there's no converter | ||||
grid.getColumn("phoneNumber").getEditorField().setReadOnly(true); | grid.getColumn("phoneNumber").getEditorField().setReadOnly(true); | ||||
addComponent(grid); | |||||
return grid; | |||||
} | } | ||||
} | } |
openEditor(10); | openEditor(10); | ||||
assertTrue("Edtor should be opened with a password field", | |||||
assertTrue("Editor should be opened with a password field", | |||||
isElementPresent(PasswordFieldElement.class)); | isElementPresent(PasswordFieldElement.class)); | ||||
assertFalse("Notification was present", | assertFalse("Notification was present", |
@Test | @Test | ||||
public void testWithSelectionColumn() throws Exception { | public void testWithSelectionColumn() throws Exception { | ||||
selectMenuPath("Component", "State", "Selection mode", "multi"); | selectMenuPath("Component", "State", "Selection mode", "multi"); | ||||
selectMenuPath("Component", "State", "Frozen column count", | |||||
"-1 columns"); | |||||
selectMenuPath(EDIT_ROW_5); | selectMenuPath(EDIT_ROW_5); | ||||
WebElement editorCells = findElement(By | |||||
.className("v-grid-editor-cells")); | |||||
WebElement editorCells = findElements( | |||||
By.className("v-grid-editor-cells")).get(1); | |||||
List<WebElement> selectorDivs = editorCells.findElements(By | List<WebElement> selectorDivs = editorCells.findElements(By | ||||
.cssSelector("div")); | .cssSelector("div")); | ||||
assertEquals( | assertEquals( | ||||
"Not editable cell did not contain correct classname", | "Not editable cell did not contain correct classname", | ||||
"not-editable", | "not-editable", | ||||
editor.findElement(By.className("v-grid-editor-cells")) | |||||
editor.findElements(By.className("v-grid-editor-cells")).get(1) | |||||
.findElements(By.xpath("./div")).get(3) | .findElements(By.xpath("./div")).get(3) | ||||
.getAttribute("class")); | .getAttribute("class")); | ||||