iPhone (Mobile Safari) で textarea, input[type=text] の文字列を全選択する方法

Posted on: August 6th, 2014 by kyokutyo

textarea や input[type=text] に入ってる文字列を全選択する方法。 あんまりやったことないんだけど、PC ブラウザでは $target.select(); でいけるらしい。 そしてこの辺を読むと、Mobile Safari では select() 使えないから selectionSatrt, selectEnd を使えと書かれてた。 iPhoneのSafari(Mobile Safari)のselect()は、代わりにselectionStart, selectEndを使わなければいけない – yohtn でも実際やってみると動かない。理由は不明。。(シンプルなページで試してみたら動いた) さらに調べてみると setSelectionRange() というものがあるらしい。 Input.select – Web API Interfaces | MDN HTMLInputElement.setSelectionRange() – Web API Interfaces | MDN   $target.on(‘click’, function() { this.setSelectionRange(0, 9999); }); これでうまく全選択できた。今回は 9999 文字もないけど、、ちょっと改善。 $target.on(‘click’, function() { this.setSelectionRange(0, this.value.length); }); さらに文字列を変更されたくない場合は readonly 属性をつける。 $target.on(‘click’, function() { this.setSelectionRange(0, this.value.length); $(this).attr(‘readonly’, ‘readonly’); }) .on(‘blur’, function() { $(this).removeAttr(‘readonly’); }); ちなみに click ではなく focus 使いたくなるけど、 focus では動かない。 今回、確認用に作ったファイル select-test.html

Categories:JavaScript

View details »


RDS に接続許可する IP の追加方法

Posted on: August 6th, 2014 by kyokutyo

AWS Console で RDS を開く。 Security Groups を開く。 適当な Security Group を選び、 Connection Type を選択する。 CIDR/IP を選択すると IP が表示されるので それを下のフォームにコピペして [Authorize]。 おわり。

Categories:AWS

View details »


DjangoでDBにSQL実行する方法

Posted on: October 31st, 2013 by kyokutyo

DjangoでDBに対してSQL実行する方法。settings/xxxxx/xxxxx.pyにDBの接続情報などが書かれてる。 $ python ./manage.py dbshell –settings=settings.xxxxx.xxxxx < fugahoge.sql すぐ忘れる。 この辺見ればいろいろ書いてあるぽい。 django-admin.py と manage.py — Django 1.4 documentation

Categories:Django

View details »


プロダクトオーナーの言うことそのままコードに落とし込むのよくない

Posted on: October 29th, 2013 by kyokutyo

こんな話。 「商品ページに商品の色名を表示したいんだよねー」 「商品コードには2パターンあって、11桁と13桁」 「11桁の場合は後ろから2文字がカラーコード」 「13桁の場合は後ろから3文字目と4文字目がカラーコード」 カラーコードを取得するためにはじめ書いてたコードは以下 if (strlen($product_code) === 11) { $color_code = substr($product_code, -2); } else if (strlen($product_code) === 13) { $color_code = substr($product_code, -4, 2); } だけど 「11桁の場合は後ろから2文字がカラーコード」 「13桁の場合は後ろから3文字目と4文字目がカラーコード」 これよくよく考えると・・・ 「桁数に関係なく頭から10文字目、11文字目がカラーコード」 012345678** 012345678**12 ということで $color_code = substr($product_code, 9, 2); 分岐不要。 プロダクトオーナーの言葉をそのままにコードにして余計なことやってるケースけっこうありそうだなー。。

Categories:dev

View details »


Middlemanで作ったサイトをS3でホスティング

Posted on: October 26th, 2013 by kyokutyo

「これまでに夫婦で泊まった都道府県」というものを作った。 自分たち夫婦がこれまで行ったところの記録です。 Middlemanで作って、S3でホスティング。 Middlemanまわりのあれこれ LiveRoad機能 便利。デフォルトでactivateされててもいい気がする。 HTMLファイルでもCSSファイルでもJSファイルでも保存するとブラウザがリロードされる。 仕事のDjangoなサイトでもこの機能欲しい。 テンプレートエンジン テンプレートエンジンはSlim。最近hamlより人気ぽいので採用。 HTMLの閉じ忘れがないのはいい。記述量減る。まだあんまりわかってない。 Middlemanで使う場合はmiddleman-slimを使う。 Slimにも継承とかあるのかしら。Jinja2の方が柔軟に書けそうな気はする。 CSSプリプロセッサー SCSS。Sassより慣れてるという理由で。 Sassだとついついお尻に;つけて怒られるの頻発するので。。 MiddlemanでSCSS使いたい場合、設定は何もしなくていい。Middleman賢い。 source/stylesheets配下にhoge.scss作るとhoge.cssとして読める。 Compassもところどころ使った。 出力設定をcompressedにしておくとCSSがminifyされるのでbuild時にだけ適用。 config.rbで以下のように設定した。 configure :build do … compass_config do |config| config.output_style = :compressed end … end 色は_colors.scssで$white, $blueを決めて、あとは background: transparentize($white, 0.7); color: darken($blue, 20%); な感じでバリエーションつけた。 mix関数というものがあることを知ったので初めて使った。 color: mix($white, $blue, 50%); ホントは2色使おうと思ってたけどやめた。 色の管理しっかりやっておくとその辺楽ぽい。 CSSフレームワーク Yahoo!のPure使ってみたけどほとんど使いこなせてない。 Middlemanで使う場合はMiddleman::Pureを使う。 その他 Google Analytics使う場合は、Middleman Google Analyticsを使うと開発中はトラッキングコードがHTMLに吐かれないのでよい。 configure :build do … activate :google_analytics do |ga| ga.tracking_id = ‘UA-xxxxxx-1′ end … end configure :development do … activate :google_analytics do |ga| ga.tracking_id = false end … end その他もろもろGitHubに書いてます。これからのことなども。 S3まわりのあれこれ デプロイ方法 MiddlemanなサイトをS3でホスティングする場合はMiddleman Syncを使うといい。 activate :sync do |sync| … sync.after_build = true // or false … end とafter_buildをtrueにしとくと $ middleman build で静的ファイルの書き出しした際に、ついでにS3へのdeployまでやってくれる。 FTPとかいうレガシーデプロイしなくていい。 […]

Categories:AWSdevMiddlemanSCSSSlim

View details »


Slimでlink_toを使ってaタグを生成する時のtarget指定方法

Posted on: October 20th, 2013 by kyokutyo

RubyのテンプレートエンジンSlimでtarget=”_blank”属性付きのリンクを生成する方法。 Slimとは → Slim – A Fast, Lightweight Template Engine for Ruby 最近のRuby界隈ではhamlよりSlimの方が流行ってるぽいです。 Slim Templates – The McDev Blog ここにそれっぽいこと書いてありました。 == link_to “blog”, “http://blog.kyokutyo.com/” これは以下のようなHTMLが生成されます。 <a href=”http://blog.kyokutyo.com/”>blog</a> target属性を指定する場合は以下のように書きます。 == link_to “blog”, “http://blog.kyokutyo.com/”, :target => ‘_blank’ 生成されるHTMLは以下↓。 <a target=”_blank” href=”http://blog.kyokutyo.com/”>blog</a> ちなみに、 a href=”http://blog.kyokutyo.com/” target=”_blank” blog と書いても同じようなHTMLを得ることができます。(属性の記述順が変わるようです)

Categories:Slim

View details »


Amazon S3 for WordPressを導入

Posted on: October 12th, 2013 by kyokutyo

このブログに Amazon S3 for WordPressを導入したのでテスト。 画像のURLはhttp://blog-kyokutyo-com.s3.amazonaws.com/wp-content/2013-09-29-11.05.521.jpgとなってます。 AWSのコンソール画面でS3のbucketのアクセスマネジメントあたりで何度かこけました。 「Authenticated Users」にUpload/Delete権限を渡す必要があるもよう。 これまでにアップロードした画像はS3にコピーされるわけではないみたい。。 移行ツールとかないかしら。 これからやりたいこと 画像すべてS3に移動 WordPressをどこかのPaaSで メールをGoogle Appsに レンタルサーバ解約 結果、以下が利用サービスになる ムームードメイン Amazon Route53 PaaS(選定中) Pagoda Box or GAE or dotCloud or Heroku or AppFog … Amazon S3 Google Apps

Categories:WordPress

View details »


hg logでの表示件数を少なくする

Posted on: October 11th, 2013 by kyokutyo

不満 $ hg log した時って、これまでのログがずらーっと出てくるんですが、見たいのは直近の数件ということがほとんどです。 $ hg log -l 5 で表示件数を指定することはできますが、毎度オプション指定するのが面倒です。。 やったこと なので.hgrcにこんなalias書いてます。 log = log -l 5 ついでにglogも glog = glog -l 5 としてます。これで基本的に5件しか表示されないようになります。 これまでどおり $ hg log -l 10 と件数を指定することもできます。

Categories:Mercurial

View details »


agで前後の行も見たい

Posted on: October 9th, 2013 by kyokutyo

$ ag [keyword] [dir] -C 3 とやるとdir配下のkeywordを含む行の前後3行も含めて表示されます。 -Aや-Bで前だけ、後だけの指定も可能です。 $ ag –help でいろんなオプションが見れます。

Categories:dev

View details »


続・JavaScriptでシグマΣの計算

Posted on: October 8th, 2013 by kyokutyo

JavaScriptでシグマΣの計算 | KYOKUTYO NO BLOG. こちらのエントリーに対してこんなコメントもらったので。 @kyokutyo ES5には配列を二項演算で畳み込みを行うArray.prototype.reduceもあるのでその環境ではそれでsigmaを書いてもいいかもね。一般的にはfoldと呼ばれるけどjsとrubyではreduceという名前。 — 西山 雄也/NISHIYAMA Yuya (@nsyee) October 2, 2013 * Array.prototype.reduce – JavaScript | MDN fmfm. reduce使うとこんなかしら。 ついでにJavaScriptでも[first, first+1, first+2, ..., last]という配列を得るのに0..9やrange(0, 9)のような書き方あるのかと思ったらないぽい。↓こんなrange関数の実装もあるようだけど、今回はstep=1で固定だったので簡単にfor文で。。 Pythonのrange関数をJavaScriptで再帰を使って実装してみた – あと味

Categories:JavaScript

View details »