1
0
mirror of https://github.com/Jermolene/TiddlyWiki5 synced 2024-12-26 01:50:28 +00:00

Merge branch 'tiddlywiki-com'

This commit is contained in:
Jeremy Ruston 2024-12-21 09:47:40 +00:00
commit 370ca4b4c4
27 changed files with 828 additions and 4 deletions

View File

@ -0,0 +1,72 @@
created: 20140610213500000
modified: 20241209112247651
original-modified: 20241030132047048
tags: Concepts Features
title: ExternalImages
ja-title: 外部画像
type: text/vnd.tiddlywiki
TiddlyWikiの外部画像は、画像データすべてを埋め込むのではなく、画像のURIを指定するTiddlerです。特に画像の数やサイズが大きい場合、埋め込み画像よりもパフォーマンスが向上します。ただし、外部画像を使用すると、TiddlyWikiの単一ファイルパターンが崩れます。
外部画像はブラウザで使用されます。TiddlyWikiをビルドするときにNode.js構成によって作成されるか、ブラウザ内で手動で作成されます。
! 外部画像とは
外部画像は、画像のURIを含む''_canonical_uri''フィールドを持つ通常の画像Tiddlerです。URIは、HTMLドキュメントに対する絶対パスや相対パスで指定することができます。Canonical URIが指定されている場合は、Tiddlerの''text''フィールドは無視されるため、省略する必要があります。
! 外部画像を手動で作成する
外部画像を手動で作成するには、適切な画像コンテンツタイプでTiddlerを作成し、実際の画像の場所を指すURIを含む''_canonical_uri''フィールドを追加します。
''重要:'' スペルを再度確認してください。``_canonical_uri``は、URLではなく[[URI|https://en.wikipedia.org/wiki/URI#The_relationship_between_URIs.2C_URLs.2C_and_URNs]]と綴られます。
! Node.jsで外部画像を作成する
参照される外部画像を含む''images''フォルダーを伴うWikiの静的HTMLファイルバージョンを作成するには、次の手順を使用します:
# 通常の方法でTiddlyWikiFoldersに画像Tiddlerを作成します
# 画像を別ファイルとして保存します (慣例により、''images''という名前のサブフォルダに保存します)
# ''_canonical_uri''フィールドを追加して画像Tiddlerを外部化します
# メインのHTMLファイルを保存します
画像ファイルは外部化する前に保存する必要があることに注意してください。外部化すると、Wikiストアのメモリ内コピーの''text''フィールドが破壊され、保存の試みが失敗します。
たとえば、''tw5.com'' Wikiの''externalimages''ビルドターゲットを参照してください:
```
--save [is[image]] images
--setfield [is[image]] _canonical_uri $:/core/templates/canonical-uri-external-image text/plain
--setfield [is[image]] text "" text/plain
--render $:/core/save/all externalimages.html text/plain
```
!! 個別の画像ファイルを保存する
次の`--save`コマンド ([[Saveコマンド|SaveCommand]]を参照)を使用すると、Wikiの画像を''images''サブフォルダーに保存できます:
```
--save [is[image]] images
```
!! 画像Tiddlerの外部化
2つの`--setfield`コマンドが使用されています: 最初のコマンドは、''_canonical_uri''フィールドをTiddlerのタイトルから派生したURIに設定し、2番目のコマンドはtextフィールドをクリアします。
```
--setfield [is[image]] _canonical_uri $:/core/templates/canonical-uri-external-image text/plain
--setfield [is[image]] text "" text/plain
```
テンプレートTiddler [[$:/core/templates/canonical-uri-external-image]]には以下が含まれます:
<pre>
<$view tiddler="$:/core/templates/canonical-uri-external-image" field="text" format="text"/>
</pre>
これらの操作により、Wikiストア内のTiddlerが変更されるため、後続のコマンド操作に影響する可能性があることに注意してください。
! 外部画像の使用について
URIフィールドを別の画像を指すように変更しない限り、ブラウザで外部画像を直接編集することはできません。

View File

@ -0,0 +1,18 @@
created: 20150917193630604
modified: 20241212114212647
original-modified: 20201129183045031
tags: Features
title: InfoPanel
ja-title: 情報パネル
type: text/vnd.tiddlywiki
各Tiddlerには追加情報のパネルがあります。それを表示するには、Tiddlerのツールバーの<<.icon $:/core/images/down-arrow>>ボタンをクリックし、ドロップダウンリストから<<.icon $:/core/images/info-button>> ''情報''を選択します。
情報パネルには次のタブがあります。:
* ''ツール'' - このTiddlerで実行できるさまざまなアクションのボタンがあります。各ボタンの横にあるチェックボックスを使用すると、アクションをTiddlerのツールバーに昇格できます。これは、Wiki内のすべてのTiddlerに影響します
* ''参照''、''この名でタグ付''、''一覧''、''被リスト'' - これらはさまざまな種類の関連するTiddlerをリストします。[[リンクを使用してTiddler間を移動する|Using links to navigate between tiddlers]]ティドラー間の移動にリンクを使用するを参照してください
* ''項目'' - Tiddlerの''テキスト''以外の[[フィールド|TiddlerFields]]をすべてまとめたものです
* ''詳細'' - これは、Tiddlerが[[隠し|ShadowTiddlers]]であるかどうかを示します。隠しである場合、どのプラグインからのものか、通常のTiddlerによって上書きされているかどうかも明らかになります
情報パネルを閉じるには、情報パネルの外側の任意の場所をクリックします。

View File

@ -0,0 +1,64 @@
created: 20140502213500000
modified: 20241216111540858
original-modified: 20210406131243532
tags: Features Concepts
title: PermaLinks
ja-title: パーマリンク
type: text/vnd.tiddlywiki
パーマリンクを使用すると、TiddlyWiki内の個々のTiddlerへの直接リンクが可能になります。
! シンプルなパーマリンク
パーマリンク(<<.icon $:/core/images/permalink-button>>)の最も単純な形式は、`#`をともなうベースURLに1つのターゲットTiddlerタイトルを追加したものです:
https://tiddlywiki.com/#HelloThere
必要なら、Tiddlerタイトルにスペースを含めることができます:
[[https://tiddlywiki.com/#Using TiddlyWiki on Node.js]]
ターゲットTiddlerのタイトルを囲む二重角括弧は不要であることに注意してください。ただし、存在する場合は暗黙的に削除されます。
! ストーリーのパーマリンク
パーマリンクでは、対象のTiddlerと一緒に開くTiddlerのストーリーリストを[[Tiddlerフィルター|Filters]]として指定することもできます:
[[https://tiddlywiki.com/#TiddlerFields:Tiddlers TiddlerTags TiddlerFields ContentType]]
ターゲットTiddlerがストーリーリストに存在しない場合は、自動的に先頭に挿入されます。つまり、次の2つの例はどちらもストーリーシーケンス`Tiddlers`、`Tags`、`TiddlerFields`内の`Tiddlers`Tiddlerをターゲットにしています:
[[https://tiddlywiki.com/#Tiddlers:Tags TiddlerFields]]
[[https://tiddlywiki.com/#Tiddlers:Tiddlers Tags TiddlerFields]]
ナビゲーションのターゲットTiddlerを指定せずにストーリーフィルターを指定することもできます:
<a href="https://tiddlywiki.com/#:[tag[task]]" rel="noopener noreferrer">~https://tiddlywiki.com/#:[tag[task]]</a>
! URLエンコードについて
URLフラグメント内の有効な文字には技術的な制限があります。すべてのTiddlerタイトルに対応できるようにするために、不正な文字は"URL エンコード"と呼ばれるプロセスの対象となり、問題のある文字は数値コードに置き換えられます。たとえば、スペース文字は`%20`に置き換えられます。
ターゲットTiddlerのタイトルとストーリーフィルターは両方ともURLエンコードされている必要があります(区切りのコロンはエンコードされません)。TiddlyWikiは適切にエンコードされたURLを生成しますが、見た目がかなり醜い場合があります。ただし、実際には、ブラウザーは通常、URLフラグメント内の任意の文字を問題なく処理します。したがって、パーマリンクを手動で作成する場合は、URLエンコードを無視することを選択できます。
! パーマリンクの動作
TiddlyWikiのパーマリンクの動作に関する2つの重要な側面は、[[コントロールパネル|$:/ControlPanel]] <<.icon $:/core/images/options-button>>の''設定''タブのオプションで制御できます:
* 各ナビゲーションでアドレスバーを自動的に更新するかどうか、また更新する場合は、対象のTiddlerだけでなくストーリーシーケンスも含めるかどうか
* アドレスバーの更新がブラウザの履歴に反映されるかどうか。デフォルトは''いいえ''です。 ''はい''に切り替えると、ブラウザの「戻る」ボタンと「進む」ボタンを使用して、Tiddler間のナビゲーションを巻き戻すことができます
パーマリンクを入力または移動すると、常にパーマリンクが処理され、Tiddlerが適宜開閉されることに注意してください。
!! 技術詳細
TiddlyWikiが起動すると、以下の手順に従ってパーマリンクを処理します。パーマリンクが動的に変更される場合(たとえば、ユーザーがアドレスバーを編集したことに応じて変更される場合)、同じ手順が繰り返されます。
# パーマリンクにコロンが含まれている場合は、その前の文字列を''ターゲット''として扱い、その後ろの文字列を''ストーリーフィルター''として扱います
# パーマリンクにコロンが含まれていない場合は、文字列全体を''ターゲット''として扱い、''ストーリーフィルター''を//未指定//としてマークします
# ''ストーリーフィルター''が指定されておらず、起動中の場合、''ターゲット''が指定されている場合は''ストーリーフィルター''を空の文字列に設定し、''ターゲット''が指定されていない場合はデフォルトのTiddlerに設定します
# ''ストーリーフィルター''が指定されておらず、起動中でない場合は、''ストーリーフィルター''を現在のストーリーリストに設定します
# ''ストーリーフィルター''を''ストーリーリスト''として評価します
# ''ターゲット''が指定されていて''ストーリーリスト''にない場合は、一番上に追加します
# ''ターゲット''が指定されている場合はそこに移動し、そうでない場合は''ストーリーリスト''の最初のTiddlerに移動します

View File

@ -0,0 +1,9 @@
created: 20140912145543340
modified: 20241216105528737
original-modified: 20211119192337845
tags: Demonstrations
title: SampleNotification
ja-title: 通知のサンプル
type: text/vnd.tiddlywiki
{{$:/core/images/done-button}} これは通知です!

View File

@ -0,0 +1,15 @@
created: 20140912145537860
footer: <$button message="tm-close-tiddler">閉じる</$button>
modified: 20241215111438511
original-modified: 20211119205125230
subtitle: これはモーダルウィザードです
tags: Demonstrations
title: SampleWizard
ja-title: サンプルウィザード
type: text/vnd.tiddlywiki
これは、Tiddler [[サンプルウィザード|SampleWizard]]に保存されているモーダルウィザードダイアログです。
{{Motovun Jack.jpg}}
<$button message="tm-modal" param="SampleWizard2">ウィザードをネスト</$button>することもできます。

View File

@ -0,0 +1,13 @@
created: 20140912145532856
footer: <$button message="tm-close-tiddler">閉じる</$button>
modified: 20241215111706825
original-modified: 20211119205144340
subtitle: これはもう一つのモーダルウィザードです
tags: Demonstrations
title: SampleWizard2
ja-title: サンプルウィザード2
type: text/vnd.tiddlywiki
これは、Tiddler [[サンプルウィザード2|SampleWizard2]]に保存されているもう一つのモーダルウィザードダイアログです。
<$button message="tm-modal" param="SampleWizard">ウィザードをネスト</$button>することもできます。

View File

@ -0,0 +1,13 @@
created: 20140206211715540
modified: 20241206115421575
original-modified: 20160610081543108
tags: Features
title: AutoSave
ja-title: 自動保存
type: text/vnd.tiddlywiki
自動保存をサポートする利用可能なSavingMechanismがある場合、TiddlyWikiは、Tiddlerの編集時に<<.icon $:/core/images/done-button>>''ok''または<<.icon $:/core/images/delete-button>>''削除''をクリックすると、現在のドキュメントの保存を自動的にトリガーします
自動保存が行われたことを確認するために、ウィンドウの右上に黄色の通知が表示されます
自動保存は、[[コントロールパネル|$:/ControlPanel]]<<.icon $:/core/images/options-button>>の''設定''タブで有効または無効にできます。バックグラウンドでは、設定用Tiddler[[$:/config/AutoSave]]を通じて制御されます。自動保存を有効にするには、この構成の値が''yes''である必要があります

View File

@ -0,0 +1,42 @@
title: Core Icons
ja-title: コアアイコン
tags: Features
modified: 20241206115817981
original-modified: 20230423103154329
created: 20230423103154329
!! 紹介
TiddlyWikiには100以上のカスタムベクターアイコンが含まれています。これらはユーザーインターフェイスに組み込まれており、作成者が独自のアプリケーションで使用することもできます。完全なリストについては、[[アイコンギャラリー|Icon Gallery]]を参照してください。
!! 使用法
コアアイコンはトランスクルージョンして使用します。例えば:
<<wikitext-example-without-html """{{$:/core/images/new-image-button}}
""">>
コアアイコンはパラメータ化されています。最初のパラメータ`size`は、アイコンをレンダリングするサイズを指定します:
<<wikitext-example-without-html """{{$:/core/images/picture|64px}}
<$transclude $tiddler="$:/core/images/picture" size="32px"/>
""">>
アイコンのサイズを動的に変更する例を示します:
<<wikitext-example-without-html """<$list filter="[range[24,56,8]]" variable=iconSize>
<$text text={{{ [<iconSize>addsuffix[px]] }}} />
<$transclude $tiddler="$:/core/icon" size=<<iconSize>>/>
</$list>
""">>
一部のアイコンは、レンダリング方法をカスタマイズするためにさらにパラメーターを受け取ります。例えば、$:/core/images/new-journal-buttonアイコンは、カレンダーに表示する日付を指定する追加パラメータ`day`を取ります。指定しない場合、デフォルトで現在の日付が設定されます
<<wikitext-example-without-html """{{$:/core/images/new-journal-button|48px|17}}
<$transclude $tiddler="$:/core/images/new-journal-button" day="17"/>
""">>
コア アイコンは、本格的なSVG画像としてではなく、埋め込み[[SVG 要素|Using SVG]]として実装されています。これは、CSSを使用してスタイルを設定できることを意味します。例えば、CSSプロパティ`fill`を使用してアイコンの色を変更できます。例えば:
<<wikitext-example-without-html """<span style="fill: red;">{{$:/core/images/opacity}}</span>
""">>

View File

@ -0,0 +1,89 @@
created: 20140418142957325
modified: 20241206120335412
original-modified: 20230226144359284
tags: Features
title: DateFormat
ja-title: 日付形式
type: text/vnd.tiddlywiki
日付のデフォルトの表現は、<<.value 20211002153802059>>のようなコンパクトな文字列です。関連するテンプレートは`[UTC]YYYY0MM0DD0hh0mm0ss0XXX`です。たとえば、<<.field created>>や<<.field modified>>のフィールドは次のように保存されます。
この文字列の表示形式は、テンプレートで制御できます。たとえば、<<.field modified>>フィールドをトランスクルードすると、日付を<<.value "Sat Oct 02 2021 17:40:50 GMT+0200 (Central European Summer Time)">>として表示するテンプレートが自動的に適用されます。いくつかのウィジェットとフィルター演算子では、テンプレートを手動で指定できます。たとえば、ViewWidgetです:
`<$view field=modified format=date template="DDth mmm YYYY 0hh:0mm:0ss" />`
日付文字列は次の置換で処理されます:
|!トークン |!置き換えられる値 |
|`ddddd` |<<.from-version "5.2.0">> 年間日数 (1から365まで、うるう年の場合は366まで) |
|`0ddddd` |<<.from-version "5.2.0">> 年間日数(ゼロ埋め) (001から 365まで、うるう年の場合は366まで) |
|`DDD` |曜日 (例、"月曜") |
|`ddd` |曜日(短縮) (例、"月") |
|`dddd` |<<.from-version "5.2.0">> 月曜始まり日曜終わりの1から7までに曜日番号 |
|`DD` |日付 |
|`0DD` |日付(ゼロ埋め) |
|`DDth` |日付('日'付き) |
|`WW` |週番号(ISO-8601) |
|`0WW` |週番号(ISO-8601)(ゼロ埋め) |
|`MMM` |月 (例、"7月") |
|`mmm` |月(短縮) (例、"7月") |
|`MM` |月番号 |
|`0MM` |月番号(ゼロ埋め) |
|`YYYY` |年 |
|`YY` |年(下2桁) |
|`wYYYY` |週番号に関する年 |
|`aYYYY` |<<.from-version "5.1.23">> 年(負の日付を正として表示) |
|`wYY` |週番号に関する年(下2桁) |
|`{era:BCE||CE}` |<<.from-version "5.1.23">> 負、ゼロ、正の年に対して異なる文字列を表示 (下記参照) |
|`hh` |時 |
|`0hh` |時(ゼロ埋め) |
|`hh12` |時(12時間表記) |
|`0hh12` |時(12時間表記)(ゼロ埋め) |
|`mm` |分 |
|`0mm` |分(ゼロ埋め) |
|`ss` |秒 |
|`0ss` |秒(ゼロ埋め) |
|`XXX` |ミリ秒 |
|`0XXX` |ミリ秒(ゼロ埋め) |
|`am` or `pm` |AM/PMインジケータ(小文字) |
|`AM` or `PM` |AM/PMインジケータ(大文字) |
|`TZD` |タイムゾーンオフセット |
|`TIMESTAMP` |<<.from-version "5.2.4">> 1970年1月1日([[ECMAScriptエポック|https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date#the_ecmascript_epoch_and_timestamps]])からのミリ秒数 |
|`\x` |特別な意味を持つ文字をエスケープするために使用 |
|`[UTC]`|表現された日付をUTCにタイムシフトします。フォーマット文字列の先頭になければなりません。|
その他のテキストは変更されずに渡され、カンマ、コロン、またはその他の区切り文字が使用されることに注意してください。
この`{era:BCE||CE}`表記法では、負、ゼロ、正の年に対して異なる文字列を指定できます。たとえば、`{era:BC|Z|AD}`は、負の年の場合は<<.value BC>>、正の年の場合は<<.value AD>>、0年の場合は<<.value Z>>が表示されます。
! 例
|!テンプレート |!Output |
|`DDth MMM YYYY` |16日 2月 2011 |
|`DDth MMM \M\M\M YYYY` |16日 2月 MMM 2011 |
|`DDth mmm YYYY 0hh:0mm:0ss` |16日 2月 2011 11:38:42 |
!! <<.value TIMESTAMP>>を時間差を計算するために使用する
次のようにして、2つの日付の差を計算できます:
# 両方の日付をタイムスタンプに変換します
# 後の日付を前の日付から引きます -- どちらが早いかわからない場合は、減算後に絶対値を取得する<<.olink "abs">>演算子を使用します
# 結果の数値を選択した間隔のミリ秒数で割ります
以下は、現在のTiddlerの作成から最終更新までの経過日数を計算する例です:
* <<.field created>>フィールドと<<.field modified>>フィールドをタイムスタンプに変換します
* その差を1日のミリ秒数である<<.value 86400000>>で割ります
** 1000ミリ秒/秒 × 60秒/分 × 60分/時 × 24時間/日 = 86,400,000 ミリ秒/日
<$macrocall $name=".example" n="0" eg="""<$let
timestamp-modified={{{ [{!!modified}format:date[TIMESTAMP]] }}}
timestamp-created={{{ [{!!created}format:date[TIMESTAMP]] }}}
difference-days={{{ [<timestamp-modified>subtract<timestamp-created>divide[86400000]floor[]] }}}>
* ''更新日:'' <$text text={{{ [{!!modified}format:date[YYYY-0MM-0DD]] }}}/>
* ''作成日:'' <$text text={{{ [{!!created}format:date[YYYY-0MM-0DD]] }}}/>
* ''日付の差:'' <<difference-days>>日
</$let>"""/>

View File

@ -0,0 +1,22 @@
created: 20230627093650105
modified: 20241207112556326
original-modified: 20230627094356394
tags: Features
title: Deserializers
ja-title: デシリアライザー
type: text/vnd.tiddlywiki
デシリアライザー[[モジュール|Modules]]は、さまざまな形式のテキストをTiddlerとしてJSON表現に解析します。Wikiで使用可能なデシリアライザーモジュールは、 [[デシリアライザー演算子|deserializers Operator]]を使用して表示でき 、[[デシリアライズ演算子|deserialize Operator]]とともに使用できます。
TiddlyWikiコアは次のデシリアライザーを提供します:
|!デシリアライザー |!説明 |
|(DOM)|DOMードからTiddlerを抽出します。<<.op deserialize[]>>演算子と一緒に使用しないでください|
|application/javascript|ヘッダーコメントからフィールドを抽出するTiddlerとしてJavaScriptモジュールを解析します|
|application/json|[[JSON|JSON in TiddlyWiki]]を解析してTiddlerにします|
|application/x-tiddler|[[.tidファイル形式|TiddlerFiles]]を解析してTiddlerにします|
|application/x-tiddler-html-div|[[<DIV>.tiddlerファイルフォーマット|TiddlerFiles]]を解析してTiddlerにします|
|application/x-tiddlers|[[MultiTiddlerFile形式|MultiTiddlerFiles]]を解析してTiddlerにします|
|text/css|CSSを解析しヘッダーコメントからフィールドを抽出してTiddlerにします|
|text/html|HTMLファイルを解析してTiddlerにします。~TiddlyWikiクラシックHTMLファイル、~TiddlyWiki5 HTMLファイル、通常のHTMLファイルをサポートします|
|text/plain|プレーンテキストを解析してTiddlerにします|

View File

@ -0,0 +1,33 @@
created: 20170328143119836
modified: 20241208110958833
original-modified: 20170328173846754
tags: Features
title: Drag and Drop
ja-title: ドラッグアンドドロップ
type: text/vnd.tiddlywiki
~TiddlyWikiはドラッグアンドドロップを使用して、2つの機能を実現します:
* ~TiddlyWikiに[[Tiddlerをインポート|Importing Tiddlers]]する
* ~TiddlyWiki内でのTiddler操作
ドラッグアンドドロップによるTiddler操作は、次のコンテキストでコアのユーザーインターフェイスによってサポートされます:
* サイドバーの"表示中"タブのエントリはドラッグアンドドロップで並べ替えることができます。タイトルをリストにドラッグすることで新しいTiddlerを開くことができます。
* タグピルのドロップダウン内のエントリはドラッグアンドドロップで並べ替えることができます。タイトルをリストにドラッグすることで新しいTiddlerにタグを割り当てることができます。
* [[コントロールパネル|$:/ControlPanel]]の"外観"/ツールバー"タブのエントリは、ドラッグアンドドロップで並べ替えることができます。(あまり便利ではありませんが、タイトルをリストにドラッグすることで、ツールバーに新しいエントリを追加できます)
すべてのTiddlerリンクはデフォルトでドラッグ可能です。ブラウザウィンドウ内でドラッグしてTiddlerを操作することも、別のブラウザウィンドウにドラッグして[[インポート操作|Importing Tiddlers]]を開始することもできます。
リンクをドラッグする場合は、水平方向の移動はブラウザによってテキスト選択として認識されるため、最初に垂直方向に移動します。
タグピルもドラッグ可能であり、タグを持つ個々のTiddlerすべてを同時にドラッグするのと同じです。
ドラッグアンドドロップによるTiddler操作の一般的なシナリオは、再利用可能なマクロとして利用できます:
* [[list-links-draggableマクロ|list-links-draggable Macro]]はTiddler ListField内のエントリを並べ替えるためのマクロ
* [[list-tagged-draggableマクロ|list-tagged-draggable Macro]]は指定されたタグを持つTiddlerを並べ替えるためのマクロ
低レベルのドラッグアンドドロッププリミティブを使用して、より複雑なインタラクションを構築する方法の詳細については、[[ドラッグアンドドロップのメカニズム|DragAndDropMechanism]]を参照してください。
~TiddlyWikiで使用される標準HTML 5のドラッグアンドドロップAPI は、通常、スマートフォンやタブレットのモバイルブラウザーでは利用できません。[[モバイルドラッグアンドドロップShimプラグイン|Mobile Drag And Drop Shim Plugin]]は、iOSやAndroidを含む多くのモバイルブラウザーで部分的サポートを実装するオープンソースライブラリを追加します。

View File

@ -0,0 +1,13 @@
created: 20130822172800000
modified: 20241206113502662
original-modified: 20160107225826644
tags: TableOfContents
title: Features
ja-title: 機能
type: text/vnd.tiddlywiki
TiddlyWikiの機能に関する詳細情報:
<<list-links "[tag[Features]]">>
最後になりましたが、TiddlyWikiは実用的な[[クワイン|Quine]]の稀な例です

View File

@ -0,0 +1,18 @@
created: 20131213101024997
modified: 20241210112855653
original-modified: 20170329104438386
tags: Features
title: Future Proof
ja-title: 将来性
type: text/vnd.tiddlywiki
2016年1月の[[Network World|http://www.networkworld.com/article/3028098/open-source-tools/tiddlywiki-a-free-open-source-wiki-revisited.html]]誌より:
<<<
はるか昔(正確には2009年1月)、私はTiddlyWikiという“個人用非線形Webートブック”という非常に優れたツールについて[[書きました|http://www.networkworld.com/article/2272104/applications/an-amazing-free-microwiki.html]]。そして今日になって、私は幽体離脱体験をしました。偶然、その記事を書いたときに始めたTiddlyWikiを見つけたのですが、それはまだ機能しているのです。
わずか2、3年後に完璧に動作するコードが見つかるだけでも十分魔法のようですが、7年も経ってます! TiddlyWikiは単一ページのWebアプリケーションとして作成されており、現在のブラウザーが2009年当時と大きく異なることを考えると、TiddlyWikiの古いバージョンがまだ動作しているという事実はまさに奇跡的です。
<<<
TiddlyWikiは、ユーザーの長期的なニーズを念頭に置いて設計されています。[[オープンソース|OpenSource]]であり、インフラストラクチャを必要としないため、遠い未来においても、~TiddlyWikiファイルにアクセスするために必要なのは、通常のHTMLブラウザーだけであると確信できます。キャリアの初期に~TiddlyWikiを使い始めたとしても、退職するまで~TiddlyWikiが役立つと確信できます。

View File

@ -0,0 +1,28 @@
created: 20130825162000000
modified: 20241211112813514
original-modified: 20170328160211362
tags: Features
title: Importing Tiddlers
ja-title: Tiddlerのインポート
type: text/vnd.tiddlywiki
外部ファイルから、または別の~TiddlyWikiから直接、Tiddlerを~TiddlyWikiにインポートできます。
!! 外部ファイルからのコンテンツのインポート
外部ファイルからコンテンツ(テキスト、画像、PDFドキュメントなど)をインポートする方法はいくつかあります:
* <<.icon $:/core/images/import-button>> ''インポート''ボタン(サイドバーの''ツール''タブ配下)を使用してローカルファイルを選択します
* WindowsエクスプローラーやOS X Finderなどからファイルを~TiddlyWikiブラウザウィンドウにドラッグアンドドロップします
* メニューやキーボードショートカット(<kbd>ctrl-V</kbd>または<kbd>cmd-V</kbd>)を使用して、クリップボードから直接コンテンツを貼り付けます
** 現在、Chrome、Firefox、Edgeでサポートされています(Internet Explorerはサポートされていません)
ほとんどのファイルは個別のTiddlerとしてインポートされます。例外は次のとおりです:
* ~TiddlyWikiファイルとして認識された''.html''ファイルは解析され、その中のTiddlerが抽出されます。
* ''.json''ファイルは解析され、その中にあるTiddlerが抽出されます。''.json''ファイルは、別の~TiddlyWikiから[[エクスポートする|How to export tiddlers]]ことで作成できます。~TiddlyWikiは、単一のTiddlerフィールドオブジェクトまたはTiddlerフィールドオブジェクトの配列を含むJSONファイルを受け入れます
!! 他の~TiddlyWikiブラウザウィンドウからのコンテンツのインポート
Tiddlerは、[[ドラッグアンドドロップ|Drag and Drop]]を使用して他の~TiddlyWikiブラウザーウィンドウからインポートできます。TiddlyWikiの内部リンクやタグを、ある~TiddlyWikiブラウザーウィンドウから別のウィンドウにドラッグします。内部リンクをドラッグすると1つのTiddlerがインポートされますが、タグピルをドラッグすると、そのタグを持つすべてのTiddlerがインポートされます。

View File

@ -0,0 +1,73 @@
title: JSON in TiddlyWiki
ja-title: TiddlyWikiでのJSON
tags: Features
type: text/vnd.tiddlywiki
created: 20220427174702859
modified: 20241214111229300
original-modified: 20220611104737314
!! 紹介
JSON(~JavaScript Object Notation)は、データの保存と転送に広く使用されているデータ構造の標準化されたテキスト表現です。
JSONはTiddlyWikiのさまざまなコンテキストで使用されます。例:
* TiddlerはTiddlyWiki HTMLファイル内でJSONデータとして表現されます
* Tiddlerの集まりはJSONファイルとして[[エクスポート|How to export tiddlers]]および[[インポート|Importing Tiddlers]]できます
* プラグインTiddlerは、構成要素の隠しTiddlerをJSONデータとして保存します
* クライアント-サーバー構成では、クライアントとサーバー間の通信に[[JSONメッセージ|TiddlyWeb JSON tiddler format]]を使用します
* DataTiddlers内の任意のJSONデータは、一連のフィルター演算子とアクションウィジェットを使用して処理および操作できます
!! JSONについて
公式ウェブサイト https://json.org/ の JSONの技術的説明は簡潔です。ここでは主な機能を要約します。
JSONは次の2つの基本データ構造をサポートします:
''配列''はアイテムのリストです。アイテムは数値インデックス(0始まり)によって識別されます
配列の例は次のとおりです:
```json
["one","two","three\"four"]
```
次の配列の機能に注意してください:
* 配列はアイテムのリストを囲む角括弧で表されます
* 各アイテムは二重引用符で囲まれた文字列です。二重引用符は、その前にバックスラッシュ(`\`)を付けることで文字列内に含めることができます
* アイテムはカンマで区切られます
''オブジェクト''は名前と値のペアの集合です。各アイテムは一意の名前で識別される値です
オブジェクトの例は次のとおりです:
```json
{
"first": "これは一番目の値です",
"second": "これは二番目の値です",
"third": "これは三番目の値です"
}
```
次のオブジェクトの機能に注意してください:
* オブジェクトは、名前と値のペアのリストを囲む中括弧で表されます
* 各名前/値のペアは、二重引用符で囲まれた名前、コロン、そして値で構成されます
* 名前と値のペアはカンマで区切られます
上記の例はすべて文字列値を示しています。JSONはいくつかの異なるタイプの値をサポートしています。これらのタイプはいずれも値として使用できます:
* 上に示したような文字列値
* `1`, `3.14`のような符号付き十進数として表される数値、指数表記も使用できます。例: `-1E10`
* キーワード`true`と`false`とで表されるブール値
* 欠損または不完全なデータを表すために使用される特別な値 `null`
* オブジェクトと配列も値であり、複雑なネスト構造を表現することができる
!! データTiddlerの操作
* [[JSON Tiddlerからのデータの読み取り|Reading data from JSON tiddlers]]
* [[JSON Tiddlerの構築|Constructing JSON tiddlers]]
* [[JSON Tiddlerの修正|Modifying JSON tiddlers]]

View File

@ -0,0 +1,32 @@
created: 20140206214608586
modified: 20241214111529899
original-modified: 20211009145417525
tags: Features
title: LazyLoading
ja-title: 遅延読み込み
type: text/vnd.tiddlywiki
通常、TiddlyWikiでは、すべてのTiddlerの完全なコンテンツがメインのHTMLファイルに埋め込まれます。遅延読み込みとは、Tiddlerに関するメタデータ(言い換えると、''テキスト''フィールド以外のすべてのフィールド)のみを埋め込み、必要なときにサーバーから本文を要求する手法を指します。
遅延読み込みは次の2つの構成で使用できます:
* [[Node.js上でのTiddlerWiki|TiddlyWiki on Node.js]]を実行する場合、画像Tiddlerのみ、またはシステム以外のすべてのTiddlerが遅延読み込みの対象にできます
* [[TiddlyWebのためのSkyでのTiddlyWiki|TiddlyWiki in the Sky for TiddlyWeb]]を実行する場合、すべてのTiddlerは遅延読み込みの対象になります
遅延読み込みの実装方法の詳細については、[[遅延読み込みメカニズム|https://tiddlywiki.com/dev/#LazyLoadingMechanism]]を参照してください。
! Node.jsでの遅延読み込み
画像Tiddlerの遅延読み込みでTiddlyWikiを起動するには、次のコマンドを使用します:
```
tiddlywiki --listen root-tiddler=$:/core/save/lazy-images
```
非システムTiddlerすべてに遅延読み込みを適用するには、次のコマンドを使用します:
```
tiddlywiki --listen root-tiddler=$:/core/save/lazy-all
```

View File

@ -0,0 +1,26 @@
created: 20160107225427489
modified: 20241215105515572
original-modified: 20211221102625141
tags: Features
title: Modals
ja-title: モーダル
type: text/vnd.tiddlywiki
モーダル(または"ウィザード")は、メインのTiddlyWikiウィンドウをフェードアウトして、ユーザーが明示的に閉じる必要がある独立したTiddlerを表示します。
表示されるTiddlerには、モーダルをカスタマイズするために使用される次のオプションフィールドを含めることができます:
|!フィールド |!説明 |
|footer|モーダルのフッターテキスト|
|subtitle|`h3`HTMLタグ内に表示されるモーダルのサブタイトルテキスト|
|class|モーダルラッパーに適用する追加クラス|
|help|フッターの左側に"Help"というテキストとともに表示されるオプションの外部リンク|
|mask-closable|''yes''または''true''に設定すると、マスク(モーダルの外側の領域)がクリックされたときにモーダルダイアログが閉じます|
フッターとサブタイトルのフィールドはプレーンテキストに限定されず、ウィジェットやトランスクルージョンなどのWikiテキスト機能も使用できることに注意してください。
モーダルは[[WidgetMessage: tm-modal]]で表示されます。
<$button message="tm-modal" param="SampleWizard">デモモーダルを開く</$button>
<<.tip """<$macrocall $name=".from-version" version="5.2.4"/> "mask-closable"フィールドが使用できるようになりました""">>

View File

@ -0,0 +1,11 @@
created: 20160107225753340
modified: 20241215112240963
original-modified: 20160107225855353
tags: Features
title: Notifications
ja-title: 通知
type: text/vnd.tiddlywiki
通知は、 TiddlyWikiウィンドウの右上に表示される小さな情報メッセージで、事前に設定された時間が経過すると自動的に消えます。
<$button message="tm-notify" param="SampleNotification">通知のサンプルを表示</$button>

View File

@ -0,0 +1,38 @@
created: 20190316163428191
modified: 20241216105842099
original-modified: 20190510133455372
tags: Features
title: Performance Instrumentation
ja-title: パフォーマンス統計情報
type: text/vnd.tiddlywiki
コアには、更新サイクル用のパフォーマンス統計情報が組み込まれています。コントロールパネルの“設定”タブの“パフォーマンス統計情報”を参照してください。有効化には、Wikiを再読み込みする必要があります。
パフォーマンス統計情報をオンにすると、更新サイクルがトリガーされるたびに、ブラウザのデベロッパーコンソールにタイミング情報が追記されます。例:
```
performance: mainRender: 327.83ms
performance: styleRefresh: 9.14ms
performance: mainRefresh: 68.10ms
```
上記の情報は次のように解釈できます:
* mainRenderはページテンプレートの初期表示にかかる時間です
* styleRefreshはページのスタイルシートをリフレッシュするのにかかる時間です
* mainRefreshはメインページテンプレートをリフレッシュするのにかかる時間です
たとえば、サイドバーのタブを切り替えて、レンダリングにかかる​​時間を比較してみましょう。
フィルター実行タイミングに関する詳細な情報も利用できます。パフォーマンス統計情報を有効にして、ブラウザーのデベロッパーコンソールに次のJavaScriptコマンドを入力します:
```
$tw.perf.log()
```
次の情報を含むテーブルが表示されます:
* ''name'' - 文字列"Filter: "とフィルターのテキスト
* ''invocations'' - 起動からのフィルターの呼び出し回数
* ''totalTime'' - 起動からのこのフィルターの評価に費やされた合計時間(ミリ秒)
* ''percentTime'' - すべてのフィルターの実行時間合計に対するこのフィルターの実行時間の割合

View File

@ -0,0 +1,30 @@
created: 20140419082845576
modified: 20241217111550799
original-modified: 20190912093109517
tags: Features
title: SafeMode
ja-title: セーフモード
type: text/vnd.tiddlywiki
! 紹介
セーフモードでは、TiddlyWikiのほとんどのカスタマイズを無効にすることができます。TiddlyWikiが誤ってカスタマイズされると動作しなくなる可能性があるため、この機能は便利です。特に問題となるのは、TiddlyWikiの新しいコアバージョン(特にベータ版)にアップグレードすると、一部のカスタマイズが壊れてしまうことです。
<<.warning "セーフモードは、TiddlyWikiの単一ファイル構成でのみ使用し、自動保存を行わないセーバーでのみ使用してください。クライアントサーバー構成でセーフモードを使用すると、データが失われる可能性があります。">>
! セーフモードの有効化
ブラウザでセーフモードを有効にするには、URLハッシュに文字列`#:safe`に設定してTiddlyWikiを起動します。例:
https://tiddlywiki.com/#:safe
! セーフモードの仕組み
セーフモードでは、次の2つの変更が行われます:
* すべてのプラグインは一時的に無効になっています。[[コントロールパネル|$:/ControlPanel]] <<.icon $:/core/images/options-button>>を使用して個々のプラグインを無効にすることができます。
* 隠しTiddlerをオーバーライドするTiddlerは、プレフィックス`SAFE: `を付けた名前に変更され、元の隠しTiddlerが復元されます
* 特定の構成オプションは無視され、代わりにデフォルト設定が使用されます:
** WikiParserRuleConfiguration
名前が変更されたTiddlerを検査できるレポートTiddlerが表示されます。

View File

@ -0,0 +1,11 @@
created: 20130822173400000
modified: 20241218111837188
original-modified: 20211124215615812
tags: Features
title: Scalability
ja-title: スケーラビリティ
type: text/vnd.tiddlywiki
TiddlyWikiの[[シングルページアプリケーション|SinglePageApplication]]としてのアーキテクチャは、大量のデータには適さないと思われるかもしれません。実際、TiddlyWikiユーザーは、数十あるいは100メガバイトを超えるファイルでも問題なく処理しています。また、ギガバイト単位のファイルでも実験に成功しています。
大規模なWikiの[[パフォーマンスに関するティップス|Performance]]を参照してください。

View File

@ -0,0 +1,46 @@
created: 20180323092308399
modified: 20241218112530254
original-modified: 20201025161723719
tags: Features
title: StartupActions
ja-title: スタートアップアクション
type: text/vnd.tiddlywiki
TiddlyWikiはスタートアップ時に、次のシステムタグを持つTiddlerのActionWidgetsを実行します:
* 初期スタートアップ時に実行されます:
** <<tag "$:/tags/StartupAction">> (すべてのプラットフォームで実行)
** <<tag "$:/tags/StartupAction/Browser">> (ブラウザで実行している場合にのみ実)
** <<tag "$:/tags/StartupAction/Node">> (Node.jsで実行している場合にのみ実行)
* レンダリング後のスタートアップ時に実行されます:
** <<.from-version "5.1.23">> <<tag "$:/tags/StartupAction/PostRender">> (ブラウザで実行している場合にのみ実行)
!! 初期スタートアップアクション
初期スタートアップアクションは、画面サイズなどの環境要因に応じてTiddlyWikiをカスタマイズするのに役立ちます。たとえば、次のアクションウィジェットをTiddlerタグ`$:/tags/StartupAction/Browser`を付けて配置すると、画面幅が1000ピクセル未満の場合にサイドバーがデフォルトで非表示になります:
```
<$reveal type="lt" state="$:/info/browser/screen/width" text="3000">
<$action-setfield $tiddler="$:/state/sidebar" $value="no"/>
</$reveal>
<$reveal type="gteq" state="$:/info/browser/screen/width" text="3000">
<$action-setfield $tiddler="$:/state/sidebar" $value="yes"/>
</$reveal>
```
<<.from-version "5.1.20">> 次の例では、ブラウザによって報告された言語に一致する言語プラグインに切り替えます:
```
<$action-setfield $tiddler="$:/language" text={{{ [[$:/languages/en-GB]] [plugin-type[language]sort[description]removeprefix[$:/languages/]] +[prefix{$:/info/browser/language}] ~[[en-GB]] +[addprefix[$:/languages/]] }}}/>
```
デフォルトでは、グローバルマクロは初期スタートアップアクションTiddler内では利用できないことに注意してください。これらにアクセスする必要がある場合は、Tiddlerの先頭に[[Pragma: \import]]を明示的に含める必要があります:
```
\import [subfilter{$:/core/config/GlobalImportFilter}]
```
!! レンダリング後のスタートアップアクション
<<.from-version "5.1.23">> レンダリング後のスタートアップアクションは、TiddlyWikiのユーザーインターフェイスがレンダリングされた後に実行されます。これにより、レンダリングされた表示に依存するアクション(モーダルの表示など)を実行できるようになります。

View File

@ -0,0 +1,57 @@
created: 20131028132700000
modified: 20241219105600277
original-modified: 20160618085859219
tags: Features
title: Using SVG
ja-title: SVGの使用
type: text/vnd.tiddlywiki
TiddlyWiki5では、SVGを使用して2つの方法でベクターグラフィックスを表示できます:
* `image/svg+xml`タイプのTiddlerはSVG画像として解釈され、`src`属性にデータURIとして埋め込まれたSVGを持つ自己包含型の`<img>`要素として表示、トランスクルードされます。
** SVG画像の例としては、[[Motovun Jack.svg]]や[[Tiddler Fishes.svg]]を参照してください
* WikiTextには、インラインSVG要素を直接含めることもできます。例については以下を参照してください。
! SVG Tiddlerの埋め込み
通常のトランスクルージョン構文を使用してSVG画像Tiddlerを埋め込むことができます:
```
{{Motovun Jack.jpg}}
```
[[WikiText の型付きブロック|Typed Blocks in WikiText]]を使用して、インラインでSVG Tiddlerを埋め込むこともできます。
`<img>`要素内でレンダリングされる画像の意味は、画像がサンドボックス化されることです。たとえば、親ドキュメントのCSSスタイルは使用されません。また、画像はトランスクルージョンなどのWikiText機能も使用できません。
! SVG要素の埋め込み
SVGを使用するもう1つの方法は、`<svg>`要素を直接埋め込むことです。例:
<svg width="150" height="100">
<circle cx="100" cy="50" r="40" stroke="black" stroke-width="2" fill="red" />
</svg>
インラインSVG要素には`<?xml version="1.0"?>`宣言は必要ないことに留意してください。
! SVG画像にHTMLまたはWikiTextコンテンツを含める
`<text>`要素を使用して、SVG画像に単純なテキスト文字列を含めることができます:
<svg width="100px" height="30px" viewBox="0 0 1000 300"><text x="250" y="150" font-family="Verdana" font-size="55">みなさん、こんにちは</text><rect x="1" y="1" width="998" height="298" fill="none" stroke-width="2" /></svg>
`<foreignObject>`要素を使用して、HTMLやWikiTextコンテンツをインラインSVG画像内に含めることができます。例:
<svg width="260px" height="260px"><circle cx="150" cy="150" r="100" fill="blue" stoke="red"/><foreignObject x="70" y="110" width="150" height="180"><body>これはワードラップが必要なテキストで、[[Tiddlerへのリンク|HelloThere]]が含まれています。</body></foreignObject></svg>
! SVG要素のトランスクルード
SVG要素を埋め込むときは、トランスクルージョンなどのWikiText機能も使用できます。たとえば、半径がTiddler[[$:/SVGExampleRadius]]の値に設定されたSVG円を示します:
<svg width="150" height="150"><circle cx="75" cy="75" r={{$:/SVGExampleRadius}} stroke="black" stroke-width="2" fill="green"/></svg>
半径の値を編集できます: <$edit-text tiddler="$:/SVGExampleRadius" tag="input"/>
! SVGでカーブしたテキストを作成する
{{Making curved text with SVG}}

View File

@ -0,0 +1,22 @@
created: 20140213224306412
modified: 20241206114008718
original-modified: 20160606125956564
tags: Mechanisms Features
title: AlertMechanism
ja-title: アラートメカニズム
type: text/vnd.tiddlywiki
アラートは、TiddlyWikiのメインウィンドウに重なる黄色のボックスとして表示されます
それぞれのアラートは、$:/tags/Alertタグを持つTiddlerに対応します。アラートの削除アイコン<<.icon $:/core/images/delete-button>> をクリックすると、対応するTiddlerが削除されます
こちらがデモです
<$fieldmangler tiddler="アラートのサンプル"><$set name="currentTiddler" value="アラートのサンプル"><$button message="tm-add-tag" param="$:/tags/Alert">アラート</$button></$set></$fieldmangler>。
アラートTiddlerには次のフィールドが必要です:
|!フィールド |!説明 |
|title |デフォルトでは、アラートのタイトルには接頭辞`$:/temp/alerts/`が付きます |
|text |アラートメッセージのテキスト |
|modified |アラートの日付(画面上でアラートを並べ替えるのに使用されます) |
|component |アラートに関連付けられたコンポーネント |
|tags |[[$:/tags/Alert]] を含める必要があります |

View File

@ -0,0 +1,27 @@
created: 20170328161210552
modified: 20241209110151828
original-modified: 20170406085836682
tags: [[Importing Tiddlers]] [[Drag and Drop]] Mechanisms
title: DragAndDropMechanism
ja-title: ドラッグアンドドロップのメカニズム
type: text/vnd.tiddlywiki
このTiddlerでは、~TiddlyWikiでドラッグアンドドロップ機能を実装するために使用される内部メカニズムについて説明します。機能の一般的な説明については、[[ドラッグアンドドロップ|Drag and Drop]]を参照してください。
<<.warning """
~TiddlyWikiは[[標準のHTML 5 ドラッグアンドドロップAPI|https://www.w3.org/TR/2010/WD-html5-20101019/dnd.html]]を使用します。ただし、この領域はブラウザ間の互換性の問題で悪名高いです。そのため、機能の一部は必ずしもすべてのブラウザで動作するとは限りません。特に、
""">>
次のウィジェットはドラッグアンドドロップ機能に関係します:
* DraggableWidgetは、ドラッグのための1つ以上のTiddlerを表すドラッグ可能な要素を作成します。
** ButtonWidgetとLinkWidgetはDraggableWidgetの機能を組み込んでいます
* DroppableWidgetは、カスタマイズ可能なアクションをトリガーするためにドラッグできるTiddlerに領域を作成します。
* DropzoneWidgetは、ファイルから、または別のブラウザウィンドウからドラッグアンドドロップして外部Tiddlerをインポートします。
ドラッグアンドドロップ操作の一般的な順序は次のとおりです:
# ユーザーは、DraggableWidget、ButtonWidget、LinkWidgetなどのドラッグ可能な要素上でポインターをクリックダウンしてドラッグします。
# ドラッグ可能な要素は、クリックが離されるまでマウスポインタとともに移動します。
# DroppableWidgetなどのドロップ可能な要素の上にポインターを移動すると、アイテムがドロップ可能であることを示すハイライトが表示されます。
# ドロップ可能な要素でドラッグが終了すると、設定されたアクションが実行されます。

View File

@ -4,10 +4,10 @@ modified: 20240710163659672
tags: $:/tags/ViewTemplate tags: $:/tags/ViewTemplate
title: $:/editions/tw5.com/systemtag-template title: $:/editions/tw5.com/systemtag-template
<$list filter='[all[current]prefix[SystemTag: ]]'> <%if [all[current]prefix[SystemTag: ]] %>
<$let thisTag={{{ [all[current]removeprefix[SystemTag: ]] }}} > <$let thisTag={{{ [all[current]removeprefix[SystemTag: ]] }}} >
<$list filter='[all[tiddlers+shadows]tag<thisTag>limit[1]]' emptyMessage='(No tiddlers are currently tagged with <<tag>> )'> <$list filter='[all[tiddlers+shadows]tag<thisTag>limit[1]]' emptyMessage='(No tiddlers are currently tagged with <<tag $(thisTag)$ >>)'>
The following tiddlers are tagged with <<tag $(thisTag)$ >> The following tiddlers are tagged with <<tag $(thisTag)$ >>
@ -24,4 +24,4 @@ The following tiddlers are tagged with <<tag $(thisTag)$ >>
</div> </div>
</$list> </$list>
</$let> </$let>
</$list> <%endif%>

View File

@ -599,3 +599,5 @@ JC John Sese Cuneta, @techmagus, 2024/10/07
John Robinette, @jrbntt, 2024/11/25 John Robinette, @jrbntt, 2024/11/25
@DesignThinkerer, 2024/12/02 @DesignThinkerer, 2024/12/02
Thomas E Tuoti, @well-noted, 2024/12/16