|
I am hoping to find some assistance with a script I am trying to build for our gym. I am rookie javascript programmer and have hit a rut. I will try to keep short and descriptive.
I am using an apikey from Wodify(system for our gym) and a ajax javascript query in our squarespace website to pull the workout down. So Wodify has workout, I want script in squarespace to grab it and display it. (I have this working).
The issue I am running into is I want the script to look to and see if current time is 7PM or greater. If it is 7PM or greater I want the script to grab tomorrow's dates workout (so 25th today). If the time is less than 7PM then it keeps todays workout. Final piece of logic is, if it is after 7PM but there is not a workout posted, then keep today's workout. What I have works some of the time, but other times during the day is incorrect. For some reason it appears the correct date is being applied in the function. I have attached the code below.
I apologize if this is a wall of garbage I really am terrible with javascript.
function loadFormattedWOD(selector, apiKey, date, location, program) {
$.ajax({
url: 'https://app.wodify.com/API/WODs_v1.aspx',
data: {
apiKey: apiKey,
date: date,
location: location,
program: program,
type: "json"
},
dataType: "json",
success: function(data){
try {
if(data && data.RecordList.APIWod.FormattedWOD) {
$(selector).html(data.RecordList.APIWod.FormattedWOD);
return "worked";
}
} catch(err) {
return null;
}
}
});
}
function loadFormattedWOD(selector, apiKey, date, location, program, callback) {
$.ajax({
url: 'https://app.wodify.com/API/WODs_v1.aspx',
data: {
apiKey: apiKey,
date: date,
location: location,
program: program,
callback: callback,
type: "json"
},
dataType: "json",
success: function(data){
try {
if (data && data.RecordList.APIWod.FormattedWOD) {
$(selector).html(data.RecordList.APIWod.FormattedWOD);
console.log('worked');
}
} catch(err) {
if (callback) callback();
}
}
});
}
today = new Date()
if (today.getHours() >=19) {today.setDate(today.getDate()+1);}
else {today.setDate(today.getDate()+0);}
var dateString = today.getFullYear() + '-' + (today.getMonth() + 1) + '-' + today.getDate();
if(loadFormattedWOD("#wodbody", "myapikey", dateString, "MYGYM", "CrossFit") == null) {
retryWithToday();
}
function retryWithToday() {
today.setDate(today.getDate() - 1);
var dateString = today.getFullYear() + '-' + (today.getMonth() + 1) + '-' + today.getDate();
loadFormattedWOD("#wodbody", "myapikey", dateString, "MYGYM", "CrossFit");
}
loadFormattedWOD("#wodbody", "myapikey", dateString, "MYGYM", "CrossFit");
|
|
|
|
|
There are a few issues with your code as it is, look at my comments below
today = new Date();
if (today.getHours() >= 19) { today.setDate(today.getDate() + 1); }
else { today.setDate(today.getDate() + 0); }
var dateString = today.getFullYear() + '-' + (today.getMonth() + 1) + '-' + today.getDate();
if (loadFormattedWOD("#wodbody", "myapikey", dateString, "MYGYM", "CrossFit") == null) {
retryWithToday();
}
function retryWithToday() {
today.setDate(today.getDate() - 1);
var dateString = today.getFullYear() + '-' + (today.getMonth() + 1) + '-' + today.getDate();
loadFormattedWOD("#wodbody", "myapikey", dateString, "MYGYM", "CrossFit");
}
loadFormattedWOD("#wodbody", "myapikey", dateString, "MYGYM", "CrossFit");
I've re-arranged your code a little, I don't have a valid api key so I can't check the code works etc but this is more the direction you should be heading
function loadFormattedWOD(selector, apiKey, date, location, program, callback) {
$.ajax({
url: 'https://app.wodify.com/API/WODs_v1.aspx',
data: {
apiKey: apiKey,
date: date,
location: location,
program: program,
type: "json"
},
dataType: "json",
success: function (data) {
try {
if (data && data.RecordList.APIWod.FormattedWOD) {
$(selector).html(data.RecordList.APIWod.FormattedWOD);
console.log('worked');
}
else {
if (callback) callback();
}
} catch (err) {
if (callback) callback();
}
}
});
}
function retry() {
console.log('In retry');
var today = new Date();
if (today.getHours() >= 19) {
var dateString = today.getFullYear() + '-' + (today.getMonth() + 1) + '-' + today.getDate();
loadFormattedWOD("#wodbody", "myapikey", dateString, "MYGYM", "CrossFit", function () {
console.log("failed again");
})
}
else {
console.log("didn't retry");
}
}
today = new Date();
if (today.getHours() >= 19) { today.setDate(today.getDate() + 1); }
var dateString = today.getFullYear() + '-' + (today.getMonth() + 1) + '-' + today.getDate();
loadFormattedWOD("#wodbody", "myapikey", dateString, "MYGYM", "CrossFit", retry)
|
|
|
|
|
Wow, it appears to be working now! Thank you so much for helping me figure
it out. Hopefully didn't take to much of your time (probably easy for
you). I am still trying to learn all the syntax and how javascript
compiles so this is great. Hope you enjoy the rest of your day.
Again, I really appreciate your help!
Jason
|
|
|
|
|
I added a div to the top of the page like
<div id="wodbody"></div>
and tried it with your API key and it all worked fine for me. To simulate a fail for the first call I changed the api key details but kept the correct details in the "retry" method and it worked there as well. You'll need to step through the code and\or add extra console.log statements to debug what it going on to see exactly where it isn't working.
|
|
|
|
|
Excuse my ignorance, but one final question now that the code completed and working. I've started online classes and have been looking online with no luck. Is it as simple as adding CSS code to format how this information gets displayed on my webpage?
Jason
|
|
|
|
|
Yeah you should just be able to use css to alter the info. If you put the mark-up inside a div with a certain class you can use that to target how the stuff in that div looks. You might also want to process the data in javascript in some way such as breaking it into lines so you have the raw data and showing that as a <ul> list for example.
|
|
|
|
|
I had a look at what comes back and they do wrap the html in classes so your best bet is to just apply the styles you want to the components to fit your site. If you use the browser dev tols (f12) to "Inspect" the text you'll see the markup and what classes are attached but the main ones are here
.wod_header {
font-size: 1.2em;
font-style: italic;
}
.wod_comment {
font-size:0.9em;
}
.ListRecords {
}
.section_title {
font-weight:bold;
font-size:1.2em;
}
.component_show_wrapper {
margin: 10px;
}
.component_name {
color:#0000ff;
}
.component_wrapper {
font-style:italic;
}
.component_comment {
color:#aaaaaa;
font-size:0.9em;
font-style:normal;
}
That's not going to make it look nice, but it should demonstrate what parts of the text have what classes attached to them.
|
|
|
|
|
Hello,
I'd like to converter dwg file to jpg file using javascript.
Please let me know if you have sample code/sample url/javascript api related to it.
Thanks.
|
|
|
|
|
This is not MacDonalds where you can order to go.
It is also not something that I'd recommend doing from JavaScript.
Bastard Programmer from Hell
If you can't read my code, try converting it here[^]
|
|
|
|
|
|
Google is the place for such questions.
|
|
|
|
|
Can you let me know url please?
I looked for it, I can't find.
Sorry.
|
|
|
|
|
Seriously? You cannot type 'google' into your broweser?
|
|
|
|
|
|
I don't think he was making an advance.
|
|
|
|
|
Don't be naive. You know nothing about Richard.
|
|
|
|
|
There's that. I was giving him the benefit of doubt.
|
|
|
|
|
Hey, you said you wouldn't tell.
|
|
|
|
|
I haven't, yet.
|
|
|
|
|
I'm not sure why everyone is downvoting this, so I upvoted it, but don't think that will help much.
Member 12869945 wrote: A image screenshot of what I'm looking for is attached. No, it's not.
But all you have to do is view source on a webpage and start to look through and find what library they are using.
There are two kinds of people in the world: those who can extrapolate from incomplete data.
There are only 10 types of people in the world, those who understand binary and those who don't.
|
|
|
|
|
RyanDev wrote: I'm not sure why everyone is downvoting this, so I upvoted it, but don't think that will help much.
You missed the spam link.
His other messages were also spam, as was his would-be article.
Spam would be article[^]
"These people looked deep within my soul and assigned me a number based on the order in which I joined."
- Homer
|
|
|
|
|
Richard Deeming wrote: You missed the spam link. OP had a link to their blog in their signature. That is allowed.
There are two kinds of people in the world: those who can extrapolate from incomplete data.
There are only 10 types of people in the world, those who understand binary and those who don't.
|
|
|
|
|
OP had a spam would-be article and three messages with spam links to the same site.
If you want to argue the toss, take it to the Spam forum and reply to the original report.
"These people looked deep within my soul and assigned me a number based on the order in which I joined."
- Homer
|
|
|
|
|
Richard Deeming wrote: If you want to argue the toss, take it to the Spam forum and reply to the original report. First off, I wasn't arguing. Secondly, no one in that forum cares so it's nearly pointless. It's a forum used to boost rep points and egos.
There are two kinds of people in the world: those who can extrapolate from incomplete data.
There are only 10 types of people in the world, those who understand binary and those who don't.
|
|
|
|
|
Hi, I really new to javascript. I was doing a JavaScript program that accept two integers and display the larger.
Below is the program, It only displays the 2nd number. Can you tell me what i am doing wrong in this please?????
var x = prompt("Enter 1st number");
var y = prompt ("Enter 2nd number");
if(x>y){
alert(x);
}
else {
alert(y);
}
I will really appreciate your help and this helps me to learn more..
|
|
|
|
|