event-calendar.wikidot.com

nav_first.pngFirst: thread:102
Marketplace
Edited: 1255961839|%e %b %Y by: pieterh
Comments: 5
Tags:

nav_prev.pngPrevious: thread:42
doc.wikidot.com
Edited: 1255961839|%e %b %Y by: pieterh
Comments: 17
Tags:

nav_last.pngLast: thread:44
chatroom.wikidot.com
Edited: 1255961839|%e %b %Y by: pieterh
Comments: 10
Tags:

nav_next.pngNext: thread:26
UrCheatz.com
Edited: 1255961839|%e %b %Y by: pieterh
Comments: 0
Tags:

James KanjoJames Kanjo wrote on 1252603590|%e %b, %H:%M (%O ago)

As some of you may know, Phil ChettPhil Chett initiated the Event Calendar project.

Aim: To create a fully functional web-application, completely powered by Wikidot.

Progress:
At first, I helped build essentially the same calendar but with a completely different framework. It looked like this:

mini-month.png
 [[include inc:month
 |year=2010
 |leap-year=FALSE
 |month=january
 |first=friday
 ]]

The code is really easy to understand. The only thing to note is that the spelling of phrases is case sensitive. Also, the first= variable specifies what is the first day of the month (this can't be calculated automatically).

After that, we started using multiple mini-calendars together to create a year-long one. I then saw the opportunity to create another mini-calendar dedicated to this purpose:

mini-year.png
 [[include inc:year
 |year=2009
 |leap-year=FALSE
 |month=august
 |first=saturday
 ]]

The calendar returns the remainder of the year from the month you specified (in this case, from August to December).

Since this web-calendar will be “competing” with embedded web-calendars, we needed to expand the mini-calendar to a full-sized calendar. Over the past 24 hours, I've done that:

new-event.png

If you hover over the blue links, you get a pop-up giving you the option to create an event for that day. If your browser doesn't support pop-ups (*cough* IE6 *cough*), don't worry, you can still click on the links to do that. Also notice that there are multiple events on the same day (see the 10th of August, which has 3).

event-hover.png

Hovering over individual events gives a short (%%short%%) preview of the content on the event's page. Clicking on the event to view it allows you to see the description in full, as well as any responses to the event.


Which reminds me! In the meantime of all of this, Helmuti_pdorfHelmuti_pdorf and Phil were working together on a method of “signing up” to events. Thank goodness for the timely moment of the new ListPages functions, as these were necessary for completing the project. Anyway, you can respond to events to say “yay” or “nay”, or anything else you want to say. Here's what an event page looks like:

event.png

Pages to visit:


That's the update! Sorry it took so long to post the progress over here, but I think this is probably the place where all updates should happen from now on.

~ James


Start a new sub-thread

Comments: 25

pieterhpieterh 1252604382|%e %b %Y, %H:%M %Z|agohover

An impressive piece of work. Where I come from, it's the one who documents and teaches that gets all the credit, and thus whether or not you did everything here yourself I'm awarding you one white stripe on that lovely black belt you already earned in the Wikidot dojo. Now allow me to post this wonderful news to my blog!

unfold by pieterhpieterh, 1252604382|%e %b %Y, %H:%M %Z|agohover
Timothy's Post
James KanjoJames Kanjo 1252638640|%e %b %Y, %H:%M %Z|agohover

Re: Package
Timothy Foster 11 Sep 2009, 12:39 AEST
Ok! I am trying to redesign using only tables (I have an unusual abhorrence to divs for some reason. They don't do what I want like tables do).

The entire idea and present design is genius. When I looked at the code, I was astonished at the intricate engineering.


λ James Kanjo | blog | photos | contact

unfold Timothy's Post by James KanjoJames Kanjo, 1252638640|%e %b %Y, %H:%M %Z|agohover
Re: Timothy's Post
James KanjoJames Kanjo 1252639065|%e %b %Y, %H:%M %Z|agohover

Ok! I am trying to redesign using only tables (I have an unusual abhorrence to divs for some reason. They don't do what I want like tables do).

Yeah I know. Using tables would fix so many alignment problems, and at first I didn't think this was possible.

But now I have a new idea… It would take a hell of a lot of effort though.

Sunday Monday Tuesday Wednesday Thursday Friday Saturday
If first=Sunday, display one
If first=Monday…Saturday, display nothing
If first=Sunday, display two
If first=Monday, display one
If first=Tuesday, display nothing
etc. etc. etc. etc. etc.
If first=Sunday, display seven,
If first=Monday, display six
etc. etc. etc. etc. etc. etc.

Therefore, this thing is possible! The only problem: It is possible that this page may exceed the # of characters allowed per Wikidot Page.

What do you think? Clever, right?


λ James Kanjo | blog | photos | contact

unfold Re: Timothy's Post by James KanjoJames Kanjo, 1252639065|%e %b %Y, %H:%M %Z|agohover
Re: Timothy's Post
James KanjoJames Kanjo 1252639877|%e %b %Y, %H:%M %Z|agohover

Upon rethinking the design (again!), we actually can just rebuild the design to be much more efficient:
Only do 31 days, no need to cater for individual months.

What's the catch? One must enter the month's number instead of the month name, and it would have to be in two digits:

[[include inc:month
|year=2009
|leap-year=FALSE
|month=09
|first=tuesday
]]

This is not a great thing, but fortunately we can inbuilt error-protection by providing the user with an error message if they type in “9” rather than “09”


λ James Kanjo | blog | photos | contact

unfold Re: Timothy's Post by James KanjoJames Kanjo, 1252639877|%e %b %Y, %H:%M %Z|agohover
Re: Timothy's Post
Helmuti_pdorfHelmuti_pdorf 1252674002|%e %b %Y, %H:%M %Z|agohover

Hi James,
Great work done!

One issue to notice - in out culture ( Europe) the week starts with the Monday and ends with the Sunday.

I know - "on the seventh day you should relax" and for a lot of people this is the sabbath or Saturday..

You should copy it to another starting day for the week to give 2 solutions for this… ?

And _ think for A DIFFERENT Language - likle italian with "Lunedi, Martedi, Mercoledi…" , (not to speak of german)


Service is my success. My webtips:www.blender.org, www.zusi.de (Demo-Video)

Wollen Sie Wikidot helfen im deutschen » Handbuch ?

unfold Re: Timothy's Post by Helmuti_pdorfHelmuti_pdorf, 1252674002|%e %b %Y, %H:%M %Z|agohover
Calendar start on Monday
James KanjoJames Kanjo 1252675359|%e %b %Y, %H:%M %Z|agohover

One issue to notice - in out culture ( Europe) the week starts with the Monday and ends with the Sunday

I thought that was everywhere? The weekend in Australia is Saturday & Sunday; hence the [typical] work week begins on Monday.

The reason that the first day of the week is a Sunday, is because that was the way Phil had it when the project was in its infancy — a coincidence. I too would prefer the week starting with Monday.

I know - "on the seventh day you should relax" and for a lot of people this is the sabbath or Saturday..

Funny. In my primary school they told us the Sabbath was Sunday — I didn't realise it varied from culture to culture.

And _ think for A DIFFERENT Language - likle italian with "Lunedi, Martedi, Mercoledi…" , (not to speak of german)

Good idea! Let's do this after we are absolutely sure that the calendar is perfect, so we don't have to spend time later upgrading everything.

Great work done!

Thanks! And thank YOU for setting up the sign-up/respond system!


λ James Kanjo | blog | photos | contact

unfold Calendar start on Monday by James KanjoJames Kanjo, 1252675359|%e %b %Y, %H:%M %Z|agohover
Re: Calendar start on Monday
Timothy FosterTimothy Foster 1252675801|%e %b %Y, %H:%M %Z|agohover

Very nice, James!

I suppose in the US, most calendars start with Sunday although it seems as if the week really begins with Monday since Sunday is still the weekend.

Only these problems exist now:

Broken table at the bottom, and the end popups go off screen.

unfold Re: Calendar start on Monday by Timothy FosterTimothy Foster, 1252675801|%e %b %Y, %H:%M %Z|agohover
Re: Calendar start on Monday
James KanjoJames Kanjo 1252677153|%e %b %Y, %H:%M %Z|agohover

Did you enjoy your sleep? Because I'm just about to get mine now XD

Broken table at the bottom

You don't mean the “Error test: ERROR! You must enter a two digit number: |month=08”, do you? Because that's not a broken table, that's in-built invalid syntax detection (see here on this page).

the end popups go off screen.

That's not a problem with the calendar, that's a problem with the hover-tip. But yes, it's something we'll have to fix for the calendar.


λ James Kanjo | blog | photos | contact

unfold Re: Calendar start on Monday by James KanjoJames Kanjo, 1252677153|%e %b %Y, %H:%M %Z|agohover
Re: Calendar start on Monday
James KanjoJames Kanjo 1252677805|%e %b %Y, %H:%M %Z|agohover

Broken table at the bottom

OH! I've just gone into Firefox and seen what you're talking about!

You see, I didn't complete the rest of the cells in the last row, because no calendar data would ever go into them. Neglecting this made FF chuck a tantrum; Safari ignored this and the calendar displayed fine.

Problem fixed — I added the remaining 5 cells to the final row, and now I am kicking my lazy butt to bed.

Edit: Funny, IE had no complaints on the subject…


λ James Kanjo | blog | photos | contact

last edited on 1252677850|%e %b %Y, %H:%M %Z|agohover by James Kanjo + show more
unfold Re: Calendar start on Monday by James KanjoJames Kanjo, 1252677805|%e %b %Y, %H:%M %Z|agohover
Re: Calendar start on Monday
leigerleiger 1252692286|%e %b %Y, %H:%M %Z|agohover

Funny. In my primary school they told us the Sabbath was Sunday — I didn't realise it varied from culture to culture.

The Sabbath is a Jewish tradition (remember, Jesus was Jewish) … and is celebrated on Saturday. It starts at sunset Friday and ends at sunset on the Saturday.

The Catholic church took this idea and adapted it, and has a similar occurrence on Sundays. However, some churches also offer services around 6-7 PM on a Saturday night… which ties in with the end of the Jewish Sabbath day (ending at sunset)

unfold Re: Calendar start on Monday by leigerleiger, 1252692286|%e %b %Y, %H:%M %Z|agohover
Re: Calendar start on Monday
Timothy FosterTimothy Foster 1252694413|%e %b %Y, %H:%M %Z|agohover

Well, the table is fixed now.

unfold Re: Calendar start on Monday by Timothy FosterTimothy Foster, 1252694413|%e %b %Y, %H:%M %Z|agohover
Re: Calendar start on Monday
Timothy FosterTimothy Foster 1252707433|%e %b %Y, %H:%M %Z|agohover

I adjusted the hover tip so that it centers. At least on FF.

This causes the text to not go off screen. It still causes some scrolling.

And I replaced display:inline to display:table-cell, some obscure display option…

unfold Re: Calendar start on Monday by Timothy FosterTimothy Foster, 1252707433|%e %b %Y, %H:%M %Z|agohover
Fixed height
James KanjoJames Kanjo 1252718515|%e %b %Y, %H:%M %Z|agohover

I fixed the height of the days in the calendar to 60px, and if you hover over a day with many events, the cell is stretched to display all events.

It's pretty cool actually:

Not hovering of big day Hovering over big day
big-day.png big-day-hover.png

λ James Kanjo | blog | photos | contact

unfold Fixed height by James KanjoJames Kanjo, 1252718515|%e %b %Y, %H:%M %Z|agohover
Re: Fixed height
leigerleiger 1252728642|%e %b %Y, %H:%M %Z|agohover

Seriously… what you are doing with this calendar I didn't even think was possible o.O

unfold Re: Fixed height by leigerleiger, 1252728642|%e %b %Y, %H:%M %Z|agohover
Um...
leigerleiger 1252650146|%e %b %Y, %H:%M %Z|agohover

Simply "wow". I had a look at this a few weeks ago, saw that you guys were doing a good job already and that it was completely over my head ;) And left you to it. Now I see an update and it's amazing how much it has changed.

Simply amazing work. Well done so far :O

unfold Um... by leigerleiger, 1252650146|%e %b %Y, %H:%M %Z|agohover
Re: Um...
James KanjoJames Kanjo 1252655333|%e %b %Y, %H:%M %Z|agohover

You thought that was good?

Timothy inspired me to think outside the square, to solve a problem I at first thought was impossible. Hehe, but then I realised possibility.

Check out the latest and greatest!
Due to the Table Behaviour, cells resize automatically. That is, you can have 60 events on the same day, and none of them will be hidden!

Oh, and this is IE6-proof, by the way XD

Thanks Timothy! You inspired me!


λ James Kanjo | blog | photos | contact

unfold Re: Um... by James KanjoJames Kanjo, 1252655333|%e %b %Y, %H:%M %Z|agohover
Re: Um...
leigerleiger 1252655850|%e %b %Y, %H:%M %Z|agohover

Nice work! :)

This appears — is it meant to?

Error test:

ERROR! You must enter a two digit number: |month=08

unfold Re: Um... by leigerleiger, 1252655850|%e %b %Y, %H:%M %Z|agohover
Re: Um...
James KanjoJames Kanjo 1252657229|%e %b %Y, %H:%M %Z|agohover

Yep! That is in-built invalid syntax detection. Since August is the eighth month of the year, some people may be tempted to use the syntax |month=8. This syntax is incompatible with the Calendar1.

So to counter this human error, I integrated error detection for the first 9 months of the year. Cool yeah?


λ James Kanjo | blog | photos | contact

unfold Re: Um... by James KanjoJames Kanjo, 1252657229|%e %b %Y, %H:%M %Z|agohover
New Calendar!
James KanjoJames Kanjo 1253779634|%e %b %Y, %H:%M %Z|agohover

We've made some AMAZING progress with the calendar, again!

Features

  • Manage upcoming and previous events;
  • Multiple events for each day;
  • Span events across more than one day;
  • Mini-mode, to use a miniaturised calendar;
  • Many events on a day don't distort the calendar — it retains its tidiness;
  • Framework nicely organised within a single category;
  • Everything customisable via CSS;
  • User friendly, especially with tables;
  • Internet Explorer proof;
  • Powered by Wikidot.

There's a new website for this calendar: calendars.wikidot.com

Feel free to try it out!


λ James Kanjo | blog | photos | contact

unfold New Calendar! by James KanjoJames Kanjo, 1253779634|%e %b %Y, %H:%M %Z|agohover
Hmmm
Naomi WiflathNaomi Wiflath 1255827495|%e %b %Y, %H:%M %Z|agohover

Has there been any problems with the includes with it recently? I cant seem to get them to work, it just appears blank.


Omnia mutantur, nihil interit.

2805 Continuity Guide

unfold Hmmm by Naomi WiflathNaomi Wiflath, 1255827495|%e %b %Y, %H:%M %Z|agohover
Re: Hmmm
James KanjoJames Kanjo 1255836394|%e %b %Y, %H:%M %Z|agohover

Sorry! There was a glitch in the Installation Instructions I wrote. I fixed the instructions and things should work fine now…

The only two pages you need to fix are the calendar and calendar:_backend pages, as these are the two pages I typed a glitch on. Go to the Installation Instructions so you can copy and paste the proper code from there.

Sorry!


λ James Kanjo | blog | photos | contact

unfold Re: Hmmm by James KanjoJames Kanjo, 1255836394|%e %b %Y, %H:%M %Z|agohover
Re: Hmmm
Naomi WiflathNaomi Wiflath 1255844064|%e %b %Y, %H:%M %Z|agohover

I thought the code looked odd! Thanks! I think it's working properly now! :)


Omnia mutantur, nihil interit.

2805 Continuity Guide

unfold Re: Hmmm by Naomi WiflathNaomi Wiflath, 1255844064|%e %b %Y, %H:%M %Z|agohover
Calendar Upgraded
James KanjoJames Kanjo 1256837149|%e %b %Y, %H:%M %Z|agohover

I have upgraded the Calendar in light of the new Cross Site Include technology.

Please visit the Installation Page for information on how to upgrade.


λ James Kanjo | blog | photos | contact

last edited on 1256853458|%e %b %Y, %H:%M %Z|agohover by James Kanjo + show more
unfold Calendar Upgraded by James KanjoJames Kanjo, 1256837149|%e %b %Y, %H:%M %Z|agohover
Re: Calendar Upgraded
pieterhpieterh 1256837520|%e %b %Y, %H:%M %Z|agohover

I have upgraded the Calendar in light of the new Cross Site Include technology.

Nice, but see my comments about using the modules site to host this, I think it's not ideal. I suggest using a dedicated site, given the complexity of the application. That will still work well using CSIs.

unfold Re: Calendar Upgraded by pieterhpieterh, 1256837520|%e %b %Y, %H:%M %Z|agohover
Re: Calendar Upgraded
James KanjoJames Kanjo 1256853558|%e %b %Y, %H:%M %Z|agohover

Done! The new installation instructions are now posted HERE.

There is also a new Calendar Template to go with it.


λ James Kanjo | blog | photos | contact

unfold Re: Calendar Upgraded by James KanjoJames Kanjo, 1256853558|%e %b %Y, %H:%M %Z|agohover
Add a new comment
page_revision: 2, last_edited: 1255961839|%e %b %Y, %H:%M %Z (%O ago)
Unless otherwise stated, the content of this page is licensed under Creative Commons Attribution-ShareAlike 3.0 License