summaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
-rw-r--r--WebContent/VAADIN/themes/base/slider/slider.css15
-rw-r--r--WebContent/VAADIN/themes/base/styles.css15
-rw-r--r--WebContent/VAADIN/themes/reindeer/common/img/vertical-sprites-ie6.pngbin8090 -> 8116 bytes
-rw-r--r--WebContent/VAADIN/themes/reindeer/common/img/vertical-sprites.pngbin22844 -> 23017 bytes
-rw-r--r--WebContent/VAADIN/themes/reindeer/slider/img/knob-pressed.pngbin420 -> 360 bytes
-rw-r--r--WebContent/VAADIN/themes/reindeer/slider/slider.css2
-rw-r--r--WebContent/VAADIN/themes/reindeer/styles.css17
-rw-r--r--WebContent/VAADIN/themes/runo/slider/slider.css2
-rw-r--r--WebContent/VAADIN/themes/runo/styles.css17
-rw-r--r--src/com/vaadin/terminal/gwt/client/ui/VSlider.java56
10 files changed, 113 insertions, 11 deletions
diff --git a/WebContent/VAADIN/themes/base/slider/slider.css b/WebContent/VAADIN/themes/base/slider/slider.css
index 7df6a4d667..5ee6cbf31c 100644
--- a/WebContent/VAADIN/themes/base/slider/slider.css
+++ b/WebContent/VAADIN/themes/base/slider/slider.css
@@ -38,6 +38,21 @@
margin-left: -5px;
}
+.v-slider-feedback {
+ padding: 2px 5px;
+ background: #444;
+ color: #fff;
+ font-size: 11px;
+ line-height: 13px;
+ font-weight: bold;
+ font-family: Arial, Helvetica, sans-serif;
+ border-radius: 4px;
+ -webkit-border-radius: 4px;
+ -moz-border-radius: 4px;
+ margin: -2px 0 0 2px;
+ text-shadow: 0 1px 0 #000;
+}
+
/* Disabled by default
.v-slider-error .v-slider-base {
background: #FFE0E0;
diff --git a/WebContent/VAADIN/themes/base/styles.css b/WebContent/VAADIN/themes/base/styles.css
index 2c508ca59e..cafbc018ca 100644
--- a/WebContent/VAADIN/themes/base/styles.css
+++ b/WebContent/VAADIN/themes/base/styles.css
@@ -1151,6 +1151,21 @@ div.v-progressindicator-indeterminate-disabled {
margin-left: -5px;
}
+.v-slider-feedback {
+ padding: 2px 5px;
+ background: #444;
+ color: #fff;
+ font-size: 11px;
+ line-height: 13px;
+ font-weight: bold;
+ font-family: Arial, Helvetica, sans-serif;
+ border-radius: 4px;
+ -webkit-border-radius: 4px;
+ -moz-border-radius: 4px;
+ margin: -2px 0 0 2px;
+ text-shadow: 0 1px 0 #000;
+}
+
/* Disabled by default
.v-slider-error .v-slider-base {
background: #FFE0E0;
diff --git a/WebContent/VAADIN/themes/reindeer/common/img/vertical-sprites-ie6.png b/WebContent/VAADIN/themes/reindeer/common/img/vertical-sprites-ie6.png
index c11ee47f9e..ec72a8b6a3 100644
--- a/WebContent/VAADIN/themes/reindeer/common/img/vertical-sprites-ie6.png
+++ b/WebContent/VAADIN/themes/reindeer/common/img/vertical-sprites-ie6.png
Binary files differ
diff --git a/WebContent/VAADIN/themes/reindeer/common/img/vertical-sprites.png b/WebContent/VAADIN/themes/reindeer/common/img/vertical-sprites.png
index 4a4537ac06..c0e29a99f5 100644
--- a/WebContent/VAADIN/themes/reindeer/common/img/vertical-sprites.png
+++ b/WebContent/VAADIN/themes/reindeer/common/img/vertical-sprites.png
Binary files differ
diff --git a/WebContent/VAADIN/themes/reindeer/slider/img/knob-pressed.png b/WebContent/VAADIN/themes/reindeer/slider/img/knob-pressed.png
index 3ea2724e77..d5afcb71a0 100644
--- a/WebContent/VAADIN/themes/reindeer/slider/img/knob-pressed.png
+++ b/WebContent/VAADIN/themes/reindeer/slider/img/knob-pressed.png
Binary files differ
diff --git a/WebContent/VAADIN/themes/reindeer/slider/slider.css b/WebContent/VAADIN/themes/reindeer/slider/slider.css
index 33ce41ca72..cb5a0f7dbe 100644
--- a/WebContent/VAADIN/themes/reindeer/slider/slider.css
+++ b/WebContent/VAADIN/themes/reindeer/slider/slider.css
@@ -17,7 +17,7 @@
height: 10px;
margin-top: -5px;
}
-.v-slider-handle:active {
+.v-slider-handle-active {
background-image: url(img/knob-pressed.png); /** sprite-ref: verticals */
}
.v-slider-vertical {
diff --git a/WebContent/VAADIN/themes/reindeer/styles.css b/WebContent/VAADIN/themes/reindeer/styles.css
index ee9629160e..88e27aacf6 100644
--- a/WebContent/VAADIN/themes/reindeer/styles.css
+++ b/WebContent/VAADIN/themes/reindeer/styles.css
@@ -1151,6 +1151,21 @@ div.v-progressindicator-indeterminate-disabled {
margin-left: -5px;
}
+.v-slider-feedback {
+ padding: 2px 5px;
+ background: #444;
+ color: #fff;
+ font-size: 11px;
+ line-height: 13px;
+ font-weight: bold;
+ font-family: Arial, Helvetica, sans-serif;
+ border-radius: 4px;
+ -webkit-border-radius: 4px;
+ -moz-border-radius: 4px;
+ margin: -2px 0 0 2px;
+ text-shadow: 0 1px 0 #000;
+}
+
/* Disabled by default
.v-slider-error .v-slider-base {
background: #FFE0E0;
@@ -3650,7 +3665,7 @@ td.v-datefield-calendarpanel-nextyear {
height: 10px;
margin-top: -5px;
}
-.v-slider-handle:active {
+.v-slider-handle-active {
background-image: url(common/img/vertical-sprites.png);
-background-image: url(common/img/vertical-sprites-ie6.png);
background-position: left -895px;
diff --git a/WebContent/VAADIN/themes/runo/slider/slider.css b/WebContent/VAADIN/themes/runo/slider/slider.css
index 5665a2aaee..07b10dfa17 100644
--- a/WebContent/VAADIN/themes/runo/slider/slider.css
+++ b/WebContent/VAADIN/themes/runo/slider/slider.css
@@ -51,7 +51,7 @@
height: 12px;
margin-left: -5px;
}
-.v-slider-vertical .v-slider-handle:hover {
+.v-slider-vertical .v-slider-handle-active {
background-position: left bottom;
}
diff --git a/WebContent/VAADIN/themes/runo/styles.css b/WebContent/VAADIN/themes/runo/styles.css
index 0ae0f686f0..5626fae70d 100644
--- a/WebContent/VAADIN/themes/runo/styles.css
+++ b/WebContent/VAADIN/themes/runo/styles.css
@@ -1151,6 +1151,21 @@ div.v-progressindicator-indeterminate-disabled {
margin-left: -5px;
}
+.v-slider-feedback {
+ padding: 2px 5px;
+ background: #444;
+ color: #fff;
+ font-size: 11px;
+ line-height: 13px;
+ font-weight: bold;
+ font-family: Arial, Helvetica, sans-serif;
+ border-radius: 4px;
+ -webkit-border-radius: 4px;
+ -moz-border-radius: 4px;
+ margin: -2px 0 0 2px;
+ text-shadow: 0 1px 0 #000;
+}
+
/* Disabled by default
.v-slider-error .v-slider-base {
background: #FFE0E0;
@@ -2755,7 +2770,7 @@ div.v-tree-node-leaf {
height: 12px;
margin-left: -5px;
}
-.v-slider-vertical .v-slider-handle:hover {
+.v-slider-vertical .v-slider-handle-active {
background-position: left bottom;
}
diff --git a/src/com/vaadin/terminal/gwt/client/ui/VSlider.java b/src/com/vaadin/terminal/gwt/client/ui/VSlider.java
index 1ca8b814a5..732ba84a3f 100644
--- a/src/com/vaadin/terminal/gwt/client/ui/VSlider.java
+++ b/src/com/vaadin/terminal/gwt/client/ui/VSlider.java
@@ -10,6 +10,7 @@ import com.google.gwt.user.client.DeferredCommand;
import com.google.gwt.user.client.Element;
import com.google.gwt.user.client.Event;
import com.google.gwt.user.client.Timer;
+import com.google.gwt.user.client.ui.HTML;
import com.google.gwt.user.client.ui.Widget;
import com.vaadin.terminal.gwt.client.ApplicationConnection;
import com.vaadin.terminal.gwt.client.BrowserInfo;
@@ -43,9 +44,18 @@ public class VSlider extends Widget implements Paintable, Field,
private int resolution;
private Double value;
private boolean vertical;
- private int size = -1;
+ private final int size = -1;
private boolean arrows;
+ private final HTML feedback = new HTML("", false);
+ private final VOverlay feedbackPopup = new VOverlay(true, false, true) {
+ @Override
+ public void show() {
+ super.show();
+ updateFeedbackPosition();
+ }
+ };
+
/* DOM element for slider's base */
private final Element base;
private final int BASE_BORDER_WIDTH = 1;
@@ -94,6 +104,9 @@ public class VSlider extends Widget implements Paintable, Field,
| Event.ONMOUSEOUT);
DOM.sinkEvents(bigger, Event.ONMOUSEDOWN | Event.ONMOUSEUP
| Event.ONMOUSEOUT);
+
+ feedbackPopup.addStyleName(CLASSNAME + "-feedback");
+ feedbackPopup.setWidget(feedback);
}
public void updateFromUIDL(UIDL uidl, ApplicationConnection client) {
@@ -136,6 +149,8 @@ public class VSlider extends Widget implements Paintable, Field,
resolution = uidl.getIntAttribute("resolution");
value = new Double(uidl.getDoubleVariable("value"));
+ setFeedbackValue(value);
+
handleSize = uidl.getIntAttribute("hsize");
buildBase();
@@ -154,6 +169,29 @@ public class VSlider extends Widget implements Paintable, Field,
}
}
+ private void setFeedbackValue(double value) {
+ String currentValue = "" + value;
+ if (resolution == 0) {
+ currentValue = "" + new Double(value).intValue();
+ }
+ feedback.setText(currentValue);
+ }
+
+ private void updateFeedbackPosition() {
+ if (vertical) {
+ feedbackPopup.setPopupPosition(DOM.getAbsoluteLeft(handle)
+ + handle.getOffsetWidth(), DOM.getAbsoluteTop(handle)
+ + handle.getOffsetHeight() / 2
+ - feedbackPopup.getOffsetHeight() / 2);
+ } else {
+ feedbackPopup.setPopupPosition(DOM.getAbsoluteLeft(handle)
+ + handle.getOffsetWidth() / 2
+ - feedbackPopup.getOffsetWidth() / 2, DOM
+ .getAbsoluteTop(handle)
+ - feedbackPopup.getOffsetHeight());
+ }
+ }
+
private void buildBase() {
final String styleAttribute = vertical ? "height" : "width";
final String domProperty = vertical ? "offsetHeight" : "offsetWidth";
@@ -244,6 +282,7 @@ public class VSlider extends Widget implements Paintable, Field,
final int range = baseSize - handleSize;
double v = value.doubleValue();
+
// Round value to resolution
if (resolution > 0) {
v = Math.round(v * Math.pow(10, resolution));
@@ -268,11 +307,9 @@ public class VSlider extends Widget implements Paintable, Field,
DOM.setStyleAttribute(handle, styleAttribute, (Math.round(pos)) + "px");
- // TODO give more detailed info when dragging and do roundup
- DOM.setElementAttribute(handle, "title", "" + v);
-
// Update value
this.value = new Double(v);
+ setFeedbackValue(v);
if (updateToServer) {
updateValueToServer();
@@ -329,7 +366,10 @@ public class VSlider extends Widget implements Paintable, Field,
switch (DOM.eventGetType(event)) {
case Event.ONMOUSEDOWN:
if (!disabled && !readonly) {
+ feedbackPopup.show();
dragging = true;
+ DOM.setElementProperty(handle, "className", CLASSNAME
+ + "-handle " + CLASSNAME + "-handle-active");
DOM.setCapture(getElement());
DOM.eventPreventDefault(event); // prevent selecting text
DOM.eventCancelBubble(event, true);
@@ -337,12 +377,14 @@ public class VSlider extends Widget implements Paintable, Field,
break;
case Event.ONMOUSEMOVE:
if (dragging) {
- // DOM.setCapture(getElement());
setValueByEvent(event, false);
+ updateFeedbackPosition();
}
break;
case Event.ONMOUSEUP:
+ feedbackPopup.hide();
dragging = false;
+ DOM.setElementProperty(handle, "className", CLASSNAME + "-handle");
DOM.releaseCapture(getElement());
setValueByEvent(event, true);
break;
@@ -381,8 +423,8 @@ public class VSlider extends Widget implements Paintable, Field,
.eventGetClientX(event);
final String domProperty = vertical ? "offsetHeight" : "offsetWidth";
- final double handleSize = Integer.parseInt(DOM.getElementProperty(
- handle, domProperty));
+ final int handleSize = Integer.parseInt(DOM.getElementProperty(handle,
+ domProperty));
final double baseSize = Integer.parseInt(DOM.getElementProperty(base,
domProperty));
final double baseOffset = vertical ? DOM.getAbsoluteTop(base)