adbanner-test/app/views/admin/ad_banners/show.html.erb

156 lines
5.0 KiB
Plaintext
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<% content_for :page_specific_javascript do %>
<%= javascript_include_tag "lib/jquery-ui-sortable.min" %>
<% end %>
<% content_for :page_specific_css do %>
<style type="text/css">
.banner-image{
height: 140px;
background-repeat: no-repeat;
}
.order-list{
list-style: none;
}
.order-list-image i{
font-size: 20px;
cursor: move;
}
.order-list-image h4{
display: inline-block;
margin-left: 30px;
}
#sort-images-modal .modal-body {
max-height: 60vh;
}
#sort-images-modal .modal-body .order-list-image img {
width: 150px;
margin: 0 0 10px 10px;
}
</style>
<% end %>
<h3>
<%= @banner.title %>
<div class="pull-right btn-group">
<a class="btn btn-small <%= params[:show] == "expired" ? "" : "active" %>" href="<%= admin_ad_banner_path(@banner.id) %>">Not Expired</a>
<a class="btn btn-small <%= params[:show] == "expired" ? "active" : "" %>" href="<%= admin_ad_banner_path(@banner.id, :show => "expired") %>">Expired</a>
</div>
</h3>
<table class="table main-list">
<thead>
<tr class="sort-header">
<% @table_fields.each do |f| %>
<%= thead(f) %>
<% end %>
</tr>
</thead>
<tbody>
<% @images.each do |image| %>
<tr>
<td>
<% if image.exchange_item == "1" %>
<%= image_tag image.file.thumb, :class => "banner-image" %>
<% else %>
<iframe height="140" src="<%= image.embed_url %>"></iframe>
<% end %>
</td>
<td>
<%= image.title rescue "" %>
<% if can_edit_or_delete?(@banner) %>
<div class="quick-edit">
<ul class="nav nav-pills">
<li><a href="<%= edit_admin_ad_image_path(image.id, :page => params[:page]) %>"><%= t(:edit) %></a></li>
<li><a href="<%= admin_ad_image_path(image.id, :page => params[:page]) %>" class="delete text-error" data-method="delete" data-confirm="Are you sure?" ><%= t(:delete_) %></a></li>
</ul>
</div>
<% end %>
</td>
<td class="span3">
<% if !image.postdate.nil? %>
<%= image.postdate.strftime("%Y-%m-%d %H:%M") rescue "" %>
<% if !image.deadline.nil? %>
~ <%= image.deadline.strftime("%Y-%m-%d %H:%M") rescue "" %>
<% if image.expired? %>
<span class="label"><%= t("ad_banner.expired") %></span>
<% end %>
<% end %>
<% end %>
</td>
<td>
<% if image.out_link != "" %>
<a href="<%= image.out_link rescue "#" %>" target="_blank">Link</a>
<% end %>
</td>
</tr>
<% end %>
</tbody>
</table>
<% if can_edit_or_delete?(@banner) %>
<div class="bottomnav clearfix" style="left: 81px;">
<div class="action pull-right">
<a class="btn btn-primary" href="<%= new_admin_ad_image_path(:page => params[:page], :banner_id => @banner.id) %>">
<%= t("ad_banner.add") %>
</a>
<a class="btn btn-info" href="#sort-images-modal" data-toggle="modal"><%= t("ad_banner.order") %></a>
</div>
<%= content_tag :div, paginate(@images), class: "pagination pagination-centered" %>
</div>
<!-- image order modal -->
<div id="sort-images-modal" class="modal hide fade" tabindex="-1" role="dialog" aria-hidden="true">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h3><%= t("ad_banner.order_images") %></h3>
</div>
<div class="modal-body">
<ul class="order-list">
<% @banner.ad_images.not_expired.asc(:sort_number).each do |image| %>
<li class="order-list-image" data-image-id="<%= image.id.to_s %>">
<i class="icons-list-2"></i>
<img src="<%= image.exchange_item == "1" ? image.file.thumb.url : image.youtube_thumb %>"/>
<h4><%= image.title %>
</li>
<% end %>
</ul>
</div>
<div class="modal-footer">
<button class="btn" data-dismiss="modal" aria-hidden="true"><%= t("ad_banner.close") %></button>
<button class="btn btn-primary" id="save-image-order-btn"><%= t("ad_banner.save_changes") %></button>
</div>
</div>
<% end %>
<script type="text/javascript">
var sortUpdated = false;
$(document).on('show.bs.modal','#sort-images-modal', function () {
$(".order-list").sortable({
update : function(){
sortUpdated = true;
}
});
})
$("#save-image-order-btn").on("click",function(){
if(sortUpdated){
var ids = [];
$(".order-list-image").each(function(i,image){
ids.push($(image).data("image-id"));
})
$.ajax({
url : "/admin/ad_banner/save_image_order",
data : {"ids" : ids, "banner_id" : "<%= @banner.id.to_s %>"},
dataType : "json",
type : "post"
}).done(function(){
alert("Order saved. Please refresh the page to see the changes.");
$("#sort-images-modal").modal("hide");
})
}
})
</script>