289 lines
8.9 KiB
Plaintext
289 lines
8.9 KiB
Plaintext
|
<% # encoding: utf-8 %>
|
||
|
|
<% content_for :page_specific_css do %>
|
||
|
|
<style type="text/css">
|
||
|
|
.sort-order-icon{
|
||
|
|
font-size: 25px;
|
||
|
|
cursor: move;
|
||
|
|
}
|
||
|
|
</style>
|
||
|
|
<% end %>
|
||
|
|
<% content_for :page_specific_javascript do %>
|
||
|
|
<%= javascript_include_tag "lib/file-type" %>
|
||
|
|
<%= javascript_include_tag "lib/module-area" %>
|
||
|
|
<%= javascript_include_tag "lib/jquery-ui-sortable.min" %>
|
||
|
|
<% end %>
|
||
|
|
<style>
|
||
|
|
#fileupload {
|
||
|
|
position: relative;
|
||
|
|
clear: both;
|
||
|
|
overflow: hidden;
|
||
|
|
height: 254px;
|
||
|
|
}
|
||
|
|
#fileupload #dropzone.drop {
|
||
|
|
position: absolute;
|
||
|
|
left: 0;
|
||
|
|
right: 0;
|
||
|
|
border: 2px dashed #0088CC;
|
||
|
|
border-radius: 10px;
|
||
|
|
color: #0088CC;
|
||
|
|
background-color: #FFFFFF;
|
||
|
|
z-index: 0;
|
||
|
|
}
|
||
|
|
#fileupload #dropzone {
|
||
|
|
padding: 30px;
|
||
|
|
text-align: center;
|
||
|
|
font-size: 3em;
|
||
|
|
font-family: 'Raleway';
|
||
|
|
line-height: 1.2em;
|
||
|
|
color: #e4e4e4;
|
||
|
|
}
|
||
|
|
#fileupload #dropzone.in {
|
||
|
|
opacity: .7;
|
||
|
|
z-index: 2;
|
||
|
|
border-color: #faa732;
|
||
|
|
color: #faa732;
|
||
|
|
}
|
||
|
|
</style>
|
||
|
|
<div class="control-group">
|
||
|
|
<%= f.label :text, column.title, :class => "control-label" %>
|
||
|
|
<div class="controls">
|
||
|
|
<p class="add-btn">
|
||
|
|
<%= hidden_field_tag 'column_entry_file_field_count', file_field.column_entry_files.count %>
|
||
|
|
<a id="add_file" class="trigger btn btn-small btn-primary"><i class="icons-plus"></i> <%= t(:add) %></a>
|
||
|
|
</p>
|
||
|
|
<hr>
|
||
|
|
<!-- Add -->
|
||
|
|
<div class="add-target" id="add-target"></div>
|
||
|
|
<!-- Exist -->
|
||
|
|
<% if file_field && !file_field.column_entry_files.blank? %>
|
||
|
|
<div class="exist plugin-sortable">
|
||
|
|
<% file_field.column_entry_files.desc(:sort_number).each_with_index do |column_entry_file, i| %>
|
||
|
|
<%= f.fields_for :column_entry_files, column_entry_file do |f| %>
|
||
|
|
<%= render :partial => 'form_file', :locals => {:f => f, :i => i,:form_file => column_entry_file} %>
|
||
|
|
<% end %>
|
||
|
|
<% end %>
|
||
|
|
<hr>
|
||
|
|
</div>
|
||
|
|
<% end %>
|
||
|
|
<div id="fileupload" ondrop="dropHandler(event);" ondragover="dragOverHandler(event);" ondragleave="(function(){$('#dropzone').removeClass('in');})()">
|
||
|
|
<div id="dropzone" class="drop">
|
||
|
|
<div data-icons=""></div>
|
||
|
|
<%=t("universal_table.drag_file_to_here")%>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
</div>
|
||
|
|
<% if !file_field.new_record? %>
|
||
|
|
<%= f.hidden_field :id %>
|
||
|
|
<% else %>
|
||
|
|
<%= f.hidden_field :table_column_id, :value => column.id %>
|
||
|
|
<% end %>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<% content_for :page_specific_javascript do %>
|
||
|
|
<script>
|
||
|
|
if (!FileReader.prototype.readAsBinaryString) {
|
||
|
|
console.log('readAsBinaryString definition not found');
|
||
|
|
|
||
|
|
FileReader.prototype.readAsBinaryString = function (fileData) {
|
||
|
|
var binary = '';
|
||
|
|
var pk = this;
|
||
|
|
var reader = new FileReader();
|
||
|
|
|
||
|
|
reader.onload = function (e) {
|
||
|
|
var bytes = new Uint8Array(reader.result);
|
||
|
|
var length = bytes.byteLength;
|
||
|
|
|
||
|
|
for (var i = 0; i < length; i++) {
|
||
|
|
var a = bytes[i];
|
||
|
|
|
||
|
|
var b = String.fromCharCode(a)
|
||
|
|
binary += b;
|
||
|
|
}
|
||
|
|
|
||
|
|
pk.content = binary;
|
||
|
|
$(pk).trigger('onload');
|
||
|
|
}
|
||
|
|
|
||
|
|
reader.readAsArrayBuffer(fileData);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
function FileListItems (files) {
|
||
|
|
var b;
|
||
|
|
try{
|
||
|
|
b = new DataTransfer();
|
||
|
|
}catch(e){
|
||
|
|
if(window.dataTransfer){
|
||
|
|
b = window.dataTransfer;
|
||
|
|
}else{
|
||
|
|
if(typeof(ClipboardEvent) == "undefined"){ //IE
|
||
|
|
b = new DataTransfer();
|
||
|
|
}else{
|
||
|
|
b = new ClipboardEvent("").clipboardData;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
if(b.items){
|
||
|
|
b.items.clear();
|
||
|
|
}else{
|
||
|
|
if(b.files.length != 0 ){
|
||
|
|
var files_length = b.files.length;
|
||
|
|
for(var i = files_length - 1;i >= 0;i = i - 1){
|
||
|
|
delete b.files[i];
|
||
|
|
}
|
||
|
|
}
|
||
|
|
if(b.files.length != 0){
|
||
|
|
return files
|
||
|
|
}
|
||
|
|
}
|
||
|
|
for (var i = 0, len = files.length; i<len; i++){
|
||
|
|
if(b.items){
|
||
|
|
b.items.add(files[i])
|
||
|
|
}else{
|
||
|
|
b.files[i] = files[i];
|
||
|
|
}
|
||
|
|
}
|
||
|
|
return b.files
|
||
|
|
}
|
||
|
|
function change_files_to_file_field(file_field,files){
|
||
|
|
var fileupload = $(file_field).parents(".fileupload");
|
||
|
|
if(fileupload.length > 0){
|
||
|
|
fileupload.find(".fileupload-preview").text(files[0].name);
|
||
|
|
}
|
||
|
|
var files_list = new FileListItems(files)
|
||
|
|
try{
|
||
|
|
$(file_field)[0].files = files_list;
|
||
|
|
}catch(e){console.log(e)}
|
||
|
|
if($(file_field)[0].files.length == 0){ //Change failed
|
||
|
|
var file_field_values = [];
|
||
|
|
var file_reader = new FileReader();
|
||
|
|
$("[name=\""+$(file_field)[0].name+"\"][type=\"hidden\"]").remove();
|
||
|
|
var hidden_input = $("<input type=\"hidden\" name=\""+$(file_field)[0].name+"\">");
|
||
|
|
var hidden_input_values = [];
|
||
|
|
$(file_field).after(hidden_input);
|
||
|
|
var files_list_length = files_list.length;
|
||
|
|
for(var i = 0; i < files_list_length; i++){
|
||
|
|
var file = files_list[i];
|
||
|
|
$(file_field)[0].files[i] = file;
|
||
|
|
file_reader.readAsBinaryString(files_list[i]);
|
||
|
|
file_reader.onload = (function(hidden_input,file,i,files_list_length) {
|
||
|
|
return function(e) {
|
||
|
|
var file_info = {};
|
||
|
|
file_info["name"] = file.name;
|
||
|
|
file_info["type"] = file.type;
|
||
|
|
if (file_reader.result)
|
||
|
|
file_reader.content = file_reader.result;
|
||
|
|
file_info["content"] = e ? e.target.result : file_reader.content;
|
||
|
|
if(Array.isArray(hidden_input_values)){
|
||
|
|
hidden_input_values.push(file_info);
|
||
|
|
}
|
||
|
|
if(i == files_list_length - 1){
|
||
|
|
if(hidden_input_values.length == 1){
|
||
|
|
hidden_input_values = hidden_input_values[0];
|
||
|
|
}
|
||
|
|
hidden_input.val(JSON.stringify(hidden_input_values));
|
||
|
|
}
|
||
|
|
};})(hidden_input,file,i,files_list_length);
|
||
|
|
file_field_values.push("C:\\fakepath\\" + files_list[i].name);
|
||
|
|
}
|
||
|
|
Object.defineProperty($(file_field)[0].files, "length", {
|
||
|
|
// only returns odd die sides
|
||
|
|
get: function () {
|
||
|
|
var length = 0;
|
||
|
|
while(this[length]){
|
||
|
|
length++;
|
||
|
|
}
|
||
|
|
return length;
|
||
|
|
}
|
||
|
|
});
|
||
|
|
Object.defineProperty($(file_field)[0], "value", {
|
||
|
|
// only returns odd die sides
|
||
|
|
get: function () {
|
||
|
|
return (this.getAttribute('value') ? this.getAttribute('value') : "");
|
||
|
|
},
|
||
|
|
set: function(value) {
|
||
|
|
this.setAttribute('value',value);
|
||
|
|
}
|
||
|
|
});
|
||
|
|
$(file_field)[0].value = file_field_values.join(", ");
|
||
|
|
}
|
||
|
|
}
|
||
|
|
function dragOverHandler(ev) {
|
||
|
|
document.activeElement.blur();
|
||
|
|
$(ev.target).addClass("in");
|
||
|
|
// Prevent default behavior (Prevent file from being opened)
|
||
|
|
ev.preventDefault();
|
||
|
|
}
|
||
|
|
function dropHandler(ev) {
|
||
|
|
window.ev = ev;
|
||
|
|
window.dataTransfer = ev.dataTransfer;
|
||
|
|
// Prevent default behavior (Prevent file from being opened)
|
||
|
|
ev.preventDefault();
|
||
|
|
var files = [];
|
||
|
|
if (ev.dataTransfer.items) {
|
||
|
|
// Use DataTransferItemList interface to access the file(s)
|
||
|
|
for (var i = 0; i < ev.dataTransfer.items.length; i++) {
|
||
|
|
// If dropped items aren't files, reject them
|
||
|
|
if (ev.dataTransfer.items[i].kind === 'file') {
|
||
|
|
var file = ev.dataTransfer.items[i].getAsFile();
|
||
|
|
files.push(file)
|
||
|
|
}
|
||
|
|
}
|
||
|
|
} else {
|
||
|
|
// Use DataTransfer interface to access the file(s)
|
||
|
|
for (var i = 0; i < ev.dataTransfer.files.length; i++) {
|
||
|
|
var file = ev.dataTransfer.files[i];
|
||
|
|
files.push(file)
|
||
|
|
}
|
||
|
|
}
|
||
|
|
files.forEach(function(file){
|
||
|
|
var single_file = [file];
|
||
|
|
var file_field = add_file_field();
|
||
|
|
change_files_to_file_field(file_field,single_file);
|
||
|
|
})
|
||
|
|
window.files = files;
|
||
|
|
var target = ev.target ? ev.target : ev.srcElement;
|
||
|
|
$(target).removeClass("in");
|
||
|
|
}
|
||
|
|
function add_file_field(){
|
||
|
|
var self = $('#add_file');
|
||
|
|
var new_id = $(self).prev().attr('value');
|
||
|
|
var old_id = new RegExp("new_column_entry_files", "g");
|
||
|
|
var on = $('.language-nav li.active').index();
|
||
|
|
var le = $('#add-target').children('.start-line').length;
|
||
|
|
$(self).prev().attr('value', parseInt(new_id) + 1);
|
||
|
|
$('#add-target').prepend(("<%= escape_javascript(add_attribute 'form_file', f, :column_entry_files) %>").replace(old_id, new_id).replace("new_column_entry_file_sort_order_XXX", parseInt(new_id) + 1));
|
||
|
|
var file_field = $('#add-target').find("*").eq(0).find("[type=\"file\"]");
|
||
|
|
$('#add-target').children('.start-line').eq(le).children('.input-append').find('.tab-content').each(function() {
|
||
|
|
$(self).children('.tab-pane').eq(on).addClass('in active').siblings().removeClass('in active');
|
||
|
|
});
|
||
|
|
formTip();
|
||
|
|
return file_field;
|
||
|
|
}
|
||
|
|
$(document).ready(function() {
|
||
|
|
$(".plugin-sortable").sortable({
|
||
|
|
update : function(event, ui){
|
||
|
|
var existingfiles = $(".exist.plugin-sortable div.fileupload")
|
||
|
|
existingfiles.each(function(i, file){
|
||
|
|
$(file).find("input.file-sort-number-field").val(existingfiles.length - i);
|
||
|
|
})
|
||
|
|
}
|
||
|
|
});
|
||
|
|
$('.main-forms .add-on').tooltip();
|
||
|
|
$(document).on('click', '#add_file', add_file_field);
|
||
|
|
$(document).on('click', '.delete_file', function(){
|
||
|
|
$(this).parents('.input-prepend').remove();
|
||
|
|
});
|
||
|
|
$(document).on('click',"[type='file']",function(){
|
||
|
|
$("[name=\""+$(this).attr("name")+"\"][type=\"hiiden\"]").remove();
|
||
|
|
});
|
||
|
|
$(document).on('click', '.remove_existing_record', function(){
|
||
|
|
if(confirm("<%= I18n.t(:sure?)%>")){
|
||
|
|
$(this).children('.should_destroy').attr('value', 1);
|
||
|
|
$(this).parents('.start-line').hide();
|
||
|
|
}
|
||
|
|
});
|
||
|
|
});
|
||
|
|
</script>
|
||
|
|
<% end %>
|