Willing to pay $50 for a special thingy

#10

Hi everyone

Thanks for all the attention lavished on my request.

I came home sick, so I have not played with Telumire’s request yet. I am going back to bed. But before I do, I think I can answer a couple of questions:

  1. I am fine with the trigger being something other than tagging. I just want to click a button to toggle details open or closed.

  2. My use case means that:
    a. Printed pdfs, and editing, can have the details all open, and I won’t need to close any individual details. So if they are all ‘locked open’ I can live with that.
    b. For exporting to static htmls I will need all details closed, but with the ability to open and close individual details.

  3. An example of the type of files I will use is at evangelismo/misiones (giffmex). Click the articles tab, and open an article. You will see I use macros to transclude ‘block’ tiddlers. Now go to the block tab and open a block with a details element to see what I did.

I want to be able to write the content in the block tiddler, not paste a macro there that transcludes a third tiddler. But if there needs to be a macro “define” at the top of the block tiddler, I am fine with that as long as I can hit edit and start addling content, and not have to scroll down somewhere first in order to do that. I hope that is clear.

Thanks again for all your help. I will try telumire’s efforts tomorrow, or later today if I feel better. Writing this explanation is way easier for my foggy brain right now than experimenting and comparing etc.

#11

FYI: I have a solution I am building that works through transclusion and as a result has other helpful features eg {{tiddlername||local-details}} but the content will always need to exist in a seperate tiddler eg tiddlername.

  • I am just working on a open all and close all buttons.

Let me know if you would like to try it.

#12

I know you said no macros…but I made one anyway. :stuck_out_tongue: Could still be useful

You can put all of your articles content, wikitext included, right inside the macro parameter. Try this out…

title: $:/.giffmex/ui/details
tags: $:/tags/Macro
text:

\define details(sum det)
<$list filter="[[$:/.giffmex/ui/details]get[state]] +[else[]match[open]]"
emptyMessage="""
<details><summary>$sum$</summary><div>

<div style="text-align:right;"><$checkbox tiddler="$:/.giffmex/ui/details" field="state" checked="open" unchecked="" default="">&nbsp;open all details</$checkbox></div><br>

$det$
</div></details>""">
<details open><summary>$sum$</summary><div>

<div style="text-align:right;"><$checkbox tiddler="$:/.giffmex/ui/details" field="state" checked="open" unchecked="" default="">&nbsp;open all details</$checkbox></div>

$det$
</div></details>
</$list>
\end

Here’s what your article code could look like:

macroCalls
macroCalls1008×830 205 KB

Here’s one details opened

ViewMode1

And after checking the box in the first example, both examples are opened
unchecking either checkbox will close both. You can put the checkbox anywhere you want, it doesn’t have to be inside the macro

ViewMode2
ViewMode21126×842 127 KB

#13

Hi everyone

Thanks again for your replies and assistance.

Brian’s macro is what I am trying to avoid, but I may have to settle for it. But first…

None of you did anything with the idea of using an “id”. There is information about this in the second link in my OP, and I even mentioned it in that post.

<details id="target-me">

Could something be set up so that if details has id of target-me, tagging a CSS tiddler similar to @telumire’s would apply a rule to force it open? And untagging the Stylesheet would just revert it back to normal “closed” details element behavior?

The link in my OP mentions applying this js document.getElementById("target-me").open = true; but I know nothing about js, so I just mention it in case it is helpful.

#14

Hi Dave,

Using an “id” isn’t really necessary. Assuming you want a button, or set of buttons, that when clicked toggles all details elements in open tiddlers between open and closed, this can be done with a small JavaScript plugin. I think the efforts so far in this thread have been trying to focus on getting the job done with just wikitext.

You could even get more control and only toggle details elements that have a class that you have specified like “toggleme”.

If you don’t mind that the solution is JavaScript based you might get something closer to you what you are describing.

Regards,
Saq

#15

Hi Saq, yes the use of JavaScript is fine. Just that when the details are closed, I would like users to be able to open individual details elements normally, and be able to select the contents, if they wish, to copy and paste. @telumire 's solution doesn’t allow that.

2 Likes
#16

This should do what you describe it to do, it has absolutely no effect on the normal behaviour of the details elements. The biggest caveat on it is that since the open property of the details element is a dom property it will default to closed every time a tiddler is opened, this action widget can only affect details elements that are currently rendered (that is they are in open tiddlers), and if you open a new tiddler any details elements on it will be closed like normal.

here is an example of it in use:

<$button>Open Details<$action-showdetails state=open/></$button>
<$button>Close Details<$action-showdetails state=close/></$button>

<details><summary>Look at me!!</summary> And now it is open</details>

Put this is a tiddler, make a field called module-type and set it to widget and set the tiddler type to application/javascript

/*\
title: $:/widgets/action-showdetails.js
type: application/javascript
module-type: widget

\*/
(function(){

/*jslint node: true, browser: true */
/*global $tw: false */
"use strict";

const Widget = require("$:/core/modules/widgets/widget.js").widget;

const ActionShowDetails = function(parseTreeNode,options) {
  this.initialise(parseTreeNode,options);
};

/*
Inherit from the base widget class
*/
ActionShowDetails.prototype = new Widget();

/*
Render this widget into the DOM
*/
ActionShowDetails.prototype.render = function(parent,nextSibling) {
  this.computeAttributes();
  this.execute();
};

/*
Compute the internal state of the widget
*/
ActionShowDetails.prototype.execute = function() {
  this.state = this.getAttribute('state',undefined)
};

/*
Refresh the widget by ensuring our attributes are up to date
*/
ActionShowDetails.prototype.refresh = function(changedTiddlers) {
  const changedAttributes = this.computeAttributes();
  if(Object.keys(changedAttributes).length) {
    this.refreshSelf();
    return true;
  }
  return this.refreshChildren(changedTiddlers);
};

/*
Invoke the action associated with this widget
*/
ActionShowDetails.prototype.invokeAction = function(triggeringWidget,event) {
    const elList = document.getElementsByTagName('details')
    const self = this
    Object.keys(elList).forEach(function(element) {
        console.log(element)
        elList[element].open = (self.state === 'open');
    })
  return true; // Action was invoked
}

exports["action-showdetails"] = ActionShowDetails;

})();
1 Like
#17

Hi, @inmysocks , I followed your directions to the letter. But something isn’t working. Can you check it again? Does it need a tag? Or maybe something got clipped when you pasted it?

The buttons show as Open DetailsUndefined widget 'action-showdetails' and clicking on them does nothing.

#18

This part is key, and you need to save and re-load the wiki.

#19

Yes, I did that, Saq. Then I put the buttons in a sidebar tiddler.

#20

Try importing the attached file, which is my attempt at solving the same problem, its just been slow going on a touch screen. Import, save, reload, open the Buttons tiddler.

tiddlers.json (2.1 KB)

1 Like
#21

I see what I did wrong. I thought the \*/ just before the code was part of what I needed to paste. Removing that worked.

1 Like
#22

@inmysocks , would you like me to send that $50 to you, or as a donation to the development fund of TiddlyWiki? If the former, please PM me your Paypal or bank info.

1 Like
#23

Much much better solution than whatever I could come up with using CSS, thank you for publicly sharing this and thanks to @DaveGifford for this thread!

2 Likes
#24

I did a lot, of development off line, wanting you @DaveGifford to let me know if a “transclusion solution” was an acceptable solution? - and for myself.

  • I have some working “open all and close all” details buttons now.
  • I plan to make a editorToolbar button to search for and insert a tiddlername {{tiddlername||local-details}}

So

Let me know if you would like to try it.

#25

Hi TW_Tones,

Thank you for your efforts. I am sorry I did not respond explicitly to your comment above. But your description at that time sounded like a transclusion in a tiddler transcluded in another tiddler, something I wanted to avoid. That is why I passed it over. But I should have answered you so you knew that, and I apologize for that.

I am disappointed that no one respected my instructions in the OP: “Please message me before creating a solution in order to avoid duplication of efforts”, and it became a free for all of people posting, something I also wanted to avoid. I ended up having to go with the flow and respond to solutions offered as they appeared.

In the end @inmysocks gave me what I needed before anyone else did, and I decided to go with that, as I indicated with a comment or two above. I am still waiting to hear from him whether he wants the payment directly or as a donation to TW development.

If I learned anything from this, it is that in the future if I do this again, I will only offer to make donations to TW development in exchange for the solution. I have benefited from this forum, and previously Google groups, for years, and I am just trying to give back a little bit. I also have a personal motive: to force me to slow down and ask for less help. I have to want it bad enough that I am willing to pay for it.

I apologize again for not acknowledging your comment and answering you, and I want to thank you and everyone else who posted here to help me with this.

1 Like
#26

oh, I wasn’t paying enough attention to really process the part where compensation was offered, I just wanted the notifications to stop because it was distracting.
So I guess just put it into the TW development thing. I wasn’t aware there was a TW development fund that can be donated to.

2 Likes
#27
  • I understand, but then I have wanted my own solution, and wanted to explore it, with nothing to do with the bounty. I am confident I did not duplicate anything.
  • That is fine, no need to apologise, I was more concerned with you answering in a timely manner, so I could see if what I suggested was useful to you, nothing more nothing less.

I am very happy you have a solution from @inmysocks I will have to try it myself, by the way my solution made use of the details widget of @telmiger anyway, but by adding smarts to the selection of the state tiddler.

  • The diversity of approaches and solutions is a testament to the flexibility of tiddlywiki and the skills of the community.

Tony

2 Likes
#28

It is still an experiment in exploring alternative revenue models and means of funding community work and supporting community infrastructure (like this forum):

4 Likes
#29

I have been using TW for nearly 18 years, first time knowing there is a way to contribute by donating. just did my first donation, really apprecate the tool, even I only use basic features, it has been great fun and great help!

3 Likes
Highlighting the TiddlyWiki Open Collective