Adding sliders
This commit is contained in:
parent
5d0ad1f6fb
commit
96ac393a11
8 changed files with 973 additions and 40 deletions
|
|
@ -15,7 +15,7 @@ package WebGUI::Form::HexSlider;
|
|||
=cut
|
||||
|
||||
use strict;
|
||||
use base 'WebGUI::Form::Control';
|
||||
use base 'WebGUI::Form::Slider';
|
||||
use WebGUI::International;
|
||||
|
||||
=head1 NAME
|
||||
|
|
@ -54,10 +54,19 @@ Defaults to "ff". The maximum that the slider can go to.
|
|||
|
||||
Defaults to "00". The minimum value that the slider can go to.
|
||||
|
||||
=head4 size
|
||||
|
||||
The length of the input box.
|
||||
|
||||
=head4 padLength
|
||||
|
||||
Pad the value to padLength characters by adding zeros in front if necesarry.
|
||||
|
||||
=head4 profileEnabled
|
||||
|
||||
Flag that tells the User Profile system that this is a valid form element in a User Profile
|
||||
|
||||
|
||||
=cut
|
||||
|
||||
sub definition {
|
||||
|
|
@ -67,7 +76,7 @@ sub definition {
|
|||
my $i18n = WebGUI::International->new($session);
|
||||
push(@{$definition}, {
|
||||
formName=>{
|
||||
defaultValue=> $i18n->get("475")
|
||||
defaultValue=> $i18n->get("hex slider")
|
||||
},
|
||||
maximum=>{
|
||||
defaultValue=> "ff",
|
||||
|
|
@ -75,6 +84,12 @@ sub definition {
|
|||
minimum=>{
|
||||
defaultValue=> "00",
|
||||
},
|
||||
size=>{
|
||||
defaultValue=>11,
|
||||
},
|
||||
padLength=>{
|
||||
defaultValue=>"2",
|
||||
},
|
||||
profileEnabled=>{
|
||||
defaultValue=>1
|
||||
},
|
||||
|
|
@ -83,7 +98,117 @@ sub definition {
|
|||
}
|
||||
|
||||
#-------------------------------------------------------------------
|
||||
=head2 getInputElement
|
||||
|
||||
Returns the form element used for manual input.
|
||||
|
||||
=cut
|
||||
|
||||
sub getInputElement {
|
||||
my $self = shift;
|
||||
|
||||
return WebGUI::Form::hexadecimal($self->session, {
|
||||
name => $self->get('name'),
|
||||
value => $self->get('value'),
|
||||
size => $self->get('size'),
|
||||
id => 'view-'.$self->get('id'),
|
||||
});
|
||||
}
|
||||
|
||||
#-------------------------------------------------------------------
|
||||
=head2 getOnChangeInputElement
|
||||
|
||||
Returns the javascript code to update the slider and other form elements on a
|
||||
change of the imput element.
|
||||
|
||||
=cut
|
||||
|
||||
sub getOnChangeInputElement {
|
||||
my $self = shift;
|
||||
|
||||
my $padLength = $self->get('padLength');
|
||||
|
||||
return
|
||||
'while (this.value.length < '.$padLength.') { '.
|
||||
'this.value = \'0\' + this.value'.
|
||||
'};'.
|
||||
$self->getSliderVariable.'.setValue(parseInt(this.value,16));'.
|
||||
$self->getDisplayVariable.'.innerHTML = this.value';
|
||||
}
|
||||
|
||||
#-------------------------------------------------------------------
|
||||
=head2 getOnChangeSlider
|
||||
|
||||
Returns the javascript code to update the form on a change of slider position.
|
||||
|
||||
=cut
|
||||
|
||||
sub getOnChangeSlider {
|
||||
my $self = shift;
|
||||
|
||||
my $padLength = $self->get('padLength');
|
||||
|
||||
return
|
||||
$self->getInputVariable.'.value = this.getValue().toString(16);'.
|
||||
'while ('.$self->getInputVariable.'.value.length < '.$padLength.') { '.
|
||||
$self->getInputVariable.'.value = \'0\' + '.$self->getInputVariable.'.value'.
|
||||
'};'.
|
||||
$self->getDisplayVariable.'.innerHTML = this.getValue().toString(16);';
|
||||
}
|
||||
|
||||
#-------------------------------------------------------------------
|
||||
=head2 getSliderMaximum
|
||||
|
||||
Returns the maximum value the slider can be set to in slider units.
|
||||
|
||||
=cut
|
||||
|
||||
sub getSliderMaximum {
|
||||
my $self = shift;
|
||||
|
||||
return scalar(keys %{$self->get('options')}) - 1;
|
||||
}
|
||||
|
||||
#-------------------------------------------------------------------
|
||||
=head2 getSliderMaximum
|
||||
|
||||
Returns the minimum value the slider can be set to in slider units.
|
||||
|
||||
=cut
|
||||
|
||||
sub getSliderMaximum {
|
||||
my $self = shift;
|
||||
|
||||
return hex($self->get('maximum'));
|
||||
}
|
||||
|
||||
#-------------------------------------------------------------------
|
||||
=head2 getSliderMaximum
|
||||
|
||||
Returns the minimum value the slider can be set to in slider units.
|
||||
|
||||
=cut
|
||||
|
||||
sub getSliderMinimum {
|
||||
my $self = shift;
|
||||
|
||||
return hex($self->get('minimum'));
|
||||
}
|
||||
|
||||
#-------------------------------------------------------------------
|
||||
=head2 getSliderValue
|
||||
|
||||
Returns the initial position of the slider in slider units.
|
||||
|
||||
=cut
|
||||
|
||||
sub getSliderValue {
|
||||
my $self = shift;
|
||||
|
||||
return hex($self->get('value'));
|
||||
}
|
||||
|
||||
#-------------------------------------------------------------------
|
||||
=head2 getValueFromPost ( )
|
||||
|
||||
Retrieves a value from a form GET or POST and returns it. If the value comes back as undef, this method will return the defaultValue instead. Strip newlines/carriage returns from the value.
|
||||
|
|
@ -92,40 +217,15 @@ Retrieves a value from a form GET or POST and returns it. If the value comes bac
|
|||
|
||||
sub getValueFromPost {
|
||||
my $self = shift;
|
||||
my $formValue = $self->session->form->param($self->get("name")) if ($self->session->request);
|
||||
if (defined $formValue && $formValue =~ m/^[a-f0-9]{2}$/) {
|
||||
return $formValue;
|
||||
} else {
|
||||
return $self->{defaultValue};
|
||||
}
|
||||
}
|
||||
|
||||
#-------------------------------------------------------------------
|
||||
|
||||
=head2 toHtml ( )
|
||||
|
||||
Renders an input tag of type text.
|
||||
|
||||
=cut
|
||||
|
||||
sub toHtml {
|
||||
my $self = shift;
|
||||
$self->session->style->setScript($self->session->url->extras("slider/js/range.js"), {type=>"text/javascript"});
|
||||
$self->session->style->setScript($self->session->url->extras("slider/js/timer.js"), {type=>"text/javascript"});
|
||||
$self->session->style->setScript($self->session->url->extras("slider/js/slider.js"), {type=>"text/javascript"});
|
||||
$self->session->style->setLink($self->session->url->extras("slider/css/bluecurve/bluecurve.css"), {rel=>"stylesheet", type=>"text/css"});
|
||||
my $output = '<div class="slider" id="'.$self->get('id').'" '.$self->get("extras").' tabindex="1">
|
||||
<input class="slider-input" id="'.$self->get('id').'-input" name="'.$self->get("name").'" value="'.$self->get("value").'" />
|
||||
</div><script type="text/javascript">
|
||||
var sliderEl = document.getElementById ? document.getElementById("'.$self->get('id').'") : null;
|
||||
var inputEl = document.forms[0]["'.$self->get('id').'-input"];
|
||||
var s = new Slider(sliderEl, inputEl);
|
||||
/* s.setMaximum('.$self->get("maximum").');
|
||||
s.setMinimum('.$self->get("minimum").');
|
||||
s.setValue('.$self->get("value").'); */
|
||||
</script>';
|
||||
return $output;
|
||||
my $properties = {
|
||||
name => $self->get('name'),
|
||||
value => $self->get('value'),
|
||||
size => $self->get('size'),
|
||||
id => 'view-'.$self->get('id'),
|
||||
};
|
||||
|
||||
return WebGUI::Form::hexadecimal->new($self->session, $properties)->getValueFromPost;
|
||||
}
|
||||
|
||||
1;
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue