[ { "id": "remote:physicstjc:prime-game", "title": "\"Guess the Prime Number\" Game", "folder": "prime-game", "folderPath": "prime-game/", "indexPath": "https://physicstjc.github.io/sls/prime-game/index.html", "hasPrompt": true, "promptText": "Create a website with a game that allows users to guess a prime number between 1 to 1000.\nWhen the user guesses correctly, there will be a congratulatory message.\nWhen the user guesses wrongly, there will be a message telling the user if the number entered is not a prime number, or if the number entered is too small or too big.\nA input box will be used to enter the number.\nThere will be a log of the guesses made as well as whether the guess is non-prime, or too big or too small.\nRefinement 1: Put all these in a single file.\nRefinement 2: The correct number must be randomly selected from a list of prime numbers from 1 to 1000. Inform the user whether the guess is too small or too big.\nRefinement 3: Reject the entry if it is not a prime number. Inform the user if it is not a prime number.\nRefinement 4: The randomly generated prime number should remain the same until the user guesses it correctly.\nCreate a button to restart the game and reset all the values.\nRedesign the website to make it more aesthetically pleasing. For the list of guesses, make it such that each guess appears in a new row.", "hasZip": true, "zipPath": "https://physicstjc.github.io/sls/prime-game/prime-game.zip", "hasPromptImage": false, "promptImagePath": null, "promptImageExt": null, "hasKnowledgeBase": false, "knowledgeBasePath": null, "knowledgeBaseExt": null }, { "id": "remote:physicstjc:acoustic-stopwatch", "title": "Acoustic Stopwatch", "folder": "acoustic-stopwatch", "folderPath": "acoustic-stopwatch/", "indexPath": "https://physicstjc.github.io/sls/acoustic-stopwatch/", "hasPrompt": true, "promptText": "Create a webpage with javascript and html that serves as an acoustic stopwatch.\nA start button will be used to begin listening for the first loud sound in order to start the timing.\nThe timer will start only when a sound louder than a predetermined threshold is detected by the microphone of the device after pressing the start button.\nIt will stop when a second sound that is louder than the same threshold is detected.\nUse a slider to vary the threshold of sound.\nUse another slider to adjust the minimum delay before the timer will stop with the second sound.\nDisplay the time in seconds and milliseconds.\nGeneral Tools", "hasZip": true, "zipPath": "https://physicstjc.github.io/sls/acoustic-stopwatch/acoustic-stopwatch.zip", "hasPromptImage": false, "promptImagePath": null, "promptImageExt": null, "hasKnowledgeBase": false, "knowledgeBasePath": null, "knowledgeBaseExt": null }, { "id": "remote:physicstjc:calculator", "title": "Basic Calculator", "folder": "calculator", "folderPath": "calculator/", "indexPath": "https://physicstjc.github.io/sls/calculator/", "hasPrompt": true, "promptText": "Create a webpage with a basic calculator, with the digits and operators in square buttons arranged in a usual calculator arrangement.\nAllow keyboard entries as alternative input method.", "hasZip": true, "zipPath": "https://physicstjc.github.io/sls/calculator/calculator.zip", "hasPromptImage": false, "promptImagePath": null, "promptImageExt": null, "hasKnowledgeBase": false, "knowledgeBasePath": null, "knowledgeBaseExt": null }, { "id": "remote:physicstjc:bohr-model", "title": "Bohr's Model of the Atom", "folder": "bohr-model", "folderPath": "bohr-model/", "indexPath": "https://physicstjc.github.io/sls/bohr-model/index.html", "hasPrompt": true, "promptText": "Create a website with a HTML5 canvas to show the bohr model of atoms of elements from 1 to 20 in the periodic table. Put all the codes in one page.\nThere should be a drop-down menu to choose the element. The image shown will update upon change in the drop-down menu.\nThe nucleus should be a dark yellow circle showing the chemical symbol and name of the element, as well as number of protons and neutrons, e.g. 1p; 1n for hydrogen.\nThere should be up to 4 concentric circles of different radii to represent the shells of the atom.\nThe electrons should be shown as coloured dots along the circumference of the circles representing the shells.\nThe first two dots of each shell shall be blue while the others will be red.\nDisplay the dots on the lines of the circles of the shell.\nThe number of electrons shown should be the same as the number of protons for each element.", "hasZip": true, "zipPath": "https://physicstjc.github.io/sls/bohr-model/bohr-model.zip", "hasPromptImage": false, "promptImagePath": null, "promptImageExt": null, "hasKnowledgeBase": false, "knowledgeBasePath": null, "knowledgeBaseExt": null }, { "id": "remote:physicstjc:bouncing-ball", "title": "Bouncing Ball", "folder": "bouncing-ball", "folderPath": "bouncing-ball/", "indexPath": "https://physicstjc.github.io/sls/bouncing-ball/index.html", "hasPrompt": true, "promptText": "Put all the codes in one page.\nCreate a canvas showing a ball dropped from rest from a height and bouncing off the ground using javascript.\nUsing the plotly library, plot the graph of velocity versus time for the ball. The time of contact with the ground is negligible.\nCreate an input box that allows the user to key in the initial height in metres.\nCreate a slider that changes the percentage energy loss after every collision with the ground.\nCreate a dropdown menu that changes the vertical axis to velocity or displacement.\nInitialise the animation and graph upon loading. Use a button to start and stop the animation.\nLimit the entire page to a size of max width 580px and max height: 460px by putting the canvas and graph side by side", "hasZip": true, "zipPath": "https://physicstjc.github.io/sls/bouncing-ball/bouncing-ball.zip", "hasPromptImage": false, "promptImagePath": null, "promptImageExt": null, "hasKnowledgeBase": false, "knowledgeBasePath": null, "knowledgeBaseExt": null }, { "id": "remote:physicstjc:brownian-motion", "title": "Brownian Motion", "folder": "brownian-motion", "folderPath": "brownian-motion/", "indexPath": "https://physicstjc.github.io/sls/brownian-motion/index.html", "hasPrompt": true, "promptText": "Create an interactive animation to demonstrate how air molecules move using HTML5 and javascript, putting the codes in one page.\nThere are about 500 grey monoatomic particles moving randomly and continuously in a vacuum in the canvas. The canvas has a width of 600 px and height of 400 px.\nThe grey particles that are in constant motion in straight lines with the same initial speed and directions until they collide against the wall of the container or against each other.\n1 red monoatomic particles of mass that is 100 times that of a grey particle will originate from the centre of the box and interact with the grey particles through collisions.\nAfter each collision, they will bounce off in another direction, obeying the conservation of momentum and conservation of kinetic energy.\nThere should be a slider to increase the initial speeds of the particles.\nThere should be a checkbox to change the grey particles to white while the red particle remains visible.", "hasZip": true, "zipPath": "https://physicstjc.github.io/sls/brownian-motion/brownian-motion.zip", "hasPromptImage": false, "promptImagePath": null, "promptImageExt": null, "hasKnowledgeBase": false, "knowledgeBasePath": null, "knowledgeBaseExt": null }, { "id": "remote:physicstjc:camera-brightness-recorder", "title": "Camera Brightness Recorder", "folder": "camera-brightness-recorder", "folderPath": "camera-brightness-recorder/", "indexPath": "https://physicstjc.github.io/sls/camera-brightness-recorder/", "hasPrompt": true, "promptText": "Create a webpage with html and javascript that obtains information from the computer's sensors such as brightness.\nDisplay the brightness information.\nUse a start and stop button to being and end the sampling.\nUse a slider to control the sampling rate.\nRecord the brightness data in a list at the bottom with the timestamp.\nCreate a button to download the data in csv format.", "hasZip": true, "zipPath": "https://physicstjc.github.io/sls/camera-brightness-recorder/camera-brightness-recorder.zip", "hasPromptImage": false, "promptImagePath": null, "promptImageExt": null, "hasKnowledgeBase": false, "knowledgeBasePath": null, "knowledgeBaseExt": null }, { "id": "remote:physicstjc:chinese-word-game", "title": "Chinese Word Game", "folder": "chinese-word-game", "folderPath": "chinese-word-game/", "indexPath": "https://physicstjc.github.io/sls/chinese-word-game/index.html", "hasPrompt": true, "promptText": "Provide the code for the following in a single html file:\nI'd like to create a webpage with a game to help people learn Chinese 成语 (Chengyu), which are interesting idiomatic expressions in Chinese. /li>\nEach 成语 will consist of 4 words, but one word will be replaced by a blank or line.\nThe missing word is the one that the player needs to guess.\nThe game screen will show 4 options for the missing word.\nOptions will be displayed as bubbles floating around the screen.\nThe bubbles should move slowly and randomly across the screen and bounce off the walls. They must remain within the box.\nThe player needs to click on the correct bubble corresponding to the missing word.\nOnce the correct bubble is clicked, the completed 成语 will be shown on the screen.\nOne point will be added to the player's score for each correct guess.\nAfter the player answers one question, the next question will be displayed automatically.", "hasZip": true, "zipPath": "https://physicstjc.github.io/sls/chinese-word-game/chinese-word-game.zip", "hasPromptImage": false, "promptImagePath": null, "promptImageExt": null, "hasKnowledgeBase": false, "knowledgeBasePath": null, "knowledgeBaseExt": null }, { "id": "remote:physicstjc:coin-addition", "title": "Coin Addition", "folder": "coin-addition", "folderPath": "coin-addition/", "indexPath": "https://physicstjc.github.io/sls/coin-addition/index.html", "hasPrompt": true, "promptText": "Create a quiz website on how to add values of coins.\nUse a button to generate a new problem with a random number of coins of varying values such as 5 cents (represented by image file \"TS5c.jpg\"), 10 cents (represented by image file \"TS10c.jpg\"), 20 cents (represented by image file \"TS20c.jpg\"), 50 cents (represented by image file \"TS50c.jpg\") and 1 dollar (represented by image file \"TS1d.jpg\").\nDisplay the number of coins as required by duplicating the images.\nUse an input box with a submit button to check the value of coins added in terms of dollars.\nPut a dollar sign in front of the input box.\nCentralise all the messages and elements.\nUse a button to generate a new question.", "hasZip": true, "zipPath": "https://physicstjc.github.io/sls/coin-addition/coin-addition.zip", "hasPromptImage": false, "promptImagePath": null, "promptImageExt": null, "hasKnowledgeBase": false, "knowledgeBasePath": null, "knowledgeBaseExt": null }, { "id": "remote:physicstjc:countdown-timer", "title": "Countdown Timer", "folder": "countdown-timer", "folderPath": "countdown-timer/", "indexPath": "https://physicstjc.github.io/sls/countdown-timer/index.html", "hasPrompt": true, "promptText": "Provide the code for the following in a single html file:\nCreate a webpage: This is a basic instruction to start building a webpage.\nAdd a countdown timer: We want to include a timer that counts down from a specified time.\nAllow setting hours, minutes, and seconds: Users should be able to input the duration of the countdown by setting the hours, minutes, and seconds individually.\nInclude buttons for adjustment: Add buttons labeled with \"+H\", \"-H\", \"+M\", \"-M\", \"+S\", and \"-S\" for users to increase or decrease the hours, minutes, and seconds as they desire.\nStyling the webpage: Use CSS to style the webpage for a visually appealing appearance. This includes setting fonts, colors, and layout.\nAdd functionality for starting, pausing, and resetting the timer: Implement JavaScript functions for starting, pausing, and resetting the countdown timer. These functions should be triggered by clicking corresponding buttons.\nIncorporate sound: When the timer reaches zero, play a sound from an audio file (alarm.mp3).\nInclude a mute button: After the sound starts playing, display a button labeled \"Mute\" that allows users to mute or unmute the sound.", "hasZip": true, "zipPath": "https://physicstjc.github.io/sls/countdown-timer/countdown-timer.zip", "hasPromptImage": false, "promptImagePath": null, "promptImageExt": null, "hasKnowledgeBase": false, "knowledgeBasePath": null, "knowledgeBaseExt": null }, { "id": "remote:physicstjc:delight", "title": "Delight - A Turn-Based Board Game on Electricity", "folder": "delight", "folderPath": "delight/", "indexPath": "https://physicstjc.github.io/sls/delight/", "hasPrompt": true, "promptText": "Create a game board using 16 squares in a 4-by-4 grid with html and javascript. In each square, there is a space of 100 pixels by 100 pixels where an image can be placed. The squares will be the placeholders for the images.\nOn the top left corner, the image file \"positive.png\" is shown. On the bottom right corner, the image file \"negative.png\" is shown.\nBelow the 4 by 4 grid, there is a line if images two users can take turns to choose from: \"cross-wires.png\", \"r-wires-0.png\", \"t-wires-0.png\", \"straight-wire-0.png\", \"yellow-light-0.png\" and \"red-light-0.png\".\nChange the css such that when an image is chosen, it will grey out slightly\nUpon clicking an image that had been placed in the grids, the image will rotate by 90 degrees clockwise.\nInclude an undo button to reverse the last step.\nAssessment", "hasZip": true, "zipPath": "https://physicstjc.github.io/sls/delight/delight.zip", "hasPromptImage": false, "promptImagePath": null, "promptImageExt": null, "hasKnowledgeBase": false, "knowledgeBasePath": null, "knowledgeBaseExt": null }, { "id": "remote:physicstjc:dice", "title": "Dice Simulator", "folder": "dice", "folderPath": "dice/", "indexPath": "https://physicstjc.github.io/sls/dice/index.html", "hasPrompt": true, "promptText": "Provide the code for the following in a single html file:\nCreate a 6-sided dice simulator where the user can click on the image of a dice, the dice image will change randomly and the final result will be shown on the image.\nThe dice image will be represented by the file \"dice1.png\" for the number 1, \"dice2.png\" for number 2, \"dice3.png\" for number 3 and so on. The image size is 80 pixels by 80 pixels.\nThe default setting shows one dice. The initial image shown is \"dice1.png\".\nCreate a button to cast the dice.\nCreate a bar chart with 6 vertical columns at the bottom that shows the frequency of the numbers obtained by the dice. Adjust the bar chart to show all 6 possible outcomes.\nEach time the dice is cast and the result is shown, it is added to a list shown below the chart.\nCreate a button for an option to toggle between the use of one dice or two die. When this button is clicked, the list of results and the bar chart is cleared. The initial images shown are both \"dice1.png\". If two die are used, both die will be shown side by side.\nBoth die will be cast when clicking on either dice. The bar chart now shows the frequency of the total of the numbers obtained by the die. Adjust the bar chart such that it now has 12 vertical columns show all 12 possible outcomes.\nThe total number for each toss will be shown in the list.", "hasZip": true, "zipPath": "https://physicstjc.github.io/sls/dice/dice.zip", "hasPromptImage": false, "promptImagePath": null, "promptImageExt": null, "hasKnowledgeBase": false, "knowledgeBasePath": null, "knowledgeBaseExt": null }, { "id": "remote:physicstjc:definitions", "title": "Digital Flashcards", "folder": "definitions", "folderPath": "definitions/", "indexPath": "https://physicstjc.github.io/sls/definitions/index.html", "hasPrompt": true, "promptText": "Create a revision webpage using html, javascript and css that references a csv file in the same folder with three columns: \"topic\", \"term\" and \"definition\". There should be a filter for the \"topic\" field. Each term in the \"term\" field will be displayed in turn using a left and right button. Another button labelled \"Definition\" will be used to show or hide the corresponding \"definition\" field at the bottom. Put all the script and style codes in the html file.", "hasZip": true, "zipPath": "https://physicstjc.github.io/sls/definitions/definitions.zip", "hasPromptImage": false, "promptImagePath": null, "promptImageExt": null, "hasKnowledgeBase": false, "knowledgeBasePath": null, "knowledgeBaseExt": null }, { "id": "remote:physicstjc:earth-moon-system", "title": "Earth-Moon System", "folder": "earth-moon-system", "folderPath": "earth-moon-system/", "indexPath": "https://physicstjc.github.io/sls/earth-moon-system/index.html", "hasPrompt": true, "promptText": "Create a 2D animation of the revolution of the Moon around the Earth.\nThe Earth is drawn as a green circle at the center of the canvas.\nShow the rotation of the moon about its own axis with the same time as it takes to move one round around the earth.\nUse two coloured hemispheres to represent the Moon, with the darker hemisphere facing away from the Earth.", "hasZip": true, "zipPath": "https://physicstjc.github.io/sls/earth-moon-system/earth-moon-system.zip", "hasPromptImage": false, "promptImagePath": null, "promptImageExt": null, "hasKnowledgeBase": false, "knowledgeBasePath": null, "knowledgeBaseExt": null }, { "id": "remote:physicstjc:electric-potential", "title": "Electric Potential of Two Charges", "folder": "electric-potential", "folderPath": "electric-potential/", "indexPath": "https://physicstjc.github.io/sls/electric-potential/index.html", "hasPrompt": true, "promptText": "Create a web app to represent the electric potential of two charged particles.\nThe two particles should be represented as dots along a straight line, with the midpoint being x=0.\nThe electric potential for each particle should be drawn using plotly.js. The vertical axis of the graph should be that of electric potential. The horizontal axis is the distance from the centre of the first particle.\nThe sum of the two electric potentials should be represented on the same axes as well.\nShow all the codes in one html file.\nMake the curve smooth.\nUse sliders to change the charge of each particle separately (both negative and positive values)\nUse a sliider to change the distance between the two particles.\nUpdate the curves with the sliders.\nKeep the range of values in the axes fixed.\nUse a checkbox to toggle the visibility of the total potential graph.", "hasZip": true, "zipPath": "https://physicstjc.github.io/sls/electric-potential/electric-potential.zip", "hasPromptImage": false, "promptImagePath": null, "promptImageExt": null, "hasKnowledgeBase": false, "knowledgeBasePath": null, "knowledgeBaseExt": null }, { "id": "remote:physicstjc:stationary-waves", "title": "Formation of Stationary Waves", "folder": "stationary-waves", "folderPath": "stationary-waves/", "indexPath": "https://physicstjc.github.io/sls/stationary-waves/index.html", "hasPrompt": true, "promptText": "For the index page:\nCreate a graph using plotly.js with a vertical axis for displacement of wave particles and a horizontal axis for distance moved by a wave. .\nDraw the curve of an infinitely long transverse wave moving along the horizontal axis.\nCreate another infinitely long transverse wave of the same wavelength moving in the opposite direction along the same horizontal axis. Represent them in different colours.\nUse a slider to change the period of oscillation of both waves and another slider to change the wavelength of the waves.\nEach wave should have the same wavelength.\nRevised prompt: Keep the vertical axis fixed in height, equal to the maximum possible amplitude of the third wave.\nRevised prompt: Keeep the legend of the chart to the bottom so that the horizontal axis length is fixed at 640 pixels\nFor the second page:\nHave separate sliders for the amplitudes, periods and wavelengths of wave 1 and wave 2.\nDisplay the values of the sliders next to them.", "hasZip": true, "zipPath": "https://physicstjc.github.io/sls/stationary-waves/stationary-waves.zip", "hasPromptImage": false, "promptImagePath": null, "promptImageExt": null, "hasKnowledgeBase": false, "knowledgeBasePath": null, "knowledgeBaseExt": null }, { "id": "remote:physicstjc:gm-counter", "title": "Geiger-Muller Counter", "folder": "gm-counter", "folderPath": "gm-counter/", "indexPath": "https://physicstjc.github.io/sls/gm-counter/index.html", "hasPrompt": true, "promptText": "Putting all the codes in one page, create a html and javascript simulation of a geiger muller counter.\nDisplay a graph using plotly that updates the total counts after each sampling\nA start and stop button should begin recording the counts. Show a timer as well.\nCreate a drop-down menu to display one of 3 graphs: the line for the cumulative background count, the sample count for each second and the count per minute.\nCreate a drop-down menu to select 3 different radioactive sources: background radiation, a banana and another real-life example of a sample used in physics labs that has more counts per minute than a banana.\nUpon changing the sample, reset all the graphs.\nKeep the entire page to within 560 px width and 480 px height.", "hasZip": true, "zipPath": "https://physicstjc.github.io/sls/gm-counter/gm-counter.zip", "hasPromptImage": false, "promptImagePath": null, "promptImageExt": null, "hasKnowledgeBase": false, "knowledgeBasePath": null, "knowledgeBaseExt": null }, { "id": "remote:physicstjc:graph-plotter", "title": "Graph Plotter", "folder": "graph-plotter", "folderPath": "graph-plotter/", "indexPath": "https://physicstjc.github.io/sls/graph-plotter/index.html", "hasPrompt": true, "promptText": "Create a website using html and javascript for users to plot a graph using data from a csv file.\nThe user can upload a csv file with the first column being the horizontal axis and the second column being the vertical axis.\nThe column headers, which is the first set of values in the csv file, will form the labels for the axes of the graph.\nPlot the points with the data in the csv file and use linear regression to obtain the best-fit straight line of the data.\nThe best fit line should be a line joining two red dots.\nIndicate the gradient and intercept of the best-fit line.\nAdd a button at the bottom for users to take a screenshot of the graph.\nPut all the codes in one html file.", "hasZip": true, "zipPath": "https://physicstjc.github.io/sls/graph-plotter/graph-plotter.zip", "hasPromptImage": false, "promptImagePath": null, "promptImageExt": null, "hasKnowledgeBase": false, "knowledgeBasePath": null, "knowledgeBaseExt": null }, { "id": "remote:physicstjc:guess-word", "title": "Hangman", "folder": "guess-word", "folderPath": "guess-word/", "indexPath": "https://physicstjc.github.io/sls/guess-word/index.html", "hasPrompt": true, "promptText": "Create a hangman game based on keywords in physics such as \"impulse\", \"momentum\" and \"inelastic\" for the user to guess one word at a time.\nThe number of blanks that are shown is the number of letters in the selected word.\nLeave a space between each blank.\nThe guessing is done letter by letter.\nFor each correct guess, add one point to the score\nFor each incorrect guess, deduct one point. Keep score until all the words are completed.\nDisplay the score. Put all the codes in one html file. Celebrate the completion of each word.", "hasZip": true, "zipPath": "https://physicstjc.github.io/sls/guess-word/guess-word.zip", "hasPromptImage": false, "promptImagePath": null, "promptImageExt": null, "hasKnowledgeBase": false, "knowledgeBasePath": null, "knowledgeBaseExt": null }, { "id": "remote:physicstjc:converter", "title": "HTML File Generator", "folder": "converter", "folderPath": "converter/", "indexPath": "https://physicstjc.github.io/sls/converter/index.html", "hasPrompt": true, "promptText": "Create a website with a large input box with adjustable dimensions. The aim of this site is to convert codes written into the box into html.\nWhatever the user keys in, when a button is clicked, save the content as plain text and download it as an \"index.html\" file.\nCreate another button for the codes to run in another browser tab as a html file without downloading.", "hasZip": true, "zipPath": "https://physicstjc.github.io/sls/converter/converter.zip", "hasPromptImage": false, "promptImagePath": null, "promptImageExt": null, "hasKnowledgeBase": false, "knowledgeBasePath": null, "knowledgeBaseExt": null }, { "id": "remote:physicstjc:irat", "title": "Individual Readiness Assurance Test (iRAT)", "folder": "irat", "folderPath": "irat/", "indexPath": "https://physicstjc.github.io/sls/irat/index.html", "hasPrompt": true, "promptText": "Create a webpage where students can enter their options for a series of 10 multiple-choice questions with 4 options. Display 10 rows of four options A, B, C and D. Each option exists as a button. Each question should be part of an ordered list.\nThere is no need to check the answer but when an option is chosen, the lightgrey buttons should turn lightblue in colour.\nIf a button is selected, when i click on it again, it should become unselected.\nInclude a button that triggers the export of a csv file with every question and its corresponding chosen option.", "hasZip": true, "zipPath": "https://physicstjc.github.io/sls/irat/irat.zip", "hasPromptImage": false, "promptImagePath": null, "promptImageExt": null, "hasKnowledgeBase": false, "knowledgeBasePath": null, "knowledgeBaseExt": null }, { "id": "remote:physicstjc:interactive-graph", "title": "Interactive Graph", "folder": "interactive-graph", "folderPath": "interactive-graph/", "indexPath": "https://physicstjc.github.io/sls/interactive-graph/index.html", "hasPrompt": true, "promptText": "Provide the code for the following in a single html file:\nCreate a html webpage that has a graph with a vertical axis labelled \"velocity\" and horizontal axis labelled \"time\". The range of values for the vertical axis is from zero to 10 m/s while the range of values for the horizontal axis is 0 to 8 seconds.\nA red line representing a change in velocity from zero to 10 m/s in 8 seconds is shown.\nA blue horizontal line is at a height that is variable, adjustable using a slider to change the variable.\nThere should be a button for a screenshot of the graph to be taken and downloaded.", "hasZip": true, "zipPath": "https://physicstjc.github.io/sls/interactive-graph/interactive-graph.zip", "hasPromptImage": false, "promptImagePath": null, "promptImageExt": null, "hasKnowledgeBase": false, "knowledgeBasePath": null, "knowledgeBaseExt": null }, { "id": "remote:physicstjc:interactive-story", "title": "Interactive Story", "folder": "interactive-story", "folderPath": "interactive-story/", "indexPath": "https://physicstjc.github.io/sls/interactive-story/index.html", "hasPrompt": true, "promptText": "Create a single html page where an interactive story with multiple story arcs can be presented. Users can choose to go to one page or another.\nAdd a button for the function to read out the text in the story.\nCreate a sample story.", "hasZip": true, "zipPath": "https://physicstjc.github.io/sls/interactive-story/interactive-story.zip", "hasPromptImage": false, "promptImagePath": null, "promptImageExt": null, "hasKnowledgeBase": false, "knowledgeBasePath": null, "knowledgeBaseExt": null }, { "id": "remote:physicstjc:interactive-video", "title": "Interactive Video", "folder": "interactive-video", "folderPath": "interactive-video/", "indexPath": "https://physicstjc.github.io/sls/interactive-video/index.html", "hasPrompt": true, "promptText": "Make a webpage using html, javascript and css and put a video player on it. Also, create a space where questions can appear later.\nMake the webpage look nice by adding styles to arrange the video and question areas.\nAdd some special instructions for the webpage to make it interactive:\nKeep track of the video and where it's paused or playing.\nPlan out when the questions should pop up during the video.\nKeep track of which question is currently being asked.\nSet up rules for when to show the questions and what happens when you answer them.\nMake sure the video pauses when a question appears, so you can't watch until you answer.\nUpdate the webpage to include the question boxes with options to choose from and a button to submit your answer.", "hasZip": true, "zipPath": "https://physicstjc.github.io/sls/interactive-video/interactive-video.zip", "hasPromptImage": false, "promptImagePath": null, "promptImageExt": null, "hasKnowledgeBase": false, "knowledgeBasePath": null, "knowledgeBaseExt": null }, { "id": "remote:physicstjc:kinematics-graph", "title": "Kinematics Graphs", "folder": "kinematics-graph", "folderPath": "kinematics-graph/", "indexPath": "https://physicstjc.github.io/sls/kinematics-graph/index.html", "hasPrompt": true, "promptText": "Create a graph using chart.js with vertical axis being \"displacement / m\" and horizontal axis being \"time / s\".\nThere should be a slider for the initial velocity value ranging from 0 to 2 m/s, a slider for the acceleration value ranging from -2 m/s^2 to 2 m/s^2.\nThe displacement will start from zero and will follow a function dependent on the initial velocity and acceleration values from the slider.\nDraw the line of the displacement on the graph. Update the graph whenever the sliders are moved. Draw the function of the displacement graph with a smooth curve instead of connecting the dots.\nShow the values of the velocity and acceleration, along with the units\nUse A drop-down list to change the vertical axis to velocity or acceleration, updating the axis each time and the curve as well.", "hasZip": true, "zipPath": "https://physicstjc.github.io/sls/kinematics-graph/kinematics-graph.zip", "hasPromptImage": false, "promptImagePath": null, "promptImageExt": null, "hasKnowledgeBase": false, "knowledgeBasePath": null, "knowledgeBaseExt": null }, { "id": "remote:physicstjc:latex-renderer", "title": "LaTeX Renderer", "folder": "latex-renderer", "folderPath": "latex-renderer/", "indexPath": "https://physicstjc.github.io/sls/latex-renderer/index.html", "hasPrompt": true, "promptText": "Create a website with a large input box to input latex and render it as a SVG file\nAdd a button to download the rendered SVG image with transparent background.\nAdd a button to convert the SVG image into png with a transparent background for download.\nSuggest a file name for the downloaded image based on the first 20 characters of the input.", "hasZip": true, "zipPath": "https://physicstjc.github.io/sls/latex-renderer/latex-renderer.zip", "hasPromptImage": false, "promptImagePath": null, "promptImageExt": null, "hasKnowledgeBase": false, "knowledgeBasePath": null, "knowledgeBaseExt": null }, { "id": "remote:physicstjc:metronome", "title": "Metronome", "folder": "metronome", "folderPath": "metronome/", "indexPath": "https://physicstjc.github.io/sls/metronome/index.html", "hasPrompt": true, "promptText": "Make a metronome website with javascript with adjustable frequency.\nProduce a midi sound of 440 Hz every half an oscillation.\nRepresent it like an inverted pendulum with one end of the pendulum fixed at the bottom of the canvas.\nHave a start and stop button for the ticking.", "hasZip": true, "zipPath": "https://physicstjc.github.io/sls/metronome/metronome.zip", "hasPromptImage": false, "promptImagePath": null, "promptImageExt": null, "hasKnowledgeBase": false, "knowledgeBasePath": null, "knowledgeBaseExt": null }, { "id": "remote:physicstjc:pdf-viewer", "title": "PDF Viewer", "folder": "pdf-viewer", "folderPath": "pdf-viewer/", "indexPath": "https://physicstjc.github.io/sls/pdf-viewer/index.html", "hasPrompt": true, "promptText": "Prompt for the index file: Create a website that embeds a PDF file.\nPrompts for the zip folder creator: Create a website that allows users to upload a pdf file, then create a index.html file that points to that pdf file using the code above to embed to pdf. The output will be a zip file with both the index.html file and the uploaded pdf file. Use only javascript, css and html.", "hasZip": true, "zipPath": "https://physicstjc.github.io/sls/pdf-viewer/pdf-viewer.zip", "hasPromptImage": false, "promptImagePath": null, "promptImageExt": null, "hasKnowledgeBase": false, "knowledgeBasePath": null, "knowledgeBaseExt": null }, { "id": "remote:physicstjc:pomodoro-timer", "title": "Pomodoro Timer", "folder": "pomodoro-timer", "folderPath": "pomodoro-timer/", "indexPath": "https://physicstjc.github.io/sls/pomodoro-timer/index.html", "hasPrompt": true, "promptText": "Create a pomodoro timer webpage. A timer for 25 minutes will begin with a start button. There is a pause button that will pause or resume the timer. After 25 minutes, there will be a 5 minute break.\nThe \"Pause\" button should toggle to \"Resume\" when pressed and vice versa.\nThe \"Start\" button will restart the timer every time it is pressed.\nThe style of the first 25 minutes should be very different from that of the last 5 minutes.\nAlso, there should be another button to turn on the music. There are 5 mp3 files to randomly choose from and play one after another. The file names are \"music1.mp3\", \"music2.mp3\", and so on.\nThe play music button should toggle to become a mute button and vice versa.\nThere should be an input box for a line of text. The placeholder in the input box should read: \"Focus: \".\nWhen it's break time, please indicate using an image \"break-image.png\".", "hasZip": true, "zipPath": "https://physicstjc.github.io/sls/pomodoro-timer/pomodoro-timer.zip", "hasPromptImage": false, "promptImagePath": null, "promptImageExt": null, "hasKnowledgeBase": false, "knowledgeBasePath": null, "knowledgeBaseExt": null }, { "id": "remote:physicstjc:projectile-simulator", "title": "Projectile Simulator", "folder": "projectile-simulator", "folderPath": "projectile-simulator/", "indexPath": "https://physicstjc.github.io/sls/projectile-simulator/", "hasPrompt": true, "promptText": "Create a simulation to demonstrate the independence of the horizontal and vertical velocities of a projectile and visually represent the cart and projectile movements.\nWhen the launch button is pressed, a projectile will be shot upward from a cart that is moving from left to right on wheels.\nThe horizontal velocity of the projectile will remain constant while the vertical velocity will change with time according to gravitational acceleration.\nIn the end, the projectile will land on the same spot relative to the moving cart.\nUse a slider to change the horizontal velocity of the cart. Use a button to start the cart and another button to launch the projectile.\nUse a slider to change the initial vertical launch velocity of the projectile. Before the launch button is pressed, the vertical velocity of the projectile is zero.\nAdd two wheels below the cart's rectangle.\nAdd a button to reset everything.\nUse time = zero at the time when the launch button is pressed.\nTrace the path of the ball after the launch in the canvas with a dotted curve line.\nCreate a variable to store the initial horizontal position of the projectile as the launch button is pressed. Use it to determine the starting point of the trace.", "hasZip": true, "zipPath": "https://physicstjc.github.io/sls/projectile-simulator/projectile-simulator.zip", "hasPromptImage": false, "promptImagePath": null, "promptImageExt": null, "hasKnowledgeBase": false, "knowledgeBasePath": null, "knowledgeBaseExt": null }, { "id": "remote:physicstjc:wave-quiz", "title": "Quiz on Waves", "folder": "wave-quiz", "folderPath": "wave-quiz/", "indexPath": "https://physicstjc.github.io/sls/wave-quiz/index.html", "hasPrompt": true, "promptText": "Putting all the codes in one page, create a quiz on the topic of general properties of waves, where the app will generate either a displacement-distance graph or a displacement-time graph using plotly.js and then ask the user questions to find amplitude, wavelength, period, frequency, speed of wave, etc.\nInclude questions such as finding frequency from a displacement-time graph and finding period or frequency given the speed of the wave and a displacement-distance graph.\nIf the information needed to solve a problem is not in the graph, you must provide additional information such as the speed of the wave. For instance, for graphs with time axis that require the user to find wavelength, speed is needed.\nGenerate a new question and graph after each question is done.\nRandomise the values to find and the answers. Use a MCQ format for each question.\nAdd units to the graphs and to the questions and options.\nThe score is shown as a fraction of correct answers over attempts.\nAfter each quiz of 10 questions is completed, if the final score is less than 5, encourage the user to try harder or try again in a positive language. If between 5-7, the user is almost there. From 8-9, very good. 10 is perfect. Display these messages in a pop-up UI element on the screen. Create a start-over button as well.\nLimit the entire page to a size of max width 580px and max height: 460px", "hasZip": true, "zipPath": "https://physicstjc.github.io/sls/wave-quiz/wave-quiz.zip", "hasPromptImage": false, "promptImagePath": null, "promptImageExt": null, "hasKnowledgeBase": false, "knowledgeBasePath": null, "knowledgeBaseExt": null }, { "id": "remote:physicstjc:radioactive-decay", "title": "Radioactive Decay", "folder": "radioactive-decay", "folderPath": "radioactive-decay/", "indexPath": "https://physicstjc.github.io/sls/radioactive-decay/index.html", "hasPrompt": true, "promptText": "Make a javascript simulation showing the decay of radioactive particles. Put all the codes in one file.\nThe half-life of the particles will range between 1 second to 200 seconds and controlled with a slider.\nThere should be two canvases. In the first canvas, create an array of 60 by 60 undecayed particles represented by circles that are grey in colour. Upon decay, they shall be red in colour. The particles shall appear as circles. Update the canvas very second.\nIn the second canvas, there should be a decay chart using plotly.js. The horizontal axis is time and vertical axis is the remaining undecayed nuclei. Update the chart every second as well.\nInitialise the graph such that the time axis starts at zero and the vertical axis shows 3600 at first.\nAdd a button to download the data values in csv format.", "hasZip": true, "zipPath": "https://physicstjc.github.io/sls/radioactive-decay/radioactive-decay.zip", "hasPromptImage": false, "promptImagePath": null, "promptImageExt": null, "hasKnowledgeBase": false, "knowledgeBasePath": null, "knowledgeBaseExt": null }, { "id": "remote:physicstjc:random-name-generator", "title": "Random Name Generator", "folder": "random-name-generator", "folderPath": "random-name-generator/", "indexPath": "https://physicstjc.github.io/sls/random-name-generator/index.html", "hasPrompt": true, "promptText": "Provide the code for the following in a single html file:\nThis web page lets you generate random names from a list of names you provide.\nThere's a section labeled \"Enter names separated by semicolons.\"\nYou can type or paste a list of names into a box provided. Each name should be separated by a semicolon.\nAlternatively, you can upload a file containing a list of names in CSV format using the \"Or upload a CSV file\" option.\nOnce you've entered the names or uploaded the file, click the \"Submit\" button.\nAfter submitting, the page will display another section.\nIn this new section, there's a button labeled \"Generate Random Name.\"\nWhen you click this button, a random name from the list you provided will appear on the page.\nBelow the \"Generate Random Name\" button, there's a paragraph displaying the randomly generated name.\nIf the user wants to remove the displayed name from the list, you can click the \"Remove Name\" button below the displayed name.\nAny names that you've generated will be listed below the \"Generated Names\" section.\nEach generated name will appear on a separate line.", "hasZip": true, "zipPath": "https://physicstjc.github.io/sls/random-name-generator/random-name-generator.zip", "hasPromptImage": false, "promptImagePath": null, "promptImageExt": null, "hasKnowledgeBase": false, "knowledgeBasePath": null, "knowledgeBaseExt": null }, { "id": "remote:physicstjc:quotations", "title": "Random Quote Generator", "folder": "quotations", "folderPath": "quotations/", "indexPath": "https://physicstjc.github.io/sls/quotations/index.html", "hasPrompt": true, "promptText": "Create a html webpage with a randomly generated quote with the attributed source each time it loads. The quotes should be aimed at inspiring students to put in their best effort in their exam preparations. The quote will be chosen from a list of twenty quotes.", "hasZip": true, "zipPath": "https://physicstjc.github.io/sls/quotations/random-quotes.zip", "hasPromptImage": false, "promptImagePath": null, "promptImageExt": null, "hasKnowledgeBase": false, "knowledgeBasePath": null, "knowledgeBaseExt": null }, { "id": "remote:physicstjc:relative-velocity", "title": "Relative Velocity", "folder": "relative-velocity", "folderPath": "relative-velocity/", "indexPath": "https://physicstjc.github.io/sls/relative-velocity/index.html", "hasPrompt": true, "promptText": "Create a javascript simulation in a single html file that demonstrates the addition of two velocity vectors to give a resultant velocity.\nThe velocity of a boat travelling in still water moving across a river is shown as vertically upward.\nA slider will change the speed and direction of the water flow.\nThe velocity of the river water is also shown.\nFinally, show the addition of the two vectors to give a third vector: the resultant velocity. Create a button for animating the boat's movement.\nUse two horizontal lines to show the shores of the river, also the starting and ending point of the boat's journey.\nThe boat should be represented with a pencil-like shape, moving upward from one horizontal line to another. The boat should be moving in the direction of the resultant velocity.\nThe vectors should be represented with arrows.\nDraw some light blue wavy curves between the two horizontal lines that are stationary when the river speed is zero but move at the river velocity otherwise.", "hasZip": true, "zipPath": "https://physicstjc.github.io/sls/relative-velocity/relative-velocity.zip", "hasPromptImage": false, "promptImagePath": null, "promptImageExt": null, "hasKnowledgeBase": false, "knowledgeBasePath": null, "knowledgeBaseExt": null }, { "id": "remote:physicstjc:sound-frequency-analyser", "title": "Sound Frequency Analyser", "folder": "sound-frequency-analyser", "folderPath": "sound-frequency-analyser/", "indexPath": "https://physicstjc.github.io/sls/sound-frequency-analyser/", "hasPrompt": true, "promptText": "Process the data from the microphone to determine the dominant frequency or frequency spectrum of the sound signal.\nDisplay the value for the dominant frequency.", "hasZip": true, "zipPath": "https://physicstjc.github.io/sls/sound-frequency-analyser/sound-frequency-analyser.zip", "hasPromptImage": false, "promptImagePath": null, "promptImageExt": null, "hasKnowledgeBase": false, "knowledgeBasePath": null, "knowledgeBaseExt": null }, { "id": "remote:physicstjc:sound-generator", "title": "Sound Generator", "folder": "sound-generator", "folderPath": "sound-generator/", "indexPath": "https://physicstjc.github.io/sls/sound-generator/", "hasPrompt": true, "promptText": "Create a website that generates sound at the highest possible volume with a frequency control slider from 10 Hz to 40000 Hz.\nUse a play and stop button.\nAdd an input box too for the frequency to work together with the slider.", "hasZip": true, "zipPath": "https://physicstjc.github.io/sls/sound-generator/sound-generator.zip", "hasPromptImage": false, "promptImagePath": null, "promptImageExt": null, "hasKnowledgeBase": false, "knowledgeBasePath": null, "knowledgeBaseExt": null }, { "id": "remote:physicstjc:sound-level-meter", "title": "Sound Level Meter", "folder": "sound-level-meter", "folderPath": "sound-level-meter/", "indexPath": "https://physicstjc.github.io/sls/sound-level-meter/", "hasPrompt": true, "promptText": "Create a html and javascript page that senses the sound from the computer's microphone and indicates the loudness on a needle to simulate a sound level meter.\nUse the slider to change the sensitivity of the sound level meter.\nCentralise everything horizontally.", "hasZip": true, "zipPath": "https://physicstjc.github.io/sls/sound-level-meter/sound-level-meter.zip", "hasPromptImage": false, "promptImagePath": null, "promptImageExt": null, "hasKnowledgeBase": false, "knowledgeBasePath": null, "knowledgeBaseExt": null }, { "id": "remote:physicstjc:student-flashcards", "title": "Student Flashcards", "folder": "student-flashcards", "folderPath": "student-flashcards/", "indexPath": "https://physicstjc.github.io/sls/student-flashcards/index.html", "hasPrompt": true, "promptText": "Create a revision webpage using html, javascript and css that references a csv file in the same folder with two columns: \"term\" and \"definition\".\nThe csv file is to be uploaded by the user.\nEach term in the \"term\" field will be displayed in turn using a left and right button. Another button labelled \"Definition\" will be used to show or hide the corresponding \"definition\" field at the bottom. Put all the script and style codes in the html file.", "hasZip": true, "zipPath": "https://physicstjc.github.io/sls/student-flashcards/student-flashcards.zip", "hasPromptImage": false, "promptImagePath": null, "promptImageExt": null, "hasKnowledgeBase": false, "knowledgeBasePath": null, "knowledgeBaseExt": null }, { "id": "remote:physicstjc:system-schema", "title": "System Schema", "folder": "system-schema", "folderPath": "system-schema/", "indexPath": "https://physicstjc.github.io/sls/system-schema/index.html", "hasPrompt": true, "promptText": "Create an interactive canvas-based web app where users can add labeled circles and connect them with arrows.\nToolbar functionality:\nAdd circles with text labels.\nDraw double-headed arrows between circles.\nMove circles dynamically.\nDelete circles and their associated arrows.\nEach circle represents an object in a system schema. Users enter a label via a UI overlay (instead of a browser prompt). All circles have a fixed pastel yellow color.\nUsers can add multiple arrows between two circles. Additional arrows between the same circles appear curved to avoid overlap.\nClicking a circle in move mode allows dragging. Clicking a circle in delete mode removes both the circle and all connected arrows.\nUsers enter text labels via an overlay pop-up UI. The overlay includes a Confirm and Cancel button.\nLimit the canvas to a size of max width 560px and max height: 460px\nA \"Save as JPG\" button allows users to export their diagrams.\nSensors", "hasZip": true, "zipPath": "https://physicstjc.github.io/sls/system-schema/system-schema.zip", "hasPromptImage": false, "promptImagePath": null, "promptImageExt": null, "hasKnowledgeBase": false, "knowledgeBasePath": null, "knowledgeBaseExt": null }, { "id": "remote:physicstjc:hangman", "title": "Template for SLS Interactive with Scores", "folder": "hangman", "folderPath": "hangman/", "indexPath": "https://physicstjc.github.io/sls/hangman/index.html", "hasPrompt": true, "promptText": "For sending a score to SLS: Add these codes to send a score of 1 when the user gets it correct:\n\nInclude the javascript file\ninto your zipped directory", "hasZip": true, "zipPath": "https://physicstjc.github.io/sls/hangman/hangman.zip", "hasPromptImage": false, "promptImagePath": null, "promptImageExt": null, "hasKnowledgeBase": false, "knowledgeBasePath": null, "knowledgeBaseExt": null }, { "id": "remote:physicstjc:thermal-processes", "title": "Thermal Processes", "folder": "thermal-processes", "folderPath": "thermal-processes/", "indexPath": "https://physicstjc.github.io/sls/thermal-processes/index.html", "hasPrompt": true, "promptText": "Make a javascript simulation showing transfer of heat energy from one body to another. Put all the codes in one file.\nShow it in a canvas with a height of 100 px and width of 580 px. The first body is hot at first, represented by a red colour body. The second body is cold, represented by blue. The colour of the body should be a function of the temperature. If the temperatures of the two bodies are the same, they should have the same temperature.\nUse a bold arrow to show the direction of heat transfer./li>\nUsing plotly.js, create a graph below the canvas that shows the variation of temperature for each body (using red and blue lines) with time.\nInitialise the graph such that the time axis starts at zero and ends at 5 seconds.\nCreate sliders that can change the heat capacity of each object with a range from 20 to 200 J per degree celsius.", "hasZip": true, "zipPath": "https://physicstjc.github.io/sls/thermal-processes/thermal-processes.zip", "hasPromptImage": false, "promptImagePath": null, "promptImageExt": null, "hasKnowledgeBase": false, "knowledgeBasePath": null, "knowledgeBaseExt": null }, { "id": "remote:physicstjc:to-do-list", "title": "To-Do List", "folder": "to-do-list", "folderPath": "to-do-list/", "indexPath": "https://physicstjc.github.io/sls/to-do-list/index.html", "hasPrompt": true, "promptText": "Create a website with a to-do list using indexedDB and javascript.\nPut all the codes in one page. Put all the codes in one page.\nUse css to give it a pleasant look.", "hasZip": true, "zipPath": "https://physicstjc.github.io/sls/to-do-list/to-do-list.zip", "hasPromptImage": false, "promptImagePath": null, "promptImageExt": null, "hasKnowledgeBase": false, "knowledgeBasePath": null, "knowledgeBaseExt": null }, { "id": "remote:physicstjc:trat", "title": "tRAT Assessment Tool", "folder": "trat", "folderPath": "trat/", "indexPath": "https://physicstjc.github.io/sls/trat/index.html", "hasPrompt": true, "promptText": "Provide the code for the following in a single html file:\nCreate a website for users to key in their answers to a tRAT quiz for checking.\nThe answers will be referenced from a csv file containing the question number in the first column and the answer to the multiple choice question (A, B, C or D) in the second column.\nThe quiz will display the question number and 4 options: A, B, C and D. The user will choose the answer from the 4 options.\nIf the first option is the correct answer, the letter will become light green and 4 marks will be added to the overall score. If it is the wrong answer, the letter will become dark grey and no marks will be added.\nThe user will get to try a second time for the same question. If the second option is the correct answer, the letter will become light green and 2 marks will be added to the overall score. If it is the wrong answer, the letter will become dark grey and no marks will be added.\nThe user will get to try a third time for the same question. If the third option is the correct answer, the letter will become light green and 1 mark will be added to the overall score. If it is the wrong answer, the letter will become dark grey and no marks will be added. There will not be a fourth time for the same question.\nGetting it correct on the second try should only get 2 marks added. On the third try, only 1 mark will be added if correct.\nThe total score will be shown at the bottom of the page.\nThere will be two other buttons to move to the next question or back to the previous question. Don't jump to the next question automatically.", "hasZip": true, "zipPath": "https://physicstjc.github.io/sls/trat/trat.zip", "hasPromptImage": false, "promptImagePath": null, "promptImageExt": null, "hasKnowledgeBase": false, "knowledgeBasePath": null, "knowledgeBaseExt": null }, { "id": "remote:physicstjc:video-recorder", "title": "Video Recorder", "folder": "video-recorder", "folderPath": "video-recorder/", "indexPath": "https://physicstjc.github.io/sls/video-recorder/index.html", "hasPrompt": true, "promptText": "Create a website that could record video and audio from the device camera and microphone.\nShow a preview of the video in the browser. Do not show the video in fullscreen mode even in mobile devices so that the controls can remain visible.\nUse a download button for the user to download the recorded video in mp4 format.\nAfter the recording, replace the video preview with the video that has been recorded. Include playback functions.", "hasZip": true, "zipPath": "https://physicstjc.github.io/sls/video-recorder/video-recorder.zip", "hasPromptImage": false, "promptImagePath": null, "promptImageExt": null, "hasKnowledgeBase": false, "knowledgeBasePath": null, "knowledgeBaseExt": null }, { "id": "remote:physicstjc:wave-motion", "title": "Wave Motion Interactive Animation", "folder": "wave-motion", "folderPath": "wave-motion/", "indexPath": "https://physicstjc.github.io/sls/wave-motion/index.html", "hasPrompt": true, "promptText": "Create a simulation of particles moving vertically with simple harmonic motion. The simulation should display 25 particles arranged horizontally, each oscillating vertically at a different phase. The horizontal motion of the particles should simulate simple harmonic motion, with their positions following a sine wave pattern. The amplitude of oscillation should be set to 100 pixels, and the period of oscillation should be controlled by a slider input with a range from 0.1 to 5 seconds. The particles should be confined within a container with a fixed width of 640 pixels and a height of 480 pixels. The slider input should be positioned at the bottom of the container. The simulation should update the positions of the particles at regular intervals to create the illusion of continuous motion. One of the particles near the middle should be red in colour.", "hasZip": true, "zipPath": "https://physicstjc.github.io/sls/wave-motion/wave-motion.zip", "hasPromptImage": false, "promptImagePath": null, "promptImageExt": null, "hasKnowledgeBase": false, "knowledgeBasePath": null, "knowledgeBaseExt": null }, { "id": "remote:physicstjc:zip-directory", "title": "Zipped Directory Generator", "folder": "zip-directory", "folderPath": "zip-directory/", "indexPath": "https://physicstjc.github.io/sls/zip-directory/index.html", "hasPrompt": true, "promptText": "Create a website using javascript that allows users to upload a zipped folder into the browser and then creates an index.html file that lists all the files within in in the form of links.\nUse a button for the user to download a new zipped file with the original files and the index.html file.\nCreate an input box to enter a title for the zip folder and the index.html file.\nGames", "hasZip": false, "zipPath": null, "hasPromptImage": false, "promptImagePath": null, "promptImageExt": null, "hasKnowledgeBase": false, "knowledgeBasePath": null, "knowledgeBaseExt": null } ]