Google Calendar Expanderを書き直しました

Googleカレンダー用のGreasemonkey/Tampermonkeyである、Google Calendar Expanderを更新しました。

左端の日(自分の場合は月曜日、設定によっては日曜日)の予定をポップアップ表示させた時に、ポップアップが左にはみ出してしまう問題の対策のため、普段隠しているミニカレンダーやカレンダー選択の欄を再表示できるように左下にボタンを付けました。
だいぶストレスが減りました...。

最新版はGistからどうぞ。

Google CodeからGithubへ移行

2016年1月のGoogle Codeの閉鎖に備えて、Google Codeに載せていたJavaScript・CSSのファイルをGitHubへ移行しました。

内部的に他のGoogle Codeのライブラリを使っていたり参考サイトとして記載していたGoogle Mapper V3については、その部分も修正し、リンク先の移転等もきれいに直しました。

また、游ゴシックで小さな文字が見づらくなっていたTodo.phpについては、ついでにstyleも微修正して、GitHubに移行しました。

東京通勤道中のAdSenseをレスポンシブにしてみた

Google AdSenseにレスポンシブなサイズがあると聞き、試しに+東京+通勤+道中+の広告をレスポンシブにしてみました。PCで見ると横長でちょうどいいんですが、幅を狭めたら正方形の大きな広告になり、コンテンツがファーストビューに入らないかも…。

AdSenseをいじったのは久しぶりですが、コードもだいぶかわってたんですねー。

PHP-Manual.cssを更新しました

なんとなく、PHP-Manual.cssを更新してみました。主に見た目の変更で、その中でも、グレー基調だったのを緑主体に変えたことが中心です。(安らぎを求めるなんて、疲れてるんでしょうか。)グラデーションもやめて、フラットデザインっぽくなって…ますか?

動作サンプルは、こちらのPHP マニュアルです。ちなみに、このマニュアルは毎週最新化されています。

そういえば、本家のPHPサイトが、かなり大きくデザイン変わりましたね。良くなったと思います。

Google search date limiterが検索BOXと重なって機能しなくなったので修正

Google Bar絡みのレイアウト変更により、Google search date limiterを使うと検索ボタンが検索BOXと重なってしまい、その結果日付による絞り込みが機能しなくなっていたので修正しました。修正後のバージョンは0.4.5です。

Updateするには、下記のUserscripts.orgのページからインストールしてください。

Google search date limiter for Greasemonkey

重なっているのは気づいていたのですが、機能としては問題ないと思っていたのですが、ファルコンさんの指摘により機能していないことに気づきました。(ありがとうございます!)

もしかしたら検索結果を最初に表示した時と、検索結果から再検索した時で、機能したりしなかったりしていたのかもしれません。
Googleの仕様として、最初に表示した時には検索BOXのmax-widthを上書きするようなscriptが走るようなので。

今回の変更の難点は、Google Barから下に降りてきたGoogleアカウントの表示とぶつかってしまい、一瞬重複して表示されたりGoogleアカウントが一部しか表示されなくなることです。
プルダウンを検索BOXの左下に持ってくる案とどちらが良いか迷ったのですが、従来のUIはを維持する方が分かりやすいかと思ってこういう形にしました。

 

ところでQR This!をアドオン化できたらいいなと思うのですが、どうするのが楽なんでしょうね。(PCで見ているページをケータイですぐ見たい時に重宝するんですよね。)探せばそういうアドオンあるような気もしますが…。

Pryn 1.0、デビュー。

長い雌伏のバージョン0.2.xの時期を経て、Pryn 1.0をリリースしました。

PrynはJavaScriptとCSSのファイルを1つずつ読み込むだけでWebサイトのユーザービリティを向上させる、つまり「おもてなし」度を上げるツールです。

内容的にはJavaScriptの方はクロスブラウザに特にフォームまわりの使い心地を楽に良くすることを中心に書かれています。それに対してCSSの方は学んできたTipsの集積地という感じです。

最初にこれを作った頃は、JavaScriptのフレームワークはまだPrototype.jsが一番手で、それに対してjQueryがカウンターテーゼとして台頭してきたという頃でした。他にもDojoやMootoolsがコアなファンに後押しされて、JavaScriptライブラリ群雄割拠という感じでした。
そんな状況で、どのフレームワーク/ライブラリにも依存しない、かつどのフレームワーク/ライブラリとも併用できるようなライブラリが欲しくなり、作ったのがこのPryn.js & cssです。
当初はクロスブラウザなイベントリスナーの追加やclass属性の追加・削除、それにいくつかのフォーム部品等のおもてなし向上とYUI2 CSSのインポートとシンプルな内容でしたが、老舗の鰻屋のタレのように、じっくり時間をかけてじわじわ知り得た知識や経験を足していき、旨みを凝縮させました。(忘れないようにメモがわりにしつつ、かつ、実験場にしてきたとも言います。)

なにはともあれ、Pryn.js & css、可愛がってやってください。

JavaScriptのツールをいろいろUpdate(主に微修正)

JavaScriptのツールの細かい点をいろいろ直しました。

変更点は下記のとおりです。ほとんど内部的な修正というかソースを整えただけのものが多いです。動きや表示に影響があるものは太字にしました。

 

GAddress Finder

  • ver. 0.1.2
  • セミコロンを補完した

 

JSONDecoder.js

  • ver. 0.1.2
  • セミコロンを補完した

 

PHP-Manual.css

  • ver. 0.1.4
  • フォントを変更Pryn.cssの成果を取り込んだ)
  • 角丸のFirefoxとWebkitの独自実装形式を削除

 

Universal Colors

  • ver. 0.1.1
  • セミコロンを補完した

 

Yahho Calendar

  • ver. 0.4.6
  • カレンダー表示中にESCキーを押されたら、カレンダーを消すようにした
  • ちょっとリファクタリング

 

Yahho Sticky Footer

  • ver. 0.1.3a
  • bodyの左右のmarginを指定しない(YUIでの指定を上書きしない)ようにした

 

Yahho Suggest

  • ver. 0.1.1a
  • YUIのバージョンは2.x系の最新を使うようにした

 

すっきり。

余談ですが、先日たまたま一休.comを見たら、Yahho Calendarをカスタマイズされたものが使われててびっくりしました。嬉しいやら恥ずかしいやら。オモハユイというやつでしょうか。

jQuery UIの各テーマの色が人目で分かる便利ツール

jQueryのサブプロジェクトであるjQuery UIは、豊富なテーマとDatepicker等のウィジェットが用意されていて、なかなか便利です。

しかしウィジェットに比べて、class属性の指定だけで簡単にサイトを彩ることが出来て便利なThe jQuery UI CSS Frameworkの存在が意外と知られていない気がします。
そしてその原因は、jQuery UI ThemeRollerで簡単に見た目を確認できる各ウィジェットに比べて、その効果がすぐに分かるページが用意されていないからではないでしょうか。

そこで、各テーマを適用した時にそれぞれのCSSクラスがどんな背景やフォントになるかをひと目で確認できるツール、名付けてThe Colors Viewer for jQuery UI CSS Frameworkを作りました。

これがあれば、着せ替え感覚で気軽にテーマを選んだり、classを変更したりできると思います。ぜひご活用ください!

テキストボックスに背景色を付けても枠線のスタイルが変わらないようにするCSSを公開した

Windows XPのデフォルトのテキストボックスのスタイルを復元する – XP Textbox Styles.css [ゼロと無限の間に]

HTMLのフォームのテキストボックスは、背景色を付けるとなぜか枠線のスタイルまで変わってしまう。そこで、テキストボックスに背景色等を付けても枠線のスタイルが変わらないようにするCSSを書いてみた。

ただしWindows XP限定。VistaやWindows 7の場合にはまたスタイルが違う。一番見慣れたXPに合わせてみた。Macは知らない。