0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

再生数が多いもの上位5件をViewに表示したい。

Posted at

桃鈴ねねさんのファンサイトを勝手に作ってます。
別記事でアーカイブ一覧表示することには成功してますが、サイトの誘導的に、アーカイブページ開いたら、全部表示されるのはさぞ迷惑なので、ブログやYouTubeであるオススメ動画というものを作りたい。

テーブル構成的にオススメ度合いを判断するのは再生数くらいなものなので、再生数が多いものを何件か表示したい。

app/controllers/home_controller.rb
class HomeController < ApplicationController
  def index
    @archivetop = Archive.order(archiveviews: :desc).limit(14)
  end
end

結論から言えばこんな感じになりました。
orderメソッドで昇順、降順を選択でき、その条件に再生数のカラムであるarchiveviewsを選択しておきます。
さらにlimitで上位14件を表示します。

と、その前にこのメソッドがちゃんと効いているのか確認したい。

ターミナルで

rails c

を入力し、

Archive.order(archiveviews: :desc).limit(5)

とりあえず5件で。

=> #<ActiveRecord::Relation 
[#<Archive id: 34, archiveid: "YeUkeAq1Dqg", archivetitle: "【 #桃鈴ねね3D 】🍑桃鈴ねね3Dお披露目!🍑【ホロライブ/桃鈴ねね】", archiveviews: 966420, archivepostdate: "2021-04-18 12:07:56", archiveurl: "https://www.youtube.com/watch?v=YeUkeAq1Dqg", archiveimg: "http://img.youtube.com/vi/YeUkeAq1Dqg/hqdefault.jp...", created_at: "2021-06-08 00:00:00", updated_at: "2021-06-08 00:00:00">,
 #<Archive id: 93, archiveid: "VMLjEUYLSy0", archivetitle: "【 #桃鈴ねね新ビジュアル】NEW SUPERNENECHI【桃鈴ねね/ホロライブ】", archiveviews: 718431, archivepostdate: "2021-01-31 12:06:35", archiveurl: "https://www.youtube.com/watch?v=VMLjEUYLSy0", archiveimg: "http://img.youtube.com/vi/VMLjEUYLSy0/hqdefault.jp...", created_at: "2021-06-08 00:00:00", updated_at: "2021-06-08 00:00:00">, 
#<Archive id: 92, archiveid: "kKqcQADSoIM", archivetitle: "【歌ってみた】私、アイドル宣言【ホロライブ/桃鈴ねね(cover)】", archiveviews: 652017, archivepostdate: "2021-01-31 12:30:14", archiveurl: "https://www.youtube.com/watch?v=kKqcQADSoIM", archiveimg: "http://img.youtube.com/vi/kKqcQADSoIM/hqdefault.jp...", created_at: "2021-06-08 00:00:00", updated_at: "2021-06-08 00:00:00">,
 #<Archive id: 267, archiveid: "fJ7ueGLuXk8", archivetitle: "【初配信!】ホロライブ5期生、桃鈴ねねある🥟【#ほろふぁいぶ】", archiveviews: 548034, archivepostdate: "2020-08-13 13:10:39", archiveurl: "https://www.youtube.com/watch?v=fJ7ueGLuXk8", archiveimg: "http://img.youtube.com/vi/fJ7ueGLuXk8/hqdefault.jp...", created_at: "2021-06-08 00:00:00", updated_at: "2021-06-08 00:00:00">,
 #<Archive id: 220, archiveid: "aCAMZvLX1Gs", archivetitle: "【マリオカート8DX】ペーパー最強!【ホロライブ/桃鈴ねね】", archiveviews: 529678, archivepostdate: "2020-09-20 14:23:57", archiveurl: "https://www.youtube.com/watch?v=aCAMZvLX1Gs", archiveimg: "http://img.youtube.com/vi/aCAMZvLX1Gs/hqdefault.jp...", created_at: "2021-06-08 00:00:00", updated_at: "2021-06-08 00:00:00">]>

結果はこんな感じで、大丈夫そうですね。
というか今気がついたんだけど、私、アイドル宣言の歌ってみたが3番目に多い再生数になってましたね。
少し前までは初配信だったはず。
個人的にはすごい素敵な歌声なんで、嬉しいです。
どうでも良い話はこんなところで。

こういう具合でテーブルに格納した情報もメソッドを組み合わせて、インスタンス変数に入れることで、Viewに表示することも可能です。

あとは

app/views/home/index.html.erb
<h2 class="major">Archives</h2>
<h3>オススメ動画</h3>
  <div class="archive">
    <%= render partial: "archivetop" , collection: @archivetop %>
  </div>
<ul class="actions">
  <li><a href="#" class="button">その他のアーカイブはこちらから</a></li>
</ul>
app/views/home/_archivetop.html.erb
<div class = "archive_card">
  <%= image_tag (archivetop.archiveimg) , class: :music_img %>
  <p><%= archivetop.archivetitle %></p>
</div>

renderメソッド、collectionオプションを使用すれば、

スクリーンショット 2021-06-12 13.42.00.png

こんな感じで綺麗に纏まりました。

参考文献
https://qiita.com/Hal_mai/items/babb19560ace072c99f5

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?