{ "X3D": { "encoding":"UTF-8", "@profile":"Immersive", "@version":"3.3", "@xsd:noNamespaceSchemaLocation":"https://www.web3d.org/specifications/x3d-3.3.xsd", "JSON schema":"https://www.web3d.org/specifications/x3d-4.0-JSONSchema.autogenerated.json", "head": { "meta": [ { "@name":"title", "@content":"PushButtonPrototype.x3d" }, { "@name":"description", "@content":"PushButton widget prototype declaration, inner button and outer shape can be round or square" }, { "@name":"creator", "@content":"Don Brutzman, Murat Onder and MV4205 class, Spring 2004 Quarter" }, { "@name":"created", "@content":"11 May 2004" }, { "@name":"modified", "@content":"2 January 2025" }, { "@name":"reference", "@content":"PushButtonExample.x3d" }, { "@name":"identifier", "@content":"https://www.web3d.org/x3d/content/examples/Savage/Tools/Animation/PushButtonPrototype.x3d" }, { "@name":"generator", "@content":"X3D-Edit 4.0, https://www.web3d.org/x3d/tools/X3D-Edit" }, { "@name":"license", "@content":"../../license.html" }, { "@name":"translated", "@content":"26 March 2026" }, { "@name":"generator", "@content":"X3dToJson.xslt, https://www.web3d.org/x3d/stylesheets/X3dToJson.html" }, { "@name":"reference", "@content":"X3D JSON encoding: https://www.web3d.org/wiki/index.php/X3D_JSON_Encoding" } ] }, "Scene": { "-children":[ { "#comment":"Material Toggle Prototype is being used to be able to provide the color toggle." }, { "WorldInfo": { "@title":"PushButtonPrototype.x3d" } }, { "ExternProtoDeclare": { "@name":"MaterialToggle", "@appinfo":"MaterialToggle selects one of two different Material values", "@url":["MaterialTogglePrototype.x3d#MaterialToggle","../../Tools/Animation/MaterialTogglePrototype.x3d#MaterialToggle","https://www.web3d.org/x3d/content/examples/Savage/Tools/Animation/MaterialTogglePrototype.x3d#MaterialToggle","../../Tools/Animation/MaterialTogglePrototype.wrl#MaterialToggle","MaterialTogglePrototype.wrl#MaterialToggle","https://www.web3d.org/x3d/content/examples/Savage/Tools/Animation/MaterialTogglePrototype.wrl#MaterialToggle"], "field": [ { "@name":"defaultMaterial", "@accessType":"initializeOnly", "@appinfo":"Material node that is enabled when toggle=false", "@type":"SFNode" }, { "@name":"toggleMaterial", "@accessType":"initializeOnly", "@appinfo":"Material node that is enabled when toggle=true", "@type":"SFNode" }, { "@name":"set_toggle", "@accessType":"inputOnly", "@type":"SFBool" }, { "@name":"set_defaultMaterial", "@accessType":"inputOnly", "@appinfo":"provide replacement default Material node", "@type":"SFNode" }, { "@name":"toggle", "@accessType":"initializeOnly", "@appinfo":"whether to use DefaultMaterial or ToggleMaterial", "@type":"SFBool" }, { "@name":"toggle_changed", "@accessType":"outputOnly", "@type":"SFBool" }, { "@name":"set_toggleMaterial", "@accessType":"inputOnly", "@appinfo":"provide replacement toggle Material node", "@type":"SFNode" } ] } }, { "#comment":"TimeDelaySensor is being used to provide the time delay for button's color change delay" }, { "ExternProtoDeclare": { "@name":"TimeDelaySensor", "@appinfo":"TimeSensor functionality commences after delayInterval pause", "@url":["TimeDelaySensorPrototype.x3d#TimeDelaySensor","../../Tools/Animation/TimeDelaySensorPrototype.x3d#TimeDelaySensor","https://www.web3d.org/x3d/content/examples/Savage/Tools/Animation/TimeDelaySensorPrototype.x3d#TimeDelaySensor","../../Tools/Animation/TimeDelaySensorPrototype.wrl#TimeDelaySensor","TimeDelaySensorPrototype.wrl#TimeDelaySensor","https://www.web3d.org/x3d/content/examples/Savage/Tools/Animation/TimeDelaySensorPrototype.wrl#TimeDelaySensor"], "field": [ { "@name":"startTime", "@accessType":"inputOutput", "@appinfo":"when current time exceeds startTime, isActive becomes true and sensor becomes active", "@type":"SFTime" }, { "@name":"delayInterval", "@accessType":"inputOutput", "@appinfo":"seconds", "@type":"SFTime" }, { "@name":"delayCompleteTime", "@accessType":"outputOnly", "@type":"SFTime" }, { "@name":"enabled", "@accessType":"inputOutput", "@appinfo":"whether sensor is active", "@type":"SFBool" }, { "@name":"description", "@accessType":"inputOutput", "@appinfo":"describe the purpose of this sensor", "@type":"SFString" }, { "@name":"traceEnabled", "@accessType":"initializeOnly", "@type":"SFBool" } ] } }, { "#comment":"PushButton Prototype definition starts here.." }, { "ProtoDeclare": { "@name":"PushButton", "@appinfo":"PushButton widget, inner button and outer shape can be round or square", "ProtoInterface": { "field": [ { "@name":"traceEnabled", "@accessType":"initializeOnly", "@appinfo":"enables the console print-out in case of assigning wrong values default is true", "@type":"SFBool", "@value":true }, { "@name":"outerShapeMaterial", "@accessType":"initializeOnly", "@type":"SFNode", "-children":[ { "Material": { "@DEF":"Blue", "@diffuseColor":[0,0,1] } } ] }, { "@name":"defaultMaterial", "@accessType":"initializeOnly", "@appinfo":"defaultMaterial for inner pushbutton", "@type":"SFNode", "-children":[ { "Material": { "@DEF":"Red", "@diffuseColor":[0.8,0.1,0] } } ] }, { "@name":"toggleMaterial", "@accessType":"initializeOnly", "@appinfo":"toggleMaterial for inner pushbutton", "@type":"SFNode", "-children":[ { "Material": { "@DEF":"Green", "@diffuseColor":[0.1,0.8,0] } } ] }, { "@name":"value_changed", "@accessType":"outputOnly", "@appinfo":"boolean output of button selection", "@type":"SFBool" }, { "@name":"outerSwitchStyle", "@accessType":"initializeOnly", "@appinfo":"allowed values: round or square default is round", "@type":"SFString", "@value":"round" }, { "@name":"set_outerSwitchStyle", "@accessType":"inputOnly", "@appinfo":"allowed values: round or square default is round", "@type":"SFString" }, { "@name":"innerSwitchStyle", "@accessType":"initializeOnly", "@appinfo":"allowed values: round square. default is round", "@type":"SFString", "@value":"round" }, { "@name":"set_innerSwitchStyle", "@accessType":"inputOnly", "@appinfo":"allowed values: round square. default is round", "@type":"SFString" }, { "@name":"delayInterval", "@accessType":"initializeOnly", "@appinfo":"time delay for button movement so for color change default is 0.5 sec.", "@type":"SFTime", "@value":0.5 } ], "-children":[ { "#comment":"switch values for combination of the button, default: round-round" } ] }, "ProtoBody": { "-children":[ { "Group": { "-children":[ { "ProtoInstance": { "@name":"TimeDelaySensor", "@DEF":"DelayTimer", "IS": { "connect": [ { "@nodeField":"delayInterval", "@protoField":"delayInterval" } ] } } }, { "Transform": { "@DEF":"OuterShapeTransform", "@rotation":[1,0,0,1.57], "-children":[ { "Switch": { "@DEF":"OuterShapeSwitchRound", "@whichChoice":-1, "-children":[ { "Shape": { "-geometry": { "Cylinder": { "@height":0.12, "@radius":0.5 } }, "-appearance": { "Appearance": { "IS": { "connect": [ { "@nodeField":"material", "@protoField":"outerShapeMaterial" } ] } } } } } ] } }, { "Switch": { "@DEF":"OuterShapeSwitchSquare", "@whichChoice":-1, "-children":[ { "Shape": { "-geometry": { "Box": { "@size":[1,0.12,1] } }, "-appearance": { "Appearance": { "IS": { "connect": [ { "@nodeField":"material", "@protoField":"outerShapeMaterial" } ] } } } } } ] } } ] } }, { "Transform": { "@DEF":"InnerShapeTransform", "@rotation":[1,0,0,1.57], "@translation":[0,0,0.1], "-children":[ { "Switch": { "@DEF":"InnerShapeSwitchRound", "@whichChoice":-1, "-children":[ { "Shape": { "-geometry": { "Cylinder": { "@height":0.12, "@radius":0.35 } }, "-appearance": { "Appearance": { "-material": { "ProtoInstance": { "@name":"MaterialToggle", "@DEF":"PushButtonToggleMaterial", "IS": { "connect": [ { "@nodeField":"defaultMaterial", "@protoField":"defaultMaterial" }, { "@nodeField":"toggleMaterial", "@protoField":"toggleMaterial" } ] } } } } } } } ] } }, { "Switch": { "@DEF":"InnerShapeSwitchSquare", "@whichChoice":-1, "-children":[ { "Shape": { "-geometry": { "Box": { "@size":[0.57,0.12,0.57] } }, "-appearance": { "Appearance": { "-material": { "ProtoInstance": { "@name":"MaterialToggle", "@USE":"PushButtonToggleMaterial" } } } } } } ] } }, { "Sound": { "-source": { "AudioClip": { "@DEF":"ClickAudio", "@description":"click sound", "@url":["click.wav","https://www.web3d.org/x3d/content/examples/Savage/Tools/Animation/click.wav"] } } } }, { "TouchSensor": { "@DEF":"Toucher", "@description":"touch to push the button" } }, { "ROUTE": { "@fromField":"touchTime", "@fromNode":"Toucher", "@toField":"set_startTime", "@toNode":"ClickAudio" } }, { "ROUTE": { "@fromField":"touchTime", "@fromNode":"Toucher", "@toField":"startTime", "@toNode":"DelayTimer" } } ] } }, { "Group": { "@DEF":"AnimationGroup", "-children":[ { "#comment":"=============================" }, { "TimeSensor": { "@DEF":"Clock1" } }, { "ROUTE": { "@fromField":"touchTime", "@fromNode":"Toucher", "@toField":"set_startTime", "@toNode":"Clock1" } }, { "#comment":"=============================" }, { "PositionInterpolator": { "@DEF":"SwitchAnimator1", "@key":[0,0.5,1], "@keyValue":[0,0,0.1,0,0,0.05,0,0,0.007] } }, { "ROUTE": { "@fromField":"fraction_changed", "@fromNode":"Clock1", "@toField":"set_fraction", "@toNode":"SwitchAnimator1" } }, { "ROUTE": { "@fromField":"value_changed", "@fromNode":"SwitchAnimator1", "@toField":"set_translation", "@toNode":"InnerShapeTransform" } }, { "#comment":"=============================" }, { "TimeSensor": { "@DEF":"Clock2" } }, { "ROUTE": { "@fromField":"delayCompleteTime", "@fromNode":"DelayTimer", "@toField":"set_startTime", "@toNode":"Clock2" } }, { "#comment":"=============================" }, { "PositionInterpolator": { "@DEF":"SwitchAnimator2", "@key":[0,0.5,1], "@keyValue":[0,0,0.007,0,0,0.05,0,0,0.1] } }, { "ROUTE": { "@fromField":"fraction_changed", "@fromNode":"Clock2", "@toField":"set_fraction", "@toNode":"SwitchAnimator2" } }, { "ROUTE": { "@fromField":"value_changed", "@fromNode":"SwitchAnimator2", "@toField":"set_translation", "@toNode":"InnerShapeTransform" } }, { "#comment":"=============================" }, { "BooleanToggle": { "@DEF":"BooleanToggler", "IS": { "connect": [ { "@nodeField":"toggle_changed", "@protoField":"value_changed" } ] } } }, { "ROUTE": { "@fromField":"isActive", "@fromNode":"Clock2", "@toField":"set_boolean", "@toNode":"BooleanToggler" } }, { "ROUTE": { "@fromField":"toggle_changed", "@fromNode":"BooleanToggler", "@toField":"set_toggle", "@toNode":"PushButtonToggleMaterial" } } ] } } ] } }, { "#comment":"Only first node in ProtoBody is rendered" }, { "Script": { "@directOutput":true, "field": [ { "@name":"traceEnabled", "@accessType":"initializeOnly", "@type":"SFBool" }, { "@name":"delayInterval", "@accessType":"initializeOnly", "@type":"SFTime" }, { "@name":"outerSwitchStyle", "@accessType":"initializeOnly", "@appinfo":"allowed values: round square. default is round", "@type":"SFString" }, { "@name":"set_outerSwitchStyle", "@accessType":"inputOnly", "@appinfo":"allowed values: round square. default is round", "@type":"SFString" }, { "@name":"innerSwitchStyle", "@accessType":"initializeOnly", "@appinfo":"allowed values: round square. default is round", "@type":"SFString" }, { "@name":"set_innerSwitchStyle", "@accessType":"inputOnly", "@appinfo":"allowed values: round square. default is round", "@type":"SFString" }, { "@name":"switchOuterRound", "@accessType":"initializeOnly", "@type":"SFNode", "-children":[ { "Switch": { "@USE":"OuterShapeSwitchRound" } } ] }, { "@name":"switchOuterSquare", "@accessType":"initializeOnly", "@type":"SFNode", "-children":[ { "Switch": { "@USE":"OuterShapeSwitchSquare" } } ] }, { "@name":"switchInnerRound", "@accessType":"initializeOnly", "@type":"SFNode", "-children":[ { "Switch": { "@USE":"InnerShapeSwitchRound" } } ] }, { "@name":"switchInnerSquare", "@accessType":"initializeOnly", "@type":"SFNode", "-children":[ { "Switch": { "@USE":"InnerShapeSwitchSquare" } } ] }, { "@name":"clock1", "@accessType":"initializeOnly", "@type":"SFNode", "-children":[ { "TimeSensor": { "@USE":"Clock1" } } ] }, { "@name":"clock2", "@accessType":"initializeOnly", "@type":"SFNode", "-children":[ { "TimeSensor": { "@USE":"Clock2" } } ] } ], "IS": { "connect": [ { "@nodeField":"traceEnabled", "@protoField":"traceEnabled" }, { "@nodeField":"outerSwitchStyle", "@protoField":"outerSwitchStyle" }, { "@nodeField":"set_outerSwitchStyle", "@protoField":"set_outerSwitchStyle" }, { "@nodeField":"innerSwitchStyle", "@protoField":"innerSwitchStyle" }, { "@nodeField":"set_innerSwitchStyle", "@protoField":"set_innerSwitchStyle" }, { "@nodeField":"delayInterval", "@protoField":"delayInterval" } ] }, "#sourceCode":[ "", "", "ecmascript:", "", "function initialize()", "{", " clock1.cycleInterval = delayInterval;", " clock2.cycleInterval = delayInterval;", "", " set_innerSwitchStyle(innerSwitchStyle);", " set_outerSwitchStyle(outerSwitchStyle);", "}", "", "function set_innerSwitchStyle(stringValue)", "{", " if (stringValue != null) //security check", " {", " if (stringValue != 'round')", " {", " if (stringValue != 'square')", " {", " printError(stringValue, 'inner');", " innerSwitchStyle = 'round';", " }", " else", " {", " innerSwitchStyle = stringValue;", " }", " }", " else", " {", " innerSwitchStyle = stringValue;", " }", " }", "", " if (innerSwitchStyle == 'round')", " {", " switchInnerSquare.whichChoice = -1;", " switchInnerRound.whichChoice = 0;", " }", " else // (innerSwitchStyle == 'square')", " {", " switchInnerSquare.whichChoice = 0;", " switchInnerRound.whichChoice = -1;", " }", "}", "", "function set_outerSwitchStyle(stringValue)", "{", " if (stringValue != null) //security check", " {", " if (stringValue != 'round')", " {", " if (stringValue != 'square')", " {", " printError(stringValue, 'outer');", " outerSwitchStyle = 'round';", " }", " else", " {", " outerSwitchStyle = stringValue;", " }", " }", " else", " {", " outerSwitchStyle = stringValue;", " }", " }", "", " if (outerSwitchStyle == 'round')", " {", " switchOuterSquare.whichChoice = -1;", " switchOuterRound.whichChoice = 0;", " }", " else // (outerSwitchStyle == 'square')", " {", " switchOuterSquare.whichChoice = 0;", " switchOuterRound.whichChoice = -1;", " }", "}", "", "function printError(s1, s2)", "{", " if (traceEnabled)", " {", " Browser.println ('\nAllowed values are [round] and [square].');", " Browser.println ('Assigned value [' + s1 + '] (The values are case/whitespace-sensitive).');", " Browser.println ('Default value [round] will be used for [' + s2 + 'SwitchStyle].');", " }", "}", "", "" ] } } ] } } }, { "#comment":"====================" }, { "Anchor": { "@description":"PushButtonExample", "@parameter":["target=_blank"], "@url":["PushButtonExample.x3d","../../Tools/Animation/PushButtonExample.x3d","https://www.web3d.org/x3d/content/examples/Savage/Tools/Animation/PushButtonExample.x3d","../../Tools/Animation/PushButtonExample.wrl","PushButtonExample.wrl","https://www.web3d.org/x3d/content/examples/Savage/Tools/Animation/PushButtonExample.wrl"], "-children":[ { "Shape": { "-geometry": { "Text": { "@string":["PushButtonPrototype","defines a prototype","Click text to see example scene","You can define 4 different buttons","with the combination of round and square","(default is round-round)"], "-fontStyle": { "FontStyle": { "@justify":["MIDDLE","MIDDLE"], "@size":0.7 } } } }, "-appearance": { "Appearance": { "-material": { "Material": { "@diffuseColor":[0.8,0.7,0.2] } } } } } } ] } } ] } } }