finalcut/assign.htm

## assign.htm
<html>
<head>
    <script type="text/javascript">


        class Student{
            constructor(firstName, lastName) {
                this.firstName = firstName;
                this.lastName = lastName;
            }
        }

        class Assignment{
            constructor(subject){
                this.subject = subject;
            }
        }

        class StudentAssignment{
            constructor(student, assignment){
                this.student = student;
                this.assignment = assignment;
            }
        }

        class Course{


            constructor(){
                this.students = [];
                this.assignments = [];
                this.studentAssignments = [];
                return this;
            }

            addStudent(student){
                this.students.push(student);
            }

            getRandomStudent(){
                var val = this.getRandomObjectFromArray(this.students);
                this.students = val.ary;
                return val.obj;
            }

            addAssignment(assignment){
                this.assignments.push(assignment);
            }

            getRandomAssignment(){
                var val = this.getRandomObjectFromArray(this.assignments);
                this.assignments = val.ary;
                return val.obj;
            }


            getRandomObjectFromArray(ary,debug){
                var idx = this.getRandomNumberWithMaxValue(ary.length);
                var obj = ary[idx];
                ary = this.removeFromArrayAtIndex(ary, idx, debug);
                return {'obj': obj, 'ary' :ary};
            }

            createAssignment(){
                var student = this.getRandomStudent();
                var assignment = this.getRandomAssignment();

                var studentAssignment = new StudentAssignment(student, assignment);

                this.studentAssignments.push(studentAssignment);

            }

            showAssignments(){
                var i = 1;
                var tb = document.querySelector('#assignments tbody');

                this.studentAssignments.forEach(function(sa){


                    var tr = document.createElement('tr');

                    if(i % 2 === 0){
                        tr.classList.add('evenRow');
                    }
                    var s = document.createElement('td');
                    var a = document.createElement('td');

                    s.innerText = `${sa.student.firstName} ${sa.student.lastName}`;
                    tr.appendChild(s);

                    a.innerText = `${sa.assignment.subject}`;
                    tr.appendChild(a);

                    tb.appendChild(tr);
                    i++;
                });
            }

            assignAllStudentsATopic(){
                var self = this;

                this.students.forEach(function(s){
                    self.createAssignment();
                });
            }


            // will return
            // an integer (whole number) between 0 and maxValue-1
            // so, if you have an array of six elements and you want
            // a random index value to find a value in that array
            // you'd pass in the array length of six and this would
            // return a value between 0 and 5
            getRandomNumberWithMaxValue(max){
                return Math.floor(Math.random() * max);
            }


            removeFromArrayAtIndex(ary,index,debug){
            if(debug) console.log(index);
            if(index >= 0 && index <= ary.length){
                // we need to know how long the ary array is:
                var lastIndex = ary.length -1;
                if(index === 0){
                    // slice with one argument will get from
                    // the index specified all the way to the end
                    ary = ary.slice(1);
                }
                // removing last person, so we grab from the first
                //to the next to last
                else if(index === lastIndex){
                    ary = ary.slice(0, lastIndex);
                }
                else {
                    // removing someone from the middle of the array

                    // slice will go from the first argument index
                    // and then count out to the second argument number
                    // of indexes to get data.
                    var firstPart = ary.slice(0,index);

                    // slice with only one argument will start at the first
                    // index and then grab all the way to the end of the array
                    var lastPart = ary.slice(index+1);

                    // concat is an array method to concatenate two arrays into
                    // one resulting array.
                    ary = firstPart.concat(lastPart);

                }
            }
            return ary;
        }


        }

        window.onload = function(){

            var c = new Course();

            c.addStudent(new Student('Bill', 'Rawlinson'));

            c.addAssignment(new Assignment('angular 7'));
            c.addAssignment(new Assignment('vue.js'));
            c.addAssignment(new Assignment('react'));
            c.addAssignment(new Assignment('svg'));
            c.addAssignment(new Assignment('REST'));
            c.addAssignment(new Assignment('node'));
            c.addAssignment(new Assignment('mdx'));
            c.addAssignment(new Assignment('babel'));
            c.addAssignment(new Assignment('508 compliance'));
            c.addAssignment(new Assignment('houdini (css future)'));
            c.addAssignment(new Assignment('web components'));
            c.addAssignment(new Assignment('progressive web applications'));
            c.addAssignment(new Assignment('GraphQL'));
            c.addAssignment(new Assignment('Motion UI'));
            c.addAssignment(new Assignment('Next.js'));
            c.addAssignment(new Assignment('Web Assembly (WASM)'));
            c.addAssignment(new Assignment('Platform as a Service (PaaS)'));
            c.addAssignment(new Assignment('unit testing'));


            //c.createAssignment();
            //c.createAssignment();


            c.assignAllStudentsATopic();
            c.showAssignments();
        };


    </script>

    <style type="text/css">
        .evenRow td { background: #eaeaea;}
        table { padding:0; margin: 0; border-collapse: collapse}
    </style>

</head>

<body>

    <table id="assignments">
        <thead>
            <tr>
                <th>Student</th>
                <th>Assignment</th>
            </tr>
        </thead>
        <tbody>

        </tbody>
    </table>
</body>

</html>
	<html>
	<head>
	<script type="text/javascript">


	class Student{
	constructor(firstName, lastName) {
	this.firstName = firstName;
	this.lastName = lastName;
	}
	}

	class Assignment{
	constructor(subject){
	this.subject = subject;
	}
	}

	class StudentAssignment{
	constructor(student, assignment){
	this.student = student;
	this.assignment = assignment;
	}
	}

	class Course{


	constructor(){
	this.students = [];
	this.assignments = [];
	this.studentAssignments = [];
	return this;
	}

	addStudent(student){
	this.students.push(student);
	}

	getRandomStudent(){
	var val = this.getRandomObjectFromArray(this.students);
	this.students = val.ary;
	return val.obj;
	}

	addAssignment(assignment){
	this.assignments.push(assignment);
	}

	getRandomAssignment(){
	var val = this.getRandomObjectFromArray(this.assignments);
	this.assignments = val.ary;
	return val.obj;
	}


	getRandomObjectFromArray(ary,debug){
	var idx = this.getRandomNumberWithMaxValue(ary.length);
	var obj = ary[idx];
	ary = this.removeFromArrayAtIndex(ary, idx, debug);
	return {'obj': obj, 'ary' :ary};
	}

	createAssignment(){
	var student = this.getRandomStudent();
	var assignment = this.getRandomAssignment();

	var studentAssignment = new StudentAssignment(student, assignment);

	this.studentAssignments.push(studentAssignment);

	}

	showAssignments(){
	var i = 1;
	var tb = document.querySelector('#assignments tbody');

	this.studentAssignments.forEach(function(sa){


	var tr = document.createElement('tr');

	if(i % 2 === 0){
	tr.classList.add('evenRow');
	}
	var s = document.createElement('td');
	var a = document.createElement('td');

	s.innerText = `${sa.student.firstName} ${sa.student.lastName}`;
	tr.appendChild(s);

	a.innerText = `${sa.assignment.subject}`;
	tr.appendChild(a);

	tb.appendChild(tr);
	i++;
	});
	}

	assignAllStudentsATopic(){
	var self = this;

	this.students.forEach(function(s){
	self.createAssignment();
	});
	}




	// will return
	// an integer (whole number) between 0 and maxValue-1
	// so, if you have an array of six elements and you want
	// a random index value to find a value in that array
	// you'd pass in the array length of six and this would
	// return a value between 0 and 5
	getRandomNumberWithMaxValue(max){
	return Math.floor(Math.random() * max);
	}


	removeFromArrayAtIndex(ary,index,debug){
	if(debug) console.log(index);
	if(index >= 0 && index <= ary.length){
	// we need to know how long the ary array is:
	var lastIndex = ary.length -1;
	if(index === 0){
	// slice with one argument will get from
	// the index specified all the way to the end
	ary = ary.slice(1);
	}
	// removing last person, so we grab from the first
	//to the next to last
	else if(index === lastIndex){
	ary = ary.slice(0, lastIndex);
	}
	else {
	// removing someone from the middle of the array

	// slice will go from the first argument index
	// and then count out to the second argument number
	// of indexes to get data.
	var firstPart = ary.slice(0,index);

	// slice with only one argument will start at the first
	// index and then grab all the way to the end of the array
	var lastPart = ary.slice(index+1);

	// concat is an array method to concatenate two arrays into
	// one resulting array.
	ary = firstPart.concat(lastPart);

	}
	}
	return ary;
	}


	}

	window.onload = function(){

	var c = new Course();

	c.addStudent(new Student('Bill', 'Rawlinson'));

	c.addAssignment(new Assignment('angular 7'));
	c.addAssignment(new Assignment('vue.js'));
	c.addAssignment(new Assignment('react'));
	c.addAssignment(new Assignment('svg'));
	c.addAssignment(new Assignment('REST'));
	c.addAssignment(new Assignment('node'));
	c.addAssignment(new Assignment('mdx'));
	c.addAssignment(new Assignment('babel'));
	c.addAssignment(new Assignment('508 compliance'));
	c.addAssignment(new Assignment('houdini (css future)'));
	c.addAssignment(new Assignment('web components'));
	c.addAssignment(new Assignment('progressive web applications'));
	c.addAssignment(new Assignment('GraphQL'));
	c.addAssignment(new Assignment('Motion UI'));
	c.addAssignment(new Assignment('Next.js'));
	c.addAssignment(new Assignment('Web Assembly (WASM)'));
	c.addAssignment(new Assignment('Platform as a Service (PaaS)'));
	c.addAssignment(new Assignment('unit testing'));


	//c.createAssignment();
	//c.createAssignment();


	c.assignAllStudentsATopic();
	c.showAssignments();
	};


	</script>

	<style type="text/css">
	.evenRow td { background: #eaeaea;}
	table { padding:0; margin: 0; border-collapse: collapse}
	</style>

	</head>

	<body>

	<table id="assignments">
	<thead>
	<tr>
	<th>Student</th>
	<th>Assignment</th>
	</tr>
	</thead>
	<tbody>

	</tbody>
	</table>
	</body>

	</html>