TiddlyWiki5 独自のフィールドを追加して文字列を設定するスクリプト例

TiddlyWiki をローカルで編集・閲覧できる TiddlyDesktop アプリで、ボタンを表示して、そのボタンを押すと、追加した独自のフィールドに指定した文字列を設定するスクリプトとその実行結果を紹介します。
スクリプトで使われる、対象のフィールドと、そのフィールドに割り当てる値を指定する属性についても紹介します。

TiddlyWiki 20251022 公式サイトの一部

※ TiddlyWiki v5.3.8 を使用します。
※ TiddlyDesktop Version0.0.20 を使用します。
※スクリプトは自己責任でご利用ください。

前回の記事

押すと本文に文字列を追加するボタンの実装例は以下の記事を参照してください。

今回は、その際のスクリプトの一部を変更して、独自のフィールドに文字列を設定するボタンを実装します。

スクリプト例

以下は、新規作成する Tiddler に貼り付ける本文です。

<!-- HelloButton の定義 -->
<!-- ボタンが押された際のアクションでは、この Tiddler に追加した myField フィールドに Hello!MyField を設定します。-->

\define HelloButton()
<$button class="tc-tagged-button"
    actions="""<$action-setfield $tiddler=<<currentTiddler>> $field="myField"
        $value={{{ Hello!MyField }}}/>""">
Hello
</$button>
\end

!! Hello ボタンを押すと、追加した myField フィールドに Hello!MyField が設定されます。
削除したい場合は、編集に切り替えて、myFiled フィールドの内容を削除して保存してください。

<!-- HelloButton の表示 -->
<<HelloButton>>

テスト

以下の手順で、新規作成した Tiddler に独自のフィールド(例:myField)を追加します。

  1. TiddlyDesktop アプリで開いたウィキで、検索ボックスの上側の + (Create a new tiddler)ボタンを押して、 Tiddler を新規作成します。
  2. 新規作成した Tiddler の右上の鉛筆(Edit this tiddler)ボタンを押して編集画面を表示します。
  3. タイトル(例:TestHelloMyFieldButton)を入力します。
  4. 編集画面の下側の Add a new field の入力欄に追加するフィールドの名前を入力して、右側の add ボタンをおして、フィールドを追加します。

※実際に試したところ、フィールドを事前に追加しなくても、ボタンを押した際に、処理に必要なフィールドは自動的に作成されました。

TiddlyWiki5 独自のフィールドを追加して文字列を設定するスクリプト例1

独自のフィールド(例:myField)が Tiddler 内に追加されました

TiddlyWiki5 独自のフィールドを追加して文字列を設定するスクリプト例2

本文には、前述のスクリプトを貼り付けます。

編集が済んだら右上のチェックマーク ✔ (Confirm changes thid tiddler)ボタンを押して保存します。

TiddlyWiki5 独自のフィールドを追加して文字列を設定するスクリプト例3

※ class=”tc-tagged-button” は反映されないので、外しても構いません。

Hello ボタン押すと、追加したフィールドに指定した文字列設定されます。
※変更が検知されると、検索ボックスの上側の Save Changes ツールボタンの色が灰色から赤色に変わります。

変更を確認するために、Tiddler の右上の鉛筆(Edit this tiddler)ボタンを押して編集画面を表示します。

TiddlyWiki5 独自のフィールドを追加して文字列を設定するスクリプト例4

先ほど追加したフィールド myField に処理で指定した Hello!MyField という文字列設定されたことが確認できました。
フィールドを追加していなくても、処理を実行した際にフィールドが作成されて文字列が設定されました。

TiddlyWiki5 独自のフィールドを追加して文字列を設定するスクリプト例5

スクリプトの説明

$field 属性では、action-setfield アクションウィジェットが値を割り当てるフィールドを指定します。
field=”text” の場合は text フィールド(本文)を指定します。

$field

Optional name of a field to be assigned the $value attribute

$value 属性を割り当てるフィールドの名前 (オプション)

action-setfield: TiddlyWiki v5.3.8 — a non-linear personal web notebook と Google 翻訳

$value 属性では、 $field で指定したフィールドに割り当てる値を設定します。
値を設定しない場合、対象のフィールドまたはインデックスが削除されるようです。

$value

The value to be assigned to the field or index identified by the $field or $index attribute. If neither is specified then the value is assigned to the text field. If no value is specified, $field or $index will be deleted.

$field または $index 属性で識別されるフィールドまたはインデックスに割り当てられる値。どちらも指定されていない場合は、値がテキスト フィールドに割り当てられます。値が指定されていない場合は、$field または $index が削除されます。

まとめ

  • action-setfield アクションウィジェットを用いて、独自のフィールドを追加して文字列を設定しました。
    ※ Add a new field の欄から事前にフィールドを追加することもできます。
  • action-setfield アクションウィジェットの $field 属性で、値を割り当てるフィールドを指定できます。
  • action-setfield アクションウィジェットの $value 属性フィールドに割り当てる値を設定できます。

参照サイト Thank You!

記事一覧 → Compota-Soft-Press

コメント

Ads Blocker Image Powered by Code Help Pro

お願い - Ads Blocker Detected

このサイトは広告を掲載して運営しています。

ポップアップを閉じて閲覧できますが、よろしければ

このサイト内の広告を非表示にする拡張機能をオフにしていただけませんか?

━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

We have detected that you are using extensions to block ads. Please support us by disabling these ads blocker.

タイトルとURLをコピーしました