JavaScript

Practice Assignments

  1. Assignment 1 - Color Palette

    Generate a Color Pallete of 256 different coloured lines drawn one below the other by progressively varying the RGB values. When a button called 'Change1' is clicked successively , the number of lines should get reduced to 64, 32, 16, 8, 4, 2 and 1. When the same button 'Change1' is clicked successively, the number of lines should get increased to 2, 4, 6, 8, 16, 32, 64, 128 and 256 lines each with a different colour shade. When another button 'Change2' is clicked, the set of lines should turn into tiny squares arranged in a grid like manner.


  2. Assignment 2 - Chess Board



    Build a Chess Board with 64 squares alternate white and black with 20 white pieces arranged in Row 1, 2 and 20 black pieces arranged in Row 7, 8. If a button 'Move White' is clicked, the white pawn should move up 2 pieces. If a button 'Move Black' is clicked, the black pawn should move up 2 pieces. Use https://www.unicode.org/charts/PDF/U2600.pdf to represent chess symbols https://en.wikipedia.org/wiki/Chess_symbols_in_Unicode


  3. Assignment 3 - Calendar



    Create a Calendar for the current month with Days of Week shown along the Columns, Sundays shown in Red. Year should be shown in bold and in the centre. PREV button should take you to previous months upto Jan. NEXT button should take you to next months upto Dec. When you click a button called 'Toggle1', the Days of the Week should come along the Rows, all other functionality remaining the same


  4. Assignment 4 - Calculator

    Build a Scientific Calculator with following buttons and a 2 line display
    a) 0, 1, 2, 3, 4, 5, 6, 7, 8, 9
    b) =, +, -, *, /, sqroot, square, cube, +/-, %
    c) sin, cos, tan, log, ln, e, pi, bin, oct, hex, rnd
    d) DEL, M+, MR, C


  5. Assignment 5 - Grocery List
    Build a simple grocery list where you can add items through input box and also remove the items when not required. The following controls are required
    1. Submit button to accept the input item
    2. Edit button for each item already in the list
    3. Delete button for each item already in the list
    4. Clear button to flush out all the items in the list


  6. Assignment 6 - Restuarant Menu Page
    Build a Restuarant Menu Page with title as 'Shubham Fine Dining' and buttons 'All', 'Breakfast', 'Lunch', 'Snacks', 'Dinner'. The page shall display 4 most attractive dishes of the day with Picture, Description and Price. There shall be a way to scroll up and down.


  7. Assignment 7 - Music PlayList
    Build a Music Player playing sequentially from a pre-defined PlayList in a round-robin fashion. Build controls to Play, Stop, Skip Song, Increase Volume, Decrease Volume, Add to Play List, Delete from Play List, Change Play List name, Export Play List.


  8. Assignment 8 - Countdown Timer
    Build a Countdown Timer which shows the number of Days, Hours and Minutes for a particular event to start. Take the event name and event date-time as input. When the event time has reached, an announcement has to be played from an audio file - 'The event is beginning now'


  9. Assignment 9 - Permuations of word 'BEAUTIFUL'
    List all combinations of a 3-letter word 'EAT' and make a function perm3(word3)
    List all combinations of a 4-letter word 'FAST' and make a function perm4(word4)
    List all combinations of a 5-letter word 'SMILE' and make a function perm5(word5)
    List all combinations of a 6-letter word 'FASTER' and make a function perm6(word6)
    List all combinations of a 7-letter word 'SINCERE' and make a function perm7(word7)
    List all combinations of a 8-letter word 'PROGRESS' and make a function perm8(word8)
    List all combinations of a 9-letter word 'BEAUTIFUL' and make a function perm9(word9)


  10. Assignment 10 - Quiz on Countries and Capitals
    Build a Quiz Game on Countries and Capitals using the following dataset. Let the questions come in random order, 'What is the capital of Italy?'. If answer is correct, the user gets 10 marks, else 0 marks. At the end of the Quiz, the total marks should be shown. Along with this, the wrongly answered questions should be shown with the correct answers. Show wrongly answered questions in Red color.
    Washington DC:USA
    London:UK
    New Delhi:India
    Paris:France
    Rome:Italy
    Colombo:Sri Lanka
    Islamabad:Pakistan
    Kabul:Afghanistan