Work Space について

Work Spaceとは何か

最終更新
更新はありません
  • fub_red用の拙作カスタムパネルです。
  • 文字を書き込んだりオブジェクトを貼り付けたりする汎用的なスペースを提供します。
  • テキストエリアとの違いは、HTMLレベルでの貼り付けが可能な点です。
  • その他JavaScriptを発射して色々と。

必要なもの、条件

最終更新
更新はありません

Work Spaceを動作させるには、以下が必要です。

  • IEの新しめのバージョン(6.0推奨)
  • fub_red(シャア専用fub)というIEコンポーネントブラウザ
    (0.3.28βで確認)
  • JavaScriptが有効になっていること

導入方法

最終更新
更新はありません
  1. Work Spaceを表示させます。
  2. カスタムパネル用のアイコン右側のボタンを押してドロップダウンメニューを表示させます。
  3. 新たに追加したい場合は「アクティブタブを新規追加」を、現在のパネルを「Work Space」に変更する場合は「アクティブタブで上書き」を選択します。
  4. タブに表示される名前を設定して完了です。

以下は、fub_red0.3.28の場合です。

  1. Work Spaceを表示させます。
  2. Shift + Pでカスタムパネルを表示します。
  3. カスタムパネルのタブ上で右クリックします。
  4. 新たに追加したい場合は「アクティブタブを新規追加」を、現在のパネルを「Work Space」に変更する場合は「アクティブタブをセット」を選択します。
  5. タブに表示される名前を設定して完了です。

ローカルで利用する場合

これを適当な場所に解凍し、ファイル構成を変えずにhtmlファイルをパネルに入れます。

ただ、オンライン版を使っていれば、細かいバージョンアップが自動で行われるという利点が。バージョンアップで不具合が発生した場合に、過去のバージョンをローカルで利用されると良いかもしれません。尚、アクセス解析のようなスパイ行為はしていません。

利用例1 - カスタムフレームとして使う -

最終更新
更新はありません
  1. ウェブページにリンクのリストがあったとします。
  2. リスト全体をドラッグします(Shift + クリックを利用すると楽です)。
  3. 「Work Space」の空白部分に選択範囲をドロップします。
  4. すると「Work Space」を目次として使うことが出来ます。

ドロップした場合には、自動で書き込み禁止になります。続けて何かを挿入したい場合には、書き込み許可のチェックを入れ直すか、あるいは、ドラッグドロップではなくコピーペーストして下さい。

利用例2 - 何かの下書きに使う -

最終更新
更新はありません

実につまらないですが、フォームか何かに直接記入するのが嫌な場合にはこういうことも出来ますというだけの話です。

下の、スペースに書くときのヒント参照。

利用例3 - ツールを使う -

最終更新
更新はありません

下の方に配置してある「ツールセレクトボックス()」から色々選択すると、拙作のJScriptが発射されます。多くの人には意味不明なツールが多いような気がしますが、個人的な都合で作っているものなので、その辺はどうかひとつ。

利用例4 - 編集モードを使う -

最終更新
更新はありません

「編集モード」は、表示しているページにメモなどを直接書き加えたり、余計な記述を消したりする為のものです。一応変更した内容を保存できます。

文字を書き込む

  1. 下の方の【編集モード】ボタンをクリックします
  2. 【編集モードON / OFF】をクリックして、現在のタブ内に表示しているページを書き込み可能状態にします(右上の【外部→】でも同じです)
  3. ページ内をクリックしてみて、点滅するカーソルが表示されれば成功です

普通に書き込めますが、若干癖があります。下のスペースに文字を書く際のヒントを参照。

文字のスタイルを変更する

  1. 変更したい文字列をドラッグして選択状態にします
  2. 「要素名」に「span」などを記入します
  3. 「属性名」に「style」と記入します
  4. 「属性値」に、変更したいスタイルのCSS宣言を記入します(例 : color:red
  5. ボタンを押します

Internet Explorerで有効なCSSについてはCSS属性(msdn)などを参照。

文字を色々な要素に変換する

例えば、この「Google」という文字を、ハイパーリンクにするには:

  1. 「Google」をドラッグして選択状態にします
  2. 「要素名」に「a」を記入します
  3. 「属性名」に「href」を記入します
  4. 「属性値」に「http://www.google.co.jp/」を記入します
  5. ボタンを押します

保存

編集した状態を保存するには、「現在のHTMLをコピー」をクリックして、クリップボードにHTMLソースをコピーした後、テキストエディタ等を起動して貼り付けを行い、拡張子を*.htmlにして任意の場所に保存します。

Ctrl + Sなどの「save as」では編集前のものしか保存されませんので注意して下さい。

注意

  • 属性値に「"」、「'」等の一部の記号は使えません
  • 空白ページ(about:blank)では、なんちゃってHTMLエディタとして使えますが、吐き出すHTMLはかなりでたらめですので気をつけてください。

設定について

最終更新
更新はありません

下のほうの【設定】ボタンを押すと、設定用のフィールドが出現します。

アンカーをリストアイテムとして表示する
インラインリストになっているアンカー(リンク)をWork Spaceに貼り付けた際、強制的にリストマークをつけます。
アンカーのhref属性値をポップアップする
Work Spaceに貼り付けたアンカーをポイントした際、URIをポップアップするイベントハンドラを強制的に付加します。
ドロップした際、書き込み不可にする
Work Spaceに何かをドロップした際、Work Spaceを自動で書き込み不可の状態にします。
ペーストした際、書き込み不可にする
Work Spaceに何かをペーストした際、Work Spaceを自動で書き込み不可の状態にします。

なんと、Cookieを利用しています。

スペースに文字を書く際のヒント

最終更新
更新はありません
  • アンドゥは、Ctrl + Z 等で可能かも知れません(OSや設定に依存?)。
  • リドゥは、Ctrl + Y 等で可能かも知れません。
  • 普通の改行はShift + Enter 等で可能かも知れません。
  • Enterキーは、段落を変更するような気がします。
  • 右上の「外部→」をクリックすると、タブ内に表示中のウェブページを書き込み可能にすることができます。
  • 書き込み可能状態でtableの端や画像をクリックすると、Wordっぽいドラッグ(?)が可能になるようです(※)。
  • 「消去」を押しても元に戻らない場合、スペース以外(青いフィールド)で右クリックして「最新の情報に更新」でなんとかなります。
  • というかこのパネルのフォントサイズを変更するとレイアウトが崩れます。

※table要素、img要素(画像)、form内要素(input, textarea, select要素等)、button要素、その他、floatさせている要素、position:relativeな要素で、この現象を確認。

過去の遺物

最終更新
更新はありません
workspace20020314.lzh
検索補助ツール等を使う際、write / drop した内容をクリアしてしまっていた。
workspace20020317.lzh
LABEL要素はfor属性を使わないと意味が無かった in MSHTML。
あと、ドロップしたアンカーの、href属性(URI)が確認しづらかった(20020318.lzhでは書き込み不可状態に切り替えた際ポップアップするハンドラを追加するようにした)。
workspace20020318.lzh
ポップアップに関して凄まじいバグ。