Interactive Web Sites - CIS250/47

Weekly Schedule

Remember RE-SUBMIT. If you get back a homework with errors and without a grade it means it has not been graded - you need to fix and resubmit to get a grade.

The CIS pool is now available for students that need to access licensed software that they cannot use from home.
Remote access virtual desktop
Instructional video for using Remote Access Virtual Desktop - HTML

Week Information
Assignments due in one week unless otherwise stated. I may add some things during the week, so double check the schedule each week! Please keep copies of all work you submit until you receive your final grade at the end of the semester.
HELP schedule My office hours are 11 on Monday, 2 on Tuesday, and 11 on Wednesday. If it turns out other hours work better for students these may change, so check back. I am also available by request (give me a few time options) especially while we get other support in place. There is access to WiFi from your car under the solar canopies on the Fall River Campus.
DUE DATES Homework is due on May 14th.
I will take a few things after that if we have an email conversation, but everything is due on May 17th.
Because of the technical problems there will be no final unless you personally request one. We would need to talk about dates etc.
One of the things I do at this point is cover sending emails. We are still going over it but I am not sure that we will be able to test emails. IT is working on it now. If we do not get it working, you can just send me the code.
Week #14
Week of May 1st

INFORMATION:

REQUIRED STATUS SHEET
The status sheet must be passed in - I cannot grade until I have checked your work to see if anything is missing!

Check back!
Week #13
Week of April 24th

INFORMATION:

I want you to look up fixed background with scrolling and figure out how to do it. W3schools has an illustration. W3 schools on this

ASSIGNMENTS TO DO:

And then I want you to make a page that does fixed background with scrolling.
Week #12
Week of April 17th

INFORMATION:

I have been sick (not Covid) so I got behind. I am feeling better and will try to get caught up this weekend. Because of the difficult beginning of the semester, I have decided to combine the final and the projects and give one final project.

ASSIGNMENTS TO DO:

I want you to make a web site for a new store that is opening in Fall River. Include Lots of JavaScript, use DOM and interactivity. The JavaScript should use a variety of things you have learned this semester. You should also add in 10 new (ones you have not done) things from the ToDo for last week.
Check back! .
Week #11
Week of April 10th

INFORMATION:

Continuing on with JavaScript.

ASSIGNMENTS TO DO:

To Do
Please do your original examples of the things listed below plus eight more that you decide you would like to see how they are done.
For all our sakes please combine and do not send 20 pages and put in notes to tell me what you are doing.
  1. Slideshow
  2. Responsive Image Grid
  3. Image Overlay
  4. Filter List
  5. Password validation
  6. Zebra Striped Table
  7. Responsive Tables
  8. Modal Boxes
  9. Display Element Hover
  10. To Do List
  11. Flip Card
  12. Responsive Text
Check back!
Week #10
Week of April 3rd

INFORMATION:

There are lots of examples of Hangman games written in JavaScript on the web and in books. Feel free to look at them to help you understand how to write one.
We will also start experimenting with ways to show things like menus etc.
Go to JavaScript how to and explore.

ASSIGNMENTS TO DO:

Please listen to todays recording of the CIS Alum panel.
CIS Alum Panel Spring 2023
I want you to write a Hangman game in JavaScript. You need to include graphics to show the changes to the hangman.
Menu assignment: I want you to write a program using one of the menus discussed in the JavaScript how to. Then modify the program to show a different way of handliig menus. I want you to keep trying until I get 5 different programs handling menus in different ways.
Week #9
Week of March 27th

INFORMATION:

On April 5th there will be a round table discussion of CIS alum talking about their careers and the paths they took. It is always a great session and students tell me how much they benefit from it. There is a question and answer session. The roundtable runs from 12:00 to about 1:00 to 1:30 depending on the conversation. I will post the address. There are several people who work with web development.
This week I want you to read about and experiment with graphics in JavaScript.
Very introductory tutorial
I found a nice group of tutorials by Adam Khoury on youtube but you can also look for others if you do not like his style.
First in a series
Other sources:
I also found this site on drawing graphics
Basic animation
Another explanation of drawing shapes
Experiment and check back! If you can find a good JavaScript editor feel free to use it. I have tried a few free ones but have not found anything I really like.

ASSIGNMENTS TO DO:

I want you to try ten different things in drawing - mostly in one page. They can be modifications of existing examples or original. If you modify please give me the address of the original.
Week#8
Week of March 20th

INFORMATION:

We are going to start out looking at some other data manipulation.
Then I want you to research and read about object-oriented JavaScript. Here are some articles I suggest:
Javascript objects
Objects
Object-Oriented JavaScript
I also am including some more examples of arrays, functions and the try...catch and the =>
Tutorial on => that I found.
Examples of OOP, arrays, functions and misc
If you can find a good JavaScript editor feel free to use it.
I will keep adding little extras to review in the work that follows.

EXAMPLES TO LOOK AT: (look at console.log)

Using stringify and parse
More data
Data to console and screen

TOPIC VIDEOS:

Stringify/parse etc

ASSIGNMENTS TO DO:

Problem #1: Write your own program using the techniques from searchparallel.html and substring.html.
Problem #2: Write your own program using the basic object oriented techniques.
These programs should have examples that incorporate these things into the page and should be reasonably complex.
Check back!
Break/Catch-up
Week of March 13th
In working with the temporary fix using vdi.bristolcc.edu I found that Chrome and Edge worked for me - had trouble with my usual browser Firefox.
Check back!
Week #7
Week of March 6th

INFORMATION:

Note that I added an example under week 6 that might help with that assignment.
Now I want you to do some research on using JSON with JavaScript to get data and create data.
I have been sick this weekend into the week (not Covid) so I am running late getting things up and corrected. Please check back!

EXAMPLES TO LOOK AT:

Examples of arrow notation (no video)
Fetch JSON basic programs zipped
Student Fetch JSON programs zipped

TOPIC VIDEOS:

Fetch JSON basic programs video
Student Fetch JSON programs video

ASSIGNMENTS TO DO:

Do a very basic program fetching information from a very basic JSON tableand producing output.
Use your JSON from last week and process that to produce output.
Check back!
Week #6
Week of February 27th

INFORMATION:

We are going to start out this week by looking at JSON. For those of you who tooks CIS258 this is a review or a repeat... So JSON is this week and using it with JavaScript will follow. Here are some resources, but please do your own research as well.
JSON
JSON tutorial
Learn JSON in 10 minutes
Another introduction to JSON
Note you can validate your JSON at jsonlint to validate

EXAMPLES TO LOOK AT:

Student JSON
Student JSON(text)

TOPIC VIDEOS:

Student JSON video

ASSIGNMENTS TO DO:

Set up a JSON layout to handle a real estate tax bill. You need a parcel id, deed date, owner name, owner address broken down into street, city, state, zip, assessments broken down into land value and building value, an array of quarter payments, total paid YTD, and tax rate per thousand. Check back.
Week #5
Week of February 20th

INFORMATION:

I want you to watch this video which creates a web page and introduces some new things and approaches.
Pets JavaScript video Note that when watching the video you do not have to use codepen, your choice.
When you encounter a language element or technique you do not understand, you should check it out and do some research.

ASSIGNMENTS TO DO:

Now I want you to write a similar problem but make significant changes. Make sure you have a variety of if statements involved in choosing what to display.
As always, check back!
Week #4
Week of February 13th

INFORMATION:

This week we are going to continue with DOM and specifically work with radiobuttons, checkboxes, arrays and functions.
I tried some videos at youtube and this is one you might find helpful:
JS Basics video

EXAMPLES TO LOOK AT: (some output in console.log F12)

Checkbox: 1) chkboxfirst.html 2) chkbox.html 3) chkboxanother.html
Radiobutton: 1) radiobutton.html 2) radiobutton2.html 3) radiobuttonalt.html
Arrays:
arrayfoundation.html
JSarraysintro.html
arraymaintain.html
Arraypropmethod.html
1 and 2 dim arrays
1 and 2 dim arrays (another version)

TOPIC VIDEOS:

Checkbox and Radiobutton:
chkboxJS.mp4
radiobuttonJS.mp4
Arrays:
arrayintrofoundJS.mp4
arraymaintainJS.mp4
moreAraypropmethodJS.mp4
1 and 2 dim arrays

ASSIGNMENTS TO DO:

Programs for week 4
Week #3
Week of February 6th

INFORMATION:

we are going to continue with DOM looking at a variety of things dealing with conditions and loops and some things related to the coding.

EXAMPLES TO LOOK AT: (some output in console.log F12)

Conditions (IF)
While loops
For loops
Some other things:
2 equal vs 3 equal
Alt to concatenate etc
Manipulating data

TOPIC VIDEOS:

Conditional (IF)
While loops
For loops
Some other things:
2 vs 3 equal and alt concatenate
Manipulating data

ASSIGNMENTS TO DO:

Loop, if DOM, functions etc
Check back...
Week #2
Week of January 30th

INFORMATION:

Please look at the DOM examples and videos for DOM under CIS122.

EXAMPLES TO LOOK AT:(look under these headings in CIS122)

"Looking at basic DOM substitutions for document.write"
"More DOM from previous JavaScript"
segments of "Some examples I tried using HTML5 and JavaScript"
"DOM examples"
"More DOM examples"(actually you may want to delay this group)

TOPIC VIDEOS:

We started DOM in week 7 in CIS122 so you will find the videos there. Remember you go to Previous Semesters from my home page to get to last semesters work.

SMARTBOARD, AUDIO AND OTHER NOTES FROM Fall 2019:

You will find the audio lectures and Smartboard also starting at week #7.

ASSIGNMENTS TO DO:

DOM etc assignment
Check back...
Week #1
Week of January 25th

INFORMATION:

Welcome to CIS250
Welcome to CIS250 (youtube version)
The first topic of this course will be a continuation of JavaScript, so please review the JavaScript from CIS122. You should also look at the videos that accompany them. We will look at DOM next week.
Previous courses are available using Previous Semesters from my home page.
Be sure to look at if statements, loops , math facts series and guess game series. I would also like you to look at events and functions.
This book is free to read on line and looks good so you might mark it for reference and use it as a textbook.
Eloquent JavaScript third edition

ASSIGNMENTS TO DO:

Write an HTML with JavaScript program for an invoice.
It should have a space for date to be gotton and name and address to be entered. There should be a series of radio buttons that will give various discounts. Lets say three discounts and a fourth button for 0 or no discount.
The invoice form should have rows about the products ordered including item number, item name, price and quantity. There should be multiple rows.
After the user enters the information, calculate the total before discount and taxes are subtracted. Then using the radio button determine which discount to give. Subtract the discount and the tax at a rate you decide on and give the final total.

Send e-mail to Priscilla Grocer: Priscilla.Grocer@bristolcc.edu

Back to the Top
Return to home page
Return to previous page