Fireworksで複数行のテキスト、複数のテキストオブジェクトのテキストを、1行にまとめてコピーするコマンドを書きましたので覚え書きしておきます。複数のテキストオブジェクトの内容を取得し結合する場合、背面のレイヤーから、前面のレイヤーに向かって結合されます。カーニングなどにより空白が生まれることはありません。
var altText = "";
for(i=fw.selection.length-1;i>=0;i--){
for(j=0;j<fw.selection[i].textRuns.textRuns.length;j++){
altText += fw.selection[i].textRuns.textRuns[j].characters;
}
}
altText = altText.replace(/[\r\n|\n|\r]/g,"");
prompt("you can copy this text.",altText);
jsfファイルのダウンロードはこちらから
上記スクリプトを拡張子「jsf」で保存して、対象のスライスを選択して「コマンド」→「スクリプトの実行」→保存したスクリプトを読み込むことでご利用 いただけます。
CS3をお使いのWindowsユーザの方は「C:\Documents and Settings\～ユーザー名～\Application Data\Adobe\Fireworks CS3\Commands」に、 Macユーザの方は「/Application/Adobe Fireworks CS3/Configuration/Commands/」に入れれば「コマンド」メニューに加わります。
CS4をお使いのWindowsユーザの方は、「C:\Users\～ユーザ名～\AppData\Roaming\Adobe\Fireworks CS4\Commands」に、Macユーザの方は、「/Application/Adobe Fireworks CS4/Configuration/Commands/」に入れれば「コマンド」メニューに加わります。
コマンドメニューに加わればキーボードショート カットとして登録することができるのでとっても便利です！Fireworksで作られたデザインをコーディングするときには、コピーしてアプリケーションを切り替えてペーストして、という繰り返しの作業が不要になり、制作スピードが倍以上になるかと思います！私自身、一ヶ月前から制作して活用していますが本当に便利で欠かせないコマンドになっています。ぜひご活用ください。
see also:
Fireworksでスライス名を一括置換するスクリプト (jsf)
Fireworksでスライス名を簡単に変更するコマンド (jsf)
Fireworksのスライス名を簡単に変更するエクステンションと同様のことを実現するFireworks用のコマンド（jsf）を書きましたので覚え書きしておきます。使っているPCに管理者権限がなくてエクステンションがインストールできないといったときにお使いいただけます。スライスを選択してこのコマンドを実行すれば、選択したスライス名を変更するダイアログが表示されます（複数のスライス選択変更にも対応しています）。
var dom = fw.getDocumentDOM()
var sliceArray = new Array();
for (var i=0;i<fw.selection.length;i++){
if(fw.selection[i] =="[object SliceHotspot]") sliceArray.push(i);
}
for (var i=0;i<sliceArray.length;i++){
var target = sliceArray.length-i-1;
var newName = prompt('Please input change slice name below.',fw.selection[target].baseName);
if( newName != null) fw.selection[target].baseName = newName;
}
jsfファイルのダウンロードはこちらから
上記スクリプトを拡張子「jsf」で保存して、対象のスライスを選択して「コマンド」→「スクリプトの実行」→保存したスクリプトを読み込むことでご利用いただけます。jsfファイルをWindowsユーザの方は「C:\Documents and Settings\～ユーザー名～\Application Data\Adobe\Fireworks CS3\Commands」に、Macユーザの方は「/Application/Adobe Fireworks CS3/Configuration/Commands/」に入れれば「コマンド」メニューに加わります。コマンドメニューに加わればキーボードショートカットとして登録することができます！お困りの方はぜひこちらもご利用いただければと思います。
なお、一括してスライス名をふりたいときにはPIXEL LABさん制作のslice_nambering.jsf、一括してスライス名を置換したいときには、拙作Fireworksでスライス名を一括置換するスクリプト(jsf)が便利です！
Fireworksのスクリプトの実行、今日めんどいなあと思う作業があって調べてみたんですけど、便利すぎて衝撃的でした。今までどうして知らなかったんだろうという感じです。以下サイトでいくつか紹介されていますが、スライスに連番＋一括名前設定は効率的すぎてやばいです。さっそく使わさせてもらっています。
■オリジナルツール / Fireworks用オリジナルコマンド(jsf)一覧 (PIXEL LAB)
http://www.pixelimage.jp/blog/2008/02/_fireworks.html
で、上記サイトを参考に僕もFireworksでスライス名を一括置換するスクリプトを書いてみました。以下スクリプトを拡張子「jsf」で保存、対象のスライスを選択して「コマンド」→「スクリプトの実行」→保存したスクリプトを読み込んでご利用いただけます。「C:\Documents and Settings\～ユーザー名～\Application Data\Adobe\Fireworks CS3\Commands」に入れれば「コマンド」メニューに加わります。スライスを流用するのだけどそのままの名前では使えないときや、ガイドラインでハイフンは使用禁止でアンダースコアにしなきゃいけなくなったとか、なんにせよスライス名を置換したいシチュエーションってけっこうあるので覚え書きしておきます。
var dom = fw.getDocumentDOM()
var le = fw.selection.length;
var sliceArray = new Array();
for (var i=0;i<le;i++){if(fw.selection[i] =="[object SliceHotspot]")sliceArray.push(i);}
var leng = sliceArray.length;
var searchName = prompt('SEARCH',( fw.newName || ""));
fw.searchName = searchName;
var replaceStr = prompt('REPLACE',( fw.numberStr || ""));
fw.replaceStr = replaceStr;
for (var i=0;i<leng;i++){
var n = sliceArray[leng-i-1];
fw.selection[n].baseName = fw.selection[n].baseName.replace(fw.searchName,fw.replaceStr);
}
jsfファイルのダウンロードはこちらから
ウェブ制作時に個人的によく利用しているブックマークレット（ブックマークに登録して利用するJavascript）を覚え書きしておきます。あまりまとめサイトなどを調べたりはしていないのですが、ほとんど必要になったものを自作したものです。なにか役に立ちそうなものがあれば使ってください。
jQueryの読み込み
以下記事を見つけて以来重宝しています。ワンクリックでjQueryの最新版を読み込むブックマークレットです。jQueryとfirebugを使ってサイトを検証したりプログラムを書いたりすることが多いので重宝しています。http://jsgt.org/mt/archives/01/001873.html
javascript:(function(){var%20s='http://jquery.com/src/jquery-latest.js',%20t='text/javascript',q='u0022',d=document,n=navigator,e;if(/mac/i.test(n.platform)&&/msie/i.test(n.userAgent))(d.createElement('div')).innerHTML='u003cscript%20type='+q+t+q+'%20src='+q+s+q+'u003eu003c/scriptu003e';else{(e=d.createElement('script')).src=s;e.type=t;d.getElementsByTagName('head')[0].appendChild(e)}})();void(0);%20%E3%80%80
jQuery (firefoxならブックマークツールバーにドラッグアンドドロップでインストールできます）
画像を非表示に（要jQuery）
画像にHTML上でwidth/heightを設定していないと画像読み込み時にがたがたがたっと画面が崩れてしまいます。そこでwidth/heightの設定漏れがないよう、img要素のsrc属性を空にして画像がまったく読み込まれていない状態を再現し、チェックするブックマークレットです。
javascript:$("img").each(function(){$(this).attr("src","");});void(0);
ImgHide
画像のwidthとheightを削除（要jQuery）
これはもう使っていないんですが、逆に画像にHTML上でwidth/heightを設定していると、IEでは1pxの差異でもつぶれて表示されます。また機械的に同じサイズの画像を呼び出すシーンがあったとして、呼び出す画像のサイズにばらつきがあれば手直ししなくてはいけません。そこで画像のHTML上のwidth/heightの指定を解除するブックマークレットです。
javascript:$("img").each(function(){$(this).removeAttr("width").removeAttr("height");});alert("done!");void(0);
ImgSizeBreak
画像の代替テキストを表示（要jQuery）
画像の代替テキスト（altテキスト）を画像の下に表示するブックマークレットです。WebDevelopperなどのFirefox拡張を入れれば同等のことが再現できます。会社の規定でFirefox拡張を勝手に入れられない、WebDevelopperを入れるのが面倒くさいときなどにお使いください。
javascript:$("img").each(function(){var%20a=$(this).attr("alt");$(this).after("<span%20style='background:#00FF00'>"+a+"</span>");});void(0);
ImgAlt
画像ファイル名を表示（要jQuery）
画像のファイル名を画像の下に表示するブックマークレットです。たとえば大量の画像があったときに、どの画像を修正したのかわからない、画像ファイル名にキーとなるワードが入っていて該当の画像をいち早く見つけたい、というようなシーンで使います。
javascript:$("img").each(function(){var%20a=$(this).attr("src");$(this).after("<span%20style='background:#00FF00'>"+a+"</span>");});void(0);
ImgName
ウィンドウサイズ変更（横幅800px）
Windows XP（デフォルトスキン）のFirefox 3.0で、Firefoxのコンテンツ表示部分の幅を800pxに、ブラウザの高さを一般的なノートパソコンのサイズに変更するブックマークレットです。ウェブデザインの段階で「おさまりチェック」を行うために使用します。一般的なモニタサイズでのブラウザ表示を再現することで、エンドユーザの視点を検証できます。
横幅はプログラム上では845pxとなっていますが、ウィンドウの縁やスクロールバーを引き算して、コンテンツエリア内は800pxの横幅となります。なので、OSや外観や扱う案件などによって変わってきますが、ご自分にあった値を一度設定しておくと、のちのちのチェックや検証が楽になるかと思います。
javascript:window.resizeTo(845,768);
WinPC
ウィンドウサイズ変更（横幅240px）
Windows XP（デフォルトスキン）のFirefox 3.0で、Firefoxのコンテンツ表示部分の幅を240pxに変更するブックマークレットです。モバイルサイトをPCで構築する際に、実機やシミュレータを用意しなくてもある程度モバイルサイトのレイアウトを再現することができます。
javascript:window.resizeTo(256,900);
WinMobile
ウィンドウタイトルを表示
現在開いているサイトのウィンドウタイトルを取得します。ブログやＥメールでウェブサイトを紹介する際に、手打ちやソースを開いたりしなくてもコピペできるようになります。（MakeLinkというすばらしいFirefox拡張はありますが）
javascript:(function(){var%20w=window.open("","","width=400,height=200");w.document.write("%E2%96%A0"+document.title+"<br>"+location.href);w.document.close()})();
ShowTitle
テストサーバと公開サーバを変換
個人的にものすごく使用しています。テストサーバと公開サーバが同じディレクトリ構成の場合、ワンクリックでサーバを切り替えるブックマークレットです。以下スクリプトの「テストサーバ」にテストサーバのURL、「公開サーバ」に公開サーバのURLを入力してご利用ください。たとえば、「http://test.tshinobu.com/blog/?p=255」を「http://tshinobu.com/blog/?p=255」にワンクリックで相互変換できます。入力し直す、Ｅメールを開いてURLをクリックし直す手間が省けるのでかなりストレス軽減できました。
javascript:(function(){var%20l=location;var%20a="テストサーバ";var%20b="公開サーバ";if(l.href.match(a))l.href=l.href.replace(a,b);if(l.href.match(b))l.href=l.href.replace(b,a);})();void(0);
www/test
jQueryのparents()と同等の関数をjQueryレスで実装したいと思い解析して作りました。引数（基点となる要素, 検索する要素）を渡すと、基点となる要素から見て条件にマッチする親要素あるいは親要素群を返す関数です。
/*---------- 親要素を検索する ----------*/
var findParentElement = function(elem, query){
var result = [];
var matched = [], cur = elem["parentNode"];
while ( cur && cur != document ) {
if ( cur.nodeType == 1 )
matched.push( cur );
cur = cur["parentNode"];
}
for (var i=0; i<matched.length; i++){
reg = new RegExp(query,"i");
if(matched[i].nodeName.match(reg)){
result = matched.splice(i,1);
break;
}
}
return result;
};
/*---------- 親要素郡を検索する ----------*/
var findParentElementsMulti = function(elem, query){
var result = [];
var matched = [], cur = elem["parentNode"];
while ( cur && cur != document ) {
if ( cur.nodeType == 1 )
matched.push( cur );
cur = cur["parentNode"];
}
for (var i=0; i<matched.length; i++){
reg = new RegExp(query,"i");
if(matched[i].nodeName.match(reg)){
result.push(matched[i]);
}
}
return result;
};
たとえば、以下のようなHTMLがあったときに「親要素を表示」を押すと「div.release-block」のオブジェクトが返ります。「親要素群を表示」を押すと配列で「div.release-block, div.primary-area, div.main-area, div.container」のオブジェクトが返ります。
<div class="container">
<div class="main-area">
<div class="primary-area">
<div class="release-block release-block-parent">
<h2>本社プレスリリース</h2>
<dl>
<dt>2009年11月18日</dt>
<dd><a href="#" onclick="alert(findParentElement(this,'div'));return(false);">親要素を表示</a></dd>
<dt>2009年10月29日</dt>
<dd><a href="#" onclick="alert(findParentElementsMulti(this,'div'));">親要素群を表示</a></dd>
</dl>
</div>
<div class="release-block release-block-group">
<h2>関連会社プレスリリース</h2>
<dl>
<dt>2009年11月18日</dt>
<dd><a href="#" onclick="alert(findParentElement(this,'div'));return(false);">親要素を表示</a></dd>
<dt>2009年10月29日</dt>
<dd><a href="#" onclick="alert(findParentElementsMulti(this,'div'));">親要素群を表示</a></dd>
</dl>
</div>
</div>
</div>
</div>
サンプル（新しいウィンドウで開きます）
返値を利用すれば条件にマッチする要素でかつ、必要なクラス名だけ抽出することも可能です。同等のファンクションを提供する際、HTMLの構造が違う場合に都度分岐させるのは非常に煩雑で面倒なので、繰り返し適用できるように工夫できます。
