SliderTitle prototype for Tiny Mobile Widgets

Title which include arrows to slide content. Routed to SliderTitle, elements slide horizontally from one border of the screen to another. The content to slide horizontally should be declared in the parent scene (that declares SliderTitle). Translation animation is done in the parent scene thanks to eventOut parameters from SliderTitle : contentInPos and contentOutPos.

PROTO SliderTitle [
    field MFString title [""]
    field SFVec2f offset 0 0
    field SFBool loop TRUE
    
    exposedField SFInt32 nbElements 0
    exposedField SFInt32 currentElement 0
    exposedField SFBool enable TRUE
    exposedField SFVec2f size 128 16
    
    eventOut SFVec2f contentInPos
    eventOut SFVec2f contentOutPos
    eventOut SFInt32 endMove
    eventOut SFInt32 startMove
]

Data fields

SFVec2f offset - Position of the SliderTitle
MFString title - The text to display
SFBool loop - When slidertitle displays the last element : if user press right arrow goes to the first element (as a circle). Same for first element to last element with left key.
SFInt32 nbElements - Number of elements (number of characters of the string)
SFInt32 currentElement - Current element (in the string)
SFVec2f size - Size of the display area

Control fields

SFBool enable - Enable/disable slider
SFVec2f contentInPos - Content which appears on screen (eventOut)/li>
SFVec2f contentOutPos - Content which disappear from the screen(eventOut)
SFInt32 endMove - Finish animation event (eventOut)
SFInt32 startMove - Start animation event (eventOut)

EXTERNPROTO TextField [] "Ticker.wrl"
EXTERNPROTO SizeNotifier [] "SizeNotifier.wrl"

Group {
  children [
    DEF SIZE_NOTIFIER SizeNotifier {}
    
    Shape {
      appearance Appearance {
        material Material2D { emissiveColor 1 1 1 }
      }
      geometry DEF BACKGROUND Rectangle {
        size 10 10
      }
    }
	
    DEF CONTENT_REF_TRS Transform2D {
		translation 0 12
		children [
			#Main content
			DEF CONTENT_TRS Transform2D {
				children [
					DEF CONTENT ScrollableText {
						content ["monday"]
						enabled TRUE
						size 128 100
					}
				]
			}
        
			#Main content clone, use to implement sliding effect for sliderTitle element. 
			DEF TMPCONTENT_TRS Transform2D {
				translation -128 0
				children [
					DEF TMPCONTENT ScrollableText {
						content ["sunday"]
						enabled TRUE
						size 128 100
					}
				]
			}
		]
	}
    DEF SLIDERTITLE_TRS Transform2D {
		translation 0 -48
		children [
			#Slider title definition, use to scroll left/right. Background size is 200% compare to original size
			DEF SLIDERTITLE SliderTitle { size 128 24 }
		]
	}
	DEF SCRIPT Script {
		eventIn SFVec2f screenSize
		eventIn SFInt32 setText
        eventIn SFInt32 setTmpText
		field SFNode sliderTitle USE SLIDERTITLE
		field SFNode sliderTitleTrs USE SLIDERTITLE_TRS
		field SFNode content USE CONTENT
		field SFNode tmpContent USE TMPCONTENT
		field MFString names[ "monday" "tuesday" "wednesday" "thursday" "friday" "saturday" "sunday"]
	
		url "javascript:
		function initialize() {
            Browser.sendMessage('Board', 'INIT', 'title', '', 'close');
            screenSize ();
			//Set number of elements displayed for sliderTitle
            sliderTitle.nbElements = 7;
            // changing slider title
            setText(0);
                
            sliderTitle.currentElement = 0;
            sliderTitle.enable = true;
        }
		
		function screenSize () {
            slidertitle.size.y = String.height(fs) * 2;
            if (Browser.getWidth() > 128) {
                slidertitle.size.x = Browser.getIntCooky('widgetWidth');
            }
            var h = Browser.getIntCooky('widgetHeight');
            content.size.y = h - slidertitle.size.y;
            sliderTitleTrs.translation.y = Math.floor(content.size.y/-2);
        }
		
		//loading text data for main content
        function setText(n) {
            content.string[0] = tmpcontent.string[0];
        }
        
        //Set temporary text for scrolling effect
        function setTmpText(n) {
            //Browser.print('setTmpText : '+names[n]);
            tmpcontent.string[0] = names[n];
        }
	}
	
	ROUTE SLIDERTITLE.contentOutPos TO CONTENT_TRS.translation
	ROUTE SLIDERTITLE.contentInPos TO TMPCONTENT_TRS.translation
	ROUTE SLIDERTITLE.endMove TO SCRIPT.setText
	ROUTE SLIDERTITLE.startMove TO SCRIPT.setTmpText

	ROUTE SIZE_NOTIFIER.screenSize TO SCRIPT.screenSize
    ROUTE SIZE_NOTIFIER.screenSize TO BACKGROUND.size
  ]
}