Adding sliders
This commit is contained in:
Martin Kamerbeek
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;
|
||||
|
||||
|
|
|
|||
125
lib/WebGUI/Form/Hexadecimal.pm
Normal file
125
lib/WebGUI/Form/Hexadecimal.pm
Normal file
|
|
@ -0,0 +1,125 @@
|
|||
package WebGUI::Form::Hexadecimal;
|
||||
|
||||
=head1 LEGAL
|
||||
|
||||
-------------------------------------------------------------------
|
||||
WebGUI is Copyright 2001-2006 Plain Black Corporation.
|
||||
-------------------------------------------------------------------
|
||||
Please read the legal notices (docs/legal.txt) and the license
|
||||
(docs/license.txt) that came with this distribution before using
|
||||
this software.
|
||||
-------------------------------------------------------------------
|
||||
http://www.plainblack.com info@plainblack.com
|
||||
-------------------------------------------------------------------
|
||||
|
||||
=cut
|
||||
|
||||
use strict;
|
||||
use base 'WebGUI::Form::Text';
|
||||
use WebGUI::International;
|
||||
|
||||
=head1 NAME
|
||||
|
||||
Package WebGUI::Form::Integer
|
||||
|
||||
=head1 DESCRIPTION
|
||||
|
||||
Creates an input field that accepts positive and negative integer.
|
||||
|
||||
=head1 SEE ALSO
|
||||
|
||||
This is a subclass of WebGUI::Form::Text.
|
||||
|
||||
=head1 METHODS
|
||||
|
||||
The following methods are specifically available from this class. Check the superclass for additional methods.
|
||||
|
||||
=cut
|
||||
|
||||
#-------------------------------------------------------------------
|
||||
|
||||
=head2 definition ( [ additionalTerms ] )
|
||||
|
||||
See the superclass for additional details.
|
||||
|
||||
=head3 additionalTerms
|
||||
|
||||
The following additional parameters have been added via this sub class.
|
||||
|
||||
=head4 maxlength
|
||||
|
||||
Defaults to 11. Determines the maximum number of characters allowed in this field.
|
||||
|
||||
=head4 defaultValue
|
||||
|
||||
Defaults to 0. Used if no value is specified.
|
||||
|
||||
=head4 size
|
||||
|
||||
Defaults to 11. The number of characters that will be displayed at once in this field. Usually no need to override the default.
|
||||
|
||||
=head4 profileEnabled
|
||||
|
||||
Flag that tells the User Profile system that this is a valid form element in a User Profile
|
||||
|
||||
=cut
|
||||
|
||||
sub definition {
|
||||
my $class = shift;
|
||||
my $session = shift;
|
||||
my $definition = shift || [];
|
||||
my $i18n = WebGUI::International->new($session);
|
||||
push(@{$definition}, {
|
||||
formName=>{
|
||||
defaultValue=>$i18n->get("hexadecimal")
|
||||
},
|
||||
maxlength=>{
|
||||
defaultValue=> 11
|
||||
},
|
||||
defaultValue=>{
|
||||
defaultValue=>0
|
||||
},
|
||||
size=>{
|
||||
defaultValue=>11
|
||||
},
|
||||
profileEnabled=>{
|
||||
defaultValue=>1
|
||||
},
|
||||
});
|
||||
return $class->SUPER::definition($session, $definition);
|
||||
}
|
||||
|
||||
#-------------------------------------------------------------------
|
||||
|
||||
=head2 getValueFromPost ( )
|
||||
|
||||
Returns the integer from the form post, or returns 0 if the post result is invalid.
|
||||
|
||||
=cut
|
||||
|
||||
sub getValueFromPost {
|
||||
my $self = shift;
|
||||
my $value = $self->session->form->param($self->get("name"));
|
||||
if ($value =~ /^[0-9a-f]+$/i) {
|
||||
return $value;
|
||||
}
|
||||
return 0;
|
||||
}
|
||||
|
||||
#-------------------------------------------------------------------
|
||||
|
||||
=head2 toHtml ( )
|
||||
|
||||
Renders an integer field.
|
||||
|
||||
=cut
|
||||
|
||||
sub toHtml {
|
||||
my $self = shift;
|
||||
$self->session->style->setScript($self->session->url->extras('inputCheck.js'),{ type=>'text/javascript' });
|
||||
$self->set("extras", $self->get('extras') . ' onkeyup="doInputCheck(document.getElementById(\''.$self->get("id").'\'),\'0123456789abcdef\')"');
|
||||
return $self->SUPER::toHtml;
|
||||
}
|
||||
|
||||
1;
|
||||
|
||||
147
lib/WebGUI/Form/IntSlider.pm
Normal file
147
lib/WebGUI/Form/IntSlider.pm
Normal file
|
|
@ -0,0 +1,147 @@
|
|||
package WebGUI::Form::IntSlider;
|
||||
|
||||
=head1 LEGAL
|
||||
|
||||
-------------------------------------------------------------------
|
||||
WebGUI is Copyright 2001-2006 Plain Black Corporation.
|
||||
-------------------------------------------------------------------
|
||||
Please read the legal notices (docs/legal.txt) and the license
|
||||
(docs/license.txt) that came with this distribution before using
|
||||
this software.
|
||||
-------------------------------------------------------------------
|
||||
http://www.plainblack.com info@plainblack.com
|
||||
-------------------------------------------------------------------
|
||||
|
||||
=cut
|
||||
|
||||
use strict;
|
||||
use base 'WebGUI::Form::Slider';
|
||||
use WebGUI::International;
|
||||
|
||||
=head1 NAME
|
||||
|
||||
Package WebGUI::Form::IntSlider
|
||||
|
||||
=head1 DESCRIPTION
|
||||
|
||||
Creates a slider control that controls integer values.
|
||||
|
||||
=head1 SEE ALSO
|
||||
|
||||
This is a subclass of WebGUI::Form::Slider.
|
||||
|
||||
=head1 METHODS
|
||||
|
||||
The following methods are specifically available from this class. Check the superclass for additional methods.
|
||||
|
||||
=cut
|
||||
|
||||
#-------------------------------------------------------------------
|
||||
|
||||
=head2 definition ( [ additionalTerms ] )
|
||||
|
||||
See the super class for additional details.
|
||||
|
||||
=head3 additionalTerms
|
||||
|
||||
The following additional parameters have been added via this sub class.
|
||||
|
||||
=head4 size
|
||||
|
||||
The length of the input box.
|
||||
|
||||
=head4 profileEnabled
|
||||
|
||||
Flag that tells the User Profile system that this is a valid form element in a User Profile
|
||||
|
||||
=cut
|
||||
|
||||
sub definition {
|
||||
my $class = shift;
|
||||
my $session = shift;
|
||||
my $definition = shift || [];
|
||||
my $i18n = WebGUI::International->new($session);
|
||||
push(@{$definition}, {
|
||||
formName=>{
|
||||
defaultValue=> $i18n->get("int slider")
|
||||
},
|
||||
size=>{
|
||||
defaultValue=> "3",
|
||||
},
|
||||
profileEnabled=>{
|
||||
defaultValue=>1
|
||||
},
|
||||
});
|
||||
return $class->SUPER::definition($session, $definition);
|
||||
}
|
||||
|
||||
#-------------------------------------------------------------------
|
||||
=head2 getInputElement
|
||||
|
||||
Returns the form element used for manual input.
|
||||
|
||||
=cut
|
||||
|
||||
sub getInputElement {
|
||||
my $self = shift;
|
||||
|
||||
return WebGUI::Form::integer($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;
|
||||
|
||||
return $self->getSliderVariable.'.setValue(parseInt(this.value));'.
|
||||
$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;
|
||||
|
||||
return $self->getInputVariable.'.value = this.getValue();'.
|
||||
$self->getDisplayVariable.'.innerHTML = this.getValue();';
|
||||
}
|
||||
|
||||
#-------------------------------------------------------------------
|
||||
|
||||
=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.
|
||||
|
||||
=cut
|
||||
|
||||
sub getValueFromPost {
|
||||
my $self = shift;
|
||||
|
||||
my $properties = {
|
||||
name => $self->get('name'),
|
||||
value => $self->get('value'),
|
||||
size => $self->get('size'),
|
||||
id => 'view-'.$self->get('id'),
|
||||
};
|
||||
|
||||
return WebGUI::Form::integer->new($self->session, $properties)->getValueFromPost;
|
||||
}
|
||||
|
||||
1;
|
||||
|
||||
195
lib/WebGUI/Form/SelectSlider.pm
Normal file
195
lib/WebGUI/Form/SelectSlider.pm
Normal file
|
|
@ -0,0 +1,195 @@
|
|||
package WebGUI::Form::SelectSlider;
|
||||
|
||||
=head1 LEGAL
|
||||
|
||||
-------------------------------------------------------------------
|
||||
WebGUI is Copyright 2001-2006 Plain Black Corporation.
|
||||
-------------------------------------------------------------------
|
||||
Please read the legal notices (docs/legal.txt) and the license
|
||||
(docs/license.txt) that came with this distribution before using
|
||||
this software.
|
||||
-------------------------------------------------------------------
|
||||
http://www.plainblack.com info@plainblack.com
|
||||
-------------------------------------------------------------------
|
||||
|
||||
=cut
|
||||
|
||||
use strict;
|
||||
use base 'WebGUI::Form::Slider';
|
||||
use WebGUI::International;
|
||||
|
||||
=head1 NAME
|
||||
|
||||
Package WebGUI::Form::HexSlider
|
||||
|
||||
=head1 DESCRIPTION
|
||||
|
||||
Creates a slider control that controls hex values, as in the red, gree, blue values for HTML colors.
|
||||
|
||||
=head1 SEE ALSO
|
||||
|
||||
This is a subclass of WebGUI::Form::Control.
|
||||
|
||||
=head1 METHODS
|
||||
|
||||
The following methods are specifically available from this class. Check the superclass for additional methods.
|
||||
|
||||
=cut
|
||||
|
||||
sub definition {
|
||||
my $class = shift;
|
||||
my $session = shift;
|
||||
my $definition = shift || [];
|
||||
my $i18n = WebGUI::International->new($session);
|
||||
push(@{$definition}, {
|
||||
formName=>{
|
||||
defaultValue=> $i18n->get("select slider")
|
||||
},
|
||||
options =>{
|
||||
defaultValue=>{},
|
||||
},
|
||||
value =>{
|
||||
defaultValue=>[],
|
||||
},
|
||||
profileEnabled=>{
|
||||
defaultValue=>1
|
||||
},
|
||||
});
|
||||
return $class->SUPER::definition($session, $definition);
|
||||
}
|
||||
|
||||
#-------------------------------------------------------------------
|
||||
=head2 getDisplayValue
|
||||
|
||||
Returns the value that should be displayed initially.
|
||||
|
||||
=cut
|
||||
|
||||
sub getDisplayValue {
|
||||
my $self = shift;
|
||||
|
||||
return $self->get('options')->{$self->get('value')->[0]};
|
||||
}
|
||||
|
||||
#-------------------------------------------------------------------
|
||||
=head2 getInputElement
|
||||
|
||||
Returns the form element used for manual input.
|
||||
|
||||
=cut
|
||||
|
||||
sub getInputElement {
|
||||
my $self = shift;
|
||||
|
||||
return WebGUI::Form::selectList($self->session, {
|
||||
-name => $self->get('name'),
|
||||
-value => $self->get('value'),
|
||||
-options=> $self->get('options'),
|
||||
-id => 'view-'.$self->get('id'),
|
||||
-size => 1,
|
||||
});
|
||||
}
|
||||
|
||||
#-------------------------------------------------------------------
|
||||
=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;
|
||||
|
||||
return
|
||||
$self->getSliderVariable.'.setValue(this.selectedIndex);'.
|
||||
$self->getDisplayVariable.'.innerHTML = this.options[this.selectedIndex].text;';
|
||||
}
|
||||
|
||||
#-------------------------------------------------------------------
|
||||
=head2 getOnChangeSlider
|
||||
|
||||
Returns the javascript code to update the form on a change of slider position.
|
||||
|
||||
=cut
|
||||
|
||||
sub getOnChangeSlider {
|
||||
my $self = shift;
|
||||
|
||||
return
|
||||
$self->getInputVariable.'.selectedIndex = this.getValue();'.
|
||||
$self->getDisplayVariable.'.innerHTML = '.$self->getInputVariable.'.options[this.getValue()].text;';
|
||||
}
|
||||
|
||||
#-------------------------------------------------------------------
|
||||
=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 getSliderMinimum
|
||||
|
||||
Returns the minimum value the slider can be set to in slider units.
|
||||
|
||||
=cut
|
||||
|
||||
sub getSliderMinimum {
|
||||
my $self = shift;
|
||||
|
||||
return '0';
|
||||
}
|
||||
|
||||
#-------------------------------------------------------------------
|
||||
=head2 getSliderValue
|
||||
|
||||
Returns the initial position of the slider in slider units.
|
||||
|
||||
=cut
|
||||
|
||||
sub getSliderValue {
|
||||
my $self = shift;
|
||||
|
||||
my @keys = keys %{$self->get('options')};
|
||||
for (my $i = 0; $i < @keys; $i++) {
|
||||
return $i if $keys[$i] eq $self->get('value')->[0];
|
||||
}
|
||||
|
||||
return undef;
|
||||
}
|
||||
|
||||
#-------------------------------------------------------------------
|
||||
|
||||
=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.
|
||||
|
||||
=cut
|
||||
|
||||
sub getValueFromPost {
|
||||
my $self = shift;
|
||||
|
||||
my $properties = {
|
||||
-name => $self->get('name'),
|
||||
-value => $self->get('value'),
|
||||
-options=> $self->get('options'),
|
||||
-id => 'view-'.$self->get('id'),
|
||||
-size => 1,
|
||||
};
|
||||
|
||||
return WebGUI::Form::selectList->new($self->session, $properties)->getValueFromPost;
|
||||
}
|
||||
|
||||
|
||||
|
||||
1;
|
||||
|
||||
332
lib/WebGUI/Form/Slider.pm
Normal file
332
lib/WebGUI/Form/Slider.pm
Normal file
|
|
@ -0,0 +1,332 @@
|
|||
package WebGUI::Form::Slider;
|
||||
|
||||
=head1 LEGAL
|
||||
|
||||
-------------------------------------------------------------------
|
||||
WebGUI is Copyright 2001-2006 Plain Black Corporation.
|
||||
-------------------------------------------------------------------
|
||||
Please read the legal notices (docs/legal.txt) and the license
|
||||
(docs/license.txt) that came with this distribution before using
|
||||
this software.
|
||||
-------------------------------------------------------------------
|
||||
http://www.plainblack.com info@plainblack.com
|
||||
-------------------------------------------------------------------
|
||||
|
||||
=cut
|
||||
|
||||
use strict;
|
||||
use base 'WebGUI::Form::Control';
|
||||
use WebGUI::International;
|
||||
|
||||
=head1 NAME
|
||||
|
||||
Package WebGUI::Form::Slider
|
||||
|
||||
=head1 DESCRIPTION
|
||||
|
||||
Abstract base class for slider controls. It cannot be used just by itself.
|
||||
You must overload some of the methods.
|
||||
|
||||
=head1 SEE ALSO
|
||||
|
||||
This is a subclass of WebGUI::Form::Control.
|
||||
|
||||
=head1 METHODS
|
||||
|
||||
The following methods are specifically available from this class. Check the superclass for additional methods.
|
||||
|
||||
=cut
|
||||
|
||||
#-------------------------------------------------------------------
|
||||
|
||||
=head2 definition ( [ additionalTerms ] )
|
||||
|
||||
See the super class for additional details.
|
||||
|
||||
=head3 additionalTerms
|
||||
|
||||
The following additional parameters have been added via this sub class.
|
||||
|
||||
=head4 maximum
|
||||
|
||||
Defaults to "100". The maximum that the slider can go to.
|
||||
|
||||
=head4 minimum
|
||||
|
||||
Defaults to "0". The minimum value that the slider can go to.
|
||||
|
||||
=head4 editable
|
||||
|
||||
Defaults to 1. Setting this option to 0 will hide the input element tied to the
|
||||
slider.
|
||||
|
||||
=head4 profileEnabled
|
||||
|
||||
Flag that tells the User Profile system that this is a valid form element in a User Profile
|
||||
|
||||
=cut
|
||||
|
||||
sub definition {
|
||||
my $class = shift;
|
||||
my $session = shift;
|
||||
my $definition = shift || [];
|
||||
my $i18n = WebGUI::International->new($session);
|
||||
push(@{$definition}, {
|
||||
formName=>{
|
||||
defaultValue=> "No name",
|
||||
},
|
||||
maximum=>{
|
||||
defaultValue=> "100",
|
||||
},
|
||||
minimum=>{
|
||||
defaultValue=> "0",
|
||||
},
|
||||
editable=>{
|
||||
defaultValue=> "1",
|
||||
},
|
||||
profileEnabled=>{
|
||||
defaultValue=>0,
|
||||
},
|
||||
});
|
||||
return $class->SUPER::definition($session, $definition);
|
||||
}
|
||||
|
||||
#-------------------------------------------------------------------
|
||||
=head2 getDisplayValue
|
||||
|
||||
Returns the value that should be displayed initially.
|
||||
|
||||
=cut
|
||||
|
||||
sub getDisplayValue {
|
||||
my $self = shift;
|
||||
|
||||
return $self->get('value');
|
||||
}
|
||||
|
||||
#-------------------------------------------------------------------
|
||||
=head2 getDisplayVariable
|
||||
|
||||
Returns the javascript variable for the td element used for display of the
|
||||
slider value.
|
||||
|
||||
=cut
|
||||
|
||||
sub getDisplayVariable {
|
||||
my $self = shift;
|
||||
|
||||
my $uniqueness = $self->get('id');
|
||||
$uniqueness =~ s/-/\$/g;
|
||||
|
||||
return 'd_'.$uniqueness;
|
||||
}
|
||||
|
||||
#-------------------------------------------------------------------
|
||||
=head2 getInputElement
|
||||
|
||||
Returns the form element used for manual input. You must overload this method.
|
||||
|
||||
=cut
|
||||
|
||||
sub getInputElement {
|
||||
my $self = shift;
|
||||
|
||||
$self->session->errorHandler->fatal("Subclasses of WebGUI::Form::Session must overload getInputElement");
|
||||
}
|
||||
|
||||
#-------------------------------------------------------------------
|
||||
=head2 getInputVariable
|
||||
|
||||
Returns the javascript variable for the input element tied to the slider.
|
||||
|
||||
=cut
|
||||
|
||||
sub getInputVariable {
|
||||
my $self = shift;
|
||||
|
||||
my $uniqueness = $self->get('id');
|
||||
$uniqueness =~ s/-/\$/g;
|
||||
|
||||
return 'i_'.$uniqueness;
|
||||
}
|
||||
|
||||
#-------------------------------------------------------------------
|
||||
=head2 getOnChangeInputElement
|
||||
|
||||
This method should return the javascript code that should be executed on an
|
||||
onchange event of the input element. This should at the very least include
|
||||
updating the slider.
|
||||
|
||||
You must overload this method.
|
||||
|
||||
For examples see any WebGUI::Form object that in herits
|
||||
from this class. For instance WebGUI::Form::SelectSlider.
|
||||
|
||||
=cut
|
||||
|
||||
sub getOnChangeInputElement {
|
||||
my $self = shift;
|
||||
|
||||
$self->session->errorHandler->fatal("Subclasses of WebGUI::Form::Session must overload getOnChangeInputElement");
|
||||
}
|
||||
|
||||
#-------------------------------------------------------------------
|
||||
=head2 getOnChangeSlider
|
||||
|
||||
This method should return the javascript code that should be executed on an
|
||||
onchange event of the slider. This should at the very least include
|
||||
updating the input element and the display table cell.
|
||||
|
||||
You must overload this method.
|
||||
|
||||
For examples see any WebGUI::Form object that in herits
|
||||
from this class. For instance WebGUI::Form::SelectSlider.
|
||||
|
||||
=cut
|
||||
|
||||
sub getOnChangeSlider {
|
||||
my $self = shift;
|
||||
|
||||
$self->session->errorHandler->fatal("Subclasses of WebGUI::Form::Session must overload getOnChangeSlider");
|
||||
}
|
||||
|
||||
#-------------------------------------------------------------------
|
||||
=head2 getSliderMaximum
|
||||
|
||||
Returns the maximum value the slider can be set to in slider units.
|
||||
|
||||
=cut
|
||||
|
||||
sub getSliderMaximum {
|
||||
my $self = shift;
|
||||
|
||||
return $self->get('maximum');
|
||||
}
|
||||
|
||||
#-------------------------------------------------------------------
|
||||
=head2 getSliderMinimum
|
||||
|
||||
Returns the minimum value the slider can be set to in slider units.
|
||||
|
||||
=cut
|
||||
|
||||
sub getSliderMinimum {
|
||||
my $self = shift;
|
||||
|
||||
return $self->get('minimum');
|
||||
}
|
||||
|
||||
#-------------------------------------------------------------------
|
||||
=head2 getSliderValue
|
||||
|
||||
Returns the initial position of the slider in slider units.
|
||||
|
||||
=cut
|
||||
|
||||
sub getSliderValue {
|
||||
my $self = shift;
|
||||
|
||||
return $self->get('value');
|
||||
}
|
||||
|
||||
#-------------------------------------------------------------------
|
||||
=head2 getSliderVariable
|
||||
|
||||
Returns the javascript variable for the slider.
|
||||
|
||||
=cut
|
||||
|
||||
sub getSliderVariable {
|
||||
my $self = shift;
|
||||
|
||||
my $uniqueness = $self->get('id');
|
||||
$uniqueness =~ s/-/\$/g;
|
||||
|
||||
return 's_'.$uniqueness;
|
||||
}
|
||||
|
||||
#-------------------------------------------------------------------
|
||||
|
||||
=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"});
|
||||
|
||||
# We need to make the variables unique because javascript does not have block scope. Also js cannot
|
||||
# have dashes in identifiers, so we convert those to dollars, which are allowed in identifiers.
|
||||
my $uniqueness = $self->get('id');
|
||||
$uniqueness =~ s/-/\$/g;
|
||||
|
||||
my $output = '<table border="0"><tr>';
|
||||
|
||||
# Slider
|
||||
$output .= '<td><div class="slider" id="'.$self->get('id').'" '.$self->get("extras").' tabindex="1">';
|
||||
$output .= WebGUI::Form::hidden($self->session, {
|
||||
-name => 'slider-'.$self->get('name'),
|
||||
-value => $self->get('value'),
|
||||
-id => $self->get('id').'-input',
|
||||
-extras => 'class="slider-input"',
|
||||
});
|
||||
$output .= '</div></td>';
|
||||
|
||||
if ($self->get('editable')) {
|
||||
# Form element
|
||||
$output .= '<td>'.$self->getInputElement.'</td>';
|
||||
|
||||
# Display box
|
||||
$output .= '<td style="display : none;" id="text-'.$self->get('id').'">';
|
||||
$output .= $self->getDisplayValue;
|
||||
$output .= '</td>';
|
||||
} else {
|
||||
# Form element
|
||||
$output .= '<td style="display : none;">'.$self->getInputElement.'</td>';
|
||||
|
||||
# Display box
|
||||
$output .= '<td id="text-'.$self->get('id').'">';
|
||||
$output .= $self->getDisplayValue;
|
||||
$output .= '</td>';
|
||||
}
|
||||
|
||||
$output .= '</tr></table>';
|
||||
|
||||
# Javascript
|
||||
my $input = $self->getInputVariable;
|
||||
my $display = $self->getDisplayVariable;
|
||||
my $slider = $self->getSliderVariable;
|
||||
my $id = $self->get('id');
|
||||
|
||||
$output .= '<script type="text/javascript">';
|
||||
$output .= qq|
|
||||
var $input = document.getElementById('view-$id');
|
||||
var $display = document.getElementById('text-$id');
|
||||
var sliderEl_$uniqueness = document.getElementById ? document.getElementById('$id') : null;
|
||||
var inputEl_$uniqueness = document.forms[0]['$id-input'];
|
||||
var $slider = new Slider(sliderEl_$uniqueness, inputEl_$uniqueness);
|
||||
|
||||
$slider.setMaximum('|.$self->getSliderMaximum.qq|');
|
||||
$slider.setMinimum('|.$self->getSliderMinimum.qq|');
|
||||
$slider.setValue('|.$self->getSliderValue.qq|');
|
||||
|
||||
$slider.onchange = function () {|.
|
||||
$self->getOnChangeSlider.qq|;
|
||||
};
|
||||
|
||||
$input.onchange = function () {|.
|
||||
$self->getOnChangeInputElement.qq|;
|
||||
};
|
||||
|;
|
||||
$output .= '</script>';
|
||||
|
||||
return $output;
|
||||
}
|
||||
|
||||
1;
|
||||
|
||||
|
|
@ -5,6 +5,7 @@ use WebGUI::Image::Palette;
|
|||
use WebGUI::Image::Color;
|
||||
use WebGUI::Image::Font;
|
||||
use WebGUI::Storage;
|
||||
use Tie::IxHash;
|
||||
|
||||
#-------------------------------------------------------------------
|
||||
sub _submenu {
|
||||
|
|
@ -30,7 +31,7 @@ sub _submenu {
|
|||
#### hoverhelp
|
||||
#-------------------------------------------------------------------
|
||||
sub _getColorForm {
|
||||
my ($f, $color);
|
||||
my ($f, $color, %hoppa);
|
||||
my $session = shift;
|
||||
my $colorId = shift;
|
||||
|
||||
|
|
@ -38,6 +39,14 @@ sub _getColorForm {
|
|||
|
||||
$color = WebGUI::Image::Color->new($session, $colorId);
|
||||
|
||||
# Create transparencies in 5% increments
|
||||
tie %hoppa, 'Tie::IxHash';
|
||||
$hoppa{'00'} = 'Opaque';
|
||||
for (1 .. 19) {
|
||||
$hoppa{unpack('H*', pack('C', $_*255/20))} = 5*$_.'% Transparent';
|
||||
}
|
||||
$hoppa{'ff'} = 'Invisible';
|
||||
|
||||
my $f = WebGUI::HTMLForm->new($session);
|
||||
$f->text(
|
||||
-name => 'colorName',
|
||||
|
|
@ -51,11 +60,13 @@ sub _getColorForm {
|
|||
-maxlength => 7,
|
||||
-size => 7,
|
||||
);
|
||||
$f->hexSlider(
|
||||
$f->selectSlider(
|
||||
-name => 'fillAlpha',
|
||||
-value => $color->getFillAlpha,
|
||||
-value => [ $color->getFillAlpha ],
|
||||
-options=> \%hoppa,
|
||||
-label => $i18n->get('fill alpha'),
|
||||
-maxlength => 2,
|
||||
-editable=>0,
|
||||
-size => 2,
|
||||
);
|
||||
$f->color(
|
||||
|
|
@ -65,11 +76,13 @@ sub _getColorForm {
|
|||
-maxlength => 7,
|
||||
-size => 7,
|
||||
);
|
||||
$f->text(
|
||||
$f->selectSlider(
|
||||
-name => 'strokeAlpha',
|
||||
-value => $color->getStrokeAlpha,
|
||||
-value => [ $color->getStrokeAlpha ],
|
||||
-options=> \%hoppa,
|
||||
-label => $i18n->get('stroke alpha'),
|
||||
-maxlength => 2,
|
||||
-editable => 0,
|
||||
-size => 2,
|
||||
);
|
||||
|
||||
|
|
|
|||
|
|
@ -3947,6 +3947,25 @@ Get a copy of wget and use this: <code>wget -p -r --html-extension -k http://the
|
|||
lastUpdated => 1145658316,
|
||||
},
|
||||
|
||||
'hex slider' => {
|
||||
message => q|Hex slider|,
|
||||
lastUpdated => 0,
|
||||
},
|
||||
|
||||
'int slider' => {
|
||||
message => q|Int slider|,
|
||||
lastUpdated => 0,
|
||||
},
|
||||
|
||||
'select slider' => {
|
||||
message => q|Select slider|,
|
||||
lastUpdated => 0,
|
||||
},
|
||||
|
||||
'hexadecimal' => {
|
||||
message => q|Hexadecimal|,
|
||||
lastUpdated => 0,
|
||||
},
|
||||
|
||||
};
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue