calender script

[mjrand]

Couldn't find a web design forum here so I figured this would be as good a place as any.

I found a very interesting calendar script and I'm trying to find the source for it. Take a look at http://www.trinitywallstreet.org/congregation/ . Look at the worship schedule. How can I implement something like this on my own site?

 

[DrPizza]

Have you simply tried "view source" and worked from there to figure out how they implemented it? Then, on top of that, there are other methods so you don't have to manually change that particular page's html and update that page manually every couple of days.

As this seems (to me) to be mostly a programming issue, I'm going to move this thread into the programming subforum. I'm sure the members there can point you to the best resources so that you can learn to do it yourself.

-Anandtech Moderator DrPizza

 

[mjrand]

Yeah I looked at the source already, and it isn't really clear how they did it. Anyone else have any other ideas?

 

[Markbnj]

That's a neat calendar widget for sure. What you're seeing when you look at the html source is the rendered markup for the calendar itself. You're not seeing the javascript or server-side script that originally rendered it, you're not seeing the javascript that handles user input events for it, and you're not seeing the styles applied to it.

You can get a look at all this stuff with either Firebug (for Firefox) or Web Development Helper (for IE). Since they're using jquery I assume this is some widget related to that framework, or created to work with it.

As for how you can create such a calendar for your own site, there are literally dozens of ways. We'd need to know a little more about what platform your site is running on, what technologies it uses, and what scripting languages you're comfortable with.

 

[SJP0tato]

The first thing I thought when I saw the calendar attribute is they were using some kind of Javascript framework.

I've never run across that functionality in the Dojo toolkit, so my next thought was JQuery. After viewing the page source:

<script src="/javascript/jquery.js?v=1.01" type="text/javascript"></script>

My suspicions were confirmed. They're either using an off the shelf component, or some kind of customized version of it. Hopefully it's not too difficult to get running/integrated into your site.

Good luck!

edit:
D'oh, Mark beat me by 3 minutes!

 

[mjrand]

Originally posted by: Markbnj
That's a neat calendar widget for sure. What you're seeing when you look at the html source is the rendered markup for the calendar itself. You're not seeing the javascript or server-side script that originally rendered it, you're not seeing the javascript that handles user input events for it, and you're not seeing the styles applied to it.

You can get a look at all this stuff with either Firebug (for Firefox) or Web Development Helper (for IE). Since they're using jquery I assume this is some widget related to that framework, or created to work with it.

As for how you can create such a calendar for your own site, there are literally dozens of ways. We'd need to know a little more about what platform your site is running on, what technologies it uses, and what scripting languages you're comfortable with.

I figured they were using jquery from viewing the source. I've actually used it for a few things myself.

I'm using the Drupal CMS to design my site. If I wanted to integrate this calendar into my site, how would I do it?

 

[Markbnj]

Originally posted by: mjrand

Originally posted by: Markbnj
That's a neat calendar widget for sure. What you're seeing when you look at the html source is the rendered markup for the calendar itself. You're not seeing the javascript or server-side script that originally rendered it, you're not seeing the javascript that handles user input events for it, and you're not seeing the styles applied to it.

You can get a look at all this stuff with either Firebug (for Firefox) or Web Development Helper (for IE). Since they're using jquery I assume this is some widget related to that framework, or created to work with it.

As for how you can create such a calendar for your own site, there are literally dozens of ways. We'd need to know a little more about what platform your site is running on, what technologies it uses, and what scripting languages you're comfortable with.

I figured they were using jquery from viewing the source. I've actually used it for a few things myself.

I'm using the Drupal CMS to design my site. If I wanted to integrate this calendar into my site, how would I do it?

I know almost nothing about jquery, so I can't help much, but I know we have some people here who are very familiar with it.

 

[mjrand]

Anybody else?

 

[Snapster]

The server side scripting is PHP and it uses Ajax to update the calendar when you click. The data sent back is JSON formatted and you can see more how it's done in the global.js?v=1.01 file under the // worship schedule comments.

 

[sourceninja]

Originally posted by: Snapster
The server side scripting is PHP and it uses Ajax to update the calendar when you click. The data sent back is JSON formatted and you can see more how it's done in the global.js?v=1.01 file under the // worship schedule comments.

Yea, it's fairly simple. Starts on line 161.