「ポップアップメニューを手軽に扱う」の版間の差分

MSY-07 (トーク | 投稿記録)
<source>タグを<syntaxhighlight>タグに置き換える
1行目: 1行目:
マクロではないのですが、Meryのポップアップメニューを手軽に扱える関数を書いてみました。
マクロではないのですが、Meryのポップアップメニューを手軽に扱える関数を書いてみました。


<source lang="javascript">
<syntaxhighlight lang="javascript">
function ShowPopupMenu(menu_obj, position, separator, esc){
function ShowPopupMenu(menu_obj, position, separator, esc){
     var MAX_NEST = 5;//ネストの最大深度
     var MAX_NEST = 5;//ネストの最大深度
115行目: 115行目:
     }
     }
}
}
</source>
</syntaxhighlight>
== 簡単な使い方 ==
== 簡単な使い方 ==
<source lang="javascript">
<syntaxhighlight lang="javascript">
var x = ShowPopupMenu(["Spring","Summer","Autumn","Winter"] );
var x = ShowPopupMenu(["Spring","Summer","Autumn","Winter"] );
Document.Write(x);
Document.Write(x);
</source>
</syntaxhighlight>
選択された文字列が挿入されます。
選択された文字列が挿入されます。


== リファレンス ==
== リファレンス ==
<source lang="javascript">
<syntaxhighlight lang="javascript">
function ShowPopupMenu(
function ShowPopupMenu(
     menu_obj : Object | Array,
     menu_obj : Object | Array,
131行目: 131行目:
     esc : Anything
     esc : Anything
)
)
</source>
</syntaxhighlight>
'''返り値''' : 選択されたメニューに対応する値。後述。
'''返り値''' : 選択されたメニューに対応する値。後述。


147行目: 147行目:


第1引数に配列を指定するとその配列内の要素をメニューに表示します。
第1引数に配列を指定するとその配列内の要素をメニューに表示します。
<source lang="javascript">
<syntaxhighlight lang="javascript">
var list = ["メニュー1","メニュー2","メニュー3","メニュー4"]
var list = ["メニュー1","メニュー2","メニュー3","メニュー4"]
</source>
</syntaxhighlight>
SowPopupMenu関数の返り値は選択された要素になります。
SowPopupMenu関数の返り値は選択された要素になります。


156行目: 156行目:
オブジェクトのキーがメニューに表示ます。キーに対応する値が返り値になります。(値が関数オブジェクトの時は後述。)
オブジェクトのキーがメニューに表示ます。キーに対応する値が返り値になります。(値が関数オブジェクトの時は後述。)


<source lang="javascript">
<syntaxhighlight lang="javascript">
var menu = {};
var menu = {};
menu["メニュー1"] = "メニュー1";
menu["メニュー1"] = "メニュー1";
menu["メニュー2"] = 2;
menu["メニュー2"] = 2;
</source>
</syntaxhighlight>


こうするとサブメニューを作れます。
こうするとサブメニューを作れます。


<source lang="javascript">
<syntaxhighlight lang="javascript">
menu["グループ1"] = {};
menu["グループ1"] = {};
menu["グループ1"]["サブメニュー1"] = "SubMenu1";
menu["グループ1"]["サブメニュー1"] = "SubMenu1";
</source>
</syntaxhighlight>


連続したハイフン4つ(----)をキー内に含む場合セパレータになります。
連続したハイフン4つ(----)をキー内に含む場合セパレータになります。


<source lang="javascript">
<syntaxhighlight lang="javascript">
menu["----"] = 0; //何らかの値を入れておく。
menu["----"] = 0; //何らかの値を入れておく。


list = ["menu1","menu----2","menu3"] //配列でも可能。
list = ["menu1","menu----2","menu3"] //配列でも可能。
</source>
</syntaxhighlight>


=== 使用例 ===
=== 使用例 ===


<source lang="javascript">
<syntaxhighlight lang="javascript">
var menu = {};
var menu = {};


189行目: 189行目:
menu["グループ1"]["----"] = 0;
menu["グループ1"]["----"] = 0;
menu["グループ1"]["サブメニュー2"] = "Submenu2";
menu["グループ1"]["サブメニュー2"] = "Submenu2";
</source>
</syntaxhighlight>


このように指定することも可能です。
このように指定することも可能です。
<source lang="javascript">
<syntaxhighlight lang="javascript">
var menu = {
var menu = {
     "メニュー1" : "メニュー1",
     "メニュー1" : "メニュー1",
202行目: 202行目:
     }
     }
}
}
</source>
</syntaxhighlight>


=== 返り値 ===
=== 返り値 ===
208行目: 208行目:
オブジェクトでメニューを定義するする場合、値が関数オブジェクトかそれ以外かで返り値が変わります。
オブジェクトでメニューを定義するする場合、値が関数オブジェクトかそれ以外かで返り値が変わります。
関数オブジェクトを指定するとその関数を実行して、その関数の返り値がShowPopupMenu関数の返り値になります。
関数オブジェクトを指定するとその関数を実行して、その関数の返り値がShowPopupMenu関数の返り値になります。
<source lang="javascript">
<syntaxhighlight lang="javascript">
function func1(){
function func1(){
     Document.Write("func1");
     Document.Write("func1");
216行目: 216行目:
var menu = {};
var menu = {};
menu["func1"] = func1; // func1() 、ではない。(括弧は付けない)
menu["func1"] = func1; // func1() 、ではない。(括弧は付けない)
</source>
</syntaxhighlight>


「func1」がエディターのキャレット位置に挿入され、0が返ります。
「func1」がエディターのキャレット位置に挿入され、0が返ります。
222行目: 222行目:
もちろんfunctionリテラルで直接書いてもかまいません。
もちろんfunctionリテラルで直接書いてもかまいません。


<source lang="javascript">
<syntaxhighlight lang="javascript">
menu["func2"] = function(){Alert("func2");};
menu["func2"] = function(){Alert("func2");};
</source>
</syntaxhighlight>


関数オブジェクト以外を値とした場合はその値がそのまま返ります。
関数オブジェクト以外を値とした場合はその値がそのまま返ります。
232行目: 232行目:
第2引数にmePosMouseを指定するとマウスカーソルの位置にメニューが表示されます。
第2引数にmePosMouseを指定するとマウスカーソルの位置にメニューが表示されます。


<source lang="javascript">
<syntaxhighlight lang="javascript">
ShowPopupMenu(menu, mePosMouse)
ShowPopupMenu(menu, mePosMouse)
</source>
</syntaxhighlight>


それ以外の値の時はキャレット位置に表示します。
それ以外の値の時はキャレット位置に表示します。
240行目: 240行目:
第3引数にfalseを指定するとセパレーターを挿入しなくなります。また文字列を指定するとその文字列が含まれるメニューをセパレータにします。それ以外の値は無視します。
第3引数にfalseを指定するとセパレーターを挿入しなくなります。また文字列を指定するとその文字列が含まれるメニューをセパレータにします。それ以外の値は無視します。


<source lang="javascript">
<syntaxhighlight lang="javascript">
ShowPopupMenu(menu,0,false) // セパレーターを挿入しない
ShowPopupMenu(menu,0,false) // セパレーターを挿入しない
ShowPopupMenu(menu,0,"ああああ") // 「ああああ」が含まれるメニューをセパレータにします。
ShowPopupMenu(menu,0,"ああああ") // 「ああああ」が含まれるメニューをセパレータにします。
</source>
</syntaxhighlight>


第4引数でメニューをESCキーで閉じた時の挙動を変更できます。デフォルトではそこでスクリプトの実行が終了します。
第4引数でメニューをESCキーで閉じた時の挙動を変更できます。デフォルトではそこでスクリプトの実行が終了します。
関数オブジェクトを指定するとその関数を実行し、それ以外の値(undefinedを除く)の場合はその値を返します。
関数オブジェクトを指定するとその関数を実行し、それ以外の値(undefinedを除く)の場合はその値を返します。


<source lang="javascript">
<syntaxhighlight lang="javascript">
ShowPopupMenu(menu,0,0,-1)
ShowPopupMenu(menu,0,0,-1)
</source>
</syntaxhighlight>


上の例ではESCキーを押してもスクリプトは終了せず、関数は-1を返します。
上の例ではESCキーを押してもスクリプトは終了せず、関数は-1を返します。
257行目: 257行目:


デフォルトではメニューの最大階層は5(2行目のMAX_NESTの値を書き換えることで変更可能)になっています。これは
デフォルトではメニューの最大階層は5(2行目のMAX_NESTの値を書き換えることで変更可能)になっています。これは
<source lang="javascript">
<syntaxhighlight lang="javascript">
var menu = {};
var menu = {};
menu["メニュー1"] = 1;
menu["メニュー1"] = 1;
menu["グループ1"] = menu;
menu["グループ1"] = menu;
</source>
</syntaxhighlight>


といった再帰定義で無限ループになるのを防ぐためです。
といった再帰定義で無限ループになるのを防ぐためです。
267行目: 267行目:
=== Tips ===
=== Tips ===


<source lang="javascript">
<syntaxhighlight lang="javascript">
menu["Now?"] = new Date();
menu["Now?"] = new Date();
</source>
</syntaxhighlight>


こう書くとマクロを実行したとき(正確にはオブジェクトに代入した瞬間)の時間になります。これをメニューが選択された時の時間にするときは
こう書くとマクロを実行したとき(正確にはオブジェクトに代入した瞬間)の時間になります。これをメニューが選択された時の時間にするときは
<source lang="javascript">
<syntaxhighlight lang="javascript">
menu["Now!!"] = function(){return new Date();};
menu["Now!!"] = function(){return new Date();};
</source>
</syntaxhighlight>
こうやってfunctionでくるんでください。
こうやってfunctionでくるんでください。


== おまけ ==
== おまけ ==
サブメニューとかいいから簡単に使いたいという人向け。
サブメニューとかいいから簡単に使いたいという人向け。
<source lang="javascript">
<syntaxhighlight lang="javascript">
function ShowMenuMini(list){
function ShowMenuMini(list){
     var pos = 0;
     var pos = 0;
300行目: 300行目:
     }
     }
}
}
</source>
</syntaxhighlight>


=== リファレンス ===
=== リファレンス ===


<source lang="javascript">
<syntaxhighlight lang="javascript">
function ShowMenuMini(
function ShowMenuMini(
     list : Array
     list : Array
)
)
</source>
</syntaxhighlight>
引数には配列を指定する。選択された要素のインデックスが返り値になる。
引数には配列を指定する。選択された要素のインデックスが返り値になる。


=== 使い方 ===
=== 使い方 ===


<source lang="javascript">
<syntaxhighlight lang="javascript">
var menu = ["Morning","Afternoon","Evening"];
var menu = ["Morning","Afternoon","Evening"];
var value = ["あんぱん","ジャムパン","カレーパン"];
var value = ["あんぱん","ジャムパン","カレーパン"];


Document.Write(value[ShowMenuMini(menu) ] );
Document.Write(value[ShowMenuMini(menu) ] );
</source>
</syntaxhighlight>


なお、セパレーターを挿入する機能はオフにしてあります。セパレータを使いたい場合は8行目のコメントアウトを外してください。その場合はメニュの表示と返り値がずれることに注意してください。
なお、セパレーターを挿入する機能はオフにしてあります。セパレータを使いたい場合は8行目のコメントアウトを外してください。その場合はメニュの表示と返り値がずれることに注意してください。
<source lang="javascript">
<syntaxhighlight lang="javascript">
var menu = ["Morning","Afternoon","----","Evening"];
var menu = ["Morning","Afternoon","----","Evening"];
var value = ["あんぱん","ジャムパン","ここが選ばれることはない","カレーパン"];
var value = ["あんぱん","ジャムパン","ここが選ばれることはない","カレーパン"];


Document.Write(value[ShowMemuMini(menu) ] );
Document.Write(value[ShowMemuMini(menu) ] );
</source>
</syntaxhighlight>
スポンサーリンク