JS Itunes API, JS Input, JS Output w/jquery, JS Output w/API.

JS Grade Average Calculator (JS Input)
Explaining Functions and what they do!

  • newInputLine(index): This function creates a new input box for scores, labels it, and sets it up to receive numeric input. It also handles setting the focus on the new input.
  • calculator(event): This function calculates the total, count, and average of entered scores when the “Tab” or “Enter” key is pressed. It updates the webpage with these values and adds a new input box if all previous scores are valid numeric values.
  • window.onload: This event ensures the first input box is created when the webpage loads, allowing users to start entering scores.

Link to calculator Javascript Average Calculator

Colleges with fees table (JS Output w/jquery)

Colleges Data Table

This Markdown code snippet represents an HTML table used to display information about the top 13 colleges. Here’s a breakdown of its structure:

  • The <table> tag starts the table.
  • Inside, there’s a <thead> section for column headers defined using <th> tags.
  • The </thead> tag closes the header section.
  • The <tbody> section contains data rows with each row enclosed in <tr> tags.
  • In each data row, you use <td> tags for actual data cells.
  • Finally, the </tbody> and </table> tags close the table.
  • This format helps organize and to present colleges and data neatly on a blog like mine.

Link to table Colleges Data Table


JS Output with API
Javascript Wikipedia Search with API

Wikipedia Search Summary Code Explained


*HTML

  1. HTML Head
  • Sets up important settings and the title for the web page.
  1. HTML Body
  • Holds the content, like the search box and area to show Wikipedia summaries.

CSS

  1. Global Styles

Makes the whole page and buttons look nice.

  1. Specific Styles

Makes the summary area and its text look nice.

JavaScript

  1. searchWikipedia() Function
  • Runs when you click the “Search” button to get Wikipedia info.
  1. Get Search Term
  • Grabs what you typed in the search box.
  1. Get Summary Area
  • Finds the area where the summary will show up.
  1. Clear Old Summary
  • Removes any old summary so the new one can show.
  1. Make API URL
  • Puts together the web address to get Wikipedia data.
  1. Fetch Data
  • Goes to Wikipedia to get the summary.
  1. Turn Into JSON
  • Makes the fetched data easy to work with.
  1. Show Summary
  • Takes the Wikipedia summary and puts it on the web page.
  1. Catch Errors
  • If something goes wrong, it shows an error message.

Wikipedia Search Bar



Python IO Input and Output Quiz

Custom Quiz About Simple Python Functions Quiz project in python How to build your own quiz in python
In python there are a variety of ways to code a quiz. You can use basic print statements and input functions or you can use for loops to make the same quiz more concise.
The provided code is a basic quiz program that interacts with users. Here are the elements that make up most of the code:

  • import getpass, sys: This imports the modules.

  • def question_with_answers(prompt): This defines a function that prints a question, collects user input as an answer, and stores the answer

  • questions = 3: This is the total number of questions in the quiz.

  • correct_answers = 0: This variable keeps track of the amout of correct answers.

  • question_list: This list contains the questions for the quiz.

  • ans_list: This list holds the correct answers corresponding to the questions.

The for loop iterates over each question:

  • rsp = question_with_answers(question_list[i]): This line asks the user a question and stores their response into a variable

  • if ans_list[i] == rsp:: This checks if the user’s response matches the correct answer.

  • If the answer is correct, correct_answers added by one, and a success message is displayed.

  • If the answer is incorrect, an print message is shown to help them know they got the question wrong

At the end code displays a completion message for the quiz and calculates the user’s percentage score.


Link to the Quiz
Python IO QUiz

JS API Movie Search Box


This search box uses JavaScript API so extract details from The Movie Database using an API created at that website. It then formats it to produce 8 major details, the name, the movie/series’s poster, overview, rating, release date, genre, Mpaa rating aswell as using the input from the dynamic script and using it to search for trailers about the movie across youtube. Most of the code was done using the air of helpful tools such as my family, friends and chat, but I’ve done the code of the CSS formatting, genre and Mpaa maping.

Parts of the code

  1. fetchMovieData(searchTerm) :This function is responsible for fetching and displaying movie/TV series data based on the search term entered by the user.

  2. getGenre(genreIds): This function takes an array of genre IDs and returns a string containing the corresponding genre names. It’s used to map genre IDs to their names.

  3. getMPAARating(contentRatings): This function takes content ratings data and returns the MPAA rating in a user-friendly format. It maps MPAA ratings from codes to their full names.

  4. getOriginalLanguage(languageCode): This function takes a language code and returns the full name of the language. It’s used to display the original language of the movie/TV series.

  5. formatDate(dateString): This function formats a date string (release date) in the “month/day/year” format. It’s used to format the release date for display.

  6. getYouTubeTrailerLink(searchTerm): This function constructs a YouTube trailer search link based on the search term entered by the user. It’s used to provide a link to search for the movie’s trailer on YouTube.

Different mapping used in this code


  1. Genre mapping
    28: “Action”,
    12: “Adventure”,
    16: “Animation”,
    35: “Comedy”,
    80: “Crime”,
    99: “Documentary”,
    18: “Drama”,
    10751: “Family”,
    14: “Fantasy”,
    36: “History”,
    27: “Horror”,
    10402: “Music”,
    9648: “Mystery”,
    10749: “Romance”,
    878: “Science Fiction”,
    10770: “TV Movie”,
    53: “Thriller”,
    10752: “War”,
    37: “Western”,

  2. Language Mapping
    “en”: “English”,
    “es”: “Spanish”,
    “fr”: “French”,
    “de”: “German”,
    “el”: “Greek”,
    “ga”: “Irish”,
    “hi”: “Hindi”,
    “ru”: “Russian”,
    “ta”: “Tamil”,
    “zh”: “Chinese”,
    “ko”: “Korean”,


  1. MPAA rating mapping
    “G”: “General Audiences”,
    “PG”: “Parental Guidance Suggested”,
    “PG-13”: “Parents Strongly Cautioned”,
    “TV-14”: “For TV Shows above 14”,
    “R”: “Restricted”,
    “NC-17”: “Adults Only”,
    “NR”: “Not Rated”,
    “Unrated”: “Unrated”,


Link to the movie search bar
Movie Search Bar