Skip to content

Commit

Permalink
[modify] move javascript codes from view to js file
Browse files Browse the repository at this point in the history
  • Loading branch information
sunny4381 committed May 25, 2021
1 parent 7fc0617 commit c309aee
Show file tree
Hide file tree
Showing 3 changed files with 160 additions and 101 deletions.
156 changes: 156 additions & 0 deletions app/assets/javascripts/ss/lib/ajax_file.js
@@ -0,0 +1,156 @@
this.SS_AjaxFile = (function () {
function SS_AjaxFile(el, options) {
this.$el = $(el || "#ajax-box");
this.options = options || {};

this.render();
}

SS_AjaxFile.errors = {
entityTooLarge: "request entity is too large"
}

SS_AjaxFile.defaultFileSelectHandler = function() {
var promisses = [];
var fileViews = [];

for (var i = 0; i < arguments.length; i++) {
var $argument = $(arguments[i]);
var url = $argument.attr('href');
if (!url) {
continue;
}

var filename = $argument.data("humanized-name");

promisses.push($.ajax({
url: url,
success: function(html) {
fileViews.push({ name: filename, html: html });
}
}));
}

$.when.apply($, promisses).done(function () {
fileViews.sort(function(a,b) {
if (a.name < b.name) return 1;
if (a.name > b.name) return -1;
return 0;
});

for (var i = 0; i < fileViews.length; i++) {
$("#selected-files").prepend(fileViews[i].html);
}

$.colorbox.close();
});
};

SS_AjaxFile.prototype.render = function() {
var self = this;

self.$el.on("submit", "form.user-file", function (ev) {
var submitted = "attach";
if (ev.originalEvent && ev.originalEvent.submitter) {
submitted = ev.originalEvent.submitter.dataset.submitted;
}
var $form = $(this);

var params = {
url: $form.attr("action") + ".json",
dataType: "json",
success: function(data, textStatus, xhr) {
self.submitSuccess(submitted, data);
},
error: function (xhr, status, error) {
self.submitError(xhr);
}
};

$form.ajaxSubmit(params);
ev.preventDefault();
});

self.$el.on("click", ".user-files .select", function(ev) {
self.selectFiles(this);

ev.preventDefault();
return false;
});

SS.ajaxDelete(self.$el, ".user-files .delete");

var resizing = $('#file-resizing').val();
if (resizing) {
var label = $('#file-resizing').attr('data-label');
var option = $('<option>').val(resizing).text(label).prop('selected', true);
$('select.image-size').append(option);
}
};

SS_AjaxFile.prototype.submitSuccess = function(submitted, data) {
var self = this;

$("<div />").load(self.options.indexPath, function () {
var $userFiles = $(this).find(".user-files");
if ($userFiles[0]) {
// TODO: 差分だけをアニメーションつきで insert するとかっこよくなる
self.$el.find(".user-files").html($userFiles.html());
SS.renderInBox(self.$el);
}

self.$el.find("form.user-file [type='file']").val(null).trigger("change");
self.$el.find("form.user-file .image-size").val(null).trigger("change");

if (submitted === "attach") {
self.attachFiles(data);
}
});
};

SS_AjaxFile.prototype.attachFiles = function(data) {
var self = this;

if (!Array.isArray(data) || data.length == 0) {
return;
}

var elements = [];
$.each(data, function(index, file) {
var item = self.$el.find(".user-files .select[data-id='" + file._id + "']");
elements.push(item);
});

self.selectFiles.apply(self, elements);
};

SS_AjaxFile.prototype.submitError = function(xhr) {
if (xhr.status === 413) {
alert(["== Error =="].concat(SS_AjaxFile.errors.entityTooLarge).join("\n"));
} else {
try {
alert(["== Error =="].concat(xhr.responseJSON).join("\n"));
} catch(_error) {
alert(["== Error =="].concat(xhr.statusText).join("\n"));
}
}
};

SS_AjaxFile.prototype.selectFiles = function() {
if (SS_SearchUI.anchorAjaxBox) {
var handler = SS_SearchUI.anchorAjaxBox.data('on-select');
if (handler) {
$.each(arguments, function() {
handler($(this));
});

return true;
}
}

SS_AjaxFile.defaultFileSelectHandler.apply(SS_AjaxFile, arguments);
};

return SS_AjaxFile;

})();
1 change: 1 addition & 0 deletions app/assets/javascripts/ss/script.js.erb
Expand Up @@ -56,6 +56,7 @@
//= require ss/lib/html_message
//= require ss/lib/file_view
//= require ss/lib/validation
//= require ss/lib/ajax_file
//= require chat/lib/chart
//= require cms/lib/editor
//= require cms/lib/form
Expand Down
104 changes: 3 additions & 101 deletions app/views/ss/crud/ajax_files/index.html.erb
@@ -1,105 +1,7 @@
<%= jquery do %>

var submitted = null;
$(".search-ui-form .save").on("click", function() {
submitted = $(this).attr("data-submitted");
});

var onSelect;
var $element = $.colorbox.element();
var $cboxContent = $("#cboxContent");
if ($element) {
onSelect = $element.data('on-select');
}
if ($cboxContent.length) {
$cboxContent.data('on-select', onSelect);
onSelect = $cboxContent.data('on-select');
}

SS.ajaxForm("form.user-file", {
success: function(data) {
$("<div />").load("<%= url_for(action: :index, file_size: params[:file_size]) %>", function(data, status) {
$.colorbox.prep($(this).contents());

if (!Array.isArray(data) || data.length == 0) {
return;
}

if(submitted == "attach") {
var sorted_name_and_datas = [];
var file_views = [];

$.each(data, function(index, file) {
var item = $(".user-files .select[data-id='" + file._id + "']");
var url = item.attr('href');
if (!url) return true;
if (onSelect) {
onSelect(item);
} else {
file_views.push($.ajax({
url: url,
success: function(data) {
sorted_name_and_datas.push({name: file.filename, data: data});
}
}));
}
});
$.when.apply($,file_views).done(function () {
sorted_name_and_datas.sort(function(a,b) {
if(a.name < b.name) return 1;
if(a.name > b.name) return -1;
return 0;
});
for (var i = 0; i < sorted_name_and_datas.length; i++) {
$("#selected-files").prepend(sorted_name_and_datas[i].data);
}
});
$.colorbox.close();
}
});
},
error: function(xhr) {
if (xhr.status == 413) {
alert(["== Error =="].concat("<%= I18n.t('errors.messages.request_entity_too_large') %>").join("\n"));
} else {
try {
alert(["== Error =="].concat(xhr.responseJSON).join("\n"));
} catch(_error) {
alert(["== Error =="].concat(xhr.statusText).join("\n"));
}
}
}
});

if (onSelect) {
$(".user-files .select").on('click', function(e) {
onSelect($(this));
e.preventDefault();
return false;
});
} else {
SS.ajax(".user-files .select", {
success: function(data) {
var dataFileId = $('<div>' + data + '</div>').find("[data-file-id]").attr("data-file-id");
if (dataFileId) {
$("#selected-files .file-view[data-file-id='" + dataFileId + "']").remove();
}
$("#selected-files").prepend(data);
$.colorbox.close();
}
});
}

SS.ajaxDelete(".user-files .delete");

var resizing = $('#file-resizing').val();
if (resizing) {
var label = $('#file-resizing').attr('data-label');
var option = $('<option>').val(resizing).text(label).prop('selected', true);
$('select.image-size').append(option);
}

SS_SearchUI.modal();
SS_AjaxFile.errors.entityTooLarge = "<%= I18n.t('errors.messages.request_entity_too_large') %>";
new SS_AjaxFile(null, { indexPath: "<%= url_for(action: :index, file_size: params[:file_size]) %>" });
SS_SearchUI.modal();
<% end %>
<% if @model.allowed?(:edit, @cur_user, site: @cur_site, node: @cur_node) %>
Expand Down

0 comments on commit c309aee

Please sign in to comment.