{ "information": { "Title": "LOLlookangSLS LOL Energy Diagram", "Author": [ "weelookang@gmail.com" ], "AuthorLogo": [ "./1authorlookangphoto5050.png" ], "Password": "", "Keywords": "", "Abstract": "LOL diagrams are a way to represent how the energy is stored in the chosen system during various snapshots and to represent any changes in total energy for the system. Each \u201cL\u201d represents how the energy is stored during a particular snapshot (instant). The \u201cO\u201d shows the objects inside and outside the system.", "Copyright": "", "Level": "", "Language": "", "Logo": [ "./LOLicon/Screenshot 2023-02-22 at 8.27.11 AM.png" ], "RunAlways": "true", "ModelTab": "", "ModelTabTitle": "", "ModelName": "", "FixedNavigationBar": "false", "CSSFile": "", "DetectedFiles": [ "./1authorlookangphoto5050.png", "./LOLicon/Screenshot 2023-02-22 at 8.27.11 AM.png" ], "AuxiliaryFiles": [ "./LOL/", "./LOLicon/" ], "HTMLHead": "\n\n\n\n", "SaveInXMLFormat": "false", "IncludeSource": "true", "IncludeLibrary": "true", "UglifyJS": "false", "PreviewFullModel": "false", "UseInterpreter": "true", "UseDeltaForODE": "false" }, "description": { "pages": [] }, "model": { "variables": { "pages": [ { "Name": "Var Table", "Active": "true", "Internal": "false", "Type": "VARIABLE_EDITOR", "PageComment": "", "Variables": [ { "Name": "t", "Value": "0", "Type": "double", "Dimension": "", "Comment": "null", "Domain": "public" }, { "Name": "dt", "Value": "0.05", "Type": "double", "Dimension": "", "Comment": "null", "Domain": "public" }, { "Name": "pi", "Value": "Math.PI", "Type": "double", "Dimension": "", "Comment": "null", "Domain": "public" }, { "Name": "font", "Value": "\"normal normal 2vw \"", "Type": "String", "Dimension": "", "Comment": "null", "Domain": "public" }, { "Name": "n", "Value": "32", "Type": "double", "Dimension": "", "Comment": "null", "Domain": "public" }, { "Name": "angle", "Value": "pi", "Type": "double", "Dimension": "", "Comment": "null", "Domain": "public" }, { "Name": "URL", "Value": "\"\"", "Type": "String", "Dimension": "", "Comment": "null", "Domain": "public" }, { "Name": "", "Value": "", "Type": "double", "Dimension": "", "Comment": "null", "Domain": "public" } ] }, { "Name": "circle", "Active": "true", "Internal": "false", "Type": "VARIABLE_EDITOR", "PageComment": "", "Variables": [ { "Name": "x", "Value": "", "Type": "double", "Dimension": "[n+1]", "Comment": "null", "Domain": "public" }, { "Name": "y", "Value": "", "Type": "double", "Dimension": "[n+1]", "Comment": "null", "Domain": "public" }, { "Name": "theta", "Value": "pi/4", "Type": "double", "Dimension": "", "Comment": "null", "Domain": "public" }, { "Name": "", "Value": "", "Type": "double", "Dimension": "", "Comment": "null", "Domain": "public" } ] }, { "Name": "layout", "Active": "true", "Internal": "false", "Type": "VARIABLE_EDITOR", "PageComment": "", "Variables": [ { "Name": "iOS", "Value": "/iPad|iPhone|iPod/.test(navigator.userAgent) && !window.MSStream", "Type": "boolean", "Dimension": "", "Comment": "http://stackoverflow.com/questions/9038625/detect-if-device-is-ios", "Domain": "public" }, { "Name": "Android", "Value": "/Android|android/i.test(navigator.userAgent)", "Type": "boolean", "Dimension": "", "Comment": "null", "Domain": "public" }, { "Name": "iPad", "Value": "/iPad/.test(navigator.userAgent) && !window.MSStream", "Type": "boolean", "Dimension": "", "Comment": "http://stackoverflow.com/questions/9038625/detect-if-device-is-ios", "Domain": "public" }, { "Name": "iPhone", "Value": "/iPhone|iPod/.test(navigator.userAgent) && !window.MSStream", "Type": "boolean", "Dimension": "", "Comment": "http://stackoverflow.com/questions/9038625/detect-if-device-is-ios", "Domain": "public" }, { "Name": "Width", "Value": "(_isEPub)?\"400\":\"100%\"", "Type": "String", "Dimension": "", "Comment": "display width", "Domain": "public" }, { "Name": "Height", "Value": "(_isEPub)?\"500\":\"100%\"", "Type": "String", "Dimension": "", "Comment": "null", "Domain": "public" }, { "Name": "Width1", "Value": "\"100%\"", "Type": "String", "Dimension": "", "Comment": "display width", "Domain": "public" }, { "Name": "Width2", "Value": "\"50%\"", "Type": "String", "Dimension": "", "Comment": "display width", "Domain": "public" }, { "Name": "world", "Value": "true", "Type": "boolean", "Dimension": "", "Comment": "null", "Domain": "public" }, { "Name": "graph", "Value": "true", "Type": "boolean", "Dimension": "", "Comment": "null", "Domain": "public" }, { "Name": "disabledworld", "Value": "false", "Type": "boolean", "Dimension": "", "Comment": "null", "Domain": "public" }, { "Name": "disabled", "Value": "false", "Type": "boolean", "Dimension": "", "Comment": "null", "Domain": "public" } ] }, { "Name": "cells", "Active": "true", "Internal": "false", "Type": "VARIABLE_EDITOR", "PageComment": "", "Variables": [ { "Name": "", "Value": "", "Type": "double", "Dimension": "", "Comment": "null", "Domain": "public" }, { "Name": "xmin", "Value": "-10", "Type": "double", "Dimension": "", "Comment": "null", "Domain": "public" }, { "Name": "xmax", "Value": "10", "Type": "double", "Dimension": "", "Comment": "null", "Domain": "public" }, { "Name": "ymin", "Value": "-10", "Type": "double", "Dimension": "", "Comment": "null", "Domain": "public" }, { "Name": "ymax", "Value": "10", "Type": "double", "Dimension": "", "Comment": "null", "Domain": "public" } ] } ] }, "initialization": { "pages": [ { "Name": "Init Page", "Active": "true", "Internal": "false", "Type": "CODE_EDITOR", "Comment": "", "Code": "\n//circle\nangle = pi; //angle to draw\ndangle = angle/n; //spacing of angle\n\n\n\nfor (var i=0; i<=n ; i++) {\n \n x[i] = Math.cos(i*dangle); // first point is on the right corner say x of(1,0)\n y[i] = Math.sin(i*dangle); // first point is on the right corner say y of (1,0)\n \n}\n\n//x[0] = 0;\n//y[0]=0;\nx[n+1] = x[0]; // join back to start\ny[n+1]=y[0];// join back to start\n\n\n\n" } ] }, "evolution": { "information": { "FPS": "20", "SPD": "1", "RealTimeVariable": "", "Autoplay": "false" }, "pages": [ { "Name": "Evol Page", "Active": "true", "Internal": "false", "Type": "ODE_EDITOR", "Comment": "", "IndependentVariable": "t", "Increment": "dt", "Equations": [ { "state": "", "rate": "" } ], "Method": "RungeKuttaFehlberg", "AbsoluteTolerance": "0.00001", "PreliminaryCode": { "Code": "", "Comment": "Code to be executed before rate equations are evaluated" }, "EventMaximumStep": "", "Events": { "pages": [] }, "ZenoEffect": { "Code": "", "Comment": "", "StopAfterEffect": "true" }, "AccelerationIndependentOfVelocity": "false", "ForceSynchronization": "false", "UseBestInterpolation": "false", "EstimateFirstStep": "false", "MemoryLength": "", "InternalStep": "", "MaximumStep": "", "MaximumNumberOfSteps": "10000", "RelativeTolerance": "", "DelayList": "", "DelayMaximum": "", "DelayAddDiscont": "", "DelayInitialCondition": { "Code": "", "Comment": "" }, "DirectIncidenceMatrix": "", "Discontinuities": { "pages": [] }, "ErrorHandling": { "pages": [] } } ] }, "fixed_relations": { "pages": [] }, "custom": { "pages": [ { "Name": "fullscreen", "Active": "true", "Internal": "false", "Type": "LIBRARY_EDITOR", "Comment": "", "Code": "//https://developer.mozilla.org/en-US/docs/Web/Guide/API/DOM/Using_full_screen_mode\n// does not work for iOS \n/*jslint browser:true */\nfunction toggleFullScreen() {\n if (!document.fullscreenElement && // alternative standard method\n !document.mozFullScreenElement && !document.webkitFullscreenElement && !document.msFullscreenElement ) { // current working methods\n if (document.documentElement.requestFullscreen) {\n document.documentElement.requestFullscreen();\n } else if (document.documentElement.msRequestFullscreen) {\n document.documentElement.msRequestFullscreen();\n } else if (document.documentElement.mozRequestFullScreen) {\n document.documentElement.mozRequestFullScreen();\n } else if (document.documentElement.webkitRequestFullscreen) {\n document.documentElement.webkitRequestFullscreen();\n }\n } else {\n if (document.exitFullscreen) {\n document.exitFullscreen();\n } else if (document.msExitFullscreen) {\n document.msExitFullscreen();\n } else if (document.mozCancelFullScreen) {\n document.mozCancelFullScreen();\n } else if (document.webkitExitFullscreen) {\n document.webkitExitFullscreen();\n }\n }\n}" }, { "Name": "changeOrientation", "Active": "true", "Internal": "false", "Type": "LIBRARY_EDITOR", "Comment": "", "Code": "// code to be copied to EJSS source code under Custom and used in drawingPanel3D and plottingPanel2D\n// address the problem is height difference is iOS app , epub, and Firefox\n// user need to change only k and kepub\n// copy %changeOrientation()% into the Height Field of drawingPanel3D and plottingPanel2D\nfunction changeOrientation() {\n \nvar k =0.90 ; // k control height 1 is for full screen, 0.9 shorten etc\nvar kapple =0.90 // control apple app height\nvar kepub =0.90 ;\n// check platform for Apps\ntry { // allow code to run in Student Learning Space \n var iOSapp = (typeof parent.device != 'undefined' && parent.device.platform == \"iOS\");\n var Androidapp = (typeof parent.device != 'undefined' && parent.device.platform == \"Android\");\n} catch(e) {\n var iOSapp = false;\n var Androidapp = false;\n}\n// check platform for web browsers\nvar iOS =/iPad|iPhone|iPod/.test(navigator.userAgent) && !window.MSStream;\nvar iPad =/iPad/.test(navigator.userAgent) && !window.MSStream;\nvar iPhone = /iPhone|iPod/.test(navigator.userAgent) && !window.MSStream;\nvar Android= /Android|android/i.test(navigator.userAgent);\n\n//navigator\nvar Firefox = navigator.userAgent.indexOf(\"Firefox\") != -1;\n \nswitch (window.orientation) { // using window.orientation as deciding factor\n case 0:\n case 180:\n this.screenOrientation = 'portrait';\n if (iOSapp){ // does not seems to work\n \n return window.screen.height*kapple; //0.1 for app and 0.1 for nonfullscreenapp \n \n }\n else if (_isEPub){ // does not seems to work\n // return Math.max(window.screen.width,window.screen.height)*0.9;\n return window.innerHeight*kepub; //0.1 for app and 0.1 for nonfullscreenapp \n // return window.screen.height;\n // return window.innerHeight;\n // return document.documentElement.clientHeight;\n }\n \n else {\n \n return 100*k+\"vh\";\n }\n break;\n case 90:\n case -90:\n this.screenOrientation = 'landscape';\n \n if (iOSapp){ // App\n return window.screen.width*kapple; \n // return window.screen.height;\n // return window.innerHeight;\n // return document.documentElement.clientHeight;\n }\n else if (_isEPub){ // does not seems to work\n // return Math.max(window.screen.width,window.screen.height)*0.9;\n return window.innerHeight*kepub; //0.1 for app and 0.1 for nonfullscreenapp \n // return window.screen.height;\n // return window.innerHeight;\n // return document.documentElement.clientHeight;\n }\n \n else {\n return 100*k+\"vh\";\n }\n break;\n default:\n this.screenOrientation = 'unknown';\n // return (iPad)?\"\"+(window.screen.width+window.screen.height)*0.4:((iPhone)?\"\"+window.screen.width:_view._format(window.innerHeight*0.9,\"0\"));\n if (Firefox){\n return window.innerHeight*k;// number as of 20180831 Firefox does not support vh yet so need a separate line to handle\n }\n // else if (iOS&&(window.orientation==0)||(window.orientation==180)){\n // return window.screen.height*k;// number as of 20180831 Firefox does not support vh yet so need a separate line to handle\n // }\n // else if (iOS&&(window.orientation==90)||(window.orientation==-90)){\n // return window.screen.width*k;// number as of 20180831 Firefox does not support vh yet so need a separate line to handle\n // }\n else {\n //alert();\n // return 100*k+\"%\"; // work on fullscreen works in EJSS6.0beta\n // works in EjsS_5.3_180131\n return window.innerHeight*k; // work on panel \n \n}\n\n}\n \n}" }, { "Name": "speech", "Active": "true", "Internal": "false", "Type": "LIBRARY_EDITOR", "Comment": "", "Code": "// copy this custom function\n// in iOS need to add speech to the play button as On iOS the API works but must be triggered by a user action callback, like a response to a tap event, to provide a better experience to users and avoid unexpected sounds out of your phone\nfunction speech (option) {\n\n\ntry { // allow code to run in Student Learning Space \nvar isCordova = (!!this.parent.cordova || !!window.cordova);\nif(isCordova) { // check it is running in Android or iOS\n // parent.TTS.speak({text:option,locale:'zh-CN'});\n\tparent.TTS.speak({text:option,locale:'us-EN'});\n\t// parent.TTS.speak({text:option,locale:'en-US'});\n\t// parent.TTS.speak({text:option,locale:'id-ID'});\n} \n} \ncatch(e) {\n var isCordova = false;\n }\n \n var msg = new SpeechSynthesisUtterance(option);\n\n //https://stackoverflow.com/questions/43983845/speechsynthesis-api-for-chinese-firefox\n // Set the text.\n\t//msg.text = option; \n\t//https://forums.developer.apple.com/message/323564#323564\n\t// comment out the next 2 lines for english\n//msg.voice = speechSynthesis.getVoices().filter(function(voice) { return voice.name == 'Ting-Ting'; })[0];\n//msg.lang = 'zh-CH'; // need for android?\n//msg.lang = 'id-ID'; // need for android?\nmsg.lang = 'us-EN'; // need for android?\n\n//https://flaviocopes.com/speech-synthesis-api/\n//debug\n//console.log(`Voices #: ${speechSynthesis.getVoices().length}`)\n//speechSynthesis.getVoices().forEach(voice => {\n// console.log(voice.name, voice.lang)\n//})\n//debug\n\n// Queue this utterance.\nwindow.speechSynthesis.speak(msg);\n\n\n\n \n\n}" } ] }, "elements": { "list": [] } }, "view": { "Tree": [ { "Name": "fullscreen", "Type": "Panel", "Expanded": "true", "Properties": [ { "name": "Width", "value": "Width" } ], "Children": [ { "Name": "control", "Type": "Panel", "Expanded": "false", "Properties": [ { "name": "BorderWidth", "value": "1" }, { "name": "Display", "value": "\"inline-block\"" } ], "Children": [ { "Name": "controlPanel", "Type": "Panel", "Expanded": "false", "Properties": [ { "name": "Width", "value": "\"100%\"" }, { "name": "Display", "value": "\"block\"" } ], "Children": [ { "Name": "LOL_Energy_Diagram_Menu", "Type": "Label", "Properties": [ { "name": "Text", "value": "\"LOL Energy Diagram Menu\"" }, { "name": "Font", "value": "font" } ] }, { "Name": "button0", "Type": "Button", "Properties": [ { "name": "OnRelease", "value": "window.open(\"LOL/index0.html\",\"_self\")" }, { "name": "TextAlign", "value": "\"left\"" }, { "name": "Text", "value": "\"Scenario 0: A Sliding Book \ud83d\udcda \"" }, { "name": "Width", "value": "\"100%\"" }, { "name": "Font", "value": "font" }, { "name": "Display", "value": "\"none\"" } ] }, { "Name": "button", "Type": "Button", "Properties": [ { "name": "OnRelease", "value": "window.open(\"LOL/index.html\",\"_self\")" }, { "name": "TextAlign", "value": "\"left\"" }, { "name": "Text", "value": "\"Scenario 1: A Moving Toy Car \"" }, { "name": "Width", "value": "\"100%\"" }, { "name": "Font", "value": "font" }, { "name": "Display", "value": "\"block\"" } ] }, { "Name": "button2", "Type": "Button", "Properties": [ { "name": "OnRelease", "value": "window.open(\"LOL/index2.html\",\"_self\")" }, { "name": "TextAlign", "value": "\"left\"" }, { "name": "Text", "value": "\"Scenario 2: Charging A Power Bank \"" }, { "name": "Width", "value": "\"100%\"" }, { "name": "Font", "value": "font" }, { "name": "Display", "value": "\"block\"" } ] }, { "Name": "button3", "Type": "Button", "Properties": [ { "name": "OnRelease", "value": "window.open(\"LOL/index3.html\",\"_self\")" }, { "name": "TextAlign", "value": "\"left\"" }, { "name": "Text", "value": "\"Scenario 3: Lighting Up A Lamp \"" }, { "name": "Width", "value": "\"100%\"" }, { "name": "Font", "value": "font" }, { "name": "Display", "value": "\"block\"" } ] }, { "Name": "button4", "Type": "Button", "Properties": [ { "name": "OnRelease", "value": "window.open(\"LOL/index4.html\",\"_self\")" }, { "name": "TextAlign", "value": "\"left\"" }, { "name": "Text", "value": "\"Scenario 4: Sitting On A Swing \"" }, { "name": "Width", "value": "\"100%\"" }, { "name": "Font", "value": "font" }, { "name": "Display", "value": "\"block\"" } ] }, { "Name": "button5", "Type": "Button", "Properties": [ { "name": "OnRelease", "value": "window.open(\"LOL/index5.html\",\"_self\")" }, { "name": "TextAlign", "value": "\"left\"" }, { "name": "Text", "value": "\"Scenario 5: Cooling A Hot Cup Of Tea \"" }, { "name": "Width", "value": "\"100%\"" }, { "name": "Font", "value": "font" }, { "name": "Display", "value": "\"block\"" } ] }, { "Name": "button6", "Type": "Button", "Properties": [ { "name": "OnRelease", "value": "window.open(\"LOL/index6.html\",\"_self\")" }, { "name": "TextAlign", "value": "\"left\"" }, { "name": "Text", "value": "\"Scenario 6: A Falling Stone \"" }, { "name": "Width", "value": "\"100%\"" }, { "name": "Font", "value": "font" }, { "name": "Display", "value": "\"block\"" } ] }, { "Name": "button7", "Type": "Button", "Properties": [ { "name": "OnRelease", "value": "window.open(\"LOL/index7.html\",\"_self\")" }, { "name": "TextAlign", "value": "\"left\"" }, { "name": "Text", "value": "\"Scenario 7: Lighting Up A Lamp \"" }, { "name": "Width", "value": "\"100%\"" }, { "name": "Font", "value": "font" }, { "name": "Display", "value": "\"block\"" } ] }, { "Name": "button8", "Type": "Button", "Properties": [ { "name": "OnRelease", "value": "window.open(\"LOL/index8.html\",\"_self\")" }, { "name": "TextAlign", "value": "\"left\"" }, { "name": "Text", "value": "\"Scenario 8: Radioactive Decay \"" }, { "name": "Width", "value": "\"100%\"" }, { "name": "Font", "value": "font" }, { "name": "Display", "value": "\"block\"" } ] }, { "Name": "button9", "Type": "Button", "Properties": [ { "name": "OnRelease", "value": "window.open(\"LOL/index9.html\",\"_self\")" }, { "name": "TextAlign", "value": "\"left\"" }, { "name": "Text", "value": "\"Scenario 9: Bungee Jumping \"" }, { "name": "Width", "value": "\"100%\"" }, { "name": "Font", "value": "font" }, { "name": "Display", "value": "\"block\"" } ] }, { "Name": "button10", "Type": "Button", "Properties": [ { "name": "OnRelease", "value": "window.open(\"LOL/index10.html\",\"_self\")" }, { "name": "TextAlign", "value": "\"left\"" }, { "name": "Text", "value": "\"Scenario 10: Releasing An Arrow \"" }, { "name": "Width", "value": "\"100%\"" }, { "name": "Font", "value": "font" }, { "name": "Display", "value": "\"block\"" } ] }, { "Name": "button11", "Type": "Button", "Properties": [ { "name": "OnRelease", "value": "window.open(\"LOL/index11.html\",\"_self\")" }, { "name": "TextAlign", "value": "\"left\"" }, { "name": "Text", "value": "\"Scenario 11: Hammering A Nail \"" }, { "name": "Width", "value": "\"100%\"" }, { "name": "Font", "value": "font" }, { "name": "Display", "value": "\"block\"" } ] }, { "Name": "button12", "Type": "Button", "Properties": [ { "name": "OnRelease", "value": "window.open(\"LOL/index12.html\",\"_self\")" }, { "name": "TextAlign", "value": "\"left\"" }, { "name": "Text", "value": "\"Scenario 12: Raising A Load \"" }, { "name": "Width", "value": "\"100%\"" }, { "name": "Font", "value": "font" }, { "name": "Display", "value": "\"block\"" } ] } ] } ] }, { "Name": "panel", "Type": "Panel", "Properties": [ { "name": "Html", "value": "

Interactive Energy Diagram Simulation

\n\n

\n This interactive energy diagram simulation helps students visualise and explore the relationships between\n work, kinetic energy, and potential energy.\n By adjusting variables and observing real-time energy transformations, learners can develop a deeper\n understanding of energy conservation and energy transfer in mechanical systems.\n

\n\n

\n The simulation is especially useful for teaching the newer Physics approach of\n energy stores and energy transfers, where students learn to track how energy is stored,\n transferred, and conserved within a system. Students can observe how energy moves between different stores,\n such as gravitational potential energy stores and kinetic energy stores, while connecting these changes to\n the work done by forces.\n

\n\n

\n At the same time, the simulation also supports the older and still commonly used language of\n energy transformations, allowing students to describe situations such as:\n

\n\n\n\n

\n By comparing both approaches side by side, students can build stronger conceptual understanding and make\n connections between traditional energy transformation descriptions and the modern energy stores and transfers framework used in contemporary Physics education.\n

\n\n

Learning Goals

\n\n\n\n

\n This simulation has been edited by lookang using Claude Sonnet 4.6 High.\n

" }, { "name": "Width", "value": "\"100%\"" } ] } ] } ], "RootProperties": [] }, "metadata": { "APP": "WebEJS", "CreatedWith": "WebEJS : The web version of Easy JavaScript Simulations", "MoreInfo": "WebEJS 1.1", "version": "https://www.um.es/fem/wikis/webejs/" } }