new ValueLabel(id, description, units, unitsPosition, formatNumbers, style, initialValue)
Label that displays value description, value itself and measurement units.
For example, when given "Wall width" as description, "10" as value and "m" as measurement units, it will output text like:
Wall width: 10 m
- when unitsPosition set to "value"
or
Wall width (m): 10
- When unitsPosition set to "description"
This widget is useful for displaying formatted values, but working with actual values, i.e. L.ALS.Widgets.ValueLabel#getValue
will return an actual number that you've set.
Parameters:
Name | Type | Description |
---|---|---|
id |
string | ID of this label |
description |
string | Value description. Pass locale property to localize it. |
units |
string | Units for this label. If set to empty string, unitsPosition won't take an effect. |
unitsPosition |
"description" | "value" | Units position. If set to "description", units will be displayed after description. Otherwise, units will be displayed after the value. |
formatNumbers |
boolean | If set to true, value will be formatted using |
style |
"nostyle" | "message" | "success" | "warning" | "error" | Style of this label |
initialValue |
string | Initial value of this label |
Extends
Members
-
<protected> constructorArguments :Array.<any>
-
Contains arguments passed to this constructor
Type:
- Array.<any>
- Inherited From:
-
<protected> container :HTMLDivElement
-
Container of this widget
Type:
- HTMLDivElement
- Inherited From:
-
<protected> containerForRevertButton :Element
-
Container to place revert button to. Used by the settings.
Type:
- Element
- Inherited From:
-
<protected, readonly> customContainerClassName
-
Custom classname for a widget container.
- Inherited From:
-
<protected, readonly> customWrapperClassName
-
Custom classname for an input wrapper. Alternative to setting classname at
L.ALS.Widgets.BaseWidget#createContainer
manually.- Inherited From:
-
<readonly> id
-
This widget's ID
- Inherited From:
-
<protected> input :HTMLElement
-
Input element controlled by this widget
Type:
- HTMLElement
- Inherited From:
-
<protected> serializationIgnoreList :Array.<string>
-
Contains properties that won't be serialized. Append your properties at the constructor.
Type:
- Array.<string>
- Inherited From:
-
<readonly> undoable
-
Indicates whether this widget can revert back to its default value. If this widget is undoable, an undo button will be appended to it at settings window.
- Inherited From:
- Overrides:
-
wrapLabel
-
Indicates whether this widgets label should be wrapped when it's too wide. Wrapping might affect how your widget displays. Test it with both short labels and long labels.
- Inherited From:
Methods
-
callCallback()
-
Calls callback attached to this widget
Warning: Callback will be called only when widget will be added to the widgetable! Util that all calls will be paused.
- Inherited From:
Returns:
- Type
- VoidFunction
-
<protected> createContainer()
-
Creates container for this widget
- Inherited From:
Returns:
Container for this widget
- Type
- HTMLDivElement
-
<protected> createInput()
-
Creates input element. If you're creating different element, override createInputElement() instead of this.
- Inherited From:
Returns:
Input element
- Type
- HTMLElement
-
<protected> createInputElement()
-
Creates input element. You can also create non-input elements here.
Use it only to create input element. To add input element at
L.ALS.Widgets.BaseWidget#toHtmlElement
, useL.ALS.Widgets.BaseWidget#createInput
- Inherited From:
Returns:
Input element
- Type
- HTMLElement
-
<protected> createLabel()
-
Creates label for this widget
- Inherited From:
Returns:
Label
- Type
- HTMLLabelElement
-
getActualValue()
-
Returns:
Whole text of this label, i.e. result of
L.ALS.Widgets.SimpleLabel#getValue
- Type
- string
-
getDescription()
-
Returns:
Description of this label
- Type
- string
-
getEnabled()
-
- Inherited From:
Returns:
True, if this widget is enabled. False otherwise.
- Type
- boolean
-
getFormatNumbers()
-
Returns:
If true, this label automatically formats numbers.
- Type
- boolean
-
getLabelText()
-
- Inherited From:
Returns:
Text of the label of this widget or locale property (if set)
- Type
- string
-
getNumberOfDigitsAfterPoint()
-
Returns:
Number of digits after floating point to display or undefined, if not set
- Type
- number | undefined
-
getObjectToSerializeTo(newObject, seenObjects)
-
Registers this object for serialization and deserialization. Returns an object to serialize custom properties to.
Call it first, if you implement your own algrorithm, and serialize to the returned object!
Parameters:
Name Type Description newObject
Object Object to where you'll serialize
seenObjects
Object Already seen objects
- Inherited From:
Returns:
Object to serialize to.
- Type
- Object
-
getStyle()
-
- Inherited From:
Returns:
This label's current style.
- Type
- "nostyle" | "message" | "success" | "warning" | "error"
-
getTextAlign()
-
- Inherited From:
Returns:
This label's current text align
- Type
- "left" | "right" | "center" | "justify"
-
getUnits()
-
Returns:
Units set to this label
- Type
- string
-
getUnitsPosition()
-
Returns:
Units position of this label
- Type
- "description" | "value"
-
getValue()
-
- Overrides:
Returns:
Value of this label. It doesn't return the whole text! To get whole text, use
L.ALS.Widgets.ValueLabel#getActualValue
.- Type
- string | number
-
<protected> onChange(event)
-
Being called when user changes this widget. Override it to add your functionality like validation.
Default implementation just returns true.
Parameters:
Name Type Description event
Event Event fired by input
- Inherited From:
Returns:
If true, the attached callback will be called.
- Type
- boolean
-
serialize(seenObjects)
-
Serializes this object to JSON. If overridden, you MUST perform following operations before returning JSON:
let json = {} // Your JSON ... // Perform serialization json.constructorArguments = this.serializeConstrutorArguments(); // Serialize constructor arguments json.serializableClassName = this.serializableClassName; // Add class name to JSON return json; // Finally return JSON
Parameters:
Name Type Description seenObjects
Object Already seen objects
- Inherited From:
Returns:
This serialized object
- Type
- Object
-
serializeConstructorArguments()
-
Serializes constructor arguments. If your constructor is not empty, result of this method MUST be added to json at
L.ALS.Serializable#serialize
as "_construtorArgs" property.Deprecated in favor of
L.ALS.Serializable#getObjectFromSerialized
which uses this function under-the-hood.- Inherited From:
- Deprecated:
-
- Yes
Returns:
Serialized constructor arguments
- Type
- Array
-
setConstructorArguments(args)
-
Sets constructor arguments for serialization
Parameters:
Name Type Description args
Arguments to set
- Inherited From:
-
setDescription(description)
-
Sets description of this label
Parameters:
Name Type Description description
string Value description. Pass locale property to localize it.
Returns:
This
-
setEnabled(isEnabled)
-
Sets whether this widget should be enabled or not
Parameters:
Name Type Description isEnabled
boolean - Inherited From:
Returns:
This
-
setFormatNumbers(formatNumbers)
-
Sets whether this label will automatically format numbers using
L.ALS.Helpers.formatNumber
Parameters:
Name Type Description formatNumbers
boolean If true, this label will automatically format numbers.
Returns:
This
-
setLabelText(text)
-
Sets label text
Parameters:
Name Type Description text
string Text to set. Pass locale property to localize the label.
- Inherited From:
Returns:
This
-
setNumberOfDigitsAfterPoint(number)
-
Sets number of digits after floating point to display. Doesn't depend on
L.ALS.Widgets.ValueLabel#setFormatNumbers
.Parameters:
Name Type Description number
number | undefined Number of digits. Pass undefined to output all numbers.
Returns:
This
-
setStyle(style)
-
Sets style of this label
Parameters:
Name Type Description style
"nostyle" | "message" | "success" | "warning" | "error" Style to set
- Inherited From:
Returns:
This
-
setTextAlign(textAlign)
-
Parameters:
Name Type Description textAlign
"left" | "right" | "center" | "justify" Text align
- Inherited From:
Returns:
This
-
setUnits(units)
-
Sets units for this label
Parameters:
Name Type Description units
string Units to set
Returns:
This
-
setUnitsPosition(position)
-
Sets units position.
Parameters:
Name Type Description position
"description" | "value" Units position. If set to "description", units will be displayed after description. Otherwise, units will be displayed after the value.
Returns:
This
-
setValue(value)
-
Sets value of this label. It's not an alias for
L.ALS.Widgets.SimpleLabel#setValue
! There's no alias for this method.Parameters:
Name Type Description value
string | number Value to set. If value is a string, this widget will try to format it as a number and, if fails, will set it as is.
- Overrides:
Returns:
This
-
shouldIgnoreEvent(event)
-
Whether ALS should ignore given event. If returns true, both
L.ALS.Widgets.BaseWidget#onChange
and (L.ALS.Widgets.BaseWidget#callCallback
) won't be called, and none of the input's attributes will change.event.preventDefault()
won't be called though.Useful for precise control over your widget's behavior. For example, if your widget doesn't behave correctly when working with keyboard, here you can detect which actions shouldn't affect your widget.
You can also use
event.preventDefault()
here.Parameters:
Name Type Description event
Event Event that should be passed or ignored.
- Inherited From:
Returns:
True, if event should be skipped.
- Type
- boolean
-
<protected> toHtmlElement()
-
Builds this widget, i.e. creates container and puts label and input here.
Default implementation is:
let container = this.createContainer(); container.appendChild(this.createLabel()); container.appendChild(this.createInput()); return container;
- Inherited From:
Returns:
HTML representation of this widget
- Type
- HTMLDivElement