2014年5月22日

ストレージ仮想ソフトのVVAULTという製品

VVAULTという製品です。

複数のストレージを1つにまとめてくれるストレージ仮想ソフトです。

 複数のストレージ(NASだったり、クラウド上のストレージだったり、ローカルドライブだったり)を一つにまとめて管理してくれるソフトウェアです。
 使っているわけではないですが、ちょっと興味があります。

気になった機能は、以下。

  • タイムマシン機能
    2日~31日間または、無制限に更新前のデータを保存していてくれる(多分、管理しているストレージ内にだと思いますが)
  • よく使うファイルは速いストレージへ、そんなに使わないファイルは、遅いけど大容量なところへ自動的に再配置してくれるらしい。
  • 無料版がある。
タイムマシン機能なんてとても、ちょっと使えるんじゃないのかな?と思います。
間違って消してしまっても、2日以内(無料版)だったら復旧できるのでとてもよいと思います。
(Personal Plusは、月額料金500円がかかりますが、31日間履歴を持っているようです。)


で、この製品は、LogitecのNASに標準添付されているそうです。

2014年5月10日

JavaScriptでの文字列操作関数作ったから公開


 いろいろなところにころがっていると思いますが、ソースがなくなってもいいようにメモっておくよ。

trim3種とQueryStringをハッシュに分解する関数。
Stringクラスのprototypeとしているから、文字列とかのStringデータにドットを打ってそのまま使えます。

/**
*   QueryStringを連想配列に変換して返却する
*   @return hash
*   page=14&run_mode=edit&rental_request_id=77
*   ↓
*   {page: "14", run_mode: "edit", rental_request_id: "77"}
*/
String.prototype.toQueryParams = function() {
    var queries = this;
    var params = queries.split("&");
    var key_value = {};
    for(var i=0; i<params.length; i++) {
        var arr = params[i].split("=");
        key_value[arr[0]] = arr[1];
    }
    return key_value;
}
/**
*   Stringオブジェクトで両端の空白を削除
*/
String.prototype.trim = function() {
return this.replace(/^\s+|\s+$/g, ""); }
/**
*    Stringオブジェクトで左の空白を削除
*
String.prototype.ltrim = function() {
return this.replace(/^\s+/, ""); }
/**
*   Stringオブジェクトで右の空白を削除
*/
String.prototype.rtrim = function() {
return this.replace(/\s+$/, ""); }

2014年4月26日

Webサイトの画面イメージのキャプチャーの仕方

 今更感満載なんですが、Webサイトの画面設計書の為の画面イメージの取り方ですが皆さんはどうされてますか?

 今までは、1画面に収まらないものは、ブラウザで表示できる分を分割してコピーしてEXCELとかに貼り付けてました。
 簡単にページ全体を撮る為のアドインがありましたので導入してみました。

 Goole Chromeのアドインなんですが、「Awesome Screenshot」というものです。
選択エリアや、ページ全体をショートカットで撮ることができます。

デフォルトだと、「Ctrl+Shift+E」で今表示してるページをキャプチャーし、あと2クリックでクリップボードへ撮ることができます。



「Ctrl+Shit+E」を押すと、ページがキャプチャーされ、下のツールバー的なものが表示されます。
(このタイミングで、いろいろとメモを入れたりもできます。)
完了をクリックします。



次にキャプチャー(編集も含む)したページをどうするかの選択で、「Copy」をクリックします。
クリップボードに保存されます。




あとはEXCELなり好きなところに貼り付けてください。


これで作業効率が劇的にあがると思いますよー。


2014年4月25日

jQueryを使ってエラー発生項目の先頭にフォーカスを当てる

 webの画面でjavascriptで入力項目チェックをした時にエラー項目にフォーカスを位置づける簡単な方法に気づきました。
 
やり方

  1. エラーになった項目のclassにマーク(例えば「item_error」というクラス名)を付ける。
  2. classに"item_error"が付いている一番最初の項目にフォーカスを当てる。
    そのロジックが以下。

ロジックの説明
 classに「item_error」が付いている項目にフォーカスを当てるロジック。
ポイントは、コールバック関数に「return false;」を付けること。
これをしないと、エラーのあった最後の項目にフォーカスがあたる。
(eachを終わらせるための方法)
$(".item_error").each(function() {
    $(this).focus();
    return false;
});
もっと良い方法
 「item_error」というclassが設定されているinput, select, text(, button)要素をに対してフォーカスを当てます。
 くるくる回らなくても良いので(コンピュータ的に)速いです(項目が少なければ人が感じられるほど違いはありません。)。
    $('.item_error:input:visible').eq(0).focus();
これで、エラーがあった項目を保持しておく必要がなくなるな。

Webシステムでの帳票のPDF出力について

 現在開発中のシステムで外部に提出する帳票はPDFで出力したという要望を頂いているのですが、ちょっと調べてみました。
 システムは、Apache+PHP+CakePHP+MySQL+Smartyで構成されています。

ちょっと調べて見ると、以下の様なものが見つかりました。

まともな調査はしていないのですが、帳票をレイアウトするのに座標指定する必要がありなかなか手間がかかる感じがします。

で、ひとつの解決案として以下の方式を考えました。

このプロジェクトで使うブラウザがGoogle Chrome固定いう大前提があります。
Chromeの印刷機能には、PDFへ保存する機能があるではないですか!!
これを使えば、HTMLで帳票をデザインして、PDFへ保存してもらえばそーとーの工数削減がされます。
 これで、開発の手間、メンテナンス性がとても上がります。


みなさんもブラウザは、Google Chromeでっ!

2014年4月18日

EXCEL2010のインデントがキーボードでできない

 EXCEL2010でセル内でインデントを付ける場合、スペースで付ける人がいると思いますが、ナンセンスです。
 または、空の列を追加してインデントしたり…。

 EXCELの機能を使ってやるには、インデント(セルと枠線の余白を増やす)という機能があるのでそれを使います。

 そのアイコンにマウスカーソルを当てると、キーボードのショートカット表示されるので、次からは、マウスではなくキーボードでやってみようと思ってやってみました。
 そしたら、Windows 7のタスク切り替えの状態になってしまいました…。

アプリケーションよりも、OSのほうが強かったという話です。
別にいいんですけどね。マウスでやるんで。

2014年4月16日

SublimeTextとやっておきたい(忘れたくない)設定


プログラミングで使うテキストエディタは、フォントやフォントサイズは見やすいように必ず設定しておく。


Sublime Textの設定は、こう!


フォントの変更

[Preferrences]-[Setting-User]
  1. {
  2. "font_face": "MS ゴシック",
  3. "font_size": 9,
  4. "draw_white_space" : "all"
  5. }
  • 2行目:フォントの種類
    MSとゴシックの間は、スペースを区切る
  • 3行目:フォントサイズ
  • 4行目:スペース、タブを表示する
キーバインドを変更

[Preferrences]-[Key Bidings-User]
  1. [
  2. { "keys": ["ctrl+m"], "command": "insert", "args": {"characters": "\n"} },
  3. { "keys": ["ctrl+i"], "command": "insert_best_completion", "args": {"default": "\t", "exact": true} },
  4. { "keys": ["ctrl+h"], "command": "left_delete" },
  5.  { "keys": ["ctrl+alt+c"], "command": "clone_file" }
  6. ]
  • 2行目:Ctrl+mでEnterキー
  • 3行目:Ctrl+iでTabキー
  • 4行目:Ctrl+hでBackspaceキー
  • 4行目:Ctrl+alt+cでアクティブはファイルをもう一つ開く(これで同じファイルを見ながら編集ができる)

linuxの時の日本語入力ができるようにする

https://lab.sonicmoov.com/markup/sublime-text-2/

プラグイン
JQuery
CSS
LESS
Emmet
SublimeLinter