How do I optimize my code so that I don't have to call the entire array every time in views from an API in my controller?

user_18093646 0
Viewed 71

I'm making a sports app to learn Rails. I've figured out how to call the API and display it how I want, but right now, I'm putting the full array in my view every time I want to call any key.

For instance, I want to make a page that shows the starting line-ups for teams using the JSON from the API, and right now I have it displaying, but the code within the view itself is pretty big and ugly.

My view:

<%= stylesheet_link_tag 'lineups' %>

<div id="lineupcontainter">
    <div id= "team1lineup">
    
        <div id= "player1"><%= @schedule["data"][0]["lineup"]["data"][0]["player_name"] %>
            <div id= "playerphotos"> <%= image_tag @schedule["data"][0]["lineup"]["data"][0]["player"]["data"]["image_path"] %> </div> </div>
            
        <div id= "player1"><%= @schedule["data"][0]["lineup"]["data"][1]["player_name"] %> 
            <div id= "playerphotos"> <%= image_tag @schedule["data"][0]["lineup"]["data"][1]["player"]["data"]["image_path"] %> </div> </div>

        <div id= "player1"><%= @schedule["data"][0]["lineup"]["data"][2]["player_name"] %>
            <div id= "playerphotos"> <%= image_tag @schedule["data"][0]["lineup"]["data"][2]["player"]["data"]["image_path"] %> </div> </div>
            
        <div id= "player1"><%= @schedule["data"][0]["lineup"]["data"][3]["player_name"] %>
            <div id= "playerphotos"> <%= image_tag @schedule["data"][0]["lineup"]["data"][3]["player"]["data"]["image_path"] %> </div> </div>
            
        <div id= "player1"><%= @schedule["data"][0]["lineup"]["data"][4]["player_name"] %>
            <div id= "playerphotos"> <%= image_tag @schedule["data"][0]["lineup"]["data"][4]["player"]["data"]["image_path"] %> </div> </div>

        <div id= "player1"><%= @schedule["data"][0]["lineup"]["data"][5]["player_name"] %>
            <div id= "playerphotos"> <%= image_tag @schedule["data"][0]["lineup"]["data"][5]["player"]["data"]["image_path"] %> </div> </div>
            
        <div id= "player1"><%= @schedule["data"][0]["lineup"]["data"][6]["player_name"] %>
            <div id= "playerphotos"> <%= image_tag @schedule["data"][0]["lineup"]["data"][6]["player"]["data"]["image_path"] %> </div> </div>
            
        <div id= "player1"><%= @schedule["data"][0]["lineup"]["data"][7]["player_name"] %>
            <div id= "playerphotos"> <%= image_tag @schedule["data"][0]["lineup"]["data"][7]["player"]["data"]["image_path"] %> </div> </div>

        <div id= "player1"><%= @schedule["data"][0]["lineup"]["data"][8]["player_name"] %>
            <div id= "playerphotos"> <%= image_tag @schedule["data"][0]["lineup"]["data"][8]["player"]["data"]["image_path"] %> </div> </div>
    </div>

My controller

def game1
    @response = RestClient.get "https://soccer.sportmonks.com/api/v2.0/fixtures/between/2022-02-01/2022-02-04/62?api_token=____&include=lineup.player,"
    {content_type: :json, accept: :json, "user_key": "____"}
    
    @schedule = JSON.parse(@response) 
    render JSON: @schedule
end

What can I do to create something where I don't have to call the entire array every time I want to put something in views?

api ruby-on-rails ruby
2 Answers

Something like this should work:

<div id="lineupcontainter">
<div id= "team1lineup">
  <% @schedule["data"][0]["lineup"]["data"].each do |cur_schedule|%>
    <div id= "player1">
      <%= cur_schedule["player_name"] %>
      <div id= "playerphotos"> 
        <%= image_tag cur_schedule.dig("player", "data", "image_path") %>
      </div> 
    </div> 
  <% end %>
</div>

Also, your controller has some redundant logic. You are parsing a JSON string and turning it into a ruby hash, then you take that hash and render it as a JSON string. You should be able to render the json directly.

user_41909330

If you want to reduce the lines of code in your template, you can iterate over the instance variable in the .erb file. This bit of code should work if you put it in your erb file:

<div id="lineupcontainter">
  <div id="team1lineup">

    <!-- iterating on team 1 -->
    <%= @schedule["data"][0]["lineup"]["data"].map.with_index do |data, index| %>

      <!-- index will increase by 1 each iteration, starts at 0 -->
      <div id="player1"><%= data[index]["player_name"] %>
        <div id="playerphotos"> <%= image_tag data[index]["player"]["data"]["image_path"] %></div>
      </div>

    <% end %>
  </div>
</div>

I would recommend parsing that data in your controller before sending it to the template, something like this:

def game1
  @response = RestClient.get "https://soccer.sportmonks.com/api/v2.0/fixtures/between/2022-02-01/2022-02-04/62?api_token=____&include=lineup.player,"
  {content_type: :json, accept: :json, "user_key": "____"}

  schedule = JSON.parse(@response)
  # in the ERB, replace schedule["data"][0]["lineup"]["data"] with @lineup_data 
  @lineup_data = schedule["data"][0]["lineup"]["data"]

  render JSON: @lineup_data
end

Another note: you do not need to call render json: @schedule in your controller. That will call .to_json on the instance variable and it's unnecessary when rendering data in an ERB template. The Rails MVC design allows the template to access instance variables defined in controllers. See section 2.2.8 Rendering JSON for documentation.

def game1
  @response = RestClient.get "https://soccer.sportmonks.com/api/v2.0/fixtures/between/2022-02-01/2022-02-04/62?api_token=____&include=lineup.player,"
  {content_type: :json, accept: :json, "user_key": "____"}

  schedule = JSON.parse(@response)
  @lineup_data = schedule["data"][0]["lineup"]["data"]
end
user_165133990
Related