Random Quote Machine feedback

Code Feedback
1

Here’s my random quote machine :slight_smile:

I wanted to go all out and make it responsive with bootstrap, and even add audio files that play so you can listen to homer read the quote himself. But, in order to keep up with my schedule I created for myself I’ve got to call it done.

There’s one problem with it. It kept showing the same quotes by chance so I just spliced them from the array as you go through them. I thought of a different solution of maybe adding them to a new array, and when the first one is empty, switch to the new array to read them over again.

Any feedback is greatly appreciated!

1 Like
2

Fantastic design, congratulations.

Sometimes when the button is clicked, quote is not showing up because of a bug in JS code:

quotes.splice([Math.floor(Math.random() * quotes.length) + 1],1)

The range of random numbers in the code above will be from 1 to the length of an array, but arrays are numbered from 0. Remove + 1 to fix it.

I liked your design so much that I’ve forked your code I did some changes in css and js.
In JS: quotes are not removed from the array completely but suspended for three draws.
In CSS: the quote text is nicely aligned at the center of the bubble.

[fork]

I’m looking forward to seeing your next project. Cheers.

3

I like your idea; you have a great start. I would recommend making it responsive for small screens…it requires a lot of scrolling on mobile. Also, you are missing the option to tweet out the quote.

4

Those are some great updates to it, thanks! As I find time I’m going to go back to try to improve on it. I think it can actually be a nice little site that drives traffic :slight_smile:.

  1. Mobile friendly

  2. Twitter and Facebook share

  3. Add audio files

5

Thanks for the reminder about Twitter, I had actually forgotten about that when I “thought I was finished”!

6

This is probably one of my favorite quote machines. The design and idea are great. I can see the effort you’ve put in it. Great work :slight_smile:

1 Like
7

Thanks @imtoobose :slight_smile:

8

Great! I really like the creative design!

9

I have to scroll down to see the Next Quote button, and I’m using a high-resolution display on a laptop computer (although I do always run my browser in a window, never full-screen). So I’d suggest reducing your vertical spacing so that button can be seen without scrolling on displays that are smaller than 1920x1080. You might want to read this related article: http://www.hobo-web.co.uk/best-screen-size/