-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
115 lines (96 loc) · 5.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
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Praxly</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="/index.css">
<link rel="icon" href="/fallen-leaf_1f342.ico" type="image/x-icon">
<link rel="stylesheet"
href="https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:opsz,wght,FILL,[email protected],100..700,0..1,-50..200" />
</head>
<body>
<!-- <header>
<button class="report">Report a bug <span class="material-symbols-rounded bug">pest_control</span></button>
</header> -->
<div class="container">
<h1>Welcome to Praxly 🍂</h1>
<div class="about">
<p>Praxly is a web-based IDE that empowers users to read, write, and run the
<a href="https://www.ets.org/pdfs/praxis/5652.pdf#page=21">pseudocode</a>
used in the <a href="https://praxis.ets.org/test/5652.html">CS Praxis Test</a>.
Praxly supports bidirectional synchronization between both block-based and text-based editors,
allowing users to learn and visualize the code while also offering the efficiency of editing text. The
text editor uses <a href="https://ace.c9.io/">Ace</a>,
and the block editor uses <a href="https://developers.google.com/blockly">Blockly</a>.
</p>
</div>
<div class="button-container">
<button class="praxly-button ">Start Coding</button>
<button class="github-button">GitHub Repo</button>
<button class="report-button">Report a bug <span class="material-symbols-rounded bug">pest_control</span></button>
</div>
<iframe width="100%" height="580" frameborder="0"
src="/embed.html?button=both&result=both#code=%2F%2F%0A%2F%2F%20Sample%20Question%208%0A%2F%2F%0A%0Avoid%20swap(int%5B%5D%20arr%2C%20int%20i%2C%20int%20j)%0A%20%20%20%20int%20temp%20←%20arr%5Bi%5D%0A%20%20%20%20arr%5Bi%5D%20←%20arr%5Bj%5D%0A%20%20%20%20arr%5Bj%5D%20←%20temp%0Aend%20swap%0A%0Avoid%20sort(int%5B%5D%20arr%2C%20int%20len)%0A%20%20%20%20int%20pos%20←%200%0A%20%20%20%20while%20(pos%20<%20len)%0A%20%20%20%20%20%20%20%20if%20(pos%20%3D%3D%200)%0A%20%20%20%20%20%20%20%20%20%20%20%20pos%20←%20pos%20%2B%201%0A%20%20%20%20%20%20%20%20else%0A%20%20%20%20%20%20%20%20%20%20%20%20if%20(arr%5Bpos%5D%20>%20arr%5Bpos%20-%201%5D)%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20pos%20←%20pos%20%2B%201%0A%20%20%20%20%20%20%20%20%20%20%20%20else%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20swap(arr%2C%20pos%2C%20pos%20-%201)%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20pos%20←%20pos%20-%201%0A%20%20%20%20%20%20%20%20%20%20%20%20end%20if%0A%20%20%20%20%20%20%20%20end%20if%0A%20%20%20%20end%20while%0Aend%20sort%0A%0Aint%5B%5D%20numbers%20←%20%7B2%2C%201%2C%205%2C%203%2C%204%7D%0Asort(numbers%2C%205)%0Aprint%20numbers%0A">
</iframe>
<h2>Praxly Team</h2>
<div class="people-container">
<div class="team-member">
<img class="member" src="people/saupp.png">
<h3>Ben Saupp</h3>
<div class="member-description"></div>
</div>
<div class="team-member">
<img class="member" src="people/macmillan.png">
<h3>Ellona Macmillan</h3>
<div class="member-description"></div>
</div>
<div class="team-member">
<img class="member" src="people/mayfield.jpg">
<h3>Dr. Chris Mayfield</h3>
<div class="member-description"></div>
</div>
<div class="team-member">
<img class="member" src="people/johnson.png">
<h3>Dr. Chris Johnson</h3>
<div class="member-description"></div>
</div>
<div class="team-member">
<img class="member" src="people/stewart.jpg">
<h3>Dr. Michael Stewart</h3>
<div class="member-description"></div>
</div>
</div>
<!-- <button class="learn-more">Learn More</button> -->
<div class="footer">
<img src="/images/NSF_logo.png" alt="NSF logo" class="logo">
<div class="nsf-ack">
This material is based upon work supported by the National Science Foundation under Grant No.
<a href="https://www.nsf.gov/awardsearch/showAward?AWD_ID=2219770">2219770</a>.
Any opinions, findings, and conclusions or recommendations expressed in this material are those
of the author(s) and do not necessarily reflect the views of the National Science Foundation.
</div>
</div>
</div>
<script>
const praxlyButton = document.querySelector('.praxly-button');
const githubButton = document.querySelector('.github-button');
const peopleContainer = document.querySelector('.people-container');
const learnMoreButton = document.querySelector('.learn-more');
const reportButton = document.querySelector('.report-button');
reportButton.addEventListener('click', function () {
window.open("https://docs.google.com/forms/d/e/1FAIpQLSeo2mUrrhNZejPch9UcQQDHWk5e6ql_xFfFSdS6oiaNA-Tk8Q/viewform", '_blank');
})
praxlyButton.addEventListener('click', function () {
window.open("/main.html", "_blank");
});
githubButton.addEventListener('click', function () {
window.open("https://github.com/JMU-CS/praxly", '_blank');
});
learnMoreButton?.addEventListener('click', function () {
peopleContainer.classList.toggle('active');
peopleContainer.classList.contains('active') ? learnMoreButton.textContent = 'Show Less' : learnMoreButton.textContent = 'Learn More';
});
</script>
</body>
</html>