ikuseiGmbH/smart-village-app-cms

<% form_class ||= "nested-media" %>
<%# fields without "source_url" here, because it is a nested object but we check for emptyness
  # currently just flatly, so we need to check all values except that to know,
  # if the object is an empty one %>
<% fields = ["caption_text", "content_type", "copyright"] %>
<% list_of_media_contents = record.media_contents.presence || [OpenStruct.new] %>

<div class="<%= form_class %>">
  <% list_of_media_contents.each_with_index do |media_content, index| %>
    <%= form.fields_for "media_contents[#{index}]", media_content do |fmc| %>
      <div class="nested-medium-form<%= " d-none" if empty?(media_content, fields) %>">
        <div class="card mb-4">
          <div class="d-flex flex-wrap justify-content-between card-header py-3 bg-dark text-white">
            <h4>Datei</h4>
            <%= link_to "#", class: "remove btn btn-sm btn-danger" do %>
              <i class="fa fa-trash text-white"></i>
            <% end %>
          </div>

          <div class="card-body">
            <%= fmc.fields_for :source_url, media_content.source_url do |fu| %>
              <div class="row">
                <div class="col">
                  <div class="form-group">
                    <label for="description">
                      Link (Bild, YouTube-Video, SoundCloud-Aufnahme)
                      <br />
                      Für YouTube und SoundCloud müssen die iframe-Embed-Codes eingebunden werden,
                      die von den Plattformen jeweils über die "Teilen"-Funktion bereitgestelt
                      werden.
                      <br />
                      Dabei ist es wichtig, bei "width" für die Breite des Elements statt des
                      vorgegebenen Wertes eine "100%" einzutragen. Nur so wird gewährleistet,
                      dass die Darstellung in der mobilen App passend ist.
                      <br />
                      Beim Wert "height" für die Höhe des Elements muss eine fixe Pixelangabe
                      eingestellt werden. Hier kann je nach Einbindung variiert werden.
                      <br />
                      Es wird dringend empfohlen, nach dem Speichern der Datensätze die Darstellung
                      in der mobilen App zu überprüfen und gegebenenfalls anzupassen!
                    </label>
                    <%= fu.text_field :url, class: "form-control image-upload-url" %>
                  </div>

                  <%= render partial: "shared/partials/image_upload", locals: { index: index } %>

                  <% image_url = "" %>
                  <% if media_content.try(:source_url).try(:url).present? %>
                    <% is_image = "image" === MIME::Types.type_for(media_content.source_url.url).try(:first).try(:media_type) %>
                    <% image_url = media_content.source_url.url if is_image %>
                  <% end %>

                  <div class="image-preview-wrapper image-preview-wrapper-<%= index %> mt-2 mb-3">
                    <label style="<%= "display: none;" unless image_url.present? %>"><u>Bildvorschau:</u></label>
                    <img src="<%= image_url %>" class="image-preview image-preview-<%= index %>" %>
                  </div>
                </div>
              </div>
            <% end %>

            <div class="row" hidden>
              <div class="col">
                <div class="form-group">
                  <label for="description">Bildunterschrift</label>
                  <%= fmc.text_field :caption_text, class: "form-control" %>
                </div>
              </div>
            </div>

            <div class="row">
              <div class="col-lg-6">
                <div class="form-group">
                  <label for="description">Art</label><br>
                  <%= fmc.select(
                        :content_type,
                        options_for_select(
                          [
                            ["Bild", "image"],
                            ["Audio", "audio"],
                            ["Video", "video"],
                            ["Logo", "logo"],
                            ["Anhang", "attachement"]
                          ],
                          fmc.object.content_type
                        ),
                        {},
                        { class: "form-control" }
                      ) %>
                </div>
              </div>

              <div class="col-lg-6">
                <div class="form-group">
                  <label for="description">Rechteinhaber</label>
                  <%= fmc.text_field :copyright, class: "form-control" %>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    <% end %>
  <% end %>
</div>

<%= link_to "#", class: "nested-add-medium btn btn-sm btn-secondary" do %>
  <i class="fas fa-plus text-white mr-2"></i>
  Datei hinzufügen
<% end %>