よくある☆による評価のコードです。 Add/Deleteボタンを使いましたが、イベントをフックする方法が色々あると思います。 unshift, shift, push and popを使ってfontawesomeのClassを書き換えてます。 in View Recommended! <button class="btn btn-warning btn-sm" ng-click="recommendDelete()"><i class="fa fa-minus"></i></button>
Selectの最初のオプションが空欄になってしまったりしてハマりましたが、ポイントはng-changeイベントでSelectの初期値を設定してやることです。 <label class="photoCategory" for="breakfirst"> <input id="breakfirst" type="radio" name="category" ng-model="category" value="breakfirst" ng-change="categoryType=selections.breakfirst[1]"> Breakfirst </label>
忘れないようにメモ。下記をhead内に入れることでモバイルデバイスで表示が固定される。 Text inputに限った話ではないみたいだけど。 AngularJSではapp/index.htmlに記述ですね。 # app/index.html <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1"> 個人的にはResponsiveでは必須だと思うんだけどな 参考 h</meta>…
前のエントリでメニューの高速化をやりましたが、周知の事実ですが、一応。 mobile safariにはタップの300msの遅延があります。これをFixをするにはfastclickを入れます。 Yeomanを使っていればbowerで一発。 $ bower install fastclick --save あとは適当な…
Responsiveで出てくるハンバーガーメニューの動きです。 これ微妙に遅くてもっさり感があるので、app/styles/main.scssで上書きした。(main.cssでも同じ) # vi app/styles/main.scss // Speed up nav dropdown in mobile .collapsing { position: relative;…
Facebook Open Graph APIでリンク付きの投稿をInstagramの写真ですると、下記のようにエラーを吐きました。 (#1500) fbcdn.net urls are not allowed. おそらくFacebookがInstagram購入後にInstagramの写真をFacebook cdnにのせるようになって、これがFacebo…
どうやらSingle page applicationのときに起きる現象のようですが、Bootstrap3を使っていてwindowサイズを小さくするとメニューがハンバーガーになります。ここでリンクをクリックするとリンク先でハンバーガーのnavbarが閉じなくなります。解決方法は、下記…
下記の写真(右上!)のようにモバイルで見たときに微妙に余白ができてズレる現象が起きました。 デバッグツールで見てみると.rowのmarginが影響しているようです。 解決方法は、 .rowFullWidth { margin-left: 0 !important; margin-right: 0 !important; }…
下記のようなViewがあって、 <div ng-show="showPicture"> picture here! </div> そのオンオフをFactory側で行うときは、$scopeのスコープ外なので$apply()をしないと反映されない。 Creator.initialize($scope.loginStatus.userID, function(){ $scope.showPicture = !$scope.showPicture; $s…
⌘ + Shift + M で右上の切り替えメニュー表示後、上下の矢印キーで選択、エンター。
grunt build後フォント読み込み時にエラーが出るのでフォントディレクトリに入れてみました。 1. fontawesomeのインストール by bower $ bower install font-awesome --save 2. fontsをbowerディレクトリからコピー $ mkdir angular/app/fonts $ cp bower_co…
ハマり所です。。 ng-repeat内のng-modelはスコープが違うのでうまく動きません。 解決方法は下記のようにキーを渡してスコープ内でOverwriteされないようにする。 controller $scope.cover = {selected: 0}; view <input type="radio" id="cover{{$index}}" name="cover" ng-model="cover.selected" ng-value="$index"> 参考:https://github.com/angular/angula…
MojoliciousのJSON出力で文字化けのyusukebeさんのコメントにもあるようにMojoliciousは内部的にutf8フラグを落としているようです。 毎回decode_utf8をするのは面倒なのでTengのスキーマ宣言クラスでinflateしてしまいましょう。 package MyApp::DB::Schema…
AngularJSでモバイルからのアクセスを検知してモバイル用のページに振り分ける方法のエントリでリダイレクトを使用しましたが、これだと戻るボタンで戻ると再度リダイレクトされて戻れません。戻るを機能させるためには、下記のようにします。 $location.pat…
Leafletはフリーで使える地図ライブラリです。Open Street Mapを差し込むことでgoogle mapsではない選択肢になります。(Google Maps APIには4000リクエスト/Dayのリミットありなので。。) これをタッチデバイスで使用するとスクロールダウン時にマップの位…
Instagram APIでユーザフィードはデフォルトで20しか返ってきません。Countパラメータで変更可能ですが、自分が確認したところ、30ぐらいが上限のようです。なのでユーザが見ているときに、"もっと見る"のようなボタンを容易して次を見させるのがよさそう…
基本的にResponsiveで対応しますが、根本的にページの表示自体をモバイル用にしたい時があります。 サーバ側でHeader等を調べてページを振り分ける方法もあると思いますが、基本的にAPIを返すというのをサーバ側の処理にしたいし、Single Page Application的…
Masonryとはレンガのように要素を並べるJQueryプラグインです。 NHKスタジオパークで使われてるように大きさによって動的に要素を並べてくれます。 参考:なんだこれ!!「NHKスタジオパーク」のレスポンシブ・ウェブデザインが凄まじくレスポンシブ!! こ…
元ネタはA Scientific Guide to Writing Great Tweets: How To Get More Clicks, Retweets and Reach エンジニアですが、マーケティングを勉強したいと思ってます。ブログを流し読みしているだけだと身になってるか疑問なので、まとめていきたいと思います。…
ブラウザによって挙動が違うらしいのでツールを使うのがBetter。 http://www.colorzilla.com/gradient-editor/
Instagram APIが緯度経度しか返さなくて、エポックタイムじゃ現地時間がわからない。。 ということで、タイムゾーン(他の情報も)を取得してみようと思います。 調べたら、Geonames.orgという団体がフリーで提供しているようです。 これを使います。 1. ユ…
外部ライブラリ等ではhtmlタグを作った後にfunctionをアプライするときがあります。 例えば、テーブルを作成後にテーブル整形するJQuery functionを適用する場合です。 AngularJSでは、ng-repeat終了のイベントは存在しないのでDirectiveを使うことになりま…
MongoHQの通信はセキュアでありません。なのでhttpsのAPIを使って保存するか、もしくはアプリケーション側で暗号化して保存する方法があると思います。今回は後者でコードを書いてみました。 package Util; use Moo; use JSON::XS; use Crypt::CBC; use IO::…
http://www.mongohq.com/でサインアップします。 "Start with an Elastic Deployment"でちゃんとSandboxを選びましょう。 512Mまではフリーです:) 下記のようにデフォルで有料プラン。。 まず、MongoHQの管理パネルでユーザを作ります。直感的にわかると思い…
AnsibleをVM経由でプライベートRepoをgit cloneするのにはSSH fowardingを使う模様。 今回はAnsible playbookをPackerのAnsible provisionerで使いたい。けど、ご存知のようにPackerのAnsible provisionerはansible-localでAnsibleホストとは独立で、SSH fow…
http://stackoverflow.com/questions/16287559/mysql-adding-user-for-remote-access はまった。%以外にlocalhostにも設定が必要とのこと。 $ /usr/bin/mysql -u root -p$MYSQL_ROOT_PASS -e"grant all privileges on db.* to user@'%' identified by '$MYSQ…
https://zapier.com/blog/feedly-interview-edwin-khodabakchian/?utm_campaign=How%20Fast-Growing%20Feedly%20Keeps%20Focus%20on%20User%20Feedback%2C%20Core%20Features&utm_medium=email&utm_source=blogblogposts Google Readerからシェアを獲得したF…
これだとダウンロードできるんだけど、a.click()の下に$location.hrefとか置けないんだよね:( promise.then(function(res) { console.log(res.url); var a = document.createElement('a'); a.href = res.url; a.download = "a.pdf"; a.click(); }) ちなみに…
ssh -p <port> root@xxx.xxx.xxx.xxxでは入れるけど、作ったユーザでユーザログイン(pubkey認証)できなかった。かなりハマったけど、dockerにsyslogがインストールされてなくて何も/var/log以下に吐かないのでここをまず修正。 $ yum syslog -y $ /etc/init.d/rsys</port>…
デフォルトだとansible-playbook -i 'localhost:2222,' hoge.ymlしたときに$HOME/.ssh/known_hostsにホストエントリが追加されます。yesと入力すれば次回からは問題ないんですが、バッチで処理したいときはyesと打ち込めないのでこれを回避したいと思いまし…