scinote-eln/scinote-web
1
1
Fork 0
mirror of https://github.com/scinote-eln/scinote-web.git synced 2024-09-20 14:45:56 +08:00
Code Issues Packages Projects Releases Wiki Activity

Add Edit renderer for ListColumnType

Browse source
This commit is contained in:
Urban Rotnik 2019-11-29 12:52:27 +01:00
parent 5f2407e3fb
commit 3a76753b72
6 changed files with 127 additions and 11 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
app/assets/javascripts/application.js.erb
View file

@ -44,6 +44,7 @@
//= require protocols/header
//= require marvinjslauncher
//= require_directory ./repositories/renderers
//= require_directory ./repositories/renderers/columns
//= require_directory ./repositories/validators
//= require_directory ./sitewide
//= require turbolinks

53
app/assets/javascripts/repositories/renderers/columns/list.js Normal file
View file

@ -0,0 +1,53 @@
/* global dropdownSelector */
/* eslint-disable no-unused-vars */
var List = (function() {
function listItemDropdown(options, currentValue, columnId, formId) {
var html = `<select class="form-control selectpicker repository-dropdown"
data-abs-min-length="2" data-live-search="true" from="${formId}"
data-container="body" column_id="${columnId}">
<option value="-1"></option>`;
$.each(options, function(index, value) {
var selected = (currentValue === value[1]) ? 'selected' : '';
html += '<option value="' + value[0] + '" ' + selected + '>';
html += value[1] + '</option>';
});
html += '</select>';
return html;
}
function initialListItemsRequest(columnId, currentValue, formId, url) {
var massageResponse = [];
$.ajax({
url: url,
type: 'POST',
dataType: 'json',
async: false,
data: {
column_id: columnId
}
}).done(function(data) {
$.each(data.list_items, function(index, el) {
massageResponse.push([el.id, el.data]);
});
});
return listItemDropdown(massageResponse, currentValue, columnId, formId);
}
function initSelectPicker($select, $hiddenField) {
dropdownSelector.init($select, {
noEmptyOption: true,
singleSelect: true,
closeOnSelect: true,
selectAppearance: 'simple',
onChange: function() {
$hiddenField.val(dropdownSelector.getValues($select));
}
});
}
return {
initialListItemsRequest: initialListItemsRequest,
initSelectPicker: initSelectPicker
};
}());

56
app/assets/javascripts/repositories/renderers/edit_renderers.js
View file

@ -1,3 +1,5 @@
/* global List SmartAnnotation*/
$.fn.dataTable.render.editRowName = function(formId, cell) {
let $cell = $(cell.node());
let text = $cell.find('a').first().text();
@ -19,14 +21,62 @@ $.fn.dataTable.render.editRepositoryAssetValue = function(formId, columnId, cell
};
$.fn.dataTable.render.editRepositoryTextValue = function(formId, columnId, cell) {
SmartAnnotation.init(cell);
return '';
let $cell = $(cell.node());
let text = $cell.text();
$cell.html(`
<div class="form-group">
<input class="form-control editing"
form="${formId}"
type="text"
name="repository_cells[${columnId}]"
value="${text}"
data-type="RepositoryTextValue">
</div>`);
SmartAnnotation.init($cell.find('input'));
};
$.fn.dataTable.render.editRepositoryListValue = function(formId, columnId, cell) {
return '';
let $cell = $(cell.node());
let currentValue = $cell.text();
let url = $cell.closest('table').data('list-items-path');
let hiddenField = `
<input form="${formId}"
type="hidden"
name="repository_cells[${columnId}]"
value=""
data-type="RepositoryListValue">`;
$cell.html(hiddenField + List.initialListItemsRequest(columnId, currentValue, formId, url));
List.initSelectPicker($cell.find('select'), $cell.find(`[name='repository_cells[${columnId}]']`));
};
$.fn.dataTable.render.editRepositoryStatusValue = function(formId, columnId, cell) {
return '';
};
$.fn.dataTable.render.editRepositoryDateTimeValue = function(formId, columnId, cell) {
return '';
};
$.fn.dataTable.render.editRepositoryDateValue = function(formId, columnId, cell) {
return '';
};
$.fn.dataTable.render.editRepositoryTimeValue = function(formId, columnId, cell) {
return '';
};
$.fn.dataTable.render.editRepositoryDateTimeRangeValue = function(formId, columnId, cell) {
return '';
};
$.fn.dataTable.render.editRepositoryDateRangeValue = function(formId, columnId, cell) {
return '';
};
$.fn.dataTable.render.editRepositoryTimeRangeValue = function(formId, columnId, cell) {
return '';
};

11
app/assets/javascripts/repositories/row_editor.js
View file

@ -106,6 +106,7 @@ var RepositoryDatatableRowEditor = (function() {
let $row = $(row.node());
let itemId = row.id();
let formId = `repositoryRowForm${itemId}`;
let requestUrl = $(TABLE.table().node()).data('current-uri');
let rowForm = $(`
<form id="${formId}"
class="repository-row-edit-form"
@ -114,20 +115,22 @@ var RepositoryDatatableRowEditor = (function() {
data-remote="true"
data-row-id="${itemId}">
<input name="id" type="hidden" value="${itemId}" />
<input name="request_url" type="hidden" value="${requestUrl}" />
</form>
`);
$row.find('td').first().append(rowForm);
TABLE.cells(row.index(), row.columns().eq(0)).every(function() {
let columnId = $(TABLE.columns(this.index().column).header()).attr('id');
let $header = $(TABLE.columns(this.index().column).header());
let columnId = $header.attr('id');
let dataType = $header.data('type');
let cell = this;
if (columnId === NAME_COLUMN_ID) {
$.fn.dataTable.render.editRowName(formId, cell);
} else {
let dataType = $(this.column().header()).data('type');
if (dataType) $.fn.dataTable.render['edit' + dataType](formId, columnId, cell);
} else if (dataType) {
$.fn.dataTable.render['edit' + dataType](formId, columnId, cell);
}
return true;

9
app/assets/javascripts/repositories/validators/base_validator.js
View file

@ -3,3 +3,12 @@
$.fn.dataTable.render.RowNameValidator = function($input) {
return textValidator(undefined, $input, 1, GLOBAL_CONSTANTS.NAME_MAX_LENGTH);
};
$.fn.dataTable.render.RepositoryTextValueValidator = function($input) {
return textValidator(undefined, $input, 1, GLOBAL_CONSTANTS.NAME_MAX_LENGTH);
};
$.fn.dataTable.render.RepositoryListValueValidator = function() {
return true;
};

8
app/views/users/settings/account/preferences/index.html.erb
View file

@ -10,7 +10,7 @@
<div class="time-zone-container">
<%= label_tag t("users.settings.account.preferences.edit.time_zone_label") %>
<div class="time-zone-selector-container">
<%= select_tag "time-zone-input-field",
<%= select_tag "time-zone-input-field",
options_for_select(
ActiveSupport::TimeZone.all.map{ |tz|
[tz.formatted_offset + " " + tz.name, tz.name]
@ -19,7 +19,7 @@
),{
'data-path-to-update': update_preferences_path(format: :json),
class: 'hidden'
}
}
%>
</div>
<small><%= t("users.settings.account.preferences.edit.time_zone_sublabel") %></small>
@ -28,7 +28,7 @@
<div class="date-format-container">
<%= label_tag t("users.settings.account.preferences.edit.date_format_label") %>
<div class="date-format-selector-container">
<%= select_tag "date-format-input-field",
<%= select_tag "date-format-input-field",
options_for_select(
Constants::SUPPORTED_DATE_FORMATS.uniq.map{ |df|
["#{l(Time.new(2014, 11, 6), format: :full_date, date_format: df)}", df]
@ -37,7 +37,7 @@
),{
'data-path-to-update': update_preferences_path(format: :json),
class: 'hidden'
}
}
%>
</div>
<small><%= t("users.settings.account.preferences.edit.date_format_sublabel") %></small>