木曜日, 12月 19, 2013

PHP: HTML セーフなコードに変換

HTMLコードを書く際に、不等号記号などそのまま書くとブラウザが勝手に変換してしまいます。

プログラムなどを表示するためには、記号をHTMLに変換しなければなりません。

ブラウザの勝手な行動を制限するために、変換するツールを作成しました。

使い捨てないツールのためにここにアップします。

以下のコードを html.php というファイルに保存し、PHP の動く環境でブラウザを使って表示します。

テキストボックスにコードを打ち込み、Convert ボタンを押すと変換されたコードが表示されます。

<html>
<head>
<style>
textarea
{
width:1000px;
height:500px;
}
</style>
</head>
<body>

<?
$text=$_REQUEST['text'];

$text=htmlspecialchars($text);

echo <<<END
<form action="html.php">
<textarea name="text">$text</textarea>
<input type="submit" value="Convert" />
</form>
END;

$html=htmlspecialchars($text);
echo <<<END
<textarea>
$html
</textarea>
END;
?>
</body>
</html>

土曜日, 12月 14, 2013

Java: 列挙型 enum を switch文で使う

Mandelbrot
列挙型 enum は Java5 で導入されました。

public enum Periodic{PERIODIC,PREPERIODIC,NONPERIODIC};

名前を付けて、識別子を列挙します。

この値を変数に代入するには、静的に定義された変数として扱います。

 Periodic periodic=Periodic.NONPERIODIC;


列挙型変数名を指定する必要があるわけです。

ただし、switch文で使う場合には指定しません。

switch(isPeriodic())
            {
            case PERIODIC:
                System.out.println("f is periodic.");
                break;
            case NONPERIODIC:
                System.out.println("f is not periodic.");
                break;
            case PREPERIODIC:
                System.out.println("f is pre-periodic.");
                break;
            }

気を付けましょう。

日曜日, 12月 01, 2013

Windows 8 ストアアプリ開発にはまっております。

作りかけのメトロアプリ
目下のところWindows8用のアプリ開発にはまっております。これが面白い。書き方が全然違うので慣れるまで大変ですが、簡便さ能率と自由度が違う。

Windows8用のアプリは ストアアプリ、メトロアプリ、WinRT などと呼ばれていてどれもメトロスタイルのアプリを書くためのものです。興味深いことにデザインはXAML形式、機能はC#などプログラミング言語で記述します。ここがポイント。

もとWindows7とかWindowsXPのデザインは、もとはRCファイルなどですね。ベタなテキストファイルで、編集は特殊なリソースエディタを使って行っておりました。エディタで部品を置いて、クリックしたときなどの動作をC++で記述するという形です。部品の種類もそこそこあるわけですが、Windows8になってデザインの差もさることながら自由度が格段にアップしました。アプリが豪華に見えます。

ページデザイン、レイアウトをXAMLというXMLに基いた言語で記述することで、あらたな世界が広がっています。HTMLはXMLに準ずる形式ですね。だからXAMLはHTMLのようなものです。ウエブページを書くノリで自由に部品が記述できるのです。これはすごい。どんどんページを書いていって、それから機能を実装していけばいい。

開発環境も優れています。部品の種類もそこそこ厳選されており、ネーミングも悪くない。いや、とてつもなく悪いのもあるわけですが、コンセプト的にはいい。アプリにブラウザ機能をつけるととんでもない便利な環境が出来上がります。ネットにどれだけのリソースがあると思いますか?アプリからそれが全部使える。辞書だろうとニュースサイトだろうとSNSだろうとそのままです。入力を処理する必要さえない。

まだまだ自由に使いこなせているとは言えませんが、チャレンジする価値は十分にあります。情報が少ないのはネックですが、今後の発展を期待しましょう。

日曜日, 11月 24, 2013

Windows ストアアプリ: ローカルファイル

ストアアプリではURIでファイル名を指定します。

Windows.Storage.StorageFile file
   = await Windows.Storage.StorageFile.GetFileFromApplicationUriAsync(
                                 new Uri("ms-appdata:///local/Doc/" + fileName));

上記の指定では、mss-appdataでローカルファイルを指定し、Docディレクトリ以下のfileNameにアクセスしています。このDocディレクトリはアプリで用意する必要があります。あらかじめアプリケーションのほうでDocディレクトリを用意し、ファイルを置いておけば、ローカルファイルから読み込むことができます。

 
ややこしいことに、元ファイルは、ローカルにコピーされたファイルとは別物です。つまり、ms-appdataで指定されたファイルをいくら書き直しても元ファイルには反映されません。 元ファイルのほうは、ms-appxで指定します。ファイルは読み込み専用です。

Windows.Storage.StorageFile file
  = await Windows.Storage.StorageFile.GetFileFromApplicationUriAsync(
                                new Uri("ms-appx:///Doc/" + fileName));

ローカルファイルのほうを調べたければ Windows.Storage.ApplicationData.Current.LocalFolder.Path に指定されているディレクトリを見に行く必要があります。




PHP: CSVをHTML形式のテーブルに変換

CSV を HTML 形式のテーブルに変換するニーズというのは多々あるものです。

HTML のテーブル形式に変換したいときに使えるツールを作ってみました。

CSV 形式のデータを上のテキストボックスにほうりこみ、Convert ボタンをクリックすると変換された HTML コードが表示されます。

ツールを使い捨てないためにここにアップします。

<html>
<head>
<style>
textarea
{
width:1000px;
height:500px;
}
</style>
</head>
<body>

<?
$text=$_REQUEST['text'];

echo <<<END
<form action="table.php">
<textarea name="text">$text</textarea>
<input type="submit" value="Convert" />
</form>
END;

$text=$_REQUEST['text'];
$text=htmlspecialchars($text);
$list=explode("\n",$text);
$html="";
foreach($list as $line)
  {
    $columnList=explode(",",$line);
    $column=implode("</td><td>",$columnList);
    $html.="<tr><td>$column</td></tr>";
  }
$html="<table><tbody><pre>
$html
</pre></tbody></table>
";
echo <<<END
<textarea>
$html
</textarea>
$html
END;
?>
</body>
</html>

日曜日, 11月 10, 2013

WinRT/Metro TIPS:ストアアプリで部品サイズを可変にする

なかなか普及の進まない Windows 8.1 と騒がれていますが、当方果敢にもストアアプリ作成にチャレンジ中であります。

プログラムの基本概念なぞという人間は現場を・知らない・知ろうとしない・連中だとまずここで一言。

考え方としてはプログラム構造は Java のような OOP で、見た目は XML で指定します。

ストアアプリでは XML 形式を拡張した XAML 形式で画面構成を指定します。

Visual Studio 2013 という豪華な(金のかかった) IDE には圧倒されますが、それなりにクセのあるツールではあります。

部品サイズを可変に指定するやり方に悩んでしまい、ネットにもなさそうなのでここに書いておきます。

Visual Studio 2013 部品を可変サイズにする
サイズを可変にするには Width と Height 右のアイコンを押して Auto に指定、さらに HorizontalAlignment と VerticalAlignment の一番右のアイコンで画面最大幅を指定します。

部品の幅を可変にする
 アルファベット順に並んでいるので、Width の真上に高さを指定する属性 VerticalAlignment がくるわけですね。

ストアアプリの開発関連情報はまだまだ少ないですね。

金曜日, 8月 23, 2013

IEでは異なる要素でも同じ名前はダメ。

表題の通りです。

 DIV要素とUL要素で同じ名前にしてやられました。

以下のように指定したとします。
<div id="menu">
<ul id="menu">
<li>
Click Here
</li>
</ul>
</div>
それで、クリック時に呼び出す関数を指定したとします。
    $(document).ready(
 function()
 {
     $("ul#menu > li").click(function(){
     alert("here");
     });
 });
これだと、Firefoxは意図を察して動いてくれるのですが、IEだとだめだめです。

あちゃー という本日の発見でした。

木曜日, 8月 22, 2013

jQuery: クリックして止まるドロップダウンメニュー

jQuery を使うとメニューを比較的エレガントに実装できます。

slideDown() / slideUp() などの関数を利用すると任意のコンポーネントを表示または非表示に設定できます。

さらに、マウスクリックでメニューを固定するなどいう指定が可能です。

固定されたメニューは画面いずれかの場所でクリック数すると解除されます。

以下、jQueryの部分です。
$(document).ready(function(){
    // 1 when any menu is shown
    var menuOn=0;

    $("ul#menu > li").click(function(){
        // hide all menu items
        $("ul#menu > li").each(function(){
            $(this).find('ul').css("display","none");
          });
        $(this).find('ul').css("display","block");
        menuOn=1;
      });
              
    // hide/show menu items
    $("ul#menu > li").hover(function(){// show menu when the cursor is over
        if(menuOn==0)
          {
            $(this).find('ul').css("display","block");
          }
      },      
      function(){// hide menu when the cursor is off
        if(menuOn==0)
          {
            $(this).find('ul').css("display","none");
          }
      });

    // hide all menus and clear the flag
    $("#canvas").click(function(){
        if(menuOn==1)
          {
            $("ul#menu > li").each(function(){
                $(this).find('ul').css("display","none");
              });
          }
        menuOn=0;
      });
  });
スタイルシートです。

ul#menu,
ul#menu ul
{
    list-style:none;
    z-index:1;
    position:relative;
}
ul#menu ul li 
{
    line-height:25px;
    width:100px;
    height:25px;
    background:#2D435A;
}
ul#menu ul li a
{
    text-decoration:none;
    color:#cccccc;
    margin-left:10px;
    font-size:14px;
    text-align:none;
}
ul#menu ul li#heading a,
table#submenu a#heading
{
    color:white;
    font-size:16px;
    margin-left:0px;
}
ul#menu ul
{
    display:none;  
}
ul#menu,
ul#menu li,
ul#menu ul,
ul#menu ul li
{
    margin:0px;
    padding:0px;
}
ul#menu li, 
ul#menu ul li 
{
    color:white;
}

div#menubar
{
    width:100%;
    background-image:url('../../../../images/topNav_bkgd.jpg');background-repeat:x-repeat;
}

ul#menu
{
    width:960px;
    margin:0px auto;
    padding:0px;
}
ul#menu li
{
    height:25px;
    line-height:25px;
    display:inline-block;
    vertical-align:top;
    color:white;
    text-align:center;
    width:130px;
    border:0px;
    *display:inline;
    *zoom:1;
}
ul#menu li ul
{
    width:400px;
    height:400px;
    background:#2D435A;
    opacity:.9;
    filter:alpha(opacity=90);
    -ms-filter:"alpha(opacity=90)";
    -moz-opacity:.9;
    -khtml-opacity:.9;
    text-align:left;
}
ul#menu li ul li
{
    text-align:left;
    border:none;
    padding-top:10px;
    padding-left:10px;
}
table#submenu
{
    margin:0px;
    margin-top:10px;
    margin-left:10px;
    border:0px;
    border-collapse:collapse;
    width:400px;
}
table#submenu td
{
    text-align:left;
    vertical-align:top;
}
div#canvas
{
    width:100%;
    text-align:center;
}
div#position
{
    width:960px;
    margin:0px auto;  
    text-align:left;
}
HTMLの部分を示します。
<div id="menu">
<ul>
<li>Home
    <ul>
<li><a href="http://www.blogger.com/default.htm" title="Noritake VFD">Home</a>
      </li>
</ul>
</li>
</ul>
</div>

水曜日, 8月 21, 2013

z-index はpositionを指定しないと意味がない。

表題の通りです。 z-index はpositionを指定しないとならないんですね。

さらに、IE では clear:both を指定しないと z-index が指定できない。

気をつけましょう。

日曜日, 8月 18, 2013

縦型メニューをjQueryで作る

縦型メニューをjQueryで書いたら簡潔かつ論理的にできたのでここにメモっときます。


    $(document).ready(function()
        {
     $('ul#menu > li').click(function(){         
         $(this).next().slideToggle();
     });
        }); 

これだけです。いくつかポイントがあって、まずは next() で後続の要素を指定します。

入れ子の要素を指定しているわけではないので、サブメニューを記述する時には注意してください。

あとはどのような関数でも呼べばいいわけですが、ここでは slideToggle()で表示を切り替えています。

既出かもという気もするのですがなかなかエレガントなのでここに置いておきます。
    <ul id="menu">
      <li>Homepages</li>
      <ul>
   <li><a href="http://easai.web.fc2.com/biology/">Biology</a></li>
   <li><a href="http://easai.web.fc2.com/travel/">Travel</a></li>
   <li><a href="http://easai.web.fc2.com/phyla/">Phyla</a></li>
   <li><a href="http://easai.web.fc2.com/homepage/">Homepage</a></li>
   <li><a href="http://easai.web.fc2.com/biochemistry/">Biochemistry</a></li>
   <li><a href="http://easai.web.fc2.com/neuroscience/">Neuroscience</a></li>
      </ul>
      <li>Lignuistics</li>
 <ul>
            <li><a href="http://easai.web.fc2.com/linguistics/">Linguistics</a></li>
 </ul>
      <li>Nature series</li>
 <ul>
   <li><a href="http://easai.web.fc2.com/aves/">Aves</a></li>
   <li><a href="http://easai.web.fc2.com/eutheria/">Eutheria</a></li>
   <li><a href="http://easai.web.fc2.com/lepidoptera/">Lepidoptera</a></li>
   <li><a href="http://easai.web.fc2.com/odonata/">Odonata</a></li>
 </ul>
    </ul>
スタイルシートもあげておきます(2013-12-05)。
body
{
display:box;display:-moz-box;display:-webkit-box;display:-ms-flexbox;
}
ul#menu
{
width:180px;
font-family:sans-serif;
font-size:18px;
color:gray;
margin-left:10px;
margin-right:60px;
}
ul#menu,
ul#menu ul
{
  list-style:none;
  padding:0px;
}
ul#menu li
{
    border:1px solid #e0e0e0;
    background:#ececec;
    height:50px;
    padding:10px;    
}
ul#menu ul
{
    display:none;
}
ul#menu ul li
{
    background:#fafafa;
    font-size:16px;
    height:30px;
}
ul#menu ul a
{
    text-decoration:none;
    color:gray;
}

火曜日, 7月 23, 2013

Stylishで「こちらのユーザーもフォローしてみませんか」を消す

つい先ほどツイッターのアカウントに行ったら画面上のほうにどどどーっとむさい顔がずらりと。

うわっっなんだ、知らないぞこんな連中は、ということで何かと思えば

「こちらのユーザーもフォローしてみませんか」

と書いてある。やめてくれー

Twitter Remove Recommendations

というのは愚痴であるので、しっかりアドオンで消す方法を探してみました。

ブラウザはFirefoxです。Stylish というアドオンを使ってみました。

Add to Firefoxボタンを押すとインストールが始まります。

ブラウザを再起動すると、 インストールが完了します。

左上 Firefox ホームメニューから Add-ons を選択。
 
左のメニューから、User Styles を探し、クリックします。

Write New Style ボタンをクリックし、新しいスタイルを作成します。

名前は Twitter Remove Recommendations とでもつけておいて、スクリプト部分にはこのような記述を書いておきます。


@namespace url(http://www.w3.org/1999/xhtml);

@-moz-document domain("twitter.com") {

div.empty-timeline-footer
{
display:none;
}

}

スタイルを保存して、ツイッターのアカウントページに行くと

余計なお世話が見事に消えてくれました。

おせっかいやめろー > ツイッター


ついでに Google News の写真・動画も消します(2013-10-23)。


@namespace url(http://www.w3.org/1999/xhtml);

@-moz-document domain("news.google.com") {

img.esc-thumbnail-image,
div.item-image-wrapper,
div.media-strip-video-wrapper
{
display:none;
}

}

金曜日, 7月 19, 2013

計算可能関数

計算可能関数

性質1.基本算法が含まれている
          1. 定数関数 2. 射影関数 3. 後置関数
性質2.閉包である
性質3.万能関数 枚挙性がある
性質4.流れの制御・選択
性質5.パラメータ性

Churchの提唱
計算可能な手続きと性質1~5を満たす算法の族は一致する。

帰納的関数論
評価可能な全値関数全てに対し、ある整数に対しf(m)=mが成立する。

計算可能なアルゴリズムの族
1.TM (Turing Machine)
2.λー算法
3.μー再帰関数
4.一般帰納的関数

木曜日, 7月 18, 2013

オキソ酸 カルボン酸 ヒドロキシ酸 オキシ酸 の違い

カルボン酸
用語だけの話ですが、カルボン酸ってのはいいと思います。教科書にあるやつですね。RCOOHで表される酸です。

オキソ酸ってのはカルボン酸を含むある種の酸の総称です。

ヒドロキシル基(-OH)とオキソ基(=O)を持つ酸のことを言います。

この定義でいくと、炭酸がオキソ酸に分類されます。
炭酸

でややこしいのがヒドロキシ酸で、ヒドロキシル基を持つカルボン酸のことをいいます。カルボン酸の一種なわけですが、時にオキシ酸という用語が使われることがあるので紛らわしい。

ヒドロキシ酸
集合記号であらわすとこうなります。

オキシ酸 ⊃ カルボン酸 ⊃  ヒドロキシ酸(オキシ酸)

木曜日, 6月 20, 2013

jQueryで要素を置き換えた場合の問題について

jQueryで要素に代入すると領域が確定できなくなるらしい。画面全体に領域が設定されているようだ。さらに、内部要素を追加するとその部分はイベントにフックできないらしい。

ブロック要素にロード時に要素を定義。
さらに、クリックイベントに関数をフック。
するとウインドウ領域全体でクリックイベントで関数が起動。

ブロック要素にロード時に要素を定義。
その要素にクリックイベントをフック。
するとフックされない。

他の要素が絡んでいないかどうか、もう少し追ってみる必要があるわけですが、もう疲れた。ので今日はここまで。


金曜日, 4月 19, 2013

PHPでJava風のprintStackTrace()を実現する方法

PHP では try-catch が使えます。

catchで捕まえた例外をどのように処理するかはまた人それぞれだとは思いますが、Java には printStackTrace() という便利な関数があります。

コールした関数を順に出力してくれる関数です。

ここではPHPで関数コールを出力する関数を実装してみました。

例外処理で呼び出すと、関数呼び出しのトレース文字列を出力します。

    try
      {
 // 関数本体
      }
    catch(Exception $e)
      {
 echo trace(debug_backtrace());
      }

関数のコールを順に出力するための関数です。

function trace($traceList)
{
  $html="";
  foreach($traceList as $debugInfo)
    {
      $pathInfo=pathinfo($debugInfo['file']);
      $baseName=$pathInfo['basename'];
      $funcName=$debugInfo['function'];
      $lineNum=$debugInfo['line'];
      $html.="@$funcName ($baseName: $lineNum)";
    }
  return $html;
}

水曜日, 4月 17, 2013

PHPでJava風のstartsWith()とendsWith()がない件について

読みやすさ、美しさというのもプログラムの質に影響してくるとおもいます。

startsWith(), endsWith()という関数がJavaにはあります。

文字列を比較して、指定した文字列で始まっていれば startsWith()は true を返します。

指定した文字列で終わっていれば endsWith()で true を返します。

Javaのネーミングセンスは最高だと常々思うわけですが、これらの関数はPHPにはありません。

substr_compare()という関数を使って startsWith()とendsWith()を実現してみました。

#文字長を制限し比較するよう変更しました(2013-06-05)。

function endsWith($haystack,$needle,$case=FALSE)
{
  $len=mb_strlen($needle);
  if(0<mb_strlen($haystack) && mb_strlen($needle)<=mb_strlen($haystack))
    $res= (substr_compare($haystack,$needle,-$len,$len,$case)==0);
  return $res;
}

function startsWith($haystack,$needle,$case=FALSE)
{
  $res=false;
  if(mb_strlen($needle)<=mb_strlen($haystack))
    $res=(substr_compare($haystack,$needle,0,mb_strlen($needle),$case)==0);
  return $res;
}


火曜日, 3月 26, 2013

Firefox で「パスワードを保存しますか」が危険な件について

Firefoxのデフォルト設定では、ログイン時に
 「ID/パスワードを保存しますか?」


と聞いてきます。

ここでID/パスワードを保存すると、次にログインするときには自動で値が設定されます。

確かに便利な機能ではあるんですが、これなんとテキストでそのまま見えてしまうんですね。

パスワードはパスワードであって、テキスト表示されるのはセキュリティ上問題がある、と考えられる方は以下のサイトでパスワードを削除できます。

「オートコンプリート」機能で保存されたパスワードの削除方法

 

木曜日, 1月 10, 2013

jQueryでページ内移動するには

ページ内移動には、ページ内アンカータグなどを指定して移動します。

index.html#position といった形で指定してやると、その箇所にページがスクロールします。

ページ内アンカータグについては、アンカータグでname属性を、divタグでid属性で指定します。

では、jQueryではどう処理するか、というのが表題の「jQueryによるページ内移動」です。

以下はアニメーションでページをスクロールするスクリプトです。

     var y=getY(document.getElementById("top"));
     $('body,html').animate({
      scrollTop: y
   }, 800); 

Qt: 外部プログラムを起動する

  Qt/C++ のアプリは、外部へ直接アクセスできます。これはネットアプリでは不可能な Qt のメリットです。 外部プログラムを起動することもできます。QProcess::startDetached() を使うと独立したプロセスを立ち上げることができます。 この QProces...