Plan de cours JS/TW5

Free Javascript Ebooks

Bonjour Jean-Bernard

Sur cette démo :

installée sur un wiki vierge (au rechargement) et sur mon site de prod (à la validation du tiddler), j’obtiens un plantage + message erreur : TypeError: ele is null

La valeur null est retournée si le sélecteur n’est pas trouvé alors qu’il est bien spécifié:

<div id='bbox'>

Une idée du pourquoi ?

Addendum : J’ai trouvé. Comme sur ton exemple, le div doit être placé avant la macro. Je l’avais placé après. La macro cherche d’abord le sélecteur et ne le trouve pas parce qu’il est en dessous ? d’où la valeur null ? et d’où le plantage ?

En tout cas bien faire attention parce que le plantage résultant casse complètement le wiki et le rend inutilisable…

Et bien sûr, faire tout test JS sur une copie de vos fichiers :sweat_smile:

Une solution ? else is null. On peut peut être ajouter du code indiquant que si la valeur est nulle alors « faire ci ou ça » enfin quelque chose qui évite le plantge ?

1 « J'aime »

Salut Éric et bravo pour les plantages !
Ça permet en effet de rappeler deux choses :

  1. bien sauvegarder avant tout essai hasardeux
  2. javascript est séquentiel : il faut donc ordonner les instructions.
    Je vais passer pour un fou… mais j’ai une solution pour le premier point que j’utilise régulièrement. Comme tiddlywiki est constitué d’un seul fichier html, lorsque je le plante, je l’édite dans un éditeur de texte, et je recherche la date de modification du jour ( modified="2019 )… je corrige alors directement les fautes que j’y ai faites…
    Contrairement à :

je dois avouer que je suis fin nul en javascript, mes langages de prédilection étant plus basique, comme Windev et l’exceptionnel Python… je pense que cela doit nécessairement aboutir à penser que je me suis mis en phase d’apprentissage comme tout le monde, et qu’on peut parvenir à apprendre (dont s’amuser avec) javascript en ayant un minimum de connaissances. « Fin nul en javascript »… mais alors comment ? Quoi ? Et bien… je compense cette faiblesse par beaucoup de recherches car le web regorge de ressources fantastiques et de personnes formidables… et je combine, avec des copier-coller adaptés, remodelés, contextualisés. Telle est ma méthode.
En informatique, tout est vite obsolète. Il ne faut rien apprendre. Il vaut mieux comprendre.
Pour atteindre sa cible il ne faut rien négliger, un bon équipement, une bonne condition, un bon arc, une bonne flèche, une bonne trajectoire et ne pas trembler : osez !
Je n’ai pas de réponse à ta question mais j’ai des pistes :wink:
La première, c’est deux mots qui me sont venus à l’esprit, try et catch.
Je fais donc une recherche sur google : +javascript +try +catch
Je clique sur le premier lien, inutile de perdre plus de temps…
https://developer.mozilla.org/fr/docs/Web/JavaScript/Reference/Instructions/try...catch
Je place mon code qui marche à la place de :
nonExistentFunction();
et voilà!

1 « J'aime »

Mon cher Jean-Bernard,

As tu remarqué comme de nombreux intervenants sur le forum anglais de TiddlyWiki ou ici même, précisent bien qu’ils ne sont absolument pas développeurs. Ce sont les mêmes qui nous pondent ces beaux plugins que nous avons grand plaisir à utiliser. Cela dit, ils ont tout de même un sérieux background dans les domaines du développement informatique, soit qu’ils exercent un métier lié, soit qu’ils soient en réalité développeurs d’applications.dans un domaine industriel quelconque.

Alors à te définir comme “fin nul en javascript” me laisse dubitatif. Mais pourquoi pas. Personnellement je préfère de loin un coach fin nul de ton envergure qu’un fin connaisseur en javascript qui n’oserait ou ne voudrait ou ne pourrait se mouiller pour inculquer quelques principes de base de ce langage à ces gens dont je fais partie qui ne seront jamais de vrai développeurs mais qui sont vraiment intéressés par le sujet.

Ce dont je suis sur c’est que cette nouvelle section Javascript ouverte sur notre forum fera date. Je ne connais pas d’autres projets identiques autour de TiddlyWiki actuellement.

Pour le reste de ton post il m’arrive aussi d’aller modifier dans le source, (donc tu n’est pas fou ou je le serais aussi) mais c’est quand même à haut risque. De plus, avec un fichier de près de 15 MO et la somme de travail que cela représente, je préfère de loin la solution “sauvegardes” . J’en dispose de nombreuses, à tous les étages!

Try & catch, à étudier de plus près. Mais j’imagine que si cet épineux problème de plantage JS dans une appli JS n’a pas été résolu par les développeurs de TW5, c’est qu’il doit être un peu plus compliqué à résoudre qu’avec ma petite remarque sibylline “Faire ci ou ça”.

Merci Éric,

Ce code :

\define erreur(f)
<<eval """
try {
  VariablePasDeclaree;
}
catch(error) {
  console.error(error);
}
""">>
\end

<<erreur>>

évite tout plantage. Il est certain que je n’ai pas vu de développement de cet ordre et que ces travaux définissent de nouvelles contributions inédites autour de notre ami TiddlyWiki !

Je pense qu’il faut aussi préparer un chapitre sur :
◉ module-type : https://tiddlywiki.com/static/ModuleType.html

1 « J'aime »

J’ai révisé et précisé le plan du cours.

1 « J'aime »

Macros JavaScript

Niveau : ★☆☆☆☆ | Temps : ◉◎◎◎◎

Vue d’ensemble

Les macros JavaScript sont des modules dont le champ module-type est : macro. Elles doivent exporter ces trois propriétés :
name : Une chaîne de caractères donnant le nom utilisé pour invoquer la macro <>
params : Un tableau d’objets avec les propriétés suivantes :

  • name : nom du paramètre
  • default : (optionnel) valeur par défaut pour le paramètre

run : Fonction appelée lorsque la macro nécessite une évaluation. Les paramètres sont extraits de l’appel de macro et organisés en fonction du tableau params. La fonction d’exécution doit renvoyer la valeur de chaîne de la macro.

Exemple :

(function(){
"use strict";
exports.name = "version";
exports.params = [];
exports.run = function() {
    return $tw.version;
};
})();

A noter que
$tw.version = $tw.utils.extractVersionInfo();

est déclarée dans $:/core/modules/startup.js
et extractVersionInfo est déclarée dans$:/core/modules/utils/utils.js
cette donnée provient du fichier package.json à la racine puis lue depuis le boot/boot.js

Les internes $tw, $tw.utils, $tw.config, $tw.wiki

Niveau : ★★★☆☆ | Temps : ◉◉◉◉◎

Nous avons regroupé ici toutes les fonctions javascript déjà développées dans tiddlywiki.

$tw.wiki

$tw.wiki.addEventListener
$tw.wiki.addTiddler
$tw.wiki.addTiddlers
$tw.wiki.clearTiddlerEventQueue
$tw.wiki.deleteTiddler
$tw.wiki.filterTiddlers
$tw.wiki.getTiddler
$tw.Wiki.parsers
$tw.Wiki.prototype.addTiddlers = function(tiddlers) {
$tw.Wiki.prototype.clearCache =
$tw.Wiki.prototype.clearGlobalCache =
$tw.Wiki.prototype.defineShadowModules = function() {
$tw.Wiki.prototype.defineTiddlerModules = function() {
$tw.Wiki.prototype.deserializeTiddlers = function(type,text,srcFields,options) {
$tw.Wiki.prototype.enqueueTiddlerEvent = function() {};
$tw.Wiki.prototype.filterOperators
$tw.Wiki.prototype.processSafeMode = function() {
$tw.wiki.registerPluginTiddlers
$tw.wiki.tiddlerExists
$tw.wiki.unpackPluginTiddlers

$tw.utils

$tw.utils.Animator
$tw.utils.Crypto
$tw.utils.Logger
$tw.utils.Modal
$tw.utils.Notifier
$tw.utils.PageScroller
$tw.utils.PasswordPrompt
$tw.utils.Popup
$tw.utils.addAttributeToParseTreeNode
$tw.utils.addClass
$tw.utils.addEventListeners
$tw.utils.base64Decode
$tw.utils.checkVersions
$tw.utils.convertPropertyNameToStyleName
$tw.utils.copyFile
$tw.utils.copyToClipboard
$tw.utils.count
$tw.utils.createDirectory
$tw.utils.deepDefaults
$tw.utils.deleteDirectory
$tw.utils.deleteEmptyDirs
$tw.utils.domMaker
$tw.utils.each
$tw.utils.entityDecode
$tw.utils.error
$tw.utils.evalGlobal
$tw.utils.evalSandboxed
$tw.utils.extend
$tw.utils.extractVersionInfo
$tw.utils.forceLayout
$tw.utils.formatDateString
$tw.utils.getAmPm
$tw.utils.getAnimationDuration
tw.utils.getAttributeValueFromParseTreeNode
$tw.utils.getFileExtensionInfo
$tw.utils.getFullScreenApis
$tw.utils.getHours12
$tw.utils.getInt
$tw.utils.getLocationHash
$tw.utils.getLocationPath
$tw.utils.getPassword
$tw.utils.getScrollPosition
$tw.utils.getTypeEncoding
$tw.utils.getWeek
$tw.utils.getYearForWeekNo
$tw.utils.hop //object has a property?
$tw.utils.hopArray
$tw.utils.htmlDecode
$tw.utils.htmlEncode
$tw.utils.httpRequest
$tw.utils.hyphenateCss
$tw.utils.importDataTransfer
$tw.utils.isArray
$tw.utils.isArrayEqual
$tw.utils.isDate
$tw.utils.isDirectory
$tw.utils.log
$tw.utils.makeDraggable
$tw.utils.pad
$tw.utils.parseAttribute
$tw.utils.parseCsvStringWithHeader
$tw.utils.parseDate
$tw.utils.parseFields
$tw.utils.parseMacroInvocation
$tw.utils.parseMacroParameter
$tw.utils.parseStringArray
$tw.utils.parseStringLiteral
$tw.utils.parseTextReference
$tw.utils.parseTokenRegExp
$tw.utils.parseTokenString
$tw.utils.parseVersion
$tw.utils.parseWhiteSpace
$tw.utils.pushTop
$tw.utils.registerFileType
$tw.utils.removeClass
$tw.utils.removeTrailingSeparator
$tw.utils.repackPlugin
$tw.utils.replaceString
$tw.utils.resolvePath
$tw.utils.roundTripPropertyName
$tw.utils.setStyle
$tw.utils.skipWhiteSpace
$tw.utils.strEndsWith
$tw.utils.stringifyDate
$tw.utils.stringifyList
$tw.utils.tagToCssSelector
$tw.utils.terminalColour
$tw.utils.toggleClass
$tw.utils.transliterate
$tw.utils.trim
$tw.utils.warning

$tw.modules.execute

$tw.hooks

$tw.hooks.invokeHook("th-boot-tiddlers-loaded");
$tw.hooks.addHook = function(hookName,definition)

$tw.boot

$tw.boot.excludeRegExp
$tw.boot.executedStartupModules
$tw.boot.logMessages
$tw.boot.preloadDirty
$tw.boot.tasks.readBrowserTiddlers
$tw.boot.wikiInfo
$tw.boot.wikiPath
$tw.boot.wikiTiddlersPath

$tw.config

$tw.config.contentTypeInfo
$tw.config.editionsPath
$tw.config.fileExtensionInfo
$tw.config.htmlBlockElements
$tw.config.htmlUnsafeElements
$tw.config.languagesEnvVar
$tw.config.pluginsPath
$tw.config.preferences.jsonSpaces
$tw.config.preferences.notificationDuration
$tw.config.textPrimitives
$tw.config.themesEnvVar
$tw.config.themesPath
$tw.config.wikiInfo
$tw.config.wikiTiddlersSubDir

<<eval """
$tw.wiki.addTiddler({
		title: "$:/TiddlerUn",
		text: "« Vif juge, trempez ce blond whisky aqueux. » <br><small>Voir aussi $:/TiddlerDeux",
		tags: ["un","démo"],
		authors: "jbf",
		modifier: "jbf",
		modified: "201904152222"});
$tw.wiki.addTiddler({
		title: "$:/TiddlerDeux",
		text: "Le vif zéphyr jubile sur les kumquats du clown gracieux <br><small>Voir aussi $:/TiddlerUn",
		tags: ["deux","démo"],
		authors: "jbf",
		modifier: "jbf",
		modified: "201904162222"});
""">>

Ce lien pour parcourir l’immensité de javascript me parait pas mal du tout :

1 « J'aime »

En voilà une liste REMARQUABLE!:star_struck: