-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
85 lines (69 loc) · 3.37 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
<!DOCTYPE HTML>
<html ng-app="playerApp">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=1024,initial-scale=1.0,maximum-scale=1.0" />
<title>Longitudinal wave</title>
<link rel="stylesheet" type="text/css" href="assets/css/libs/bootstrap.min.css" />
<link rel="stylesheet" type="text/css" href="assets/css/libs/bootstrap-slider.min.css" />
<link rel="stylesheet" type="text/css" href="assets/css/main.css" />
<link rel="stylesheet" type="text/css" href="assets/sim/css/sim.css" />
</head>
<body>
<div id="wrapper" ng-controller="playerCtrl">
<header>
<div class="titleBar">Longitudinal wave</div>
<div class="instructionBar">
<strong>Instruction:</strong> Press <Start> to see the wave motion. Observe how the particles vibrate as the longitudinal waves pass them. How is the direction of movement of the particles related to the direction of travel of the wave?
</div>
<div class="selectionBar_top">
<div class="formFields">
<label>Show </label>
<input type="radio" name="r1" id="r1" value="fourparticles" ng-model="animMode" ng-click="onChange($event);"/>
<label class="input_radio removeMarg" name="r1" id="r1" value="fourparticles" for="r1">4 particles</label>
<input type="radio" name="r2" id="r2" value="chainOfParticles" ng-model="animMode" ng-click="onChange($event);"/>
<label class="input_radio removeMarg" name="r2" id="r2" value="chainOfParticles" for="r2">chain of particles</label>
<span class="actBtns rounded green startsim startBtnML" ng-click="startMove($event)" ng-class="{'disable': !resetActBool}">Start</span>
<span class="actBtns rounded red" ng-class="{'disable': !resetActBool}" ng-click="resetSim()">Reset</span>
</div>
</div>
</header>
<section class="middleSection">
<!-- Mid Right Start Here -->
<div class="midRight">
<!-- Stage Area Start Here -->
<div class="stageArea">
<div class="experimentArea">
<div class="directionText">
<div class="Text1 " ng-if="showLabels">
<span>direction of vibration of the particles</span>
<span class="both-side-arrow-drection"></span>
</div>
<!-- <p class="Text1" >{{directionOfVibration}} </p>
<span class="both-side-arrow-drection" ng-show = "oneWayArrowDresc == true"></span> -->
<div class="vibrationArea">
<element></element>
<span class="vibrationText">vibrator</span>
<span class="Text2" ng-if="showLabels">direction of travel of the wave</span>
<span class="one-arrow-drection" ng-if="showLabels"></span>
</div>
<!-- <p class="Text2">{{directionOfPropagation}}</p>
<span class="one-arrow-drection" ng-show = "bothWayArrowDresc == true"></span> -->
</div>
</div>
<div class="imprint"></div>
<!-- Oxford Logo -->
</div>
<!-- Stage Area Ends Here -->
</div>
<!-- mid Right Ends Here -->
</section>
</div>
<script type="text/javascript" src="assets/js/libs/jquery.min.js"></script>
<script type="text/javascript" src="assets/js/libs/bootstrap-slider.min.js"></script>
<script type="text/javascript" src="assets/js/jq_main.js"></script>
<script type="text/javascript" src="assets/js/ng/angular.min.js"></script>
<script type="text/javascript" src="assets/js/ng/angular-sanitize.min.js"></script>
<script type="text/javascript" src="assets/js/app.js"></script>
</body>
</html>