SAMPLE APP: Crazy Calendar Hack

[GreenFlux (GreenFluxLLC)]

Here’s a new take on calendar views, based on some Virtual Column weirdness:

The sample app uses a public holiday calendar, and a WeekNum table with just two sheet columns:

https://www.appsheet.com/samples/Built-from-your-app-spec-?appGuidString=4fe2fb91-feca-4a6e-bee3-3ab092e96064

Here’s a quick overview of how it works:

Crazy Calendar v2.mov (video)

I used a public/read-only calendar so I could post it as a sample. But you could do a lot more with it if you connect your personal calendar and create inline actions next to each date.

Unfortunately, that makes the calendar table twice as wide, for now…
shameless plug for my own feature request

---

This is a follow up to the first Crazy Calendar Hack, using a similar technique for Hours instead of WeekNums.

[Chris_Jeal (Chris)]

Hi @GreenFlux,

This is brilliant!
Thanks for sharing.

I would like to ask if you would know how I would have Sunday at the end of the week?

In this image, the week starts on Sunday 2/7/20, but if it’s possible, is there something I could change to your sample app that will show the Sunday having a date of Saturday 2/12/20 +1?

Hope this makes sense.
Best,
Chris.

[GreenFlux (GreenFluxLLC)]

Hey @Chris_Jeal , glad you like the sample app!

Changing the week to end on Sunday is a little tricky. I’m using WEEKNUM() which always starts on Sunday. I think you’d have to put in an exception for WEEKDAY()=7, and come up with a new [alt_weeknum] to group and filter the rows differently.

[Chris_Jeal (Chris)]

Thanks for the reply.
You’re not kidding there about the trickiness of this, I’ve been trying to tackle this one for a while now.
I’ve not thought about the alternate weeknum though so I’ll give it a go.

Thanks, and stay safe.
Chris.

[Ratatosk]

Nice!! Somehow I didn’t see this post when it was posted.

Played around a bit with it and made the dates on the right into an SVG through a virtual column:

[Grant_Stead]

Can you post the Appsheet based SVG expression?

[Ratatosk]

Sure. Here’s the code with a bit of update:

CONCATENATE("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 480 120'>

--WEEK CIRCLE--
<circle cx=""60"" cy=""60"" r=""50"" fill=""rgb(3,123,228)"" stroke=""rgb(3,123,228)""  stroke-width=""12"" /> 

--WEEK NUMBERS--
<text x=""58""  font-family=""Roboto,Arial,sans-serif""  font-size=""60"" fill=""white""  y=""68%""  text-anchor=""middle"">
",RIGHT([Weeknum],LEN([Weeknum])-6),"
</text>

--TEXT STANDARD DAY_DATE--
<text font-family=""Roboto,Arial,sans-serif"" font-size=""65""   text-anchor=""left"" fill=""black"" x=""150"" y=""70%"">

<tspan  fill=""red"" >
",[Day],"
</tspan>

<tspan  fill=""rgb(3,123,228)"" >
",LEFT((TEXT([Date])),LEN(TEXT([Date]))-5),"
</tspan>

</text>

</svg>")

[Grant_Stead]

That’s awesome, thanks!

[Fabian (Fabian Weller wAPPlabor)]

So this is all in one SVG.
Super cool @Ratatosk

[Ratatosk]

Super cool indeed!!

As someone with a graphic designer background, to just have a little bit of say on the UI/UX feels great!