<component level='3' name='Navigation'/>
<meta name='title' content=' Web3dTimeline.x3d '/>
<meta name='info' content='Presenters can edit events under TimelineEventsGroup.'/>
<meta name='description' content='Time line of X3D history with a viewpoint for each milestone. Use PgDown and PgUp to look through each viewpoint. Clicking (selecting) text for any milestone binds that viewpoint, then returns to prior milestone when unclicked (deselected).'/>
<meta name='creator' content='Don Brutzman, Anita Havele, Johannes Behr, Byounghyun Yoo'/>
<meta name=' TODO ' content=' BS Contact BitManagement Bug Report, problem with .x3dv encoding http://www.bitmanagement.de/en/contact '/>
<meta name='created' content='28 July 2008'/>
<meta name='modified' content='20 October 2019'/>
<meta name='Image' content='Web3dTimelineEntryView.png' />
<meta name='Image' content='Web3dTimelinePanorama.png' />
<meta name='info' content='Point paper by Anita Havele and Don Brutzman'/>
<meta name='reference' content=' Declarative3dTimelineSceneUseCaseHaveleBrutzman.pdf '/>
<meta name='reference' content='Declarative3dTimelineSceneUseCaseHaveleBrutzman.doc'/>
<meta name='reference' content=' http://events.declarative3d.org/Dec3D2012 '/>
<meta name='info' content='Corresponding X3DOM translation by Nils Michaelis of Fraunhofer'/>
<meta name='reference' content=' http://examples.x3dom.org/x3dTimeLine '/>
<meta name='reference' content=' http://examples.x3dom.org/x3dTimeLine/timeline.js '/>
<meta name='reference' content=' http://examples.x3dom.org/x3dTimeLine/timeline.css '/>
<meta name='reference' content=' http://examples.x3dom.org/x3dTimeLine/timestamps.txt '/>
<meta name=' TODO ' content=' side by side scene and information page, as adjacent frames in HTML parent '/>
<meta name=' TODO ' content=' better images '/>
<meta name=' TODO ' content=' hidden attribute '/>
<meta name=' TODO ' content=' confirm dates and events '/>
<meta name='identifier' content=' https://www.web3d.org/x3d/content/examples/Basic/Web3dOutreach/Web3dTimeline.x3d '/>
<meta name='generator' content='X3D-Edit 3.3, https://savage.nps.edu/X3D-Edit'/>
<meta name='license' content=' ../license.html'/>

---

<!-- Event Graph ROUTE Table shows event connections -->
 
<!-- Index for DEF nodes: bt, EmptyNode, HideBackgroundTextTransform, HideSwitch, ImageCoordinate, ImageIFS, ImageTransform, InitialSetupAndPrototype, it0, it1, NameMaterial, OverviewViewpoint, proximity, RootTransform, Slide1_VRML1.0, Slide10_X3dVersion3.1, Slide11_X3dForWebAuthors, Slide12_X3dCompressedBinaryEncoding, Slide13_X3dEarth, Slide14_X3dVersion3.2, Slide15_DICOM, Slide16_X3DOM, Slide17_X3dAugmentedReality, Slide18_Declarative3D, Slide19_WWW2012, Slide2_VRML2.0, Slide3_VRML97, Slide4_MPEG-4, Slide5_X3dDesign, Slide6_X3dEncoding, Slide7_Web3DConsortium, Slide8_X3dStandard, Slide9_SceneAcessInterface, TimelineElementScript, TimelineElementSwitch, TimelineElementViewpoint, TimelineElementViewpointGroup, TimelineEventsGroup, TitleMaterial, TouchToView, TouchViewpointSelectBooleanFilter, trans_web3dlogo, TransparentTouchForNameTitleShape, Web3dLogoClock, Web3dLogoSpinner, Web3dLogoTransform

---

Index for Viewpoint nodes: Viewpoint_1, OverviewViewpoint, TimelineElementViewpoint

---

Index for ProtoDeclare definition: TimelineElement

---

<WorldInfo title='Web3D Timeline'/>
<Background groundColor='1 1 1' skyColor='1 1 1'/>
<DirectionalLight direction='0 -0.5 -1'/>
<Viewpoint DEF='OverviewViewpoint' description='Web3D Timeline' orientation='-0.33 0.94 0 0.4' position='18 8 21'/>
<!-- <Fog visibilityRange='2000'/> <Viewpoint DEF='vp2' description='Starting view' position='3 10 20'/> -->
<Group DEF='InitialSetupAndPrototype'>

<!-- floor -->
<Transform translation='0 0 -50'>

<Shape>

<Appearance>

<Material diffuseColor='1 1 1' emissiveColor='1 1 1'/>
<ImageTexture
  url=' "images/lines.png " "https://www.web3d.org/x3d/content/examples/Basic/Web3dOutreach/images/lines.png " ' />
<TextureTransform rotation='1.57'/>

</Appearance>
<Box size='125 0.01 125'/>

</Shape>

</Transform>
<ProtoDeclare name='TimelineElement'>

<ProtoInterface>

<field name='name' type='MFString' accessType='inputOutput'
 appinfo='Name for this timeline element' />
<field name='title' type='MFString' accessType='inputOutput'
 appinfo='Displayed title' />
<field name='description' type='SFString' accessType='inputOutput'
 appinfo='Viewpoint, Anchor description' />
<field name='hidden' type='SFBool' value='false' accessType='inputOutput'
 appinfo='Whether to hide this entry. TODO: is Viewpoint hidden also?' />
<field name='imageUrl' type='MFString' accessType='inputOutput'
 appinfo='"Link to display image"' />
<field name='soundUrl' type='MFString' accessType='inputOutput'
 appinfo='"Link to narrative"' />
<field name='referenceUrl' type='MFString' accessType='inputOutput'
 appinfo='"Link to reference, launched in separate frame"' />
<field name='imagePixelHeight' type='SFInt32' value='0' accessType='inputOutput'
 appinfo='author must initialize' />
<field name='imagePixelWidth' type='SFInt32' value='0' accessType='inputOutput'
 appinfo='author must initialize' />
<field name='translation' type='SFVec3f' value='0 0 0' accessType='inputOutput'
 appinfo='default value 0 0 0' />

</ProtoInterface>
<ProtoBody>

<Transform DEF='RootTransform'>

<IS>

<connect nodeField='translation' protoField='translation'/>

</IS>
<!-- TODO try to omit this viewpoint from scene's active list of viewpoints if hidden='true' -->
<Switch DEF='HideSwitch' whichChoice='0'>

<!-- ROUTE information for TimelineElementViewpointGroup node:  [from TimelineElementScript.displayViewpointGroup to displayed ] -->
<ViewpointGroup DEF='TimelineElementViewpointGroup' containerField='children'>

<!-- test ability to hide in BSContact -->

</ViewpointGroup>

</Switch>

<!-- ROUTE information for TimelineElementViewpoint node:  [from TouchViewpointSelectBooleanFilter.inputTrue to set_bind ] -->
<Viewpoint DEF='TimelineElementViewpoint' position='2 3 14'>

<IS>

<connect nodeField='description' protoField='description'/>

</IS>

</Viewpoint>

<!-- ROUTE information for proximity node:  [from isActive to it0.set_boolean ] [from exitTime to bt.set_triggerTime ] -->
<ProximitySensor DEF='proximity' center='0 0 12' size='40 40 13'/>

<Transform translation='-0.2 -0.3 0'>

<Shape>

<Appearance>

<Material DEF='NameMaterial' diffuseColor='0.619608 0.258824 0'/>

</Appearance>
<Text>

<IS>

<connect nodeField='string' protoField='name'/>

</IS>
<FontStyle family='"SANS"' justify='"END" "FIRST"' size='1.5' spacing='0.8'/>

</Text>

</Shape>

</Transform>
<Transform translation='0.2 0 0'>

<Shape>

<Appearance>

<Material DEF='TitleMaterial' diffuseColor='0 0.184314 0.658824'/>

</Appearance>
<Text>

<IS>

<connect nodeField='string' protoField='title'/>

</IS>
<FontStyle family='"SANS"' justify='"BEGIN" "FIRST"' size='0.9'/>

</Text>

</Shape>

</Transform>
<Group>

<!-- ROUTE information for TouchToView node:  [from isActive to TouchViewpointSelectBooleanFilter.set_boolean ] -->
<TouchSensor DEF='TouchToView' description='touch to view'/>

<!-- ROUTE information for TouchViewpointSelectBooleanFilter node:  [from TouchToView.isActive to set_boolean ] [from inputTrue to TimelineElementViewpoint.set_bind ] -->
<BooleanFilter DEF='TouchViewpointSelectBooleanFilter'/>

< ROUTE  fromNode=' TouchToView' fromField='isActive' toNode=' TouchViewpointSelectBooleanFilter' toField='set_boolean'/>
< ROUTE  fromNode=' TouchViewpointSelectBooleanFilter' fromField='inputTrue' toNode=' TimelineElementViewpoint' toField='set_bind'/>
<Shape DEF='TransparentTouchForNameTitleShape'>

<Box size='8 3 0.1'/>
<Appearance>

<Material transparency='1'/>

</Appearance>

</Shape>

</Group>

<!-- ROUTE information for TimelineElementSwitch node:  [from it0.triggerValue to whichChoice ] [from it1.triggerValue to whichChoice ] [from TimelineElementScript.hideSwitchChoice to whichChoice ] -->
<Switch DEF='TimelineElementSwitch' whichChoice='1'>

<Group>

<Transform DEF='HideBackgroundTextTransform' scale='12 8 0.01' translation='0 3.5 -0.5'>

<!-- Hide other TimeLineElement entries that are behind this one -->
<Shape>

<Appearance>

<Material diffuseColor='1 1 1'/>

</Appearance>
<!-- hide next entry, but try not to chop of dates from perspective view -->
<Box size='0.9 1 0.01'/>

</Shape>

</Transform>
<Transform DEF='ImageTransform' scale='8 8 0.01' translation='-4 1 0'>

<Anchor parameter='"target=Web3dTimelineReferenceFrame"'>

<IS>

<connect nodeField='url' protoField='referenceUrl'/>
<connect nodeField='description' protoField='description'/>

</IS>
<Shape>

<Appearance>

<Material diffuseColor='1 1 1' emissiveColor='1 1 1'/>
<ImageTexture>

<IS>

<connect nodeField='url' protoField='imageUrl'/>

</IS>

</ImageTexture>

</Appearance>
<IndexedFaceSet DEF='ImageIFS' solid='false' coordIndex='0 1 2 3 -1'>

<!-- ROUTE information for ImageCoordinate node:  [from TimelineElementScript.pointArray to point ] -->
<Coordinate DEF='ImageCoordinate'/>

<TextureCoordinate point='0 0 0 1 1 1 1 0'/>

</IndexedFaceSet>

</Shape>

</Anchor>

</Transform>

</Group>
<Group DEF='EmptyNode'/>

</Switch>

<!-- ROUTE information for bt node:  [from proximity.exitTime to set_triggerTime ] [from triggerTrue to it1.set_boolean ] -->
<BooleanTrigger DEF='bt'/>

<!-- ROUTE information for it0 node:  [from proximity.isActive to set_boolean ] [from triggerValue to TimelineElementSwitch.whichChoice ] -->
<IntegerTrigger DEF='it0' integerKey='0'/>

<!-- ROUTE information for it1 node:  [from bt.triggerTrue to set_boolean ] [from triggerValue to TimelineElementSwitch.whichChoice ] -->
<IntegerTrigger DEF='it1' integerKey='1'/>

< ROUTE  fromNode=' proximity' fromField='isActive' toNode=' it0' toField='set_boolean'/>
< ROUTE  fromNode=' it0' fromField='triggerValue' toNode=' TimelineElementSwitch' toField='whichChoice'/>
< ROUTE  fromNode=' proximity' fromField='exitTime' toNode=' bt' toField='set_triggerTime'/>
< ROUTE  fromNode=' bt' fromField='triggerTrue' toNode=' it1' toField='set_boolean'/>
< ROUTE  fromNode=' it1' fromField='triggerValue' toNode=' TimelineElementSwitch' toField='whichChoice'/>

</Transform>
<!-- This embedded Script computes and updates IFS/Coordinate geometry dimensions to match image size -->

<!-- ROUTE information for TimelineElementScript node:  [from pointArray to ImageCoordinate.point ] [from hideSwitchChoice to TimelineElementSwitch.whichChoice ] [from displayViewpointGroup to TimelineElementViewpointGroup.displayed ] -->
<Script DEF='TimelineElementScript'>

<field name='name' type='MFString' accessType='inputOutput'/>
<field name='imagePixelHeight' type='SFInt32' accessType='inputOutput'
 appinfo='default value 0' />
<field name='imagePixelWidth' type='SFInt32' accessType='inputOutput'
 appinfo='default value 0' />
<field name='hidden' type='SFBool' accessType='inputOutput'
 appinfo='Whether to hide this entry. TODO: is Viewpoint hidden also?' />
<field name='traceEnabled' type='SFBool' value='false' accessType='inputOutput'
 appinfo='debug trace to Browser output console' />
<field name='pointArray' type='MFVec3f' accessType='outputOnly'
 appinfo='compute scale based on image pixel height, width' />
<field name='hideSwitchChoice' type='SFInt32' accessType='outputOnly'
 appinfo='hide node if hidden' />
<field name='displayViewpointGroup' type='SFBool' accessType='outputOnly'
 appinfo='display Viewpoint if not hidden' />
<IS>

<connect nodeField='name' protoField='name'/>
<connect nodeField='imagePixelHeight' protoField='imagePixelHeight'/>
<connect nodeField='imagePixelWidth' protoField='imagePixelWidth'/>
<connect nodeField='hidden' protoField='hidden'/>

</IS>

            
ecmascript:

function initialize ()
{
    computePointArray ();
    
    hide ();

    tracePrint ('initialization() successful');
}
function computePointArray ()
{
    if ((imagePixelHeight <= 0) || (imagePixelWidth <= 0))
    {
        tracePrint ('cannot compute new scale, imagePixelHeight=' + imagePixelHeight.toString() + ', imagePixelWidth=' + imagePixelWidth.toString());
        return;
    }
    else if (imagePixelHeight < imagePixelWidth)
    {
        height = imagePixelHeight/imagePixelWidth;
        width  = 1.0;
    }
    else if (imagePixelHeight > imagePixelWidth)
    {
        height = 1.0;
        width  = imagePixelWidth/imagePixelHeight;
    }
    else // same
    {
        height = 1.0;
        width  = 1.0;
    }
    p0 = new SFVec3f (0.0,   0.0,    0.0);
    p1 = new SFVec3f (0.0,   height, 0.0);
    p2 = new SFVec3f (width, height, 0.0);
    p3 = new SFVec3f (width, 0.0,    0.0);
    pointArray = new MFVec3f (p0, p1, p2, p3);
    tracePrint ('computed new ImageCoordinate.point=' + pointArray.toString());
    
    if (hidden)
    {
        hideSwitchChoice = -1;
    }
}
function set_imagePixelHeight (eventValue)
{
    computePointArray ();
}
function set_imagePixelWidth (eventValue)
{
    computePointArray ();
}

function set_name (eventValue)
{
   // input eventValue received for inputOutput field
    name = eventValue;
}
function hide ()
{
    // input eventValue received for inputOutput field
    tracePrint ("set_hidden: hidden=" + hidden);
    if (hidden)
    {
         hideSwitchChoice      = -1;
         displayViewpointGroup = false;
    }
    else
    {
        hideSwitchChoice      = 0;
        displayViewpointGroup = true;
    }
}

function set_hidden (eventValue)
{
    hidden = eventValue;
    hide ();
}
// ================== Trace output functions ==================

function tracePrint (outputString)
{
   // if traceEnabled is true, print outputString on X3D browser console
   if (traceEnabled)
      Browser.println ('[TimelineElementScript ' + name.toString() + ': ' + outputString.toString() + ']');
}
function alwaysPrint (outputString)
{
      // always print outputString on X3D browser console
      Browser.println ('[TimelineElementScript ' + name.toString() + ': ' + outputString.toString() + ']');
}
function set_traceEnabled (eventValue)
{
      // input eventValue received for inputOutput field
      traceEnabled = eventValue;
}
// ===========================================================