-
Notifications
You must be signed in to change notification settings - Fork 2
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #1 from sa08MilneB57/version-2
Version 2- More Waves, More Particles, More Duality
- Loading branch information
Showing
24 changed files
with
2,603 additions
and
203 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,140 @@ | ||
<!DOCTYPE html> | ||
<html lang="EN"> | ||
|
||
<head> | ||
<meta charset="utf-8"> | ||
<meta name="viewport" content="width=device-width, initial-scale=1.0"> | ||
<link rel="stylesheet" type="text/css" href="https://www.w3schools.com/w3css/4/w3.css"> | ||
<link rel="stylesheet" type="text/css" href="styles.css"> | ||
<title>Interactive Particle In A Box</title> | ||
<script src="mathplus.js"></script> | ||
<script src="https://cdn.jsdelivr.net/npm/p5@1.0.0/lib/p5.js"></script> | ||
</head> | ||
|
||
<body> | ||
<div id="containment"> | ||
|
||
<img id="burger" class="w3-btn w3-purple w3-card-4 w3-hover-deep-purple" src="./textures/burger.svg" width="5%" onClick="baropen()"/> | ||
|
||
<div id="sidebar" class="w3-sidebar w3-animate-opacity w3-khaki"> | ||
<div id="navibar" class="w3-bar w3-khaki w3-card-4"> | ||
<a href="index.html" class="w3-btn w3-bar-item w3-wide w3-large w3-ripple w3-purple w3-hover-deep-purple w3-bar-item">Home</a> | ||
<span class="w3-bar-item"><b>Particle In A Box</b> | ||
<input type="button" class="helpButton w3-card-2 w3-ripple w3-round w3-purple w3-hover-deep-purple" value="?" onClick="helpopen('Introduction')"/> | ||
</span> | ||
</div> | ||
<div class="w3-container w3-red"><b>Position</b> Arrowheads correspond to units of distance.</div> | ||
<div class="w3-container w3-blue"><b>Real</b> Axis of Wavefunction<input type="button" class="helpButton w3-card-2 w3-ripple w3-round w3-aqua w3-hover-blue" value="?" onClick="helpopen('Wavefunctions')"/></div> | ||
<div class="w3-container w3-green"><b>Imaginary</b> Axis of Wavefunction<input type="button" class="helpButton w3-card-2 w3-ripple w3-round w3-aqua w3-hover-blue" value="?" onClick="helpopen('Complex')"/></div> | ||
<div class="w3-container w3-orange"><input id="showMOM" type="checkbox" autocomplete="off"/><b>Momentum</b> Display Momentum Wavefunction<input type="button" class="helpButton w3-card-2 w3-ripple w3-round w3-aqua w3-hover-blue" value="?" onClick="helpopen('momentum')"/></div> | ||
<div class="w3-container">Play Speed(1=RealTime):</br> | ||
<input id="timeAcc" type="number" step="0.2" value="1" autocomplete="off" style="width:4em"/> | ||
<input id="timeRes" type="button" class="w3-btn w3-card-4 w3-ripple w3-round w3-purple w3-hover-deep-purple" value="time=0" onClick="resetTime()"/> | ||
</div> | ||
<div class="w3-container"> | ||
<span class="label">X Scaling:</span> | ||
<input id="scaleSlider" class="usrinput" type="range" min="0.2" max="2" value="1" step="0.1" autocomplete="off"/> | ||
</div> | ||
<div class="w3-container"> | ||
<span class="label">Y Scaling:</span> | ||
<input id="yScaleSlider" class="usrinput" type="range" min="0.2" max="2" value="1" step="0.1" autocomplete="off"/> | ||
</div> | ||
<div class="w3-container"> | ||
<span id="massLabel" class="label">Mass: 25</span> | ||
<input id="massSlider" class="usrinput" type="range" min="0.1" max="100" value="25" step="0.1" autocomplete="off"/> | ||
</div> | ||
<div class="w3-container"> | ||
<span id="LLabel" class="label">Length "L": 4</span> | ||
<input id="LSlider" class="usrinput" type="range" min="0.1" max="10" value="4" step="0.1" autocomplete="off"/> | ||
</div> | ||
<div class="w3-container"> | ||
<div class="w3-red w3-container w3-card-4"> | ||
<div class="w3-container"> | ||
<span class="label">*No. of points:</span> | ||
<input id="detailIn" type="number" class="usrinput" style="width: 5em;" min="1" step="10" value="256" autocomplete="off"/> | ||
</div> | ||
<div id="psiequation" class="w3-bar w3-panel w3-small w3-deep-orange w3-card-4 w3-round-large"> | ||
<img class="w3-bar-item" src="./equations/psi.gif" alt="psi equals the sum of coefficents multiplied by their corresponding n-ket"/> | ||
<input type="button" class="helpButton w3-card-2 w3-ripple w3-round w3-aqua w3-hover-blue" value="? n" onClick="helpopen('QuantumNumbers')"/> | ||
<input type="button" class="helpButton w3-card-2 w3-ripple w3-round w3-aqua w3-hover-blue" value="? C" onClick="helpopen('Coefficients')"/> | ||
</div> | ||
<div class="w3-container"> | ||
<span class="label">Represent as Reflection:</span> | ||
<input id="standingBox" type="checkbox" autocomplete="off"/> | ||
<input type="button" class="helpButton w3-card-2 w3-ripple w3-round w3-purple w3-hover-deep-purple" value="?" onClick="helpopen('Reflection')"/> | ||
</div> | ||
<div class="w3-green w3-panel w3-card-4"> | ||
<div><input type="radio" name="coeffMode" value="manual" checked autocomplete="off"/> | ||
*Manually Input Coefficients:<input type="button" class="helpButton w3-card-2 w3-ripple w3-round w3-aqua w3-hover-blue" value="?" onClick="helpopen('Manual')"/></div> | ||
<input id="cInput" value="1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1" autocomplete="off"/> | ||
</div> | ||
<div class="w3-teal w3-panel w3-card-4"> | ||
<div><input type="radio" name="coeffMode" value="function" autocomplete="off"/> | ||
Define <b>C</b>n=<b>f</b>(n,t,u,w)<input type="button" class="helpButton w3-card-2 w3-ripple w3-round w3-aqua w3-hover-blue" value="?" onClick="helpopen('FunkMode')"/></div> | ||
<div id="maxNLabel"><b>*</b>Max value of n: 16</div> | ||
<input id="maxNSlider" type="range" min="1" max="32" value="16" step="1" autocomplete="off"/> | ||
<div id="Udiv"> | ||
<div id="Ulabel"><b>u</b> = 1 + 0i</div> | ||
<input id="sliderURe" type="range" min="-10" max="10" value="1" step="0.1" autocomplete="off"/> | ||
<input id="sliderUIm" type="range" min="-10" max="10" value="0" step="0.1" autocomplete="off"/> | ||
</div> | ||
<div id="Wdiv"> | ||
<div id="Wlabel"><b>w</b> = 1 + 0i</div> | ||
<input id="sliderWRe" type="range" min="-10" max="10" value="1" step="0.1" autocomplete="off"/> | ||
<input id="sliderWIm" type="range" min="-10" max="10" value="0" step="0.1" autocomplete="off"/> | ||
</div> | ||
<div><b>*f</b>(n,t,u,w)=<input id="fInput" value="exp(-((n-u)^2)/(2*w^2))" autocomplete="off"/></div> | ||
|
||
</div> | ||
<div class="w3-panel"> | ||
<input id="cButton" type="button" class="w3-btn w3-card-4 w3-ripple w3-round w3-khaki w3-hover-deep-orange" value="Apply" onClick="buttFunk()"/> | ||
*Needs "Apply" | ||
</div> | ||
</div> | ||
</div> | ||
<div> | ||
<select id="setters"> | ||
<option value="maxReU">Real U Slider: Max</option> | ||
<option value="minReU">Real U Slider: Min</option> | ||
<option value="maxImU">Imaginary U Slider: Max</option> | ||
<option value="minImU">Imaginary U Slider: Min</option> | ||
<option value="maxReW">Real W Slider: Max</option> | ||
<option value="minReW">Real W Slider: Min</option> | ||
<option value="maxImW">Imaginary W Slider: Max</option> | ||
<option value="minImW">Imaginary W Slider: Min</option> | ||
<option value="massMax">Mass Slider: Max</option> | ||
<option value="massMin">Mass Slider: Min</option> | ||
<option value="maxNMax">Max N Slider: Max</option> | ||
<option value="lengthMax">Length Slider: Max</option> | ||
<option value="lengthMin">Length Slider: Min</option> | ||
</select> | ||
<div> | ||
<input id="setVal" type="number" step="1" value="1" autocomplete="off"/> | ||
<input id="setBut" type="button" class="w3-btn w3-card-4 w3-ripple w3-round w3-purple w3-hover-deep-purple" value="Set" onClick="advSetting()"/> | ||
</div> | ||
</div> | ||
</div> | ||
<img id="sideclose" class="w3-btn w3-card-4 w3-ripple w3-purple w3-hover-deep-purple w3-bar-item" src="./textures/doublearrow.svg" onClick="barclose()"/> | ||
</div> | ||
<div id="helpPanelIntroduction" style="display:none" class="help-panel w3-panel w3-card-4 w3-blue w3-display-middle w3-display-container"> | ||
<h3>Help- "Particle In A Box"</h3> | ||
<img id="eqNket" src="./equations/BOXnket.gif"/> | ||
<p>This is a particle perfectly confined to a region of Length "L". Or, if you like, the quantum equivalent of a guitar string.</p> | ||
<p>In reality this situation is very unphysical. In order to perfectly confine the particle to a region, you need an infinite wall of energy to stop it leaking out.</p> | ||
<p>But assuming it to be possible, greatly simplifies a lot of the maths, in fact each energy state is just a sine or cosine wave of a specific frequency. This is because, like a guitar string, each of the end points are fixed in place at 0, meaning only certain frequencies are allowed. In a guitar string the waves bounce of the end points and interact with the waves coming in the other direction. A very similar phenomenon happens in this simulation and you can see the particle "interacting with itself" by checking the box marked "Represent As Reflection".</p> | ||
<p>See Also: Standing Waves, Self-Interaction</p> | ||
<input id="helpClose" type="button" class="w3-btn w3-card-4 w3-ripple w3-display-topright w3-purple w3-hover-deep-purple" value="X" onClick="helpclose('Introduction')"/> | ||
</div> | ||
<div id="helpPanelReflection" style="display:none" class="help-panel w3-panel w3-card-4 w3-blue w3-display-middle w3-display-container"> | ||
<h3>Help- "Reflection"</h3> | ||
<p>This will display show a decomposition of the wavefunction as two "free particles" moving in opposite directions. By adding these two together you get the original wavefunction.</p> | ||
<p>At each wall the arrows pointing into it will be exactly opposite the arrows coming out of it. This may not seem like a reflection but when polarised light reflects off a surface it rotates by a full 180 degrees in the same way and so does the sound wave in a guitar string. This exact opposition also means they cancel out and keep the waveunction at zero at each of the end points.</p> | ||
<p>See Also: Standing Waves, Sine and Cosine as Exponentials</p> | ||
<input id="helpClose" type="button" class="w3-btn w3-card-4 w3-ripple w3-display-topright w3-purple w3-hover-deep-purple" value="X" onClick="helpclose('Reflection')"/> | ||
</div> | ||
|
||
<script src="boxSketch.js"></script> | ||
<script src="panels.js"></script> | ||
</body> | ||
|
||
</html> |
Oops, something went wrong.