sorceryforce.net のほうで Tips 公開始めました

今まで Tips 系の記事は sorceryforce.com のほうに書いていましたが、あちらはすべて静的な HTML で書いているため、ちょっと管理が面倒になってきました。

そのため、現在プログラムのほうで動かしている sorceryforce.net のほうで記事を載せられるように構築したので今後はこちらのほうに載せていきたいと思ってます。

まあ、ブログとか CMS 使えばいいじゃんっていう話にもなるかもしれませんが、細かいところまで制御したかったので必要な部分だけ自分で作ってしまいました。まだ対して載せられる項目はないのですが、今後少しずつ作り上げていきたいと思います。

あと、Tips 系の多言語化についてですが、HTML 付きの翻訳が割とめんどくさそうなので、Tips 系の記事については多言語化していません。必要であれば他サービスの翻訳機能をつかって見る形になるかと思います。


日本のアニメオンエア時間検索を作ってみました

前の投稿でホームページを多言語しましたという投稿をしましたが、実はその目的がこれだったりします。

β版開発室の方にて「日本のアニメ検索」を作ってみました。β版開発なので、正式サービスとして公開する予定はなく、あくまでも開発目的で作ってあります。

内容はアニメ検索と言いながら、今後一週間のアニメのオンエア時間を見れるというものです。ジャンルごとに分かれているのでジャンルで検索すればそのジャンルで表示するアニメを絞り込むことができます。他にも検索項目があればよかったのですが、まあとりあえず作ってみたものなので、気が向けば増やしてみたいですね。

まだテスト運用したばっかりなので正常に番組内容が新しくなるかはもうちょっと動かしてみないとわからないです。一応1日ごとに更新されます(予定)。

まあ、アニメ検索自体は他のサイトでもやっているのであんまり需要はないのですが、今回作ってみたのは他の言語でも同様に表示されるというのをやってみたかったからです。言語を変更したブラウザで開けばその言語でテキストが表示されるようになっています。ただ、アニメのタイトルは結構特殊なものが多いので正常に翻訳されていないものも結構あるのですが、そこはイメージで感じ取ってください、ってな形で。ちなみに翻訳できなかった場合は日本語にしています。グローバル的には英語にするべきなのですが、日本のアニメなんで日本語のままにしてあります。

あと、オンエア時間とかは自動で更新されているので正しいかどうかは特に検証していません。とりあえずこんなアニメがあるんだー、へー、程度で見ていただければと思います。


ホームページを多言語対応しました

ホームページ「ソーサリーフォース.net」を多言語化対応してみました。対応している言語は列挙するのがちょっと大変なので書きませんが大体40か国語ぐらいに対応しています。主要な言語については大体サポートしているつもりです。

1年前に英語には対応していましたが、なんとなくやってみた程度だったので、半分ぐらいは翻訳されていない状態でした。最近プログラムの方をさわる機会ができたので今回一気に多言語対応しました。ただ、ページによってはそもそも多言語化する必要のないところもありますので、そこはそのままにしてあります。

多言語化の仕組みなんですが、sorceryforce.net ではサーバープログラムに ASP.NET MVC を採用しています。ASP.NET MVC にはローカライズの仕組みがあり普通に多言語化する分にはこれを使って作ります(作ると思います)。

ただ、調べてみると言語が増えるたびにファイルが増えて行くというなんとも嫌らしい構成になるらしく、数言語ぐらいならまだしも全世界対応ってなると相当な数になるみたいです。ビューを言語ごとに作成するとなると、レイアウトとか変更するたびに全ファイル修正しなければならなくなり、ビューの修正が億劫になってしまいます。私も Windows From でちょろっと多言語化やってみたのですが、同じように Windows Form のデザインを言語ごとに作る必要があり、とてもめんどくさそうなイメージがありました。まあ、ASP.NET MVC ならビューの継承、Windows Form ならフォームの継承を使ってある程度はごまかせるのですが、テキストが右⇒左方向だったり、翻訳語のテキストが長くなったり、文字の大きさが変わったりするので結局は微調整に時間を取られそうな感じがしますね。Windows Form は問題が顕著になりますが、Web ならレイアウトはある程度ブラウザが補間してくれるのでなんとかなりそうな気がしますが。

で、そんなこんな考慮してみて、最終的には多言語対応はすべて自前で実装しました。Visual Studio のリソース入力もめんどそうだったので、テキストはすべて Excel で管理し、日本語さえ入力すれば後は半自動的に他の言語に翻訳してくれるようにしました。半自動っていうのは、テキストを入力した後に頻繁に翻訳されても困るので、入力した後にバッチ叩けばプログラムにまで自動反映されるよー、っていう感じにしてあります。

実際にビューに出力する方法としては、テキストはすべて ID 管理されているため、.cshtml とかで @Model.GetMessage(なんちゃらID) のようにしておけば、後はブラウザの言語を判定して対応する言語で表示されるようになっています。ID は列挙体なので、ID 名でどんなテキストかわかんなくてもマウスカーソルを合わせれば summary で元の日本語が表示されるのでとても便利です。

あと、この仕組みはプラットフォームに依存しないようにしてあるので、ASP.NET でなくても、.NET Framework であれば他のアプリケーションにも適用できるようになっています。クライアントツールとかゲームとか Windows ストアアプリとか。まあ、まだホームページにしか使ってないので、機会があれば他のソフトも多言語対応してみたいですね。

ちょっといろいろ長くなってしまい、また内部的な話になっていしましたが、要はホームページを多言語化対応しました、という話でした。


レスポンシブデザインにしてみた

最近話題になっているレスポンシブデザインをホームページの方に適用してみました。とはいっても sorceryforce.com の方ではなくて sorceryforce.net の方です。

レスポンシブデザインと大々的に描いてますが、適用しているのはブラウザの幅に合わせてレイアウトを変更している部分です。スマートフォンとかのようなブラウザサイズが小さい画面でもコンテンツをなるべく表示できるようにしています。まあ、もともとPC向けのサイトなのでページによってはそれほど快適になるわけではないんですけどね。ここらへんは CSS の調整次第かと思います。

sorceryforce.net の方はサービス系のアプリとかを公開するために作ったんですが、しばらく放置気味だったのでこれから少しずつ構築していく予定です。外部コンポーネントとか使わずに自分で構築しているので結構時間がかかったりとかテストが面倒だったりしていますが、そのかわりすべて自分で制御できるので自由度は高いですね。


Windows Server 2008 R2 で FTP サイトを立ち上げる (イントラ)

割とめんどくさかったのでメモ書きします。すべてサーバー側の設定です。一応イントラでの環境設定を想定しているので、インターネットで公開する場合は対象箇所を置き換えて読み取ってください。

接続条件

  • 基本認証のみ
  • 21番ポートを使用した接続
  • イントラ環境のみ使用

手順

  1. 基本認証を行うためのユーザーアカウントを作成 (Users グループなどは削除して問題ありません。不用意にログインできないようにしましょう)。パスワードも設定しておきます。(FTP ログインのユーザー名とパスワードに使用されます)
  2. 任意のフォルダパスに FTP 用のフォルダを作成。対象フォルダに先ほど作成したユーザーの権限 (プロパティのセキュリティタブから)を付加する
  3. サーバーマネージャーの役割から Web サーバー(IIS) を選択し、役割サービスの中からFTPサーバーを選択しインストール
  4. IIS管理ツールを開き、サイトを右クリックして「FTPサイトの追加」を選択
  5. 物理パスは先ほど作成したフォルダのパスを指定。
  6. SSL を使わない場合は「なし」に設定。今回は匿名認証を使わないので基本認証のみにチェックを入れる
  7. FTP サイトを作成したら「FTP IPv4 アドレスとドメインの制限」を開き、操作から「許可エントリの追加」を選択。IP アドレス範囲を「192.168.0.0」マスク「255.255.255.0」のように設定 (この場合 192.168.0.0~192.168.0.255 の IP アドレスを持つ PC から接続が許可されます)
  8. 続いて FTP ホームから「FTP の承認規則」を開き、操作から「許可規則の追加」を選択。指定されたユーザーをチェックし、先ほど作成したユーザーアカウントの名前を設定します。このユーザーアカウントの名前とパスワードで外部から FTP 接続できます。
  9. 最後にサーバーマネージャーから Windows ファイアウォールを選択、受信の規則から新しい規則を作成し、TCP の 21番ポートを有効にします。

以上の設定が終わったら別な PC から FTP コマンドなりツールなり使用して接続確認をして下さい。


テスト投稿です

Windows 8 からの新環境投稿テストです。この投稿は無視してください。


[ASP.NET] エラー:オブジェクトの現在の状態に問題があるため、操作は有効ではありません。

リンク先情報なのですが、セキュリティパッチにより 500 個以上のコントロールを Postback するとタイトルのようなエラーが出てしまうみたいですね。回避策としては「コントロールの数を減らす」か「Web.config に上限数を設定する」のどちらかみたいですね。


jQuery とラジオボタンメモ

ラジオボタンのラベルクリックでもチェックできるようにする

<input type="radio" id=”AAA1” name=”BBB” val=”0” checked="checked" /><label for=”AAA1”>サンプル</label>
<input type="radio" id=”AAA2” name=”BBB” val=”1” /><label for=”AAA2”>サンプル</label>

 

ラジオボタンのチェック状態が変更されたときに処理を行う

$(“input[name=’BBB’]”).change(function()
{
  // なんたら処理
});

 

チェックがついているラジオボタンの値を取得する (ラジオボタンのイベント内で)

var data = $(this).val();

 

イベントを発行したラジオボタンがチェックされているか取得する (ラジオボタンのイベント内で)

if ($(this).attr("checked") == true)
{
  // なんたら
}

[ASP.NET] IE の互換表示で ReportViewer コントロールのサイズを小さくすると IE がフリーズする現象を回避する方法

ReportViewer+SSRS のレポートを IE で互換表示すると高確率でフリーズする」で質問させていただいたのですが、回避方法が見つかったのでこちらにも書いておきます。

【環境】(現象確認環境であるため、似たような環境でも発生すると思います)

❏サーバー

  • Windows Server 2008 R2 Standard (SPなし)
  • IIS 7.5
  • ASP.NET MVC 3
  • ReportViewer コントロール バージョン 10.0.0.0 (.NET Runtime 2.0.50727)
  • SQL Server 2008 R2 (SPなし)
  • 見出しマップを表示されたレポート (.rdl)

 

❏クライアント

  • OS : Windows XP, Vista, Windows Server 2008 R2
  • ブラウザ:IE8, 9

 

【現象】

ReportViewer コントロールに見出しマップがあるレポートをバインドさせ、その Web ページを IE 8, または 9 の「互換表示」で開き、ReportViewer コントロールのサイズを小さく表示させると IE がフリーズする。(ReportViewer コントロールのサイズがウインドウサイズに追従する場合は、IE のウインドウサイズを小さくしていけば現象は確認できる)

おそらくではあるが、IE の内部処理でレイアウトを計算する際に無限ループ、またはそれに近い再起処理が行われているためだと思われる。

 

【対処法】

IE のレイアウトの解析処理を変更させることでフリーズを回避させることができる。具体的には HTML の解析は DOCTYPE で変えられるため、この宣言の内容を変更することによって可能。

・修正前

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

↓↓↓↓

・修正後

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

 

しかし、HTML 4.01 Transitional を指定すると今度は逆に互換表示していない IE での表示が崩れてしまうという現象に見舞われる。そのため、HTML で互換表示かそうでないか (正確には IE のレンダリングバージョン)で条件分けをして現象を回避します。

下記では「IE 8 以降であるか」「IE 8 未満であるか」「それ以外のブラウザであるか」で分岐しています。

<!--[if gte IE 8]>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<![endif]-->
<!--[if lt IE 8]>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<![endif]-->
<![if !IE]>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<![endif]>

 

別案としてサーバーから「<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />」のようなメタ情報を返してクライアントで互換モードを指定するという方法もあるが、最終的な互換モードの決定権はクライアントにあるため、必ずしも有効であるとは限らない。(でも何もしないよりはいいと思います。)