107 comments

[ 0.33 ms ] story [ 174 ms ] thread
That’s neat! Took me a few second to figure it out :)
Me too, the rollover on cells makes a bit confusing because it suggests interactivity that is actually not there.
There's a rollover? That explains why I was puzzled that it didn't seem to have any interactive elements: I'm on mobile.
me too, I finally figure it out that one month only loop in one column.
Where's the 21st?
Reuse one of the 18ths
I'd rather keep one of mine as a spare. I frequently find myself needing more time around the middle of the month.
Probably copy paste error. There are two of 18.
How does one change the year then?
First, you create the universe.

Then you build a new year of the calendar.

(comment deleted)
Very cool, but missing 21st.
Not sure why, but it seems like the script which appends the 'today' class to today's cell doesn't seem to be working.
Perhaps it's not 2020 yet.
(comment deleted)
Just increment the 20, 19 and second 18 and it should be correct.
Good to know that Feb 31st falls on a Monday this year :-)

Love it though.

(comment deleted)
It's just wrong isn't it? It says Jan 20 is a Tuesday. It isn't.
Ha, yeah, there's two 18's and no 21
May 20th is also not a Thursday.
There are two 18s, the 19 should instead say 20

...

old -> fixed

17 -> 17

18 -> 18

18 -> 19

19 -> 20

20 -> 21

...

A feature addition: Clicking on a particular month, should select its column and decrease the opacity of other months. Will increase readability.
Another suggestion: Keep the width of all dates equal, so that the first column does not look weird.
Another suggestion: add toggle option to rotate tables 90 degrees for conventional horizontal view.
The date 18 is double and 21 missing.
Why not simply do 'cal 2020' and embed it in HTML?
I'm not really sure what I am looking at.

EDIT: Now I am. Clever!

I still am not. Could you explain?
2d lookup table for (month,day) -> weekday
To find the current day of the week, look at the row corresponding to the day of the month and the column corresponding to the month. There's a typo for the days 18-21 where there's two 18s.
- Source code?

- Is this generated using a known algorithm? Can the same trick be applied to other years?

Very cool idea!

It looks like it's currently manual, considering the double date on the 18th
It seems like it should be able to be done programmatically, though. It suddenly seems like a neat project.
What happens with the two 18s?
For the last 3 years I've been printing several copies of the Compact Calendar by David Seah [1]. It's as its name implies a compact form calendar that spans the whole year in a single page, and leaves enough side space to annotate stuff as needed.

It's very cool and useful, although it would be nice having an open-source based version (i.e. LibreOffice), for those of us that don't have an MS Office license...

[1]: https://davidseah.com/node/compact-calendar/

(not sure why but upon checking the website I'm seeing all text and links scrambled in the page, probably the author inadvertently broke it during an update)

Wow I just discovered that it's uBlock Origin that totally breaks the page layout. Which means that for some reason this page's CSS are detected as an ad source, and blocked! Curious, as it seems to be a plain and simple static site.

EDIT: It is the "AdGuard Annoyances" optional list, which is disabled by default but I like to enable: https://kb.adguard.com/en/general/adguard-ad-filters#annoyan...

(comment deleted)
It's also blocked by Fanboy's annoyances list. It's a generic blocker, /wp-gdpr, probably designed to block a Wordpress plugin's GDPR banner. My guess is this site is using such a plugin, and then stuck the rest of its CSS in the plugin's folder instead of a generic folder like CSS, so it ends up blocked there too. You can whitelist this URL on the site if you want without having to whitelist the site as a whole.
What do you mean “open source”? XLS is the (previously proprietary) format used by older versions that’s (basically) just serialized structs. XLSX (which I see here) is the ZIP/XML based version based on an open standard[0][1]. LibreOffice opens those just fine from my experience; It’s the older binary format that LibreOffice can screw up with formatting.

[0]: https://en.m.wikipedia.org/wiki/Office_Open_XML

[1]: ECMA-376, http://www.ecma-international.org/publications/standards/Ecm...

You are right although as I understood it, the MS standard is exceedingly complicated, some would say in an attempt to "obfuscate" it.

In any case, this specific excel template states that it requires Excel 2007 and might misbehave if using any other program such as OpenOffice or Google Sheets:

> Please note that Microsoft Excel 2007 or newer is required. Other software like Open Office, Google Docs, and Numbers may import the Excel spreadsheet, but due to differences in the way they handle dates you should double-check that the calendars are correct.

Perhaps things have gotten better, but OOXML is not an open format by the normal usage of the word (text based does not mean open). OOXML was rushed through the standardization process, and was entirely created by one vendor (Microsoft).

Microsoft doesn't even bother to support the OOXML format completely, as the Wikipedia article notes.

> OOXML is not an open format by the normal usage of the word

It's a poor standard (including, iirc, normative references to behavior of particular proprietary software), but it's standardized and free to use.

not having the days of the week in close visual proximity to the dates makes utilizing this layout pretty tedious, imo.
Thank goodness – you've brought up David Seah! I used to use his stationery religiously, but forgot his name. I appreciate it!
Oh cool! I happened to build something similar a while back, because I was frustrated with the way that the Unix `cal` program laid out all the months in a 3 x 4 grid instead of in a continuous format:

https://github.com/jez/calz

So for example to get the same year-long calendar view as the Compact Calendar would have, I can type

    calz 2020
calz has a couple other features too which make it nicer to use than `cal`, but those are beside the point.
I have calz now. Thanks!

Now I just need a really long e-ink screen.

It certainly makes the year look a lot smaller than usual, when all the days are printed in 1/3 of a standard paper size.
I print a bunch of these (sometimes multiple calendars on a page) and stick them up on the wall. Very useful to separate events / agendas of different classes on separate calendars e.g. birthdays, travel plans, project deadlines, appointments, goal tracking, habit tracking all go on different calendars but on the same wall.

Much cleaner than putting them all on the same calendar and fight for space.

I'm thinking of doing it on tracing paper so I can overlay one over the other to check for double booking.
It renders fine for me in Firefox, but garbled in Chrome. Disabling this CSS rule "fixes" the layout for me in Chrome, without breaking anything obvious in Firefox:

@media (min-width: 500px) .calendar td, .calendar th { max-width: 0; }

I'm not actually sure what benefit that rule provides in the first place, but I haven't done any serious CSS hacking in forever.

Its not clear about such limitations as Feb <= 28/29 & Apr/Jun/Sep/Nov <= 30
You can tell that 2020 is a leap year because if you look up the day of the week for Feb. 28, it's Friday, and March 1st is a Sunday. That must mean that Feb. 29th is a Saturday. And indeed it is.
Can someone ELI5?
It took me a while, but I think I have it: choose a month of the year in the blue table and read only the column pertaining to that month. The column has seven days within it and the first day in the column matches the first day of that month; then, increment each day and date until reaching the maximum for the month and proceed to the next month in its matching column. Never move right to left in the blue month table as if moving through a standard calendar's format; only loop through the column for the current month from top to bottom.
Pick a month on the top, pick a day of the month on the left, find the day of the week in the row/column intersection.
(comment deleted)
This is super cool. Since I usually read Month, Date, Year - would've been awesome if the months/day was on the left. Took me a minute to read it - but makes a lot of sense.
how in the holy hell do you read this?

there are only 5 dates columns; how do you read days in month columns 6 and 7 (feb aug mar nov)?

am i suppossed to matrix multiply this thing or what. im not normally too dumb for things but boy this is totally opaque to me.

The dates in a row correspond to the days beneath a month in the same row.

EG the 1st, 8th, 15th, 22nd, and 29th of January, April, and July all fall on Wednesday.

Or, May 18th is a Tuesday.

I think the idea is this:

1. On the left under "Dates" are the consecutive days of the month if you read column by column (of course not every month has 31 days).

2. The rows represent intervals of a week (hence each square is previous + 7).

3. Look first at the top left cell with June and Monday. That lines up with the days of the month 1, 8, 15, 22, 29. That's because those are all the Mondays of June.

4. Next row (same column) shows similar: The Tuesdays of June are 2, 9, 16, etc.

So you can start with any month (the columns) and look at the first row underneath to see which day of the week the month starts on and then follow the dates from there using the above logic.

I'm guessing you locate your month on the top, then locate the day of the month and it tells you what day of the week it is.

It's an interesting design exercise, but I can't imagine people using this day to day.

My thought was "Your calendar is bad and you should feel bad." It's a reference and I don't actually mean that, except as a reaction to seeing it after clicking the title on HN which had me expecting something I might want to use.
I am guessing that people outside the US do not have as much trouble, as the format is naturally dd/mm/yyyy instead of mm/dd/yy, so reading left to right is more natural.

It took me a brief moment to acclimate to this, but after I did I felt it was pretty straightforward and elegant.

Brit here. While this is undoubtedly clever, it confuses the hell out of me!
(comment deleted)
A few years back I took part in an online design challenge to make a pocket calendar - it was a lot of fun, my designs are here:

https://www.flickr.com/photos/joelanman/albums/7215759450272...

One of them is very similar to this one (Design 2) - I was tidying up someone else's idea. Dunno if David Seah's was related in any way or just people came up with the same idea.

Design 3 is quite nice. For me, it's the quickest to read.
Agreed. I love stacking the months like that and turning it into a never-ending river of days, looks like it'd be easier to estimate the length of time between two different months.