English help on website



レンダリング枠(Ver9.24対応版)
目次− レンダリング枠

レンダリング枠について
レンダリング枠は、ブラウザ枠に似ていますが、キー割り当て等で呼び出せるコマンドには無く、マクロから呼び出す専用のものです。
renderpanecommand文/関数からのみ呼び出して使うことができます。

レンダリングとUI目的のもので、http: https: のネット上のURIは指定できません。(localhostは除く)
file: のローカルファイルを指定できます。
jsmodeと同じく、ファイル単位で、ファイルを閉じるとレンダリング用の枠は閉じます。
uriにjavascript: から始まるものを指定することで、ブックマークレットのように実行が可能です。
実行できるのは、秀丸マクロとしてのJavaScriptではなく、WebページとしてのJavaScriptです。
枠のように四辺の表示のほか、オーバーレイ表示ができます。

ページ内のスクリプトでwindow.chrome.webview.postMessageを呼ぶことで、jsmodeの関数の呼び出し、またはマクロ実行することができます。
postMessageのパラメータにはオブジェクトを指定し、オブジェクトのfuncidに関数ID、messageに任意の文字列パラメータを指定します。
例:<script>window.chrome.webview.postMessage({funcid:123,message:"hoge"});</script>
関数IDは、hidemaru.getFunctionIdまたは、registercallbackで取得します。

setrenderpanetarget文(V9.22以降)
renderpanecommand文で操作の対象となる既定の枠を指定します。
パラメータ1:
英字から始まる任意の文字列を指定します。

renderpanecommand文/関数(V9.22以降)
レンダリング枠に対する何らかの操作・取得・設定を文字列で指定します。
renderpanecommandは、非同期の関数からでも呼ぶことができます。
パラメータ1:URIの文字列、コマンドの文字列、JSONの文字列(またはJavaScriptのオブジェクト)のいずれかを指定します。
コマンドの文字列の場合は以下の通りです。
"get_DOMContentLoaded" 未完了では"0"、DOM操作まで完了では"1"が返ります。
"get_load" 未完了では"0"、すべて完了では"1"が返ります。
"get_readyState" 未完了では"loading"、DOM操作まで完了では"interactive"、すべて完了では"complete"が返ります。
"left" 位置を左にします。
"right" 位置を右にします。
"top" 位置を上にします。
"bottom" 位置を下にします。
"clear" クリアします。
"refresh" 更新します。
"focus" ウィンドウのフォーカスをブラウザ枠に移動します。
JSON/オブジェクトの場合のプロパティの意味は以下の通りです。
target: 対象となる枠の名前。英字から始まる任意の文字列を指定します。記述が無い場合は既定の枠が対象。
show: 表示するかどうか。1で表示、0で非表示。非表示の場合はインスタンスが無くなります。(コンテンツが閉じます)
invisible: 見えないようにするかどうか。1で見えない。0で見える。
uri: URI。"file:"から始まるローカルファイル、または"javascript:"から始まるスクリプト。(urlでも可)
place: 位置。"leftside" "rightside" "upside" "downside" "overlay"のいずれか。
get: 情報を取得します。target以外の他のプロパティは無視されます。(後述)
clear: 1を指定するとクリアします。
focus: 1を指定するとウィンドウのフォーカスをブラウザ枠に移動します。
align: オーバーレイ時の水平配置。"left" "center" "right"のいずれか。
valign: オーバーレイ時の垂直配置。"top" "center"または"middle" "bottom"のいずれか。
x: オーバーレイ時の左から(右から)のx位置。文字列で"300px"といったピクセル指定、または"50%"といったパーセント指定。
y: オーバーレイ時の上から(下から)のy位置。文字列で"300px"といったピクセル指定、または"50%"といったパーセント指定。
cx: オーバーレイ時の幅。文字列で"300px"といったピクセル指定、または"50%"といったパーセント指定。
cy: オーバーレイ時の高さ。文字列で"300px"といったピクセル指定、または"50%"といったパーセント指定。
size: 上下左右の枠の配置のときのピクセル単位のサイズの数値。
initialize: "async"を指定すると初期化を待機せずにすぐに制御を戻します。
JSONの/オブジェクトのgetプロパティで関数として呼ばれたときに、取得したい情報を以下の値で指定します。
"readyState"の場合、"loading" "interactive" "complete"のいずれかが返ります。
"DOMContentLoaded"の場合、"0"または"1"が返ります。
"load"の場合、"0"または"1"が返ります。
"show"の場合、"0"または"1"が返ります。
"uri"の場合、URIが返ります。(urlでも可)
"size"の場合、上下左右の枠の配置のときのピクセル単位のサイズが文字列として返ります。
"invisible"の場合、"0"または"1"が返ります。
"place"の場合、"leftside" "rightside" "upside" "downside" "overlay"のいずれかが返ります。
"initialized"の場合、初期化が完了していれば"1"、そうでなければ"0"が返ります。(initialize: "async"の場合だけに意味がある)




例:C:\Folder\rendering.html
<html>
<head>
<style>
.btn { border-radius: 30px; padding: 30px; background: #111; color: #eee; text-align: center; transition: 0.3s;}
.btn:hover { background: #ccc; color: #222;}
</style>
<script>
var idCallback=0; //idCallbackは、ページ表示後にマクロ側からjavascript: で設定される
function onbtn(s){
  //document.body.insertAdjacentHTML("beforeend", "["+idCallback+"]<BR>");
  window.chrome.webview.postMessage({funcid:idCallback,message:s});
}
</script>
</head>
<body style="background-color:#333;">
<div class="btn" onclick="onbtn('ボタン1押した')">ボタン1</div>
<BR>
<div class="btn" onclick="onbtn('ボタン2押した')">ボタン2</div>
<BR>
</body>
</html>

例:test1.mac
//表示するだけ
renderpanecommand """
  {
    "target":"rendering#1",
    "show":1,
    "uri":"file:///c:/folder/rendering.html",
    "place":"leftside",
  }
  """;

endmacro;

例:test2.mac
//非同期的にページ作成完了まで待って、イベントなどの応答を得る(js版)
hidemaruversion "9.22.14";
js{
  //debuginfo(2);
  var strTarget="rendering#1";
  
  function checkComplete(){
    //実行の順番(3) 繰り返し
    var readyState = renderpanecommand({target:strTarget,get:"readyState"});
    console.log(readyState);
    if( readyState == "complete" ) {
      hidemaru.clearInterval(idInterval);
      funcCompleted();
    }
  }
  
  function funcCompleted() {
    //実行の順番(4)
    var idCallback=hidemaru.getFunctionId(funcCallback);
    renderpanecommand({
        target:strTarget,
        uri:'javascript:idCallback='+idCallback+';',
        });
  }
  
  var sGlobal="";
  function funcCallback(s){
    //実行の順番(5) 手動操作時
    sGlobal=s;
    console.log(s);
    hidemaru.postExecMacroMemory('js{message(sGlobal);}');
  }
  
  //実行の順番(1)
  renderpanecommand({
      target:strTarget,
      show:1,
      uri:"file:///c:/folder/rendering.html",
      place:"leftside",
      });
      

  //実行の順番(2)
  var idInterval;
  if( typeof(idInterval)!="undefined" ) {
    hidemaru.clearInterval(idInterval);
  }
  idInterval = hidemaru.setInterval(checkComplete,100);
}
endmacro;

例:test3.mac
//同期的にページ作成完了まで待って、イベントなどの応答を得る(従来マクロ版)
if(event==10){
  message geteventparam(0);	//ボタン押した
  endmacro;
}

//最初の実行
setrenderpanetarget "rendering#1";
renderpanecommand """
    {
    "show":1,
    "uri":"file:///c:/folder/rendering.html",
    "place":"leftside",
    }
    """;

while(1){
  $readyState = renderpanecommand( "get_readyState" );//または{"get":"readyState"}
  if($readyState=="complete")break;
  if(iskeydown(0x1B)){//Esc
    endmacro;
  }
}

#idCallback=registercallback(currentmacrofilename);
$uri = "javascript:idCallback="+str(#idCallback)+";";
renderpanecommand( $uri );

endmacro;

ブラウザ枠・個別ブラウザ枠