add content wip
This commit is contained in:
jr-k
parent
91c4ed14fe
commit
f42e0ea069
@ -1,153 +0,0 @@
|
||||
jQuery(document).ready(function ($) {
|
||||
const inputTypeUpdate = function () {
|
||||
const $el = $('#content-add-type');
|
||||
const value = $el.val();
|
||||
const $selectedOption = $('#content-add-type option[value='+value+']');
|
||||
const inputType = $el.find('option').filter(function (i, el) {
|
||||
return $(el).val() === value;
|
||||
}).data('input');
|
||||
|
||||
$('.content-add-object-input').each(function() {
|
||||
const active = $(this).attr('id') === 'content-add-object-input-' + inputType;
|
||||
|
||||
if ($(this).is('input[type=file]')) {
|
||||
$(this).prop('disabled', !active);
|
||||
$(this).parents('label:eq(0)').toggleClass('hidden', !active);
|
||||
} else {
|
||||
$(this).prop('disabled', !active).toggleClass('hidden', !active);
|
||||
}
|
||||
});
|
||||
|
||||
$('.object-label-add').html($selectedOption.get(0).attributes['data-object-label'].value);
|
||||
$('.object-icon-add').attr('class', 'object-icon-add fa ' + $selectedOption.get(0).attributes['data-icon'].value)
|
||||
};
|
||||
|
||||
const initExplr = function () {
|
||||
$('.explr').explr({
|
||||
classesPlus: 'fa fa-plus',
|
||||
classesMinus: 'fa fa-minus',
|
||||
onLoadFinish: function ($tree) {
|
||||
$tree.removeClass('hidden');
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
const initDrags = function () {
|
||||
$(".draggable").draggable({
|
||||
revert: "invalid",
|
||||
});
|
||||
$(".droppable").droppable({
|
||||
accept: ".draggable",
|
||||
over: function (event, ui) {
|
||||
$(this).addClass("highlight-drop");
|
||||
},
|
||||
out: function (event, ui) {
|
||||
$(this).removeClass("highlight-drop");
|
||||
},
|
||||
drop: function (event, ui) {
|
||||
$(this).removeClass("highlight-drop");
|
||||
const $form = $('#folder-move-form');
|
||||
const $moved = ui.draggable;
|
||||
const $target = $(this);
|
||||
$form.find('[name=is_folder]').val($moved.attr('data-folder'))
|
||||
$form.find('[name=entity_id]').val($moved.attr('data-id'))
|
||||
$form.find('[name=new_folder_id]').val($target.attr('data-id'))
|
||||
ui.draggable.position({
|
||||
my: "center",
|
||||
at: "center",
|
||||
of: $(this),
|
||||
using: function (pos) {
|
||||
$(this).animate(pos, 50);
|
||||
}
|
||||
});
|
||||
$form.submit();
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
const main = function () {
|
||||
initExplr();
|
||||
initDrags();
|
||||
};
|
||||
|
||||
$(document).on('change', '.modal input[type=file]', function() {
|
||||
const file = $(this).val().replace(/\\/g, '/').split('/').slice(-1)[0];
|
||||
$(this).parents('label:eq(0)').find('input[type=text]').val(file);
|
||||
|
||||
if ($('#content-add-name').val().trim().length === 0) {
|
||||
const fileWithoutExt = file.split('.').slice(0, -1).join('.');
|
||||
$('#content-add-name').val(fileWithoutExt);
|
||||
}
|
||||
});
|
||||
|
||||
$(document).on('change', '#content-add-type', inputTypeUpdate);
|
||||
|
||||
$(document).on('click', '.folder-add', function () {
|
||||
$('.dirview .new-folder').removeClass('hidden');
|
||||
$('.page-content').animate({scrollTop: 0}, 0);
|
||||
$('.dirview input').focus();
|
||||
});
|
||||
|
||||
$(document).on('click', '.content-add', function () {
|
||||
showModal('modal-content-add');
|
||||
inputTypeUpdate();
|
||||
$('.modal-content-add input:eq(0)').focus().select();
|
||||
});
|
||||
|
||||
$(document).on('click', '.explr-item-edit', function () {
|
||||
const $item = $('.explr-dirview .highlight-clicked');
|
||||
const is_folder = $item.attr('data-folder') === '1';
|
||||
|
||||
if (is_folder) {
|
||||
$item.addClass('renaming');
|
||||
$item.find('input').focus().select();
|
||||
}
|
||||
});
|
||||
|
||||
$(document).on('click', '.explr-item-delete', function () {
|
||||
const $item = $('.explr-dirview .highlight-clicked');
|
||||
const is_folder = $item.attr('data-folder') === '1';
|
||||
let route = document.location.href;
|
||||
|
||||
if (is_folder) {
|
||||
route = $(this).attr('data-folder-route') + '?id=' + $item.attr('data-id');
|
||||
} else {
|
||||
route = $(this).attr('data-content-route') + '?id=' + $item.attr('data-id');
|
||||
}
|
||||
|
||||
if (confirm(l.js_slideshow_content_delete_confirmation)) {
|
||||
document.location.href = route;
|
||||
}
|
||||
});
|
||||
|
||||
$(document).on('click', '.content-edit', function () {
|
||||
const content = JSON.parse($(this).parents('tr:eq(0)').attr('data-entity'));
|
||||
showModal('modal-content-edit');
|
||||
|
||||
let location = content.location;
|
||||
|
||||
if (content.type == 'youtube') {
|
||||
location = 'https://www.youtube.com/watch?v=' + content.location;
|
||||
}
|
||||
|
||||
$('.modal-content-edit input:visible:eq(0)').focus().select();
|
||||
$('#content-edit-name').val(content.name);
|
||||
$('#content-edit-type').val(content.type);
|
||||
$('#content-edit-location').val(location).prop('disabled', !content.is_editable);
|
||||
$('#content-edit-id').val(content.id);
|
||||
});
|
||||
|
||||
$(document).on('submit', '.modal-content-add form', function () {
|
||||
const $modal = $(this).parents('.modal:eq(0)');
|
||||
$modal.find('button[type=submit]').addClass('hidden');
|
||||
$modal.find('.btn-loading').removeClass('hidden');
|
||||
});
|
||||
|
||||
$(document).keyup(function (e) {
|
||||
if (e.key === "Escape") {
|
||||
$('.dirview .new-folder').addClass('hidden');
|
||||
}
|
||||
});
|
||||
|
||||
main();
|
||||
});
|
||||
@ -4,6 +4,11 @@
|
||||
|
||||
}
|
||||
|
||||
.view-content-edit main .main-container {
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
@ -1,66 +0,0 @@
|
||||
<table class="{{ tclass }}-contents">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>{{ l.slideshow_content_panel_th_name }}</th>
|
||||
{% if AUTH_ENABLED %}
|
||||
<th class="tac">
|
||||
<i class="fa fa-user"></i>
|
||||
</th>
|
||||
{% endif %}
|
||||
<th class="tac">{{ l.slideshow_content_panel_th_activity }}</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr class="empty-tr {% if contents|length != 0 %}hidden{% endif %}">
|
||||
<td colspan="4">
|
||||
{{ l.slideshow_content_panel_empty|replace(
|
||||
'%link%',
|
||||
('<a href="javascript:void(0);" class="item-add content-add">'~l.slideshow_content_button_add~'</a>')|safe
|
||||
) }}
|
||||
</td>
|
||||
</tr>
|
||||
{% for content in contents %}
|
||||
<tr class="content-item" data-level="{{ content.id }}" data-entity="{{ content.to_json({"created_by": track_created(content).username, "updated_by": track_updated(content).username}) }}">
|
||||
<td class="infos">
|
||||
<div class="inner">
|
||||
{% set icon_type = 'globe' %}
|
||||
{% if content.type == enum_content_type.VIDEO %}
|
||||
{% set icon_type = 'film' %}
|
||||
{% elif content.type == enum_content_type.PICTURE %}
|
||||
{% set icon_type = 'image' %}
|
||||
{% elif content.type == enum_content_type.YOUTUBE %}
|
||||
{% set icon_type = 'video' %}
|
||||
{% endif %}
|
||||
|
||||
<i class="fa fa-{{ icon_type }} icon-left"></i>
|
||||
{{ content.name }}
|
||||
</div>
|
||||
</td>
|
||||
{% if AUTH_ENABLED %}
|
||||
<td class="tac">
|
||||
{% set creator = track_created(content) %}
|
||||
{% if creator.username %}
|
||||
<a href="javascript:void(0);" class="badge item-utrack content-utrack {% if not creator.enabled %}anonymous{% endif %}">
|
||||
{{ creator.username }}
|
||||
</a>
|
||||
{% endif %}
|
||||
</td>
|
||||
{% endif %}
|
||||
|
||||
<td class="actions tac">
|
||||
<a href="javascript:void(0);" class="item-edit content-edit">
|
||||
<i class="fa fa-pencil"></i>
|
||||
</a>
|
||||
|
||||
<a href="javascript:void(0);" class="item-delete content-delete">
|
||||
<i class="fa fa-trash"></i>
|
||||
</a>
|
||||
|
||||
<a href="{{ url_for('slideshow_content_show', content_id=content.id) }}" class="item-download content-download" target="_blank">
|
||||
<i class="fa fa-eye"></i>
|
||||
</a>
|
||||
</td>
|
||||
</tr>
|
||||
{% endfor %}
|
||||
</tbody>
|
||||
</table>
|
||||
@ -17,7 +17,7 @@
|
||||
{{ HOOK(H_SLIDESHOW_CONTENT_JAVASCRIPT) }}
|
||||
{% endblock %}
|
||||
|
||||
{% block body_class %}view-content-list{% endblock %}
|
||||
{% block body_class %}view-content-edit{% endblock %}
|
||||
|
||||
{% block page %}
|
||||
<div class="top-content">
|
||||
@ -60,44 +60,22 @@
|
||||
<div class="form-holder">
|
||||
<form class="form" action="{{ url_for('slideshow_content_save') }}" method="POST">
|
||||
|
||||
<input type="hidden" name="id" id="content-edit-id" />
|
||||
<input type="hidden" name="id" id="content-edit-id"/>
|
||||
|
||||
<div class="form-group">
|
||||
<label for="content-edit-name">{{ l.slideshow_content_form_label_name }}</label>
|
||||
<div class="widget">
|
||||
<input type="text" name="name" id="content-edit-name" required="required" />
|
||||
<div class="form-group">
|
||||
<label for="content-edit-name">{{ l.slideshow_content_form_label_name }}</label>
|
||||
<div class="widget">
|
||||
<input type="text" name="name" id="content-edit-name" required="required"/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="content-edit-type">{{ l.slideshow_content_form_label_type }}</label>
|
||||
<div class="widget">
|
||||
<select id="content-edit-type" name="type" disabled="disabled">
|
||||
{% for type in enum_content_type %}
|
||||
<option value="{{ type.value }}" data-input="{% if type.value == 'url' or type.value == 'youtube' %}text{% else %}upload{% endif %}">
|
||||
{{ t(type) }}
|
||||
</option>
|
||||
{% endfor %}
|
||||
</select>
|
||||
|
||||
<div class="form-group">
|
||||
<label for="content-edit-location">{{ l.slideshow_content_form_label_location }}</label>
|
||||
<div class="widget">
|
||||
<input type="text" name="location" id="content-edit-location"/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label for="content-edit-location">{{ l.slideshow_content_form_label_location }}</label>
|
||||
<div class="widget">
|
||||
<input type="text" name="location" id="content-edit-location" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="actions">
|
||||
<button type="button" class="btn-normal modal-close">
|
||||
{{ l.slideshow_content_form_button_cancel }}
|
||||
</button>
|
||||
<button type="submit" class="green">
|
||||
<i class="fa fa-save icon-left"></i>{{ l.slideshow_content_form_edit_submit }}
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
<div class="preview-holder">
|
||||
|
||||
@ -204,7 +204,6 @@
|
||||
<div class="modals-outer">
|
||||
<div class="modals-inner">
|
||||
{% include 'slideshow/contents/modal/add.jinja.html' %}
|
||||
{% include 'slideshow/contents/modal/edit.jinja.html' %}
|
||||
{% include 'core/utrack.jinja.html' %}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -1,47 +0,0 @@
|
||||
<div class="modal modal-content-edit modal-content hidden">
|
||||
<h2>
|
||||
{{ l.slideshow_content_form_edit_title }}
|
||||
</h2>
|
||||
|
||||
|
||||
<form class="form" action="/slideshow/content/edit" method="POST">
|
||||
|
||||
<input type="hidden" name="id" id="content-edit-id" />
|
||||
|
||||
<div class="form-group">
|
||||
<label for="content-edit-name">{{ l.slideshow_content_form_label_name }}</label>
|
||||
<div class="widget">
|
||||
<input type="text" name="name" id="content-edit-name" required="required" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="content-edit-type">{{ l.slideshow_content_form_label_type }}</label>
|
||||
<div class="widget">
|
||||
<select id="content-edit-type" name="type" disabled="disabled">
|
||||
{% for type in enum_content_type %}
|
||||
<option value="{{ type.value }}" data-input="{% if type.value == 'url' or type.value == 'youtube' %}text{% else %}upload{% endif %}">
|
||||
{{ t(type) }}
|
||||
</option>
|
||||
{% endfor %}
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label for="content-edit-location">{{ l.slideshow_content_form_label_location }}</label>
|
||||
<div class="widget">
|
||||
<input type="text" name="location" id="content-edit-location" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="actions">
|
||||
<button type="button" class="btn-normal modal-close">
|
||||
{{ l.slideshow_content_form_button_cancel }}
|
||||
</button>
|
||||
<button type="submit" class="green">
|
||||
<i class="fa fa-save icon-left"></i>{{ l.slideshow_content_form_edit_submit }}
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
Loading…
Reference in New Issue
Block a user