Hi campers!
I just spent an entire afternoon trying to figure out what is wrong with my simple code.
I’ve tried the others campers sugesttions related to same probelm but still not working.
Can you take a look at my code and see if you can sopt the problem.
PS. I have tried the crossorigin thing.
First, your url should begin with https, because Codepen is served over https. Second, according to API website documenation, the url should use the query parameters format=jsonp and jsonp=?. Your url was using format=json and jsonp=mycallback?
Thanks for your answer.
Made the changes suggested but gave this error and still not working.
“Refused to execute script from ‘https://api.forismatic.com/api/1.0/?method=getQuote&lang=en&format=json&jsonp=jQuery321032191368788916086_1515403308438&_=1515403308440’ because its MIME type (‘application/json’) is not executable, and strict MIME type checking is enabled.”
It appears you changed the API you were using to QuotesOnDesign.com. Also, appears you are not getting the results you want. If you notice, you are only getting the same quote, no matter how many times you click on the New Quote button. That is because QuotesOnDesign.com caches the results, so you keep getting the same 6 quotes each time. To prevent caching, you must put the following code in the $(document).ready callback function, before you call getQuote.
$.ajaxSetup({cache:false});
There is really no reason to pull 6 quotes as you are doing with rand&filter[posts_per_page]=6 in the API url’s querystring, because you only need the one. You could just specify rand&filter[posts_per_page]=1 Plus, even if you pull the 6 results (which are already random), you could just pull the first one by:
randomQuote = data[0].content;
randomAuthor = "-"+data[0].title;
Thanks again!
I changed the Api because i have read that the Api is no longer maintained.
New quote button is working now,
Twitter button opens a new window and does nothing, just a blank page. Any idea on what it could be? Code is ok.
The quotes that come back from the quotesondesign API are wrapped in a p element. This is causing the window.open to work work properly. One quick solution (there are probably better ones), is to remove the p element tags using replace after you have first assigned data[0[.content to randomQuote.
Can you tell if there is any issue with codepen? Because i tested the remove p tag in this website https://ideone.com/fork/62buxj and it works fine. But it keeps adding closing p tag in codepen.
I also used regex to replace single quotes but seems i’m doing it wrong.
For example:
“Every new thing you make will be (should be) the nicest thing you’ve made so far, because you’re learning and getting better with each and every new project.”
it’s transformed to:
“Every new thing you make will be (should be) the nicest thing you’ve made so far, because you’re learning and getting better with each and every new project.</p>”
It also cuts the string when it finds semicolon when posting to twitter.
For example: “The conclusion of design flows naturally from the data; we should not shrink from it; we should embrace it and build on it.”
becomes: "The conclusion of design flows naturally from the data
Using the following would remove both opening and closing p tags:
randomQuote = randomQuote.substr(3,randomQuote.length-9);
If you wanted to use a regular expression to take remove the p tags you could do:
randomQuote = randomQuote.replace(/<\/?p>/g, '');
I will have to get back with you on dealing with the semi-colon cutting off the remaining quote. You might search the forum as others probably experienced this same issue.
Thanks @RandellDawson!
I searched the forum but seems i’m the first having this issue. When transfering the string to the twitter page it cuts it if find semicolon or quote. Any insight on what it might be?
Thanks again for your suport. I’m working on the weather app in the meanwhile.
I did a search for “twitter semicolon cuts off quote” on the forum and did find the following thread on how to fix the issue with the semicolon. Seems as if you have to use encodeURIComponent(randomQuote) to convert the semicolons and characters which might cause trouble to a url safe version.
encodeURIComponent(randomQuote) results in something like this.
"Stop. I’m not going to take any more input until I’ve made something with what I got. "
What worke was this:
window.open(“https://twitter.com/intent/tweet?text=” + $(".quote").text());
I might be missing something, but what is wrong with the following that was created with encodeURIComponent?
"Stop. I’m not going to take any more input until I’ve made something with what I got. "
“If everyone likes your design, it’s banal. Mediocrity shirks offense. Art dares it.”
This is how it looks. Freecodecamp forum converted it back again, lol.
Notice the quote is converted. That’s what happened.
I see what you mean now. However, when I just tested your code using the text, when the following shows in your quote area, it still gets cutoff because of the semicolon.
Here’s how we work. Somebody calls up with a project; we do some stuff; and the money follows.
Oh, you right, still have to check that. 
Using encodeURIComponent on $(".quote").text() seems to do the job.