Commit d7d89845 authored by Dipesh Poudel's avatar Dipesh Poudel
Browse files

'major' changes

parent 03b3f7d1
File added
......@@ -109,13 +109,26 @@ input{
.autocomplete-items div {
padding: 10px;
cursor: pointer;
background-color: #fff;
border-bottom: 1px solid #d4d4d4;
background-color: #fff;
border-bottom: 1px solid #d4d4d4;
}
.autocomplete-items div:hover {
background-color: #e9e9e9;
background-color: #e9e9e9;
}
.autocomplete-active {
background-color: DodgerBlue !important;
color: #ffffff;
}
\ No newline at end of file
background-color: DodgerBlue !important;
color: #ffffff;
}
/* STUFF FOR MAJOR SELECTION (DIPESH) */
#major-search-container{
width: 100%;
height: 100%;
padding-top: 50%;
text-align: center;
}
#major-search-container span{
font-size: 12px;
}
File added
var major = [
"African and African American Studies",
"Ancient and Classical Studies",
"Archaeology",
"Art",
"Athletics Wellness and Physical Education",
"Biochemistry",
"Biology",
"Chemistry",
"Chinese Languages",
"Chinese Studies",
"Comparative Languages and Linguistics",
"Computer Science",
"East Asian Studies",
"Economics",
"English",
"Environmental Sustainability",
"Film Studies",
"French and Francophone Studies",
"Geology",
"German Language and Literature",
"Global Management",
"History",
"Human Development and Social Relations",
"International Studies",
"Japanese Language and Linguistics",
"Japanese Studies",
"Jewish Studies",
"Languages and Cultures",
"Master of Arts in Teaching",
"Master of Education",
"Mathematics",
"Museum Studies",
"Music",
"Neuroscience",
"Peace and Global Studies",
"Philosophy",
"Physics and Astronomy",
"Politics",
"Psychology",
"Public Health",
"Public Policy",
"Religion",
"Sociology and Anthropology",
"Spanish and Hispanic Studies",
"Teaching English to Speakers of Other Languages",
"Theatre Arts",
"Women's Gender Sexuality Studies"
]
African and African American Studies
Ancient and Classical Studies
Archaeology
Art
Athletics Wellness and Physical Education
Biochemistry
Biology
Chemistry
Chinese Languages
Chinese Studies
Comparative Languages and Linguistics
Computer Science
East Asian Studies
Economics
English
Environmental Sustainability
Film Studies
French and Francophone Studies
Geology
German Language and Literature
Global Management
History
Human Development and Social Relations
International Studies
Japanese Language and Linguistics
Japanese Studies
Jewish Studies
Languages and Cultures
Master of Arts in Teaching
Master of Education
Mathematics
Museum Studies
Music
Neuroscience
Peace and Global Studies
Philosophy
Physics and Astronomy
Politics
Psychology
Public Health
Public Policy
Religion
Sociology and Anthropology
Spanish and Hispanic Studies
Teaching English to Speakers of Other Languages
Theatre Arts
Women's Gender Sexuality Studies
......@@ -13,5 +13,8 @@
<script src="public/js/main.js"></script>
<script src="data/careers-data.js"></script>
<script src="public/js/careers.js"></script>
<script src="data/major-data.js"></script>
<script src="public/js/major.js"></script>
</body>
</html>
\ No newline at end of file
</html>
// Test data for now
// Mimic form of JSON input for future development
var items = [{
'name': "First Year Advising",
'items': [],
'type': "circle-1",
'column': 0
},
{
'name': "Career Exploration",
'items': [],
'type': "circle-2",
'column': 0
},
{
'name': "Campus Life",
'items': [],
'type': "square-2",
'column': 1
},
{
'name': "Community Engagement",
'items': [],
'type': "square-5",
'column': 1
},
{
'name': "Career Exploration",
'items': [],
'type': "circle-1",
'column': 1
},
{
'name': "Major Selection",
'items': [],
'type': "square-3",
'column': 2
},
{
'name': "Research",
'items': [],
'type': "square-4",
'column': 2
},
{
'name': "Internship",
'items': [],
'type': "square-5",
'column': 2
},
{
'name': "Off-Campus Study",
'items': [],
'type': "square-1",
'column': 3
},
{
'name': "Career",
'items': [],
'type': "square-2",
'column': 3
}];
var container = document.getElementById("flow-chart-container");
var columns = items[items.length - 1].column;
// main render
function main(){
// loop over the colums in in the chart
console.table(items);
console.log(columns);
for (j = 0; j < columns + 1; j++){
var column = document.createElement('div');
column.className = 'flow-chart-column';
// loop over the items in each column
for (i = 0; i < items.length; i++){
if (items[i].column == j) {
var line = document.createElement('div');
line.className = 'flow-chart-line-down';
line.innerHTML = "<svg height='40px' width='100%'><line x1='50%' y1='0' x2='50%' y2='40' stroke-dasharray='4' style='stroke:rgb(0,0,0);stroke-width:2' /></svg>"
// create div of specific shape
var elem = document.createElement("div");
elem.className = "flow-chart-block flow-chart-" + items[i].type;
// create text to go in div
var text = document.createElement("p");
text.innerText = items[i].name;
// append elements together
elem.append(text);
column.append(line);
column.append(elem);
}
}
var endline = document.createElement('div');
endline.className = 'flow-chart-line-down';
endline.innerHTML = "<svg height='40px' width='100%'><line x1='50%' y1='0' x2='50%' y2='40' stroke-dasharray='4' style='stroke:rgb(0,0,0);stroke-width:2' /></svg>"
if (j != columns){
column.append(endline);
}
container.append(column);
}
}
main();
console.log(major);
var container_name = 'Major Selection';
var container = document.getElementById(container_name);
//create search obj
var search_container = document.createElement("div");
search_container.id = 'major-search-container';
var search = document.createElement("INPUT");
search.id = 'myInput'
search.setAttribute("type", "text");
search.setAttribute("value", "");
prompt = document.createElement('span');
prompt.innerHTML = 'Search for Major:';
search_container.appendChild(prompt);
search_container.appendChild(search);
container.appendChild(search_container);
names_for_search = [];
for(x=0;x<major.length;x++){
names_for_search.push(major[x]);
}
function autocomplete(inp, arr) {
var currentFocus;
inp.addEventListener("input", function(e) {
var a, b, i, val = this.value;
closeAllLists();
if (!val) { return false;}
currentFocus = -1;
a = document.createElement("DIV");
a.setAttribute("id", this.id + "autocomplete-list");
a.setAttribute("class", "autocomplete-items");
this.parentNode.appendChild(a);
for (i = 0; i < arr.length; i++) {
if (arr[i].substr(0, val.length).toUpperCase() == val.toUpperCase()) {
b = document.createElement("DIV");
b.innerHTML = "<strong>" + arr[i].substr(0, val.length) + "</strong>";
b.innerHTML += arr[i].substr(val.length);
b.innerHTML += "<input type='hidden' value='" + arr[i] + "'>";
b.addEventListener("click", function(e) {
inp.value = this.getElementsByTagName("input")[0].value;
closeAllLists();
});
a.appendChild(b);
}
}
});
inp.addEventListener("keydown", function(e) {
var x = document.getElementById(this.id + "autocomplete-list");
if (x) x = x.getElementsByTagName("div");
if (e.keyCode == 40) {
currentFocus++;
addActive(x);
} else if (e.keyCode == 38) { //up
currentFocus--;
addActive(x);
} else if (e.keyCode == 13) {
e.preventDefault();
if (currentFocus > -1) {
if (x) x[currentFocus].click();
}
}
});
function addActive(x) {
if (!x) return false;
removeActive(x);
if (currentFocus >= x.length) currentFocus = 0;
if (currentFocus < 0) currentFocus = (x.length - 1);
x[currentFocus].classList.add("autocomplete-active");
}
function removeActive(x) {
for (var i = 0; i < x.length; i++) {
x[i].classList.remove("autocomplete-active");
}
}
function closeAllLists(elmnt) {
var x = document.getElementsByClassName("autocomplete-items");
for (var i = 0; i < x.length; i++) {
if (elmnt != x[i] && elmnt != inp) {
x[i].parentNode.removeChild(x[i]);
}
}
}
document.addEventListener("click", function (e) {
closeAllLists(e.target);
});
}
autocomplete(document.getElementById("myInput"), names_for_search);
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment