自前のC++オブジェクトをjscriptで操作させたい

単純にCOMオートメーションサーバーを作成すれば事足ります。コードの再利用という点から考えてみてもそれがいいのですが・・・、一つのプログラム内で完結させたいといった時に調べてみました。

たとえば、自作の複雑なオブジェクトを持つアプリケーションがあって、jscriptなどのスクリプトでプラグインを書いてもらう、というようなケースなどでは、スクリプト環境をホストしなければなりません。

完全に自分用のメモで(^^;、 ネットなどで検索をしたり、MSDNドキュメントを拾い読みなどをまとめた備忘録です。あしからず。

で、やはりCOMのお世話にならないといけません。Visual Studio Express Editionでは全部自分でコーディングしないといけないので、退屈なコードを書かないといけないところが面倒です・・・。

手順としては、

  1. スクリプトから操作させたいオブジェクトをIDispatch を継承、もしくは、オブジェクトへのラッパークラスをIDispatch実装クラスでインプリメントする。
  2. スクリプトをホストするため(スクリプトからの様々な通知を受け取るため?)に必要なIActiveScriptSite の 実装クラスを作成

で、これらを使って、以下を順番に実行。

  1. CoCreateInstance APIでIActiveScriptのインスタンスを生成
  2. IActiteScript::SetScriptSite()へIActiveScriptSiteの実装クラスのインスタンスをnewして放り込む。
  3. IActiveScript::QueryInterface()でIActiveScriptParse インターフェイスポインタ(IID_IActiveScriptParse)を得る。
  4. IActiveScriptParse::InitNew()をコール
  5. IActiveScript::AddNamedItem()で、自前のC++オブジェクトの名前をつける。スクリプトではこの名前を使ってアクセスさせる。
  6. IActiveScriptParse::ParseScriptText()でスクリプト文を解析させる
  7. IActiveScript::SetScriptState(SCRIPTSTATE_CONNECTED)をコール
  8. IActiveScript::SetScriptState(SCRIPTSTATE_CLOSED)をコール
  9. インターフェイスポインタの後始末

という流れ。

続きを読む

CANVASとSVG

IE9がリリースされ、主要なウェブ・ブラウザのほぼ全てで、HTML5の<CANVAS>タグや<SVG>タグがサポートされました。IE以外のブラウザではもっと早くにサポートされてたんですけどね。

アクセス解析のグラフ表示やCSVデータのグラフィック表示など、いままで、JavaアプレットやFlashに頼っていたものが、CANVASタグだけでなくSVGタグを使って、ブラウザ機能だけで実現できてしまうので、Web開発している人には朗報かもですね。ちょっとした動的なグラフィック表示なんかjavascriptでチョコチョコッと書けば済むんですから(^^;

とくに、Illustratorで作成したデータなんかをSVG形式で保存して<SVG>タグ内にコピペしてやれば、プラグインなしに表示できますし、画像のHTML内への埋め込み(インライン)も可能。SVG自体、xmlなのでjavascriptで動的に作成もでき、使わない手はありません。

IllustratorのデータをSVGで保存し、HTMLの<SVG>タグ内にコピペしたサンプル。

ただ、SVGについては、ブラウザによって表示が違いました。firefox4とchrome(11)だと、下の画像のように・・・花の部分が欠けてしまいました。なんでだろ???ブラウザのせいとうより、SVGフォーマットへの書き出し方が悪いんでしょうか。

svg1

まだブラウザ毎に表示確認は必要みたいですね。

で、おそまきながら、勉強がてら<CANVAS>タグでなんかしてみよう! と思いたって書いてみたんですが・・・なんせ無知なもんで、ちょっとはまってしまいました。

リファレンスサイトとして参照させてもらったのは、

http://www.html5.jp/canvas/index.html

続きを読む

“HTML Speech Input” on Google Chrome

先日、Google Chromeがバージョンアップしてv11になり、音声入力APIがブラウザで実装されましたね。iPhoneなどのスマートフォンではすでにお馴染みの機能ですが、やっとこさ、PCバージョンのブラウザでも搭載されました。

なんか難しそうに思いますが、既存のHTMLのINPUT タグに、x-webkit-speech 属性を追加するだけ。

まだ独自仕様なので、speech 属性ではなく、x-webkit-speech となっています。Google Translater(翻訳) なんかで確認すると、speech と x-webkit-speech の二つが指定されています。いずれ標準化されるんでしょうかね。
lang属性で、言語を指定できるみたいです。指定しない場合はOSの言語設定が適用されるみたいで、日本語もちゃんと認識されます・・・が、しゃべる人によって認識率は低くなるのは、スマートフォンの場合と同様のようです(笑)
カタカナ語をしゃべると、英語だったり、日本語だったり、結構揺れますね~( ̄0 ̄)

HTML5仕様のようですが、別にHTML4で書いても認識出来るみたいで(当たり前か(^^;;)

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html lang="ja">
	<head>
		<meta http-equiv="content-type" content="text/html; charset=shift_jis">
		<title>Title...</title>
	</head>
	<body>
    <input type="text" name="q" speech x-webkit-speech>
	</body>
</html>

で、表示はお馴染みのマイクマークが付きます。

htmlspeech

で、音声入力をすると、この入力ボックスにワード(語)が入るので、DOM操作でこのワードを拾うときは、onwebkitspeechchange イベントをハンドリングすればいいようです。
HTML5仕様的には、onspeechchangeなんでしょうけど・・・、speech属性と同じく、onspeechchangeはまだ認識されませんでした。

// <input type="text" name="q" x-webkit-speech onwebkitspeechchange="SpeechChange(this)">
function SpeechChange(oInput)
{
  //alert(this.value); ← 記述ミス(間違い)修正しました
  alert(oInput.value);
}


//HTMLにonxxxxとか書きたくない場合は・・・、
// <input type="text" name="q" x-webkit-speech>
var oInputs =  document.getElementsByName('q');
for(var i in oInputs)
{
  if(typeof oInputs[i] == 'object')
    oInputs[i].addEventListener('webkitspeechchange',function(){alert(this.value);});
}
//とかでしょうか。

ここでややこしいのは、onchangeイベントでは拾えない、っちゅーこと。onchange は音声入力以外での入力に反応するようです。ややこしい。いずれはonchangeで拾えるようになるんじゃないかな~、とは思っているんですが・・・どうなんでしょうかね。イベントを別々にする意味はあまりないような気がするんですが・・・。

それと・・・まだ、エラーイベント(onwebkitspeecherror)がまだ実装されていないみたいすね~。
他のブラウザも実装してくれるんでしょうかねぇ・・・?

既存の入力ボックスに、x-webkit-speech 属性を追加するだけでいいので手間がかかりませんし(文字列置換で済むと思う)、問い合わせページとかの場合は、speech 属性とともに付けとくと、アクセシビリティーの向上?にはいいかもしれません。とはいいつつ、音声入力を必要とするユーザーのchrome使っている比率はメッチャ低いと思いますが・・・ただそう感じただけで根拠はありません(^^;;;

混ぜると危険

どーでもいい話です(^^ゞ

str()という関数があらかじめ定義されているとして・・・下のコードは何?(コードに特別な意味はありません)

function fx($p,$d)
{
  $a = $p.str(1);
  $b = $d.str(2);

  return $a * $b;
}

「これは、phpの関数だ」と思った方と、
「これは、Javascriptの関数オブジェクトだ」と思った方もいる。

最近、DOM+javascriptでjQueryライブラリを本格的に使い出しまして・・・jQueryを駆使した、あの特徴のあるコードを書いていると、何か変な気分になる。

もちろんjavascriptでは、$ マークに特別な意味はない。だから普通に変数名に使える。
jQueryのショートカットとしてよく使う。

一方PHPでは、変数を表す予約文字となってる。

また、ピリオド文字は、PHPでは文字列連結演算子で、javascriptではドット演算子・・・オブジェクトのプロパティへアクセスするための演算子。

う~ん・・・なんだか、気色悪い・・・

こんなしょーもないことを思うのは、ちょっと疲れてんのかな~・・・。
PHPとJavascript+jQuery を混ぜたコードを書く場合(そんなケースは希だけど)、地獄を見る気がしてならない(^^;;;

・・・ちょっと長めのつぶやきでした(^^;;;

ネットワークプレースの作り方がわからん

Windows7 では、WebDAVをネットワークドライブとして割り当てることができました。
「ネットワークドライブとWebDAV over SSL」

ですが、WindowsXP(SP3)では失敗してしまいました。
XPでは、ネットワークドライブの割り当てに、WebDAVは使えないようです。

XPではWebフォルダ(ネットワークプレース?)を作成することで解決できるようです・・・が、肝心のネットワークプレースをWindowsAPIを使って作成方法がマイクロソフトからは公開されてないみたいです。

すみません、Windowsのネットワーク関係のことがよく分かってません。ので、まるでトンチンカンなことを書いてるかもしません。備忘録なので、ご注意を。)

ネットワークプレースの仕組み自体はカンタン。。。というか、ネットワークプレース自体がフォルダーリンクなので、

  1. ディレクトリを作成
  2. 作ったディレクトリの中に target という名のショートカットを作成
  3. そのショートカットにリードオンリー属性をつける。
  4. 下記内容のDesktop.ini(要システム・隠し属性)ファイルを作成
    [.ShellClassInfo]
    CLSID2={0AFACED1-E828-11D1-9187-B532F1E9575D}
    Flags=2
    
  5. ディレクトリにリードオンリー属性に。

これだけ。ショートカットはIShellLink/IPersistFile インターフェイスで作れます。

だだ、この方法では WebDAV(https/http)のネットワークプレースは作れません。
理由は至極当然で、上記(2)のWebDAVのアドレスへのショートカットが原因で、具体的には、https/http などのURIリンク先を単純にIShellLink::SetPath()に渡しても、ショートカットファイル自体は作れても、エクスプローラからWebフォルダとしては認識されません。

リンク先が、HTTP/HTTPSのURLではなく、FTP(ftp://server_name/directory/)や共有フォルダ(\\server_name\folder)のURIならうまくいきます。

このHTTP/HTTPSへのショートカットファイルは、普通のショートカットファイルではなく、どうやら特殊な(非公開の)方法で作られる必要があるようです。
もしかしたら公式のMSDNドキュメントに記述されているのかもしれません。が、結構検索かけて探してみたけどわかりませんでした。ご存じの方は教えて欲しいです (--;;;
WebDAV APIというのがあって、DavAddConnectionなどのようなAPIはありますが、Vista以降用のもののようですし、そもそも DavAddConnectionなどのAPIはSSL接続用、というようなことが書かれてますので、ちょっと違うみたいです。

で、もうちょっとグーグル先生に粘って聞いてみると・・・マイクロソフトのユーザーフォーラム?でそれらしき情報がありました。
【How to create web folders programmatically using Windows Script Host】

英文を要約すると、target.lnk そのもののバイト配列を用意してファイルに書き込むという、かなり力技で強引な(^^;;解決方法が提示されてます。
エクスプローラシェルでWebフォルダを作った後、そのtarget.lnkを解析したみたいですね。

この情報を元に、整理してC/C++で書き直して見ました。

#pragma comment(lib,"shell32.lib")

#define URI_LIMIT_SIZE 1024

#include <windows.h>
#include <strsafe.h>
#include <shlobj.h>
/*
 pURI : WebDAVへのhttp/httpsから始まるURLアドレス
 pDir : ネットワークプレースを作成するディレクトリ
 pName : ネットワークプレースの名前
*/
HRESULT CreateURILinkByEmbedByteArray(PCTSTR pURI,PCTSTR pDir,PCTSTR pName)
{
  HRESULT hres = S_OK;

  TCHAR szPath[MAX_PATH] = {0};
  TCHAR szDir[MAX_PATH] = {0};

  WCHAR szName[URI_LIMIT_SIZE] = {0};
  WCHAR szURI[URI_LIMIT_SIZE] = {0};
  
  HANDLE hFile = NULL;
  DWORD dwLen = 0;
  
  BYTE part1[] = 
    { 0x4c,0x00,0x00,0x00,0x01,0x14,0x02,0x00,0x00,0x00,0x00,0x00,0xC0,0x00,0x00,0x00,
      0x00,0x00,0x00,0x46,0x81,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,
      0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,
      0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x01,0x00,0x00,0x00,
      0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0xff,0x00,0x14,0x00,
      0x1f,0x50,0xe0,0x4f,0xd0,0x20,0xea,0x3a,0x69,0x10,0xa2,0xd8,0x08,0x00,0x2b,0x30,
      0x30,0x9d,0x14,0x00,0x2e,0x00,0x00,0xdf,0xea,0xbd,0x65,0xc2,0xd0,0x11,0xbc,0xed,
      0x00,0xa0,0xc9,0x0a,0xb5,0x0f,0xa4,0x00,0x4c,0x50,0x00,0x01,0x42,0x57,0x00,0x00,
      0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x10,0x00,
      0x00,0x00};
  BYTE part2[] = { 0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00,0x00 };
  BYTE nameLen[] = {0x00, 0x00};
  BYTE uriLen[] = {0x00, 0x00};

  int cbLen = lstrlen(pName);

  part1[0x4d] = part1[0x77] = (cbLen <= 44) ? 0x00 : 0x01;

  nameLen[0] = cbLen % 0x100;
  nameLen[1] = cbLen / 0x100;

//ワイド文字に変換。ユニコードでビルドする場合は、単にコピーするだけ。
#ifdef UNICODE
  StringCchCopy(szURI,URI_LIMIT_SIZE,pURI);
  StringCchCopy(szName,MAX_PATH,pName);
#else
  MultiByteToWideChar(CP_ACP,0,pURI,-1,szURI,URI_LIMIT_SIZE);
  MultiByteToWideChar(CP_ACP,0,pName,-1,szName,MAX_PATH);
#endif

  cbLen = lstrlen(pURI);
  uriLen[0] = cbLen % 0x100;
  uriLen[1] = cbLen / 0x100;
  
  //ディレクトリの作成
  StringCchPrintf(szDir,
                  MAX_PATH,
                  TEXT("%s%s%s"),
                  pDir,
                  (szDir[lstrlen(szDir) - 1] != TEXT('\\')) ? TEXT("\\") : TEXT(""),
                  pName);
  SHCreateDirectoryEx(NULL,szDir,NULL);

  //target.lnkのパスを生成  
  StringCchPrintf(szPath,MAX_PATH,TEXT("%s\\%s"),szDir,TEXT("target.lnk"));

  //シェルリンク・ファイルへの書込み
  hFile = CreateFile(szPath,
                     GENERIC_WRITE,
                     0,
                     NULL,
                     CREATE_NEW,
                     FILE_ATTRIBUTE_NORMAL,
                     NULL);

  if(hFile == INVALID_HANDLE_VALUE || GetLastError() == ERROR_ALREADY_EXISTS)
    {
      hres = E_FAIL;
      goto cleanup;
    }

  //埋め込み
  WriteFile(hFile,reinterpret_cast<PVOID>(part1),sizeof(part1),&dwLen,NULL);
  WriteFile(hFile,reinterpret_cast<PVOID>(nameLen),2,&dwLen,NULL);
  WriteFile(hFile,reinterpret_cast<PVOID>(szName),sizeof(WCHAR) * (lstrlenW(szName) + 1),&dwLen,NULL);
  WriteFile(hFile,reinterpret_cast<PVOID>(uriLen),2,&dwLen,NULL);
  WriteFile(hFile,reinterpret_cast<PVOID>(szURI),sizeof(WCHAR) * (lstrlenW(szURI) + 1),&dwLen,NULL);
  WriteFile(hFile,reinterpret_cast<PVOID>(part2),sizeof(part2),&dwLen,NULL);

  CloseHandle(hFile);
  
  //ファイルにRO属性を設定
  SetFileAttributes(szPath,FILE_ATTRIBUTE_READONLY);

  //ディレクトリにRO属性
  SetFileAttributes(szDir,FILE_ATTRIBUTE_READONLY);

cleanup:
  return hres;
}

一応、会社で使っているWindows XP SP3ではネットワークプレースをプログラムから作成できました。
が!、当然ながら、Windows7では、うまくいきません(笑)
Windows7/Vista から仕様が変わったようです。当たり前か(^^;;;

う~ん・・・なんかこう、すんなり旨い方法がないものだろうか・・・。