377 lines
14 KiB
Plaintext
377 lines
14 KiB
Plaintext
<%= csrf_meta_tags %>
|
|
<% content_for :page_specific_css do %>
|
|
<%= stylesheet_link_tag "ruling_template/template" %>
|
|
<style type="text/css">
|
|
.fileinput-button {
|
|
position: relative;
|
|
overflow: hidden;
|
|
display: inline-block;
|
|
}
|
|
.fileinput-button input {
|
|
position: absolute;
|
|
top: 0;
|
|
right: 0;
|
|
margin: 0;
|
|
opacity: 0;
|
|
-ms-filter: 'alpha(opacity=0)';
|
|
font-size: 200px !important;
|
|
direction: ltr;
|
|
cursor: pointer;
|
|
}
|
|
|
|
/* Fixes for IE < 8 */
|
|
@media screen\9 {
|
|
.fileinput-button input {
|
|
filter: alpha(opacity=0);
|
|
font-size: 100%;
|
|
height: 100%;
|
|
}
|
|
}
|
|
|
|
#progress {
|
|
margin-top: 10px;
|
|
height: 5px;
|
|
text-align: center;
|
|
margin-bottom: 5px;
|
|
}
|
|
.progress-text{
|
|
text-align: center;
|
|
font-size: 18px;
|
|
}
|
|
|
|
.area {
|
|
margin-bottom: 40px;
|
|
border-bottom: 1px solid #c8c8c8;
|
|
}
|
|
</style>
|
|
<% end %>
|
|
<div class="file-upload-area">
|
|
<h3><%= @template.title %></h3>
|
|
<% if !@template.template_image_files.empty? %>
|
|
<label class="control-label muted">Uploaded Images (Drag to change order)</label>
|
|
<ul class="preview-image-area">
|
|
<% @template.template_image_files.asc(:order).each do |image| %>
|
|
<li class="uploaded-image" data-id="<%= image.id.to_s %>">
|
|
<img src="<%= image.image_file.thumb.url %>" alt="">
|
|
<a href="<%= delete_image_admin_ruling_template_path(image.id) %>" class="preview-image-delete btn btn-small btn-danger">Delete</a>
|
|
</li>
|
|
<% end %>
|
|
</ul>
|
|
<% end %>
|
|
<div class="preview-upload-area area">
|
|
<label class="control-label muted">Preview Images</label>
|
|
<form action="<%= upload_image_admin_ruling_template_path(@template.id) %>" id="fileupload">
|
|
<!-- Redirect browsers with JavaScript disabled to the origin page -->
|
|
<!-- The fileupload-buttonbar contains buttons to add/delete files and start/cancel the upload -->
|
|
<div class="fileupload-buttonbar">
|
|
<div class="navbar">
|
|
<div class="navbar-inner">
|
|
<ul class="nav">
|
|
<li>
|
|
<div class="fileinput-button add-photo">
|
|
<i class="icon-plus icon-white"></i>
|
|
<span>Add files...</span>
|
|
<input type="file" name="template_image_file[image_file]" multiple>
|
|
</div>
|
|
</li>
|
|
<li>
|
|
<button type="submit" class="start add-photo">
|
|
<i class="icon-upload icon-white"></i>
|
|
<span>Start upload</span>
|
|
</button>
|
|
</li>
|
|
<li>
|
|
<button type="reset" class="cancel add-photo">
|
|
<i class="icon-ban-circle icon-white"></i>
|
|
<span>Cancel upload</span>
|
|
</button>
|
|
</li>
|
|
<!-- <li>
|
|
<button type="button" class="delete">
|
|
<i class="icons-trash icon-white"></i>
|
|
<span>Delete</span>
|
|
</button>
|
|
</li> -->
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
<!-- The global progress information -->
|
|
<div class="fileupload-progress">
|
|
<!-- The global progress bar -->
|
|
<div class="progress progress-success progress-striped active" role="progressbar" aria-valuemin="0" aria-valuemax="100">
|
|
<div class="bar" style="width:0%;"></div>
|
|
</div>
|
|
<!-- The extended global progress information -->
|
|
<div class="progress-extended"></div>
|
|
</div>
|
|
</div>
|
|
<!-- Drop Zone -->
|
|
<div id="dropzone" class="drop">
|
|
<div data-icons=""></div>
|
|
Drop files here
|
|
</div>
|
|
<!-- The loading indicator is shown during file processing -->
|
|
<div class="fileupload-loading"></div>
|
|
<!-- The table listing the files available for upload/download -->
|
|
<div id="file-list" class="nano">
|
|
<div class="content">
|
|
<ul role="presentation" class="files clearfix">
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
|
|
<div class="zip-upload-area area">
|
|
<% if !@template.template_psd_file.nil? && !@template.template_psd_file.psd_zip.url.nil? %>
|
|
<a href="<%= @template.template_psd_file.psd_zip.url %>">Click here to download PSD</a>
|
|
<% end %>
|
|
<label class="control-label muted">Upload PSD</label>
|
|
<form id="psdfileupload" method="POST" enctype="multipart/form-data" action="<%= upload_temp_file_admin_ruling_templates_path %>">
|
|
<span class="btn btn-success fileinput-button">
|
|
<i class="glyphicon glyphicon-plus"></i>
|
|
<span>Select PSD File</span>
|
|
<!-- The file input field used as target for the file upload widget -->
|
|
<input type="file" name="psdfile" >
|
|
<input type="hidden" name="path" >
|
|
<input name="authenticity_token" value="<%= form_authenticity_token %>" type="hidden">
|
|
</span>
|
|
<input id="psd-upload-submit" type="submit" class="btn btn-primary" value="Upload" style="display: none;" />
|
|
</form>
|
|
<div class="psd-notification-area"></div>
|
|
<div id="progress" class="progress">
|
|
<div class="bar bar-success"></div>
|
|
</div>
|
|
<div class="progress-text"></div>
|
|
</div>
|
|
|
|
<div class="template-upload-area area">
|
|
<%= form_for @template, url: admin_ruling_template_path(@template.id) do |f| %>
|
|
<label class="control-label muted">Git Url</label>
|
|
<%= f.text_field :git_url %>
|
|
<label class="control-label muted">Git Branch</label>
|
|
<%= f.text_field :git_branch %>
|
|
<br>
|
|
<%= f.submit 'update',class: 'btn btn-primary' %>
|
|
<% end %>
|
|
<% if !@template.template_zip(true).url.nil? %>
|
|
<a href="<%= @template.template_zip(true).url %>">Click here to download Template</a>
|
|
<% end %>
|
|
<label class="control-label muted">Upload Template</label>
|
|
<%= form_for @template, url: admin_ruling_template_path(@template.id) do |f| %>
|
|
<span class="btn btn-success fileinput-button">
|
|
<i class="glyphicon glyphicon-plus"></i>
|
|
<span>Select Template File</span>
|
|
<%= f.file_field :template_zip %>
|
|
</span>
|
|
<input id="template-upload-submit" type="submit" class="btn btn-primary" value="Upload" style="display: none;" />
|
|
<% end %>
|
|
<div class="template-notification-area"></div>
|
|
</div>
|
|
<a href="<%= edit_admin_ruling_template_path(@template.id) %>" class="btn btn-info">Edit Template</a>
|
|
<a href="<%= admin_ruling_templates_path %>" class="btn btn-warning">Templates</a>
|
|
</div>
|
|
<% content_for :page_specific_javascript do %>
|
|
<%= javascript_include_tag "lib/jquery-ui-sortable.min" %>
|
|
<%= javascript_include_tag "file-upload/vendor/jquery.ui.widget.js" %>
|
|
<%= javascript_include_tag "file-upload/tmpl.min.js" %>
|
|
<%= javascript_include_tag "file-upload/load-image.min.js" %>
|
|
<%= javascript_include_tag "file-upload/canvas-to-blob.min.js" %>
|
|
<%= javascript_include_tag "file-upload/jquery.iframe-transport.js" %>
|
|
<%= javascript_include_tag "file-upload/jquery.fileupload.js" %>
|
|
<%= javascript_include_tag "file-upload/jquery.fileupload-fp.js" %>
|
|
<%= javascript_include_tag "file-upload/jquery.fileupload-ui.js" %>
|
|
<%= javascript_include_tag "file-upload/drop-zone.js" %>
|
|
<script type="text/javascript">
|
|
!function ($) {
|
|
$.fn.checkListLength = function (param){
|
|
_defaultSettings = {
|
|
onlyOne: null,
|
|
};
|
|
_set = $.extend(_defaultSettings, param);
|
|
$this = this;
|
|
$li = this.children('li');
|
|
$dropzone = $('#dropzone');
|
|
if(($li.length - _set.onlyOne) == 0) {
|
|
$('#dropzone').fadeIn(300);
|
|
} else {
|
|
$('#dropzone').fadeOut(300);
|
|
};
|
|
$('#file-list').nanoScroller({ scrollTop: 0, iOSNativeScrolling: true });
|
|
}
|
|
}(window.jQuery);
|
|
$(function () {
|
|
'use strict';
|
|
// Initialize the jQuery File Upload widget:
|
|
if($('#fileupload').length){
|
|
$('#fileupload').fileupload({
|
|
maxFileSize: 5000000,
|
|
acceptFileTypes: /(\.|\/)(gif|jpe?g|png)$/i,
|
|
dropZone: $('#dropzone'),
|
|
headers:{
|
|
'X-CSRF-Token': $('meta[name="csrf-token"]').attr("content")
|
|
}
|
|
}).on('fileuploaddone', function (e, data) {
|
|
alert("Please refresh the page.");
|
|
});
|
|
}
|
|
|
|
var psdfilename = null,
|
|
psdFileForm = null;
|
|
$("#psdfileupload").fileupload({
|
|
maxChunkSize : 8 * 1024 * 1024,
|
|
acceptFileTypes: /(\.|\/)(zip)$/i,
|
|
add : function(e, data){
|
|
var file = data.originalFiles[0].name.split(".");
|
|
psdfilename = data.originalFiles[0].name;
|
|
psdFileForm = data;
|
|
if(file[file.length - 1] == "zip"){
|
|
$("div.psd-notification-area").removeClass("error").text("");
|
|
$("#psd-upload-submit").show();
|
|
}else{
|
|
$("div.psd-notification-area").addClass("error").text("Only zip file allowed.");
|
|
$("#psd-upload-submit").hide();
|
|
return false;
|
|
}
|
|
},
|
|
progressall: function (e, data) {
|
|
var progress = parseInt(data.loaded / data.total * 100, 10);
|
|
$('#progress .bar').css(
|
|
'width',
|
|
progress + '%'
|
|
);
|
|
if(progress < 100){
|
|
$('.progress-text').text("Uploading " + progress + "%");
|
|
}else{
|
|
$('.progress-text').text("Uploaded successfully.");
|
|
}
|
|
}
|
|
})
|
|
|
|
$("#psd-upload-submit").on("click",function(){
|
|
$.ajax({
|
|
url : "<%= get_temp_dir_name_admin_ruling_template_path(@template.id) %>",
|
|
dataType : "json",
|
|
type : "get",
|
|
data : {"filename" : psdfilename}
|
|
}).done(function(data){
|
|
$('.progress-text').show();
|
|
$("#psdfileupload input[type=hidden]").val(data.path);
|
|
psdFileForm.submit();
|
|
})
|
|
return false;
|
|
})
|
|
|
|
$("#r_template_template_zip").on("change",function(){
|
|
var file = this.files[0].name.split(".");
|
|
if(file[file.length - 1] == "zip"){
|
|
$("div.template-notification-area").removeClass("error").text("");
|
|
$("#template-upload-submit").show();
|
|
}else{
|
|
$("div.template-notification-area").addClass("error").text("Only zip file allowed.");
|
|
$("#template-upload-submit").hide();
|
|
return false;
|
|
}
|
|
})
|
|
});
|
|
|
|
</script>
|
|
<% end %>
|
|
<script type="text/javascript">
|
|
$(".preview-image-area").sortable({
|
|
update : function(event, ui){
|
|
var image_ids = [];
|
|
$(".preview-image-area li").each(function(){
|
|
image_ids.push($(this).data("id"));
|
|
})
|
|
$.ajax({
|
|
url : "<%= change_image_order_admin_ruling_templates_path %>",
|
|
data : {"images" : image_ids},
|
|
dataType : "json",
|
|
type : "post",
|
|
headers:{
|
|
'X-CSRF-Token' : $('meta[name="csrf-token"]').attr("content")
|
|
}
|
|
})
|
|
}
|
|
});
|
|
$(".preview-image-delete").on("click",function(){
|
|
var el = $(this);
|
|
if(confirm("Are you sure?")){
|
|
$.ajax({
|
|
url : el.attr("href"),
|
|
type : "delete",
|
|
dataType : "json",
|
|
headers:{
|
|
'X-CSRF-Token' : $('meta[name="csrf-token"]').attr("content")
|
|
}
|
|
}).done(function(){
|
|
el.parent().remove();
|
|
})
|
|
}
|
|
return false;
|
|
})
|
|
|
|
|
|
</script>
|
|
<!-- The template to display files available for upload -->
|
|
<script id="template-upload" type="text/x-tmpl">
|
|
{% for (var i=0, file; file=o.files[i]; i++) { %}
|
|
<li class="template-upload fade">
|
|
<ul class="clearfix">
|
|
<li class="action-bnt">
|
|
{% if (o.files.valid && !i) { %}
|
|
<div class="progress progress-success progress-striped active" role="progressbar" aria-valuemin="0" aria-valuemax="100" aria-valuenow="0">
|
|
<div class="bar" style="width:0%;"></div>
|
|
</div>
|
|
{% if (!o.options.autoUpload) { %}
|
|
<button class="btn btn-primary start">
|
|
<i class="icon-upload icon-white"></i>
|
|
</button>
|
|
{% } %}
|
|
{% } %}
|
|
{% if (!i) { %}
|
|
<button class="btn btn-warning cancel">
|
|
<i class="icon-ban-circle icon-white"></i>
|
|
</button>
|
|
{% } %}
|
|
</li>
|
|
<li class="preview pull-left"><span class="fade"></span></li>
|
|
<li class="name-size">
|
|
<p>{%=file.name%}</p>
|
|
{% if (file.error) { %}
|
|
<p class="error"><span class="label label-important">Error</span> {%=file.error%}</p>
|
|
{% } else if (o.files.valid && !i) { %}
|
|
<p class="label label-info">{%=o.formatFileSize(file.size)%}</p>
|
|
{% } %}
|
|
</li>
|
|
</ul>
|
|
</li>
|
|
{% } %}
|
|
</script>
|
|
<!-- The template to display files available for download -->
|
|
<script id="template-download" type="text/x-tmpl">
|
|
{% for (var i=0, file; file=o.files[i]; i++) { %}
|
|
<li class="template-download fade">
|
|
<ul class="clearfix">
|
|
{% if (file.error) { %}
|
|
<li class="name-size">
|
|
<p>{%=file.name%}</p>
|
|
<p class="error"><span class="label label-important">Error</span> {%=file.error%}</p>
|
|
</li>
|
|
{% } else { %}
|
|
<li class="preview">
|
|
{% if (file.thumbnail_url) { %}
|
|
<a href="{%=file.url%}" title="{%=file.name%}" data-gallery="gallery" download="{%=file.name%}"><img src="{%=file.thumbnail_url%}"></a>
|
|
{% } %}
|
|
</li>
|
|
<li class="name-size">
|
|
<p><a href="{%=file.url%}" title="{%=file.name%}" data-gallery="{%=file.thumbnail_url&&'gallery'%}" download="{%=file.name%}">{%=file.name%}</a></p>
|
|
<p ><span class="label label-success">Success</span> File uploaded successfully!</p>
|
|
<p class="label label-info">{%=o.formatFileSize(file.size)%}</p>
|
|
</li>
|
|
{% } %}
|
|
</ul>
|
|
</li>
|
|
{% } %}
|
|
</script> |