💾 Archived View for gem.arisamiga.rocks › post › quotetest.gmi captured on 2024-08-18 at 17:43:52. Gemini links have been rewritten to link to archived content

View Raw

More Information

⬅️ Previous capture (2024-05-10)

-=-=-=-=-=-=-

Making a Quote Test Website!

So I have been gone for a long time (again haha).

This is because I was working on a new project which I like to call the **Quote Test Website** which you can find at

https://quotes.arisamiga.rocks/

Quote Test Website [IMG]

The idea is simple, you can test your knowledge of quotes from various sources by having to fill in the missing words in a "quote test".

I would like to show you some of the features of the website.

Let's start with the actual **Quote Test**.

- Quote Test

So the main feature of the website is the **Quote Test**.

Quote Test Website [IMG]

At the start of the page you will see a **"Quote"** Box this is where you will add your quotes for the test.

You will be able to use the **"+ Add Another Quote"** button to add a new field for more quotes if you would like.

**Note:** If you don't have any quotes in the box you will not be able to start the test and get this message.

No Quotes [IMG]

When you have added your quotes you can click the **"Start Quote Test"** button to start the test.

Quotes Ready [IMG]

Once you click the **"Start Quote Test"** button you will be moved to a different page where you will see the quotes you added but with some missing words.

Quote Test [IMG]

You will be able to type in the missing words in the boxes provided and click the **"Submit Quote Test"** button to see if you got the answers right.

**Note:** Make sure you type in all the missing word boxes before you click the **"Submit Quote Test"** button. If you don't you will get a message like this.

Missing Words [IMG]

There you will also see a **"Complete Anyway"** button which will allow you to complete the test without filling in all the missing words if you would like.

Once you have filled in all the missing words you can click the **"Submit Quote Test"** button to see if you got the answers right.

Quote Test Results [IMG]

You will be able to get a score which is the number of correct quotes you got out of the total number of quotes you added.

If you have gotten a word wrong a **"?"** button will appear next to the quote you got wrong.

If you click the **"?"** button you will see the correct answer.

Correct Answer [IMG]

If you want to go back to the main page you can by clicking the **"Go Back"** Button on the top left of the page. There you will be able to add new quotes or edit the quotes you already have.

If you want to use the same quotes you can just refresh the page and a new test will be generated with the same quotes.

**Note:** That when you refresh the page the missing quotes will be randomized so they will not be the same as the previous test.

- Options

You will also see a **"Options"** button on the top left of the main page.

Clicking the button will show you the following options.

Options [IMG]

You will see the following options.

https://github.com/Arisamiga/quote-test

- Premade Quotes

We have also added a section for **Premade Quotes** which you can use for popular novels, plays, and more. For the moment we have added quotes from **King Lear** as a start.

King Lear Quotes [IMG]

You will be able to see the quotes for certain scenes and Acts.

For example, if we want to learn the quotes from **Act 1 Scene 1** we can do so by clicking on the button.

Act 1 Scene 1 Quotes [IMG]

This popup will appear and you can see the quotes from that scene.

You will have two options **"Use Template Quotes"** which will allow you to replace any quotes you currently have with the quotes from this scene.

The other option is **"+ Add to Existing Quotes"** which will add the quotes from this scene to the quotes you already have.

- My Quotes

Another part of the Premade Quotes Options is something called **"My Quotes"**

My Quotes [IMG]

This is where you will be able to make your own Quote Collections for use in the future or for sharing with others.

If you don't have any quotes saved you should see an image close to the one above.

You will have two options **"Save Current Quotes"** which will save the quotes you currently have to a new collection.

When you click the **"Save Current Quotes"** button you will see a popup like this.

Save Current Quotes [IMG]

You will be able to see the quotes you currently have under **"Current Quotes"** which will be saved in this collection you can also give your collection a name by typing in the **"Name of Collection"** box.

**Note:** You will not be able to click the Save button until you have typed in a name for your collection.

Once you have typed in a name for your collection the Save button should be clickable and you can save your collection.

Save Collection [IMG]

Once you have saved your collection you will be able to see it under **"My Quotes"**.

Saved Collection [IMG]

You will also be able to delete your collection by clicking the **"Delete"** button.

If you click on your newly saved collection you should see a popup like this.

Collection Popup [IMG]

Here you will see some familiar buttons like **"Use Template Quotes"** and **"+ Add to Existing Quotes"** which function the same as before.

- Export and Import Collection

You will also see a **"Export Collection"** button which will allow you to export your collection to a string that we will use later!

If you click the **"Export Collection"** button you will see a popup like this.

Export Collection [IMG]

You will see a string of text that you can copy manually or you can also click the **"Copy to Clipboard"** button to copy the text to your clipboard.

This text can be used for sharing your collection with others or for importing your collection to another device.

The last part I want to show you from the My Quotes section is the **"Import Collection"** button.

Saved Collection [IMG]

If you click the **"Import Collection"** button you will see a popup like this.

Import Collection [IMG]

You will be able to paste the string you copied from the **"Export Collection"** button here and click the **"Import Collection"** button to import your collection.

**Note:** If your collection has the same name as a collection you already have saved it will be replaced with the new collection but before this happens you will see a popup asking you if you are sure you want to replace the collection.

Replace Collection [IMG]

If you click the **"Yes"** button your collection will be replaced with the new collection.

If for some reason you get a message like this:

Invalid Collection [IMG]

That means that the string you pasted is not a valid collection string so make sure it is the correct string before you try to import it.

- Conclusion

So that is the **Quote Test Website**. I am sorry that I have been gone for so long but I have been working on this project and I hope you like it! We started to make it as a fun project to help us in our English classes and we thought it would be a good idea to share it with others.

If you have any feedback or suggestions please let me know by creating an issue on the Github Repository

https://github.com/Arisamiga/quote-test

or if you would like to use the website yourself you can find it at

https://quotes.arisamiga.rocks/

Also Yes I have open-sourced the project so you can see the code and contribute if you would like! We will be trying to add more features and Premade Text in the future so keep an eye out for that!

Also, I want to give a massive shoutout to my friend

Alex23062007

for helping me with the project and making it possible! (He worked a lot on the front-end and design of the website and I am very grateful for that!)

So that is all for now! Hope you have an amazing day and Thanks so much for reading :D