Slider Cell in Grid calculates wrong Slider position

[mtraynham]

Required Information


Version(s) of Ext GWT
«Ext GWT 3.0.1»


Browser versions and OS
(and desktop environment, if applicable)

• «Internet Explorer 8, Windows 7»
• «Firefox 10, OS X 10.7»
• «Chrome 17, Windows XP, Aston Shell»
• «Firefox 11, Ubuntu 10.04, GNOME»

Virtual Machine
«Yes/No»


Description
«Slider Cell in Grid calculates wrong Slider position.»


Run mode
«both»


Steps to reproduce the problem

1. Start running in development mode in Eclipse
2. Open app in browser
3. «Run test code»
4. «Move sliders»

Expected result
«Correct Slider Position»


Actual result
«Incorrect Slider Position»


Test case

package com.test.test;


import java.util.ArrayList;
import java.util.List;


import com.google.gwt.core.client.EntryPoint;
import com.google.gwt.user.client.ui.IsWidget;
import com.google.gwt.user.client.ui.RootPanel;
import com.google.gwt.user.client.ui.Widget;
import com.sencha.gxt.cell.core.client.SliderCell;
import com.sencha.gxt.core.client.ValueProvider;
import com.sencha.gxt.data.shared.ListStore;
import com.sencha.gxt.data.shared.ModelKeyProvider;
import com.sencha.gxt.widget.core.client.Slider;
import com.sencha.gxt.widget.core.client.container.VerticalLayoutContainer;
import com.sencha.gxt.widget.core.client.container.VerticalLayoutContainer.VerticalLayoutData;
import com.sencha.gxt.widget.core.client.grid.ColumnConfig;
import com.sencha.gxt.widget.core.client.grid.ColumnModel;
import com.sencha.gxt.widget.core.client.grid.Grid;


public class StockGridExample implements IsWidget, EntryPoint {
    @Override
    public void onModuleLoad() {
        RootPanel.get().add(this);
    }


    @Override
    public Widget asWidget() {
        VerticalLayoutContainer container = new VerticalLayoutContainer();
        container.add(new Slider());
        
        ArrayList<Stock> stocks = new ArrayList<Stock>();
        for(int i = 0; i < 10; i++) {
            stocks.add(new Stock((int)Math.round(Math.random()*100)));
        }
        ListStore<Stock> store = new ListStore<Stock>(new ModelKeyProvider<Stock>() {
            @Override
            public String getKey(Stock item) {
                return item.getId().toString();
            }
        });
        store.addAll(stocks);
        List<ColumnConfig<Stock, ?>> cc = new ArrayList<ColumnConfig<Stock,?>>();
        ColumnConfig<Stock, Integer> cc1 = new ColumnConfig<Stock, Integer>(new ValueProvider<Stock, Integer>() {
            @Override
            public Integer getValue(Stock object) {
                return object.getValue();
            }


            @Override
            public void setValue(Stock object, Integer value) {
                object.setValue(value);
            }


            @Override
            public String getPath() { return null; }
        });
        cc1.setCell(new SliderCell());
        cc1.setWidth(250);
        cc.add(cc1);
        ColumnModel<Stock> cm = new ColumnModel<Stock>(cc);
        Grid<Stock> stockGrid = new Grid<Stock>(store, cm);
        container.add(stockGrid, new VerticalLayoutData(500, 200));
        return container.asWidget();
    }
    
    public static class Stock {
        private Integer value;
        private final Integer id;
        private static int idCounter = 0;
        
        public Stock(Integer value) {
            this.id = idCounter++;
            this.value = value;
        }
        
        public Integer getValue() {
            return value;
        }
        
        public void setValue(Integer value) {
            this.value = value;
        }
        
        public Integer getId() {
            return this.id;
        }
    }
}

[mtraynham]

The bug is in the render method of the SliderHorizontalBaseAppearance class. The standard slider does not call this method, but the when the cell is used by itself, it does.

I fixed the math and removed a duplicate variable definition that was unnecessary.

Here is the current render method:
SliderHorizontalBaseAppearance.java

  @Override
  public void render(double fractionalValue, int width, int height, SafeHtmlBuilder sb) {
    if (width == -1) {
      // default
      width = 200;
    }
    
    // padding
    width -= 7;
    
    int offset = (int) (fractionalValue * (width - 21)) - 7;
    
    offset = Math.max(-7, offset);
    
    SafeStyles offsetStyles = SafeStylesUtils.fromTrustedString("left:" + offset + "px;");
    SafeStyles widthStyle = SafeStylesUtils.fromTrustedString("");


    widthStyle = SafeStylesUtils.fromTrustedString("width: " + width + "px;");
    sb.append(template.template(resources.style(), widthStyle, offsetStyles));
  }

It should be changed to:
SliderHorizontalBaseAppearance.java

	@Override
	public void render(double fractionalValue, int width, int height, SafeHtmlBuilder sb) {
		if (width == -1) {
			// default
			width = 200;
		}
		// padding
		width -= 7;


		int offset = (int) (fractionalValue * width) - 14;
		offset = Math.max(-7, offset);
		
		SafeStyles offsetStyles = SafeStylesUtils.fromTrustedString("left:" + offset + "px;");
		SafeStyles widthStyle = SafeStylesUtils.fromTrustedString("width: " + width + "px;");
		
		sb.append(template.template(resources.style(), widthStyle, offsetStyles));
	}