ついに RAP and BEATのトップページに実装

これまでの積み重ねを経て、各種テストを行いました そして ついに RAP and BEATのトップページに登録症例数のグラフ表示を実装できました

動画で表示するようにし、自施設に関しては、赤グラフで表示するようにしました もちろん、ログインが誰により行われ、その人が所属する施設が自施設となります ここで問題だったのは、$_SESSION変数を如何にして Javascriptライブラリである D3.jsに変数として渡すか? でしたが これに関しては少し調べて簡単にできることが分かりました

ここに記載されていたように json_encodeを用いて jsonオブジェクトとして渡すのだそうです これは securityが深く関係しているようです 実際の javascript codeはかくも簡単です

// json_encodeを使用して$_SESSION変数を安全に javascript変数に変換する
    var hp_tbl_id = <?php echo json_encode($_SESSION['hp_tbl_id'], JSON_HEX_TAG | JSON_HEX_AMP | JSON_HEX_APOS | JSON_HEX_QUOT); ?>;

この関数の第二引数はオプションであり、security上非常に重要だそうです

こんな馬鹿なことで1週間潰した

さて、今から本格的にプログラム書こうと思っているのが、2019年に学会長を行うように指示されといるとある学会があるのですが、そのいわゆる学会プログラムやその他諸々を handlingするソフトの開発なのです 当然のことながら Smart Phone/Tablet/PCの全てに対応するように “Responsive Web Design”で開発するのです DBは慣れている MySQLを使用し、言語もこれも慣れている PHPを使用します

こんものいちなり書けないのでテスト・プログラムを作成し、local web serverでテスト繰り返すのですが全く作動しないのです

「えーーっ、なんでぇーーー こんな筈は無いはずだあ」と一週間悩んだのです 少しずつ修正しながらテストするのですが全く僕の意図を無視して動作しないのです

まあこんな感じです

// ここれはフロントエンドで SQLに探索語を渡す Ajax通信のルーチン
    $( document ).ready( function () {
      $( "#search_results" ).slideUp();
      $( "#search_term" ).keyup( function ( e ) {
        e.preventDefault();
        ajax_search();
      } );

      function ajax_search() {
        $( "#search_results" ).show();
        var search_val = $( "#search_term" ).val();
        $.post( "dr_role_find_backend.php", {
          search_term: search_val
        }, function ( data ) {
          if ( data.length > 0 ) {
            $( "#search_results" ).html( data );
          }
        } );
      }
    } );

 

そして受け取る方は、PHPとMySQLです

 session_start();
 session_regenerate_id(true);
 require_once('../utilities/config.php');
 require_once('../utilities/lib.php');	
 charSetUTF8();
 //接続
	try {
   // MySQLサーバへ接続
  	$pdo = new PDO("mysql:host=$db_host;dbname=$db_name_sessions;charset=utf8", $db_user, $db_password);
 // 注意: 不要なspaceを挿入すると' $db_host'のようにみなされ、エラーとなる
 } catch(PDOException $e){
   		die($e-&gt;getMessage());
 }

 $hp_name = strip_tags(trimBothEndSpace(mb_substr($_POST['search_term'], 0, 100)));	// 前後のspaceなど削除し、文字数を100文字に制限する
 $hp_name = strtoupper(mb_convert_kana($hp_name, 'ashK'));		// 半角英字大文字に変換する

 $stmt = $pdo-&gt;prepare("SELECT * FROM `hp_tbls` WHERE `hp_name` LIKE :hp_name ORDER BY `hp_name` ASC;");
 $stmt-&gt;bindValue(":hp_name", '%'.$hp_name.'%', PDO::PARAM_STR);
 $flag = $stmt-&gt;execute();
 $rows = $stmt-&gt;fetchAll(PDO::FETCH_ASSOC);
 
 if (!$flag) {
   		$infor = $stmt-&gt;errorInfo();
     exit($infor[2]);
 }

 

これで、検索語として病院名の一部を入力すれば、DBより検索してくれる筈なのです

しかし、しかし動作しない 本当にこの解決に一週間かかり、先程やっと解決しました

色々な問題があったのです まずは

trimBothEndSpace(mb_substr($_POST['search_term'], 0, 100))

という関数ですが、(1) mb_substrの引数を何時の間にか消去してました つぎに(2) trimBothEndSpaceという関数ですが、これは自作関数なのですが、それをlib.phpに作成してあり(ある筈)、それを読み込んで使用するのですが、何と lib.phpの中にこの関数を書いていなかったのです

この2つのバグのために、phpそのものが走らず結果的に echoで途中経過を出そうと思っても出せない そんな事態に陥っていたのです 本当に大変なバグ退治でした これも Ajax通信によるプログラムだからのことです 本当に非同期通信というのは難しいです これが解決してうまく動作しているデモ画面です

うまく Ajax通信が動作しているところ

Herokuのアカウントを取得したのはかれこれ5年ぐらい前のことでした しかし、それ以降全く使用せず来ましたのですっかり忘れていました
今回そのようなことが起こらないように記録しておきます

まずは何はともあれ、 Folderの作成を行い、そこに cdします
そして、その中に javascript fileを作成していきますが、その前に準備として2つのファイルが必要です
#packaget.json

{
    "name": "nodesample",
    "version": "0.0.1"
}

そして

#Procfile

web: node samplapp.js

そして node.jsのプログラム ここでは

#samplapp.js にしています

var http = require('http');

var server = http.createServer();
server.on('request', doRequest);
server.listen(process.env.PORT, process.env.IP);
console.log('Server running!');

// リクエストの処理
function doRequest(req, res) {
   res.writeHead(200, {'Content-Type': 'text/html'});
   res.write('<h1 style="color:red;">');
   res.write('Hello World\n');
   res.write('</h1>');
   res.write('<p>This is my first deployment the program written in Node.js on Heroku!</p>')
   res.end();
}

この後

$git add -u

$git add commit -m “新たなプログラム”

$git push heroku master

とコマンドを発行すれば、インターネット上に公開されます 公開 urlは

https://shigeru-saito-tavi-cto-tri.herokuapp.com/

ですが、これはアプリ名を shigeru-saito-tavi-cto-tri という世界で一つしか無い名前にしたからです

npmと node.jsのインストール

node.jsはサーバーでも作動する Javascript実行エンジンです その高性能さに注目を集め、巷では随分と用いられているそうです

今回この node.jsと、nodeで走る package managerを MacBook Proにインストールしました もちろんこれはコマンド・ベースでインストールする訳ですが、当初 homebrewでインストール試みたのですが、何か訳の分からないエラーがでてきて一生懸命 Netで調べ、ようやくインストールできました

node.jsの入門ということで ここを参照していますが すぐに「めんどくさい」という悪魔の囁きが聞こえてきます 困ったものです

Distal Radial Approach (DRA) vs Conventional Radial Approach (CRA)

さて、そろそろこの秘密のテクニックについて公表する時が来ました 何れにしてもライブでは皆の眼に触れることになるのでこれ以上秘密にしていても仕方ありません

DRAに関しては最近僕が推進している三文字略語ですが、未だ主流とはなっていません しかし、臨床試験を企画していますのでそれで主流となるでしょう dTRAとかも使われていますし、PPA (Princeps Pollicis Artery) Approachとか、も使われています これに対して通常の橈骨動脈アプローチについては、区別するために、僕は三文字略語として Conventionalを用いたいと思っています

さて、何故今 DRAが注目されるのでしょうか? 未だに経大腿動脈的冠動脈インターベンション (TFI: Trans Femoral Intervention)にこだわっている頭の固い先生方はここでは相手にはしませんが、経橈骨動脈的冠動脈インターベンション (TRI: Trans Radial Intervention)の優れた点は世界中で明らかになっています しかし、その最大の欠点は術後の橈骨動脈閉塞 (RAO: Radial Artery Occlusion)です これはTRIが生まれた時から悩ましき問題として注目されていました 既に論文にもなっている僕が仕掛けた大規模医師主導型臨床試験である RAP and BEAT trialでもこの点が Primary Endpointとされました

さて、DRAにおいては穿刺部位が何しろ CRAよりも末梢であるため、原理的にRAOが起こる可能性は低いと考えられます しかし、問題は何しろ新しい方法なのでデータがありません 想像のみで医療はできません そこで、僕はこの問題を解決するために無作為臨床試験を規格しているのです これに参加して頂ける施設と医師を求めています もちろん医師主導型臨床試験ですので、基本的にはボランティアとしての参加です 真実を知りたい、という知的意欲の下で参加して頂きたいのです

徐々にその全貌を明らかにしていきたいと思います 例によって、症例登録は Webで行います お金が無いとか色々ありますので、例によって僕が自分の知識を駆使して、html5 + css3 + Javascript + jQuery + Ajax + SQL + PHPでその全てのプログラムを書きます というよりも、既に成功裏に終了した RAP and BEAT試験のプログラムを改変するのです これが、僕が次に考えている大きな仕事です

馬鹿なことをやっていた 今気づいたけど

さて、kamakuralive.netは鎌倉ライブの Home Pageですが、先日までサーバーの切り替えですったもんだしたのです しかし、このクラウド・ベースのサーバーになり速度は明らかに早くなり安定しています

ここのプログラムは何回も言いますが、全てゼロから僕自身が html, css, jQuery, javascript, php, sql (mysql)を用いてプログラムを書いてきたものです

基本的にデータ構造は、たった3つのテーブルを使用するのみです それは、それぞれ dr_tbl, session_tbl, role_tblと名付けていますが、論理的にはお互いにリンク付けられ、関係データベースを形成しています

そのように作ったつもりだったのですが、今日突然気づきました それは database sqlのデバグをしている段階だったのです 何と role_tblsが session_tblを指すべき indexを作っていなかったのです!!!

もちろん今からこれを作るのは簡単ですが、そうなるとそこに関係したプログラムのみならず、既に入力されているデータそのものも変更が必要となります 参りました

そんなことをすれば膨大な時間がかかりますので、とりあえずはこのままにすることに決めました ほとんど不都合は発生しませんが、役割の時間帯重複を sqlで検出することが困難なのです

あっという間に目まぐるしく二週間が過ぎ

あっという間に二週間が過ぎてしまいました この間、TAVIにかかりきりかと言えば、そうでもなく しかしながら激しいTAVIに各地で付き合いました

その中で、先週は島原ライブで四例治療し、その中の一例はかなり高難度のCTOでしたが、それもうまくやり、昨日は函館で非常に難度の高いCTO二例を我ながら信じられないような強い意志の力と、これまでの知識、積み上げてきたテクニックを総動員してやり遂げました 集まっておられた韓国の先生方 (第11回 日韓友好TRIセミナー)もすごく満足されました TRIの可能性の限界への挑戦でした でも疲れきりました CTOの一例目で渾身の力を使いましたので、CTOの二例目の時には左手の指や足底の筋が痙攣(つる)していました この二週間で何例のTAVIとCTO三例を含めたPCIを行ってきたのでしょうか

その一方で鎌倉ライブのHome Page programmingにとりかかりました 暫く javascript/sql/jQuery/phpなどと何ヶ月も付き合ってきませんでしたので、自分の知識と感覚を取り戻すのに時間がかかっています 実はこの数週間、「深層学習」の勉強を Kindle本でやっていたのです 偏微分や行列計算などこれまで避けてきたことにも再挑戦しています そんなこんなであっという間に時間が流れていったのです あ~~~~ こんなことではいけない いけない

この土日相当に悩んだぞ

この土日は、久しぶりにプログラミング・モードに入りました 日本循環器学会で配布されていたプログラム閲覧用Appに触発されたのです

昨年の鎌倉ライブHomePageは PHP/JavaScript/jQuery/CSS/html/MySQLを組み合わせて何とか付け焼き刃で作りました

それなりに使えるものであり、未だ HomePageは残してあります

しかし、これは本当に付け焼き刃なので、もう少しきちんとしたものを作りたい、そのためには Laravelを勉強しよう!!と思ったのですが、既に挫折しました とにかく PHP以外に学んだり、覚えたり、あるいは流儀に馴染んだり、そのようなことが多すぎます もう僕の脳みそは新たなものを取り入れる余地があまりありませんので、これは辛いのです

そこで、考え方を方向転換しました 「折角使えるようになっているPHP/JavaScript/jQuery/CSS/html/MySQLなのだから、そのまま推し進めよう」と思ったのです そして「余力が出れば Laravelなりを学べば良い」と思ったのです

それで、昨年のプログラムを見直しました こんな風体にしたかったのです

デモスクリーン

もちろん、下の大きなアイコンは navigatorであり、このアイコン集はどのページにも出現し、スクロールしても消えません このようなものを作りたいのです

これには、Bootstrapの navibar/dropdownコンポーネントを用いればそんなに難しくなくできる、ということは自分で分かっていました そして実装したのですが、どうしても

こんな風にDropdownしたいんだ!!!!

こんな風に(dropdownする)動かないのです いや、動いたり動かなかったり、と厄介なバグです

そしてついに原因をつかみました jQuery Libraryが version3.xであると動かないのですが、1.xや 2.xであれば動作したのです これには驚きました ちなみに 3.xでも動いていた時には次のようなコードを書いていたからです

<script src="http://code.jquery.com/jquery.js"></script>
<script>
	if ( !window.jQuery ) {
		document.write( '<script src="js/jquery3-1-0.js"><\/script>' );
	}
</script>

つまりこれであれば、on-lineであれば、CDNを読みにいっていますが、この読んだ先には、jQuery 1.xがあったからなのです

うーん時間潰しました

目標としていた9月1日に何とか間に合いました

鎌倉ライブデモンストレーションのHome Pageの全面改訂を8月の10日頃から行ってきました ある程度公開するのを9月1日と目標設定していたのですが、何とか間に合いました

http://kamakuralive.net/

大きなバグはとれていると思います このページの特徴は、SQL databaseに色々なデータを別の保護されたページにより登録すれば、それが自動的にこのページで更新されていく、ということです

鎌倉ライブデモンストレーションの詳細については未だ確定できない部分も多く、かといって全く分からないままで放置しておくことも良くないので、このような構造にしたのです

僕にとってこれは長年のライブデモンストレーション生活の中での最適解の一つなのですが、それをどのように実現していけば良いのか、それを解決できるだけのスキルも知力も以前の僕にはありませんでした しかし、今は違います これをやり遂げるだけの能力を習得したのです 嬉しいな

これもTAVIがすんなりと治療できるから可能なのです ありがとう SAPIEN3

洗練化するデータ構造

鎌倉ライブデモンストレーションの公式Web Site構築中です こっそりと現在の姿お見せすると

http://kamakuralive.net/23rd/db_read/come_session_all_read.php

となるのですが、もちろん公式には未だ公開していません

このページの特徴は、参加して頂く方のデータを別のページでdatabaseに登録し、そこから読みだしているのです 従ってそのページにアクセスする方々は、常時データを更新することができ、それが瞬時に反映される、ということなのです さらに、データ構造を工夫してあり、たとえば ◯◯さんがどの時間帯に dutyがあり、それがぶつかっていないかどうかもすぐに判明できる、というものにしてあるのです このデータ構造を創造するのには随分と頭を回転させました 知力の勝負ですね