TW "Calculator" prototype ready to play with

To me, the related “What would you like to see in a TiddlyWiki calculator?” thread is done, so new thread for new stage. (And the thought of a calculator was a spin-off of “A simple macro for basic arithmetic”)

Try out this TiddlyWiki hosted on

I’m pretty sure I’m leaning towards replacing the three “TiddlyWiki-related” buttons in the calculator with just the one button that opens the dropdown window with all of the goodies. For now, the “link” button is doing the job of opening the dropdown window.

For now, the dropdown window provides a search field for tiddler’s with matching titles. Search results give tiddler titles and names of fields in each tiddler. Click on a field to add {{tiddler-title!!field-name}} to the calculator’s edit area.

TiddlyWiki Calculator Buttons


Looking great @Charlie_Veniot

I will keep playing with it and provide more feedback if necessary.

Observations and Ideas

  • Consider emphasising the result more, even a box or button containing the result, as a button we can add
    • Click to copy result to clipboard
    • Alt to copy “formulae” as it appears to clipboard
    • Ctrl to generate a tiddler containing the “formulae” from the calculator (object-type=formulae)
  • Then perhaps we can add a supporting macro which we give a formulae as captured as the parameter and returns the result (without GUI interaction)
  • Similarly a view template for tiddlers object-type=formulae that returns the result
    • use supporting macro to access formulae from another tiddler
  • One could choose a folmulae from saved formulae and load into the calculator.

This thread addresses dropdowns somewhat, if it helps Toolbar - custom button opening dropdown menu. Just ask if I can help.

Love your work

That’s the cart I started with before the horse: this tiddler, demonstrates <<eval "2 + 5 + {{{ [[9]] }}}">> (In “A simple macro for basic arithmetic”, just before the thread asking folk about what they would like in a calculator.)

I don’t forsee spending much time in the near term adding functionality or prettiness. Not keen on too much investment or getting attached to anything while there’s potential for some serious demolition and major structural redesign to the whole guacamole.

The idea I have in my head is to get it all so that one can design a math equation (or calculation, or formula; not sure what to call it), and slap the related macro and formula in a $list (or nested $lists). Whatever variable(s) can go right into the calculation.)

What you’ve provided is exactly what I’m looking for: requirements. Wish Lists.

Things that let me know whether or not the architecture will withstand any scope beyond what I’ve got in mind

That’s a good bit of info, but I already figured it all out this morning in a deep dive of shadow tiddlers. Some may say what don’t kill you makes you stronger, but I think I just sprouted a few white hairs and lost a few dark ones.

Relevant tiddlers:


Ah I see you use a dropdown for the link, I was thinking to put the calculator in a viewToolbar button.

  • Never mind, later.

Awesome work.
Using on mobile… (Android Firefox.)

I know you said you weren’t polishing yet so this is for future you…

A clear button to remove the last Calc.
When pressing the buttons focus moves to the display, so scrolling back up needs to be done to get back to the buttons.

Excellent stuff!

Stuff that is easy to squeeze in without architectural re-think, I’m going to try and squeeze them in.

A button section for things like clear and copy to clipboard, I’m going to start putting together a “component” for that.

The focus-scrolling thingy, I’m going to have to chew on that. Sniffs like default TiddlyWiki behaviour that I’m going to need to squash, if it can be squashed.

Just starting to sketch out a menu bar for the types of things @TW_Tones and @Ste_W have mentionned.

1 Like

In many ways I think the most used keys, numbers and basic operators, should be the easiest to find, perhaps all in the bottom right corner near the result display. All the other special /named functions are usually very occasional, and could even be behind a menu, except perhaps the tiddlywiki references, which some users may come to use a lot.

So The basic order could be starting at the top to the bottom and/or left right as follows;

  • Named functions eg abs(x) behind advanced button?
  • Blue and Purple sections
  • Numbers and basic operators “+ X enter”
  • Working formulae display
  • Result
  • Result buttons

One thing I wonder about is the use of “**” when “^” is a more suitable representation or is this a restriction of calculator code?

Nice progress @Charlie_Veniot

I’d much prefer “^”, which matches my happy place that is the BASIC programming language.

The “backend” to resolve the equation is javascript.

I thought about setting up a mechanism to translate from “^” (entered in the editor) to the “**” that javascript needs (to resolve the equation) via regex etc., but I don’t particularly like that idea. It would involve making sure to not unintentionally convert any “^” used for any wonky reason in the title of a tiddler or in the name of a field.

Maybe something to consider some day, but I see that kind of thing as too much potential to gum up the works.

SIDENOTE: I still have loads of testing to do to make sure nothing in any tiddler title or field name does not get confused with “math things”.

Editor toolbar buttons (that’s what all of the calculator buttons are) show up above the editor by TW design. Seems to me I remember a discussion once about putting buttons at the bottom of the editor (or I might be getting mixed up with somebody wanting the buttons to float.) I’ll have to go digging in the discussions.

Layout of the grouping is based on the Calculator app on Chromebooks. I’ll be sticking to that layout for my benefit and sanity, but maybe someday I can setup configuration preferences so folk can order the groups differently.

Layout aside, I’d like to setup a button to hide/show groups. So basic calculator functions always visible, the rest of them pop open on demand/click. And save preferences.