Re: [twdev] [TW5] Javascript kiddy

2018-03-18 Thread Jeremy Ruston
Hi Tony

> Is there a way to get this function added to the wiki so that the HTML/CSS 
> solution works?.

Not as written, no.

It is an example of conventional DOM-based programming, as popularised by 
jQuery. The key characteristic is that the state of the page is maintained in 
the DOM. TiddlyWiki 5 is based on a fundamentally different architecture where 
the state is maintained in JavaScript variables, and the DOM can be recreated 
from that state as needed.

DOM-based JavaScript libraries can be integrated with TiddlyWiki (there are 
several examples in the plugin library, such as CodeMirror, the Twitter plugin 
etc.). But it’s a complex process that requires an understanding of the 
specifics of the library and of TiddlyWiki itself.

(TiddlyWiki Classic, on the other hand, is very much a traditional DOM-based 
app, and it’s relatively easy to drop in off-the-shelf JavaScript).

It’s worth pointing out that TiddlyWiki 5 adopted this architecture in 2011, 
but it has since become mainstream in the shape of the React framework. There’s 
the same chasm for jQuery developers to cross to get to React as there is for 
TiddlyWiki 5.

Best wishes

Jeremy.

> 
> Thanks in advance
> Tony
> 
> -- 
> You received this message because you are subscribed to the Google Groups 
> "TiddlyWikiDev" group.
> To unsubscribe from this group and stop receiving emails from it, send an 
> email to tiddlywikidev+unsubscr...@googlegroups.com 
> .
> To post to this group, send email to tiddlywikidev@googlegroups.com 
> .
> Visit this group at https://groups.google.com/group/tiddlywikidev 
> .
> To view this discussion on the web visit 
> https://groups.google.com/d/msgid/tiddlywikidev/8e038951-2cd6-47c5-971c-244a7778e100%40googlegroups.com
>  
> .
> For more options, visit https://groups.google.com/d/optout 
> .

-- 
You received this message because you are subscribed to the Google Groups 
"TiddlyWikiDev" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to tiddlywikidev+unsubscr...@googlegroups.com.
To post to this group, send email to tiddlywikidev@googlegroups.com.
Visit this group at https://groups.google.com/group/tiddlywikidev.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/tiddlywikidev/70850C4F-D672-4EE3-8797-634439951C1C%40gmail.com.
For more options, visit https://groups.google.com/d/optout.


[twdev] [TW5] Javascript kiddy

2018-03-18 Thread TonyM
Folks,

I was wondering if you could tell a JavaScript kiddy like myself, who loves 
to cut snipits of code and reuse them if there is a practical way to use 
common javacript to enhance out tiddlywikis.

An example may be here https://www.w3schools.com/w3css/w3css_tabulators.asp

I know this could be achived in other ways however such examples exist out 
in the world and they can help develop solutions quickly.

In the example below I am using a w3.css stylesheet.

Where some html and css call for a little javascript


  London
  London is the capital of England.


 
  Paris
  Paris is the capital of France. 



   Tokyo
  Tokyo is the capital of Japan.





  London

  Paris

  Tokyo

 


and 

function openCity(cityName) {
var i;
var x = document.getElementsByClassName("city");
for (i = 0; i < x.length; i++) {
x[i].style.display = "none"; 
}
document.getElementById(cityName).style.display = "block"; 
}

Clearly this is quite simple javascript involving defining a single 
function.

Is there a way to get this function added to the wiki so that the HTML/CSS 
solution works?.

Thanks in advance
Tony

-- 
You received this message because you are subscribed to the Google Groups 
"TiddlyWikiDev" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to tiddlywikidev+unsubscr...@googlegroups.com.
To post to this group, send email to tiddlywikidev@googlegroups.com.
Visit this group at https://groups.google.com/group/tiddlywikidev.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/tiddlywikidev/8e038951-2cd6-47c5-971c-244a7778e100%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.