#jquery-segmented-picker ##Description This plugin is simply wrapper for text input to become picker for any format you wish. It is meant to be simple and to look simple while giving you some control over what user writes.

The main idea in it is to avoid showing complicated popups while there is possibility to use keyboard only. That way you can incorporate it in any more complex forms without worrying about complicating layout further.

We will use it mainly as simple time picker, time duration picker and maybe as currency picker.

##Disclaimer

• This plugin is nowhere near ready.
• It is full of nasty insects.
• Button positioning may not work in some cases.

We are sharing it simply to let others use it and gather feedback if anyone would like to share one. If you have any idea, please share it with me or fork the stuff and come back with pull request.

##Usage:

$('input').segmentPicker({
    segments: [ segment, segment, ... ],
    onIncrement: function(newVal, oldVal, segments, segmentIdx){ ... },
    onDecrement: function(newVal, oldVal, segments, segmentIdx){ ... }
})

Parameters:

Name	Description
segments	An array of segment definitions (see segment types below)
onIncrement	Callback for incrementing action. It is quite useful when you want to change another segment on value change (see 12h time picker example)
onDecrement	Callback for decrementing action. It is quite useful when you want to change another segment on value change (see 12h time picker example)

Possible segments:

Segment type	Expected parameter	Description	Example
Numeric	Object {min:min, max:max}	This segment will try to provide simple numeric spinner functionality on given segment	{min:1, max:12} - definition for hours in 12h format
Separator	String "separator"	This segment is inactive for editing and will act simply as decoration for format	"km/h " - units are nice example of decorators
Enum	Array [Enum1, Enum2 ... ]	This will act as very simple picker for already defined set of values	["am", "pm"] - am/pm format

##Usage examples:

simple floating point speed picker:

$('input').segmentPicker({
    segments: [{min: 0, max: 999}, ".", {min: 0, max: 99}, " km/h"]
})

more advanced 12h time format picker:

$('inut').segmentPicker({
    segments: [{min: 1, max: 12}, ":", {min: 0, max: 59}, " ", ["am", "pm"]],
    onIncrement: function(newVal, oldVal, segments, selectedSegment)
    {
        if(selectedSegment == 0 && oldVal == "11" && newVal == "12")
            segments[4].increment();
        else if(selectedSegment == 2 && oldVal == "59" && newVal == "00")
            segments[0].increment()
    },
    onDecrement: function(newVal, oldVal, segments, selectedSegment){
        if(selectedSegment == 0 && oldVal == "12" && newVal == "11")
            segments[4].decrement();
        else if(selectedSegment == 2 && oldVal == "00" && newVal == "59")
            segments[0].decrement()
    }
});