Googleカレンダー用のGreasemonkey/Tampermonkeyである、Google Calendar Expanderを更新しました。
左端の日(自分の場合は月曜日、設定によっては日曜日)の予定をポップアップ表示させた時に、ポップアップが左にはみ出してしまう問題の対策のため、普段隠しているミニカレンダーやカレンダー選択の欄を再表示できるように左下にボタンを付けました。
だいぶストレスが減りました...。
最新版はGistからどうぞ。
フリーでオープンソースなJavaScriptやPHPのツールや、サービスの更新記録など
Googleカレンダー用のGreasemonkey/Tampermonkeyである、Google Calendar Expanderを更新しました。
左端の日(自分の場合は月曜日、設定によっては日曜日)の予定をポップアップ表示させた時に、ポップアップが左にはみ出してしまう問題の対策のため、普段隠しているミニカレンダーやカレンダー選択の欄を再表示できるように左下にボタンを付けました。
だいぶストレスが減りました...。
最新版はGistからどうぞ。
2016年1月のGoogle Codeの閉鎖に備えて、Google Codeに載せていたJavaScript・CSSのファイルをGitHubへ移行しました。
内部的に他のGoogle Codeのライブラリを使っていたり参考サイトとして記載していたGoogle Mapper V3については、その部分も修正し、リンク先の移転等もきれいに直しました。
また、游ゴシックで小さな文字が見づらくなっていたTodo.phpについては、ついでにstyleも微修正して、GitHubに移行しました。
Google AdSenseにレスポンシブなサイズがあると聞き、試しに+東京+通勤+道中+の広告をレスポンシブにしてみました。PCで見ると横長でちょうどいいんですが、幅を狭めたら正方形の大きな広告になり、コンテンツがファーストビューに入らないかも…。
AdSenseをいじったのは久しぶりですが、コードもだいぶかわってたんですねー。
なんとなく、PHP-Manual.cssを更新してみました。主に見た目の変更で、その中でも、グレー基調だったのを緑主体に変えたことが中心です。(安らぎを求めるなんて、疲れてるんでしょうか。)グラデーションもやめて、フラットデザインっぽくなって…ますか?
動作サンプルは、こちらのPHP マニュアルです。ちなみに、このマニュアルは毎週最新化されています。
そういえば、本家のPHPサイトが、かなり大きくデザイン変わりましたね。良くなったと思います。
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で見ているページをケータイですぐ見たい時に重宝するんですよね。)探せばそういうアドオンあるような気もしますが…。
長い雌伏のバージョン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のツールの細かい点をいろいろ直しました。
変更点は下記のとおりです。ほとんど内部的な修正というかソースを整えただけのものが多いです。動きや表示に影響があるものは太字にしました。
すっきり。
余談ですが、先日たまたま一休.comを見たら、Yahho Calendarをカスタマイズされたものが使われててびっくりしました。嬉しいやら恥ずかしいやら。オモハユイというやつでしょうか。
jQueryのサブプロジェクトであるjQuery UIは、豊富なテーマとDatepicker等のウィジェットが用意されていて、なかなか便利です。
しかしウィジェットに比べて、class属性の指定だけで簡単にサイトを彩ることが出来て便利なThe jQuery UI CSS Frameworkの存在が意外と知られていない気がします。
そしてその原因は、jQuery UI ThemeRollerで簡単に見た目を確認できる各ウィジェットに比べて、その効果がすぐに分かるページが用意されていないからではないでしょうか。
そこで、各テーマを適用した時にそれぞれのCSSクラスがどんな背景やフォントになるかをひと目で確認できるツール、名付けてThe Colors Viewer for jQuery UI CSS Frameworkを作りました。
これがあれば、着せ替え感覚で気軽にテーマを選んだり、classを変更したりできると思います。ぜひご活用ください!
アメリカのAmazon.comの新発売情報をRSS購読できるサービスのNew Arrivals RSS Feed Generator(※)のヘッダーのロゴ部分を、Google Web Fontsを使って手書き風の文字にしてみました。
(※最新作をRSSでお届け!のUS版ですね。)
Google Web Fonts、なかなかおもしろいですね。あとはこれの日本語フォントが出てくればいいのですが...サイズが大きいからなかなか難しいのでしょうね。
—
Windows XPのデフォルトのテキストボックスのスタイルを復元する – XP Textbox Styles.css [ゼロと無限の間に]
—
HTMLのフォームのテキストボックスは、背景色を付けるとなぜか枠線のスタイルまで変わってしまう。そこで、テキストボックスに背景色等を付けても枠線のスタイルが変わらないようにするCSSを書いてみた。
ただしWindows XP限定。VistaやWindows 7の場合にはまたスタイルが違う。一番見慣れたXPに合わせてみた。Macは知らない。