Web Analytics Made Easy -
StatCounter

めモらンだム・ヤード

自分用のアプリ設定やスクリプト類の備忘録・覚え書き(Memorandum) / 作った物のライセンスはCC BY-NC-SAで。 / 内容が古いまま、間違ったまま、書いている途中、途中で放置など、手入れはあまり行き届いていない庭 / 対象の仕様変更で動かなくなったもの多々。WorkFlowy向けは全滅したので削除 / 製作物のインストール及び使用は各自の責任で。使用によって、利用者および第三者に損害が発生したとしても、当方は一切責任を負いかねます

2021-10-11 DraftsのPreviewsフォルダとObsidianのassetsフォルダを利用すると、Draftsアプリで画像付きメモの下書きも可能になる

運用

使ってみる

f:id:sorashima:20211010233523p:plain:w311
このキャレットの位置に画像を2つ挿入する

f:id:sorashima:20211019193712j:plain:w311
Save images in Drafts' Previews folderアクションを実行

f:id:sorashima:20211010234302j:plain:w311
画像を2つ選択して「追加」

そして、ファイルアプリでDraftsのPreviewsフォルダを見てみると、

f:id:sorashima:20211010234525p:plain:w311
画像ファイルがコピーされていることを確認できる

そしてドラフトには、

f:id:sorashima:20211010234748p:plain:w311
画像ファイルのリンクが挿入された

f:id:sorashima:20211010235042p:plain:w311
Draftsアプリ標準のMarkdownプレビューアクションを実行すると画像が表示される

f:id:sorashima:20211019193754j:plain:w311
ここでCopy images from Drafts' Previews folder to Obsidian vault's assets folderアクションを実行

そして、ファイルアプリでObsidianのVaultのフォルダのassetsサブフォルダを見ると、

f:id:sorashima:20211010235734j:plain:w311
画像ファイルがコピーされていることを確認できる

f:id:sorashima:20211011000347j:plain:w311
以前に作ったObsidianのVaultフォルダに直接保存するアクションを実行

Obsidianを開いてみると、

f:id:sorashima:20211011000630p:plain:w311
画像付きでメモが表示された



前準備

選んだ 画像ファイルをDraftsのPreviewsフォルダに保存し、それの画像リンクをドラフトに挿入するDraftsアクション+ショートカットカット

ショートカットにDraftsのPreviewsフォルダを指定する

f:id:sorashima:20211010225713j:plain:w311
このアクションのここをタップし、「置き換え…」

f:id:sorashima:20211010230506j:plain:w311
iCloud DriveのDraftsフォルダのLibraryサブフォルダにPreviewsサブフォルダを作り、それを選択して「完了」


ドラフト中に書かれた画像リンクのリンク先画像ファイルを、DraftsのPreviewsフォルダからObsidianのassetsフォルダにコピーするDraftsアクション+ショートカット

ショートカットにDraftsのPreviewsフォルダと、ObsidianのVaultのassetsフォルダを指定する

f:id:sorashima:20211010231534j:plain:w311
このアクションのここをタップし、「置き換え…」

f:id:sorashima:20211010230506j:plain:w311
iCloud DriveのDraftsフォルダのLibraryサブフォルダのPreviewsサブフォルダを選択して「完了」

f:id:sorashima:20211010232141j:plain:w311
その下のこのアクションのここをタップし、「置き換え…」

f:id:sorashima:20211010232520j:plain:w311
iCloud Driveまたは、このiPhone内/このiPad内の、Obsidianフォルダ内のVaultのフォルダ内のassetsサブフォルダを選択して「完了」




技術的背景達

以下の3点の仕組みにより、Obsidianの画像付きメモの下書きがDraftsで可能になる。


1. Obsidianのassetフォルダの画像は![](abc.png)で参照可能
Obsidianの保管庫(vault)直下に画像ファイルなども入れてしまうと、ファイル エクスプローラの表示がゴチャゴチャとしてしまう。

幸いassetsというサブフォルダがあり、その中にそれらノート以外のファイルを入れておける。

そこに保管されたファイルは 、「![[abc.png]] 」で表示される。(本来は「![[assets/abc.png]]」とする必要があるはず)

もちろんMarkdownの書式である「![](abc.png)」でも表示される

※添付ファイルが保存される先は設定で変更できる。


2. DraftsのPreviewsフォルダの画像は![](abc.png)で参照可能
他のテキストファイルを編集するエディタアプリと異なり、Draftsアプリはその名前の通り下書きを作ることが目的のアプリ。既存のテキストファイルを操作するためのものではない。また、入力されたドキュメントはどこかのフォルダに単一ファイルとして保存もされない。

そのため画像を表示したい時は、URLで参照できる場所に画像ファイル置き、それを参照する。(例えば、![](https://foobar.com/img/abc.png)の様に)

しかしDraftsにはPreviewsという特殊フォルダが存在する。

プレビューでは、ローカル画像、JavaScriptスタイルシート、その他のファイルベースのアセットを iCloud Drive/Drafts/Library/Previews/ のフォルダーに配置することで、それらのアセットをプレビューに組み込むこともできます。 組み込みたいアセットをこのフォルダーまたはそのフォルダーのサブフォルダーに配置すると、HTMLプレビューテンプレートの相対パスを介してこれらのアセットを参照できます。  
Previews - Drafts User Guide

iCloud Drive/Drafts/Library/Previews/abc.png
にある画像ファイルは、「![](abc.png)」で参照できる。

Obsidianのassetsフォルダと同じ振る舞いになり、ドラフトに変更を加える必要がない。


3. ショートカットでPreviewsフォルダからassetsフォルダにファイルコピーが可能になった
これまでのショートカットアプリは、iOS/iPadOSの保護機能「サンドボックス」の制限により、iCloud DriveのShortcutsフォルダ内以外の場所にアクセスするには、その都度ユーザーが場所を指定する必要があった。

それがiOS/iPadOS がバージョン15になって、「フォルダ ブックマーク」という、前もってアクセスできるフォルダを指定しておける仕組みが取り入れられた。

そのおかげで、フォルダ ブックマークに対応したToolbox ProやScriptableなどのアプリの力を借りることなく、iCloud Drive/Drafts/Library/Previews/フォルダーや、iCloud Drive/Obsidian/Vaultのフォルダ/assetsフォルダや、(このiPhone内|このiPad内)/Obsidian/Vaultのフォルダ/assetsフォルダに簡単にアクセスできるようになった。

つまり、ショートカットだけで、DraftsのPreviewsフォルダ内の画像ファイルをObsidianのassetsフォルダにコピーできるようになった。


そこで、

  • 選んだ 画像ファイルをDraftsのPreviewsフォルダに保存し、それの画像リンクをドラフトに挿入するDraftsアクション+ショートカット
    1. ユーザーに画像ファイル達を選ばせ、それらをDraftsのPreviewsフォルダ(iCloud Drive/Drafts/Library/Previews/)に保存する。
    2. それらの画像リンク達をドラフトに挿入する。

と、

  • ドラフト中に書かれた画像リンクのリンク先画像ファイルを、DraftsのPreviewsフォルダからObsidianのassetsフォルダにコピーするDraftsアクション+ショートカット
    1. ドラフトのアクション: Save images in Drafts' Previews folder によってドラフト中に書かれた画像リンク達を、抽出。
    2. それらから、DraftsのPreviewsフォルダ(iCloud Drive/Drafts/Library/Previews/)に保存されている画像ファイル達を取得。
    3. それらをObsidianのassetsフォルダ(iCloud Drive/Obsidian/{Vaultのフォルダ}/assetsや、(このiPhone内|このiPad内)/Obsidian/{Vaultのフォルダ}/assets)にコピーする。

を作った。

©︎ 2022 Sorashima