Tag Archive Laravel

atom始めました。(ex-modeがちゃんと動く方法あります)

なかしーです。
今日もWeb関連です。
これまでソースコードはVimで普通にガリガリ書いてましたが、さすがにしんどくなって来たのと、AtomなるGithub謹製のIDEっぽいのが結構使えると聞いて導入してみました。
あんまり優し書き方はしないですが、色々書いておきます。
1,インストール
MSの.Netが強要されます。
インストールはスムーズに完了しますよ。
デフォルトでの起動時間は10数秒ってとこでしょうか。ただのEditorとして使うには向いてません。
 
2,パッケージ、テーマのインストール
入れたのは、以下。

  • color-picker(#FFFFFFとか作るやつ)
  • compare-files(Diffとして)
  • ex-mode(後述)
  • keyboard-localization(後述)
  • laravel(Laravelスニペット)
  • laravel-theme
  • minimap(ソースの全体像を片側に表示してくれるやつ)
  • remote-edit(ちょっとしたリモートホスト上のファイルのイジイジ用として使うんじゃないかな。)
  • remote-sync(開発サーバー上のソースをまるごとPC上に持ってきて作業してます)
  • vim-mode(後述)

 
3,ちょこちょこ設定、Tipsなど
思い出せる部分だけでも書いときます。

  • エディタからTree View(所謂左側に出てくるプロジェクトとかのファイルを表示するアレ)に移動するにはCtrl+0(ゼロ)で切替ができます。そこでもVim風に操作できるっぽい。
  • remote-editは、パスワードだとうまく動かなかった気がする。SSH Keyでやったらちゃんと動いた。
  • remote-syncのignoreアレイで、最初フルパスで指定したからちゃんと動かなかったけど、ターゲット以下のパスとして書いたら動いた。そりゃそうか。ちなみにLaravelの場合、Vendor以下まで持ってこようとすると5千ファイル以上あるからそれだけで大変です。外しておきましょう。
  • remote-syncのDiffコマンドって、コマンドプロンプトから呼び出せるコマンドの様です。うーん。なんかダサい気がする。ちゃんと使ってません。
  • remote-syncは、セーブ後自動UploadオプションをOnにしておけば速攻でUpしてくれるです。(最初のサーバーとのセッション確立時は時間かかりますが。)
  • Vim-modeは、デフォルトでは:wが使えません。なので、人によっては:でコマンドパレット呼び出しにして、wでSaveをキーバインドに仕込んでおくという方法をやるひとも居るようです。ただ、折角ex-modeなるパッケージがあったのでそれを使おうとしたんですが、なんでか:が普通に動かない。色々試してたらShift+:で動いた。でも、それだと普通のVim使うときに変な癖がついちゃうので避けたい。色々調べてたら、USキーボードじゃない人で起きる話のようです。(普通にテキスト入力するときは全く問題ないんですが、コマンド入力待ちの時はどうもUSキーボード状態のようです。Ctrl+.で確認してるとよくわかります。)なので、さっきのGithubに書いてあったKeyboard-localizationを入れるわけです。デフォルト選択肢で日本語キーボードが無かったので、ジェネレータで日本語用をサクサク作って反映して、無事に:が動きましたとさ。開発者にも投げたのでその内デフォルトに組み込まれるかも。初Githubナリ。(ちなみに、今今自分で作る人は「.」の箇所は含めないほうが良さそう。なんかDeleteになってしまったので抜いても問題なかったです。)
  • ex-modeでも、:q!はちゃんと効かない。あと置換(s/hoge/fuga/g)みたいなのは動かなそう。エラーが出る。
  • 一般的なタブブラウザ系で使えるショートカット(タブ変更やタブ閉じ)は使えるので楽。

 
4,その内やりたい事

  • 開発サーバー->検証サーバー->本番サーバーでの連携にGitを使ってみたい。まだそこまで回ってない。
  • 背景が黒すぎて非選択タブとかの文字が見づらいから変えたい。
  • Tree viewにおいて、キー入力でファイルをカンタンに辿れものか。WindowsのExplorerでも出来るんだから、ありそうだけどまだ知らない。
  • (期待)エクリプスでJava書く時みたいに、クラスとかメソッドとか色々保管してくれればいいのになー。そしたら重くなっちゃうのかなー。

 
というわけで、今のところまぁまぁ素敵かもです。
みなさんのお役に立ちますように。。
 
 
 
 

slickを使う際に参考にしたサイト3つ。(最後の超大事)

こんにちは、なかしーです。
WEB関連続きです。
Slick使ってますか?使ってますよね?オシャレだし、きっとみんなつかってます。
(Twitterのカルーセルでもいいんですが、応用効かせられるかどうか、未熟な私にはわからず使わない。)
ということで、Slick使うときに超お役立ちのサイトを紹介。
その1、本家。そりゃないか?
その2、emiac-worksさんの記事
こちらは設定がリストしてあって便利でした。助かりました。
 
その3、おなじみStack Overflowの投稿
矢印がちゃんと出てこないよー!って時に助かった気がします。(多分。若干もう忘れた。)
英語ですが、まぁこのくらいなら読むしか無いっすね。
ちなみに、矢印の色とか変えちゃいたい場合は以下サンプルCSSとかで如何かしら。

/*       Slickの矢印の色変更   */
.slick-prev:before, .slick-next:before {
    color:#337AB7 !important;
}

 
 
 
ではでは。
 
 
 
 
 

whereHasを使う歳に役立ったサイト

こんにちは、なかしーです。
今日もLaravel関連です。
Eloquentはとても便利ですよね。
この前、とある処理でmorph先のモデルをひとつ以上持っているモデルだけ引っ張ってこいよ!という処理を考えていた時に、こちらのページにお世話になりました。(https://teratail.com/questions/5416)
こちらのオブジェクト側(仮にHogeとする)は以下の関係を持っていて、このtop_photos()を一つでも持っているHogeを連れて来い!という事がやりたかったわけです。
ということで、そういうスコープを以下のように作りました。

public function scopeHasphoto( $query )
{
return $query->with('top_photos')->whereHas('top_photos', function($q)
{
$q->where('top_imageables.top_imageable_type', '=', 'Hoge');
});
}

パフォーマンスがどうかってのはあんまりまだ考えれて無いですが、とりあえず動いたので良しとする。

AJAXで追加コンテンツを読み込んだ時にmasonryとimagesLoadedがうまく動かない場合

こんにちは、なかしーです。
Laravelネタに関連して、masonryで躓いた時の対応についてです。
ピンタレスト風にコンテンツをぬるぬる読み込みたい時もあると思います。ありますよ。あります。
そこでmasonryなぞを使ってみたものの、あんまりAJAXとかJSが得意でない為に、ちゃんと動かず困りました。
それで、こちらへんを参考にしてやっとこさ動きました。JSなんてどうせ見えちゃうからさらしちゃおう。
 
サンプル:

<script type="text/javascript">
var page = 1;
$(document).ready(function() {
    $container = $("#item_list");
    $container.imagesLoaded(function() {
      $container.masonry({
        itemSelector: '.thumb',
        columnWidth: '.thumb',
      });
    });
        $(window).scroll(function(){
                if  ($(window).scrollTop() + 100 >= $(document).height() - $(window).height()){
			var obj = $(this);
		        if (!obj.data("loading")) {
		            obj.data("loading", true);
		            $("#prefooter").append("<p>Loading...</p>");
		            setTimeout(function(){
		            $.ajax({
		               type: 'GET',
		               url: "http://hogehoge/?order=desc&page=" + (++page),
		               dataType: 'html',
		               success: function(data) {
				if (data != ''){
				  $container.imagesLoaded(function(){
 					var el = $(data);
					el.css('display','none');
					$container.append(el);
					$container.imagesLoaded(function(){
					  el.css('display','inline');
					  $container.masonry('appended', el, true);
					});
				  });
				}
		               },
		               error:function() {
		                   alert('問題がありました。');
		               }
		            });
				setTimeout(function(){
					 obj.data("loading", false);
				}, 1000);
			 	$("#prefooter p:last").remove();
		            }, 500);
		        }
                }
        });
    // リロードしたときにページの先頭を表示する
    $('html,body').animate({ scrollTop: 0 }, '1');
});
</script>

 
 
誰かのお役に立てば何よりです。
 
 
では。
 
 

Laravel:Eloquentのモデルの値(Attributes)をViewでズラッと表示したい時

なかしーです
最近、PHPのLaravelというフレームワークを使ったりしてます。
なので、その関連で自分が躓いた所で、解決方法を英語で発見したものとかを紹介しておこうかなーとか思いました。
今回は、Eloquentの中身をつらつら一覧したいときなんかに、ちまちま書くのめんどくせーってなった場合の1つの方法です。
http://laravel.io/forum/02-16-2014-iterate-through-model-attributes
こちらの、下のほうにちょろっと書いてあるgetAttributes()をつかって、@foreachすればまぁそれなりにシンプルにいけます。
 
サンプル:

 @if (! empty($user))
@foreach( (array) $user->getAttributes() as $key => $value)
<tbody>
<tr>
<th scope="row">{{{$key}}}
</th>
<td>{{{$value}}}</td>
</tr>
</tbody>
@endforeach
@endif

 
みたいな。
 
 
では。
 
http://laravel.io/forum/02-16-2014-iterate-through-model-attributes

12