ぼくはパソコンのことはよく分からないのですが
世間ではWindowsの新しいのが出たらしいです。

ぼくは萌えキャラとかよく分からないのですが
Windowsを買うとイメージキャラクターのグッズがおまけで貰えるそうです。

なぜかよく分からないのですが
とても買わなければならない気がしたので
とりあえず買ってきました


これです。



理由はよく分からないのですが
とても満ち足りた気分になりました。

意味はよく分からないのですが32bit版は余っているそうです
Tsukumo eXに行けばまだ残っているかもしれません。

今作っているシステムに日時を入力するフォームが必要になりました。

jQuery UIを使って日付けの方をdatepickerで実装したものの、
時間の方はUIが付いてないのです。

なので、いくつか時間指定のUIを探し、
timepickrがかっこいいなあと思ったわけです。

しかし、このtimepickrは長いこと更新されていないため、
jQuery UIの最新版(現時点で1.8.23)と組み合わせて使おうとすると動きません。

ということで動くように直してみました。せっかくなので置いておきます。
jquery-ui-timepicker-1.8.23.0.zip

ただ、私はjQueryどころかJavascriptさえよくわかって無いので
素人がコードをエスパーしつつ適当に弄くって動いたワァな代物という点にご注意ください。

SAStrutsはStrutsベースなのでフォームを作るときはtaglibを使うわけですが、
これがもうだいぶ古いプログラムなのでHTML5なんて知らないのです。

しかし、最近ブラウザでも実装され始め、にわかに便利な
emailとかrequiredとかpatternとかを使いたい！


というわけでHTML5対応してみました。
taglib-html5_1_2_9_0.zip


対応といっても基本的にはTextTagをコピペして各種inputタグを作成し、
TLDに新しい属性を書きまくっただけです。

しばらく使ってみていますが、一応動いているので大丈夫な気がします。

ある程度大きいCSSを書いていると、変数とか継承とかが欲しくなります。

「CSS3で見た目の派手さもいいけどさ、もっとこの辺の文法を何とかしろよ。お前らもっと出来るはずだろ？」

と、いつも思っていたのですが、こういう物があることを最近知りました。
LESS ≪ The Dynamic Stylesheet language

CSS用のプリプロセッサ的な物です。
Javascriptで作られており、これを使用することでlessファイルをそのままブラウザで読み込むことが出来ます。
正に私の欲しい機能が全て入っていたので、今後CSSを書くときはこれを使おうと思います。



ところで、公式で配っているのは前述の通りJavascriptで動作するインタプリタのようなものです。
これですとJavascript OFFの環境ではCSSが効かなくなってしまいます。

今時Javascriptが動作しない環境を使ってるのは群馬県民くらいだとは思いますが、
昔からJavascript OFFの環境も考慮せよと刷り込まれてきた私には馴染むことが出来ません。

個人的にはlessファイルをcssファイルに変換してくれればそれでよいのです。


そこで、単純な変換プログラムが無いか探してみたのですが、
lesscというnode.jsで動作するものしか見つかりません。

仕方ないのでこれを使おうとしたのですが、使う為に一手間かかったのでメモっておきます。
(Windows上で動かす設定です)


まずこのlesscと依存ライブラリダウンロードします。
これはgithubからtarかzipで落とせばいいでしょう。
GitHubダウンロードページ

gitクライアントがある人はそれで落としてもいいと思います。

ファイルの中で使うのはbinとlibフォルダだけです。
他は消してしまって問題有りません。


次にこれを実行する環境を用意します。
環境といっても、node.jsをWindows上で動かすにはnode.exe一つあれば良いです。
ダウンロードページからOther release filesを開くと置いてあります。
Node.jsダウンロードページ

ダウンロードしたnode.exeを先ほどのbinフォルダに入れます。


ここまで用意すると、lesscを以下のように動かせます。

bin\node.exe bin\less 入力.less 出力.css

さらに使いやすくする為に、以下のようなバッチファイルも用意しました。
lessc.bat

@"%~dp0\bin\node.exe" "%~dp0\bin\lessc" %*

これを使用すると以下のように使えます

lessc 入力.less 出力.css

最終的には以下のようなフォルダ構成になります。

• lessc.bat
• bin
  • node.exe
  • lessc
• lib
  • less
    • tree
    • browser.js
    • 以下省略

このフォルダを環境変数PATHに追加しておくとさらに便利でしょう。
バッチファイルをもう少し変えてドラッグ & ドロップ出来るようにしても良いかもしれません。