mirror of
https://github.com/haiwen/seahub.git
synced 2025-09-03 16:10:26 +00:00
[image] use thumbnail for magnificPopups, file_view page & shared_file_view page
This commit is contained in:
@@ -657,3 +657,12 @@ function quotaSizeFormat(bytes, precision) {
|
||||
return bytes + ' B';
|
||||
}
|
||||
}
|
||||
|
||||
function encodePath(path) {
|
||||
var path_arr = path.split('/'),
|
||||
path_arr_ = [];
|
||||
for (var i = 0, len = path_arr.length; i < len; i++) {
|
||||
path_arr_.push(encodeURIComponent(path_arr[i]));
|
||||
}
|
||||
return path_arr_.join('/');
|
||||
}
|
||||
|
@@ -16,7 +16,7 @@ from constance import config
|
||||
from seahub.settings import SEAFILE_VERSION, SITE_TITLE, SITE_NAME, \
|
||||
MAX_FILE_NAME, BRANDING_CSS, LOGO_PATH, LOGO_WIDTH, LOGO_HEIGHT,\
|
||||
SHOW_REPO_DOWNLOAD_BUTTON, SITE_ROOT, ENABLE_GUEST_INVITATION, \
|
||||
FAVICON_PATH
|
||||
FAVICON_PATH, ENABLE_THUMBNAIL
|
||||
|
||||
try:
|
||||
from seahub.settings import SEACLOUD_MODE
|
||||
@@ -86,6 +86,7 @@ def base(request):
|
||||
'SITE_ROOT': SITE_ROOT,
|
||||
'constance_enabled': dj_settings.CONSTANCE_ENABLED,
|
||||
'FILE_SERVER_ROOT': file_server_root,
|
||||
'enable_thumbnail': ENABLE_THUMBNAIL,
|
||||
'enable_guest_invitation': ENABLE_GUEST_INVITATION,
|
||||
'enable_terms_and_conditions': dj_settings.ENABLE_TERMS_AND_CONDITIONS,
|
||||
'is_pro': True if is_pro_version() else False,
|
||||
|
@@ -122,5 +122,18 @@ $('#file-save-form').submit(function() {
|
||||
});
|
||||
{% endif %}
|
||||
{% include "snippets/file_content_js.html" %}
|
||||
|
||||
{% if filetype == 'Image' and not err %}
|
||||
{% if enable_thumbnail %}
|
||||
{% if from_shared_dir %}
|
||||
var encoded_path = encodePath('{{ path|escapejs }}'); // path: '/Portrait_8.jpg'
|
||||
$('#image-view').attr('src', '{{ SITE_ROOT }}thumbnail/{{ shared_token }}/1024' + encoded_path);
|
||||
{% else %}
|
||||
$('#image-view').attr('src', '{{ SITE_ROOT }}thumbnail/{{ shared_token }}/1024/' + encodeURIComponent('{{file_name|escapejs}}'));
|
||||
{% endif %}
|
||||
{% else %}
|
||||
$('#image-view').attr('src', '{{ raw_path|escapejs }}');
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
</script>
|
||||
{% endblock %}
|
||||
|
@@ -20,7 +20,7 @@ For details please refer to 'snippets/file_content_js.html'.
|
||||
{% endif %}
|
||||
|
||||
{% if filetype == 'Image' %}
|
||||
<img src="{{ raw_path }}" alt="{{ u_filename}}" id="image-view" />
|
||||
<img src="" alt="{{ file_name }}" id="image-view" />
|
||||
{% endif %}
|
||||
|
||||
{% if filetype == 'Document' or filetype == 'PDF' and not use_pdfjs %}
|
||||
|
@@ -17,11 +17,7 @@
|
||||
{% endif %}
|
||||
|
||||
{% if filetype == 'Image' %}
|
||||
function setFileViewAreaHeight() {
|
||||
var $fileView = $('#file-view');
|
||||
$fileView.outerHeight($(window).height() - $fileView.offset().top);
|
||||
}
|
||||
$(window).load(setFileViewAreaHeight).resize(setFileViewAreaHeight);
|
||||
{% include 'snippets/image_file_view_js.html' %}
|
||||
{% endif %}
|
||||
|
||||
{% if filetype == 'SVG' %}
|
||||
|
5
seahub/templates/snippets/image_file_view_js.html
Normal file
5
seahub/templates/snippets/image_file_view_js.html
Normal file
@@ -0,0 +1,5 @@
|
||||
function setFileViewAreaHeight() {
|
||||
var $fileView = $('#file-view');
|
||||
$fileView.outerHeight($(window).height() - $fileView.offset().top);
|
||||
}
|
||||
$(window).load(setFileViewAreaHeight).resize(setFileViewAreaHeight);
|
@@ -17,12 +17,21 @@ body { overflow:hidden; }
|
||||
<a href="{% url 'view_lib_file' repo.id img_next %}" id="img-next" title="{% trans 'you can also press → ' %}"><span class="icon-chevron-right"></span></a>
|
||||
{% endif %}
|
||||
|
||||
<img src="{{ raw_path }}" alt="{{ u_filename}}" id="image-view" />
|
||||
<img src="" alt="{{ filename }}" id="image-view" />
|
||||
{% endblock %}
|
||||
|
||||
{% block extra_script %}{{ block.super }}
|
||||
|
||||
<script type="text/javascript">
|
||||
{% if enable_thumbnail and not repo.encrypted %}
|
||||
var encoded_path = encodePath('{{ path|escapejs }}'); // path: '/Portrait_8.jpg'
|
||||
$('#image-view').attr('src', '{{ SITE_ROOT }}thumbnail/{{ repo.id }}/1024' + encoded_path);
|
||||
{% else %}
|
||||
$('#image-view').attr('src', '{{ raw_path|escapejs }}');
|
||||
{% endif %}
|
||||
|
||||
{% include 'snippets/image_file_view_js.html' %}
|
||||
|
||||
{% if img_prev or img_next %}
|
||||
var input_focus = false;
|
||||
$('input, textarea').focus(function() {
|
||||
@@ -45,11 +54,5 @@ $('body').bind('keydown', function(e) {
|
||||
}
|
||||
})
|
||||
{% endif %}
|
||||
|
||||
function setFileViewAreaHeight() {
|
||||
var $fileView = $('#file-view');
|
||||
$fileView.outerHeight($(window).height() - $fileView.offset().top);
|
||||
}
|
||||
$(window).load(setFileViewAreaHeight).resize(setFileViewAreaHeight);
|
||||
</script>
|
||||
{% endblock %}
|
||||
|
@@ -36,6 +36,7 @@ $(function() {
|
||||
|
||||
{% if filetype == 'PDF' and use_pdfjs and not err %}
|
||||
{% elif filetype == 'Image' and not err %}
|
||||
$('#image-view').attr('src', '{{ raw_path|escapejs }}');
|
||||
{% else %}
|
||||
function setFileViewAreaHeight() {
|
||||
$('body').css({'overflow':'auto'});
|
||||
|
@@ -162,6 +162,10 @@
|
||||
{% block extra_script %}
|
||||
<script type="text/javascript" src="{% static "scripts/lib/jquery.magnific-popup.js" %}"></script>
|
||||
<script type="text/javascript">
|
||||
var cur_path = '{{path|escapejs}}';
|
||||
var share_link_token = '{{token}}';
|
||||
var file_server_root = '{{FILE_SERVER_ROOT}}';
|
||||
|
||||
var magnificOptions = {
|
||||
type: 'image',
|
||||
tClose: "{% trans "Close (Esc)" %}", // Alt text on close button
|
||||
@@ -182,13 +186,17 @@ var magnificOptions = {
|
||||
tError: '{% trans '<a href="%url%" target="_blank">The image</a> could not be loaded.' %}' // Error message when image could not be loaded
|
||||
}
|
||||
};
|
||||
|
||||
{% if not repo.encrypted and ENABLE_THUMBNAIL %}
|
||||
$('[data-mfp-src]').each(function(index, item) {
|
||||
var $item = $(item);
|
||||
var file_name = $item.closest('.file-item').attr('data-name');
|
||||
$item.attr('data-mfp-src', '{{ SITE_ROOT }}thumbnail/{{ token }}/1024' + encodePath(cur_path + file_name));
|
||||
});
|
||||
{% endif %}
|
||||
$('.img-name-link').magnificPopup(magnificOptions);
|
||||
$('.img-img-link').magnificPopup(magnificOptions);
|
||||
|
||||
var cur_path = '{{path|escapejs}}';
|
||||
var share_link_token = '{{token}}';
|
||||
var file_server_root = '{{FILE_SERVER_ROOT}}';
|
||||
|
||||
$('.shared-dir-zip, .download-dir').click(function (e) {
|
||||
var cur_download_dir_path;
|
||||
var interval,
|
||||
|
@@ -222,13 +222,34 @@ define([
|
||||
updateMagnificPopupOptions: function(options) {
|
||||
var repo_id = this.dir.repo_id,
|
||||
path = this.dir.path;
|
||||
|
||||
var use_thumbnail = true;
|
||||
if (!app.pageOptions.enable_thumbnail || this.dir.encrypted) {
|
||||
use_thumbnail = false;
|
||||
}
|
||||
var genItem = function(model) {
|
||||
var name = model.get('obj_name');
|
||||
var dirent_path = Common.pathJoin([path, name]);
|
||||
var url_options = {
|
||||
'repo_id': repo_id,
|
||||
'path': Common.encodePath(dirent_path)
|
||||
};
|
||||
var item_src;
|
||||
if (use_thumbnail) {
|
||||
item_src = Common.getUrl($.extend(url_options, {
|
||||
'name': 'thumbnail_get',
|
||||
'size': 1024
|
||||
}));
|
||||
} else {
|
||||
item_src = Common.getUrl($.extend(url_options, {
|
||||
'name': 'view_raw_file'
|
||||
}));
|
||||
}
|
||||
|
||||
var item = {
|
||||
'name': name,
|
||||
'url': model.getWebUrl(),
|
||||
'src': app.config.siteRoot + 'repo/' + repo_id + '/raw' + Common.encodePath(dirent_path)
|
||||
'src': item_src
|
||||
};
|
||||
return item;
|
||||
};
|
||||
|
@@ -32,6 +32,16 @@ define([
|
||||
|
||||
var tmpl = $(window).width() >= 768 ? this.template : this.mobileTemplate;
|
||||
this.$el.html(tmpl(data));
|
||||
|
||||
if (app.pageOptions.enable_thumbnail) {
|
||||
this.$('.img-name-link').attr('data-mfp-src', Common.getUrl({
|
||||
'name': 'thumbnail_get',
|
||||
'repo_id': data.repo_id,
|
||||
'size': 1024,
|
||||
'path': data.encoded_path
|
||||
}));
|
||||
}
|
||||
|
||||
return this;
|
||||
},
|
||||
|
||||
|
@@ -94,7 +94,6 @@ define([
|
||||
|
||||
render: function() {
|
||||
this.$el.html(this.template());
|
||||
$("#right-panel").html(this.$el);
|
||||
|
||||
this.$table = this.$('table');
|
||||
this.$tableBody = this.$('tbody');
|
||||
|
@@ -144,10 +144,14 @@ define([
|
||||
case 'group_discussions': return siteRoot + 'api2/groups/' + options.group_id + '/discussions/';
|
||||
case 'group_discussion': return siteRoot + 'api2/groups/' + options.group_id + '/discussions/' + options.discussion_id + '/';
|
||||
|
||||
// Misc
|
||||
// thumbnail
|
||||
case 'thumbnail_create': return siteRoot + 'thumbnail/' + options.repo_id + '/create/';
|
||||
case 'get_popup_notices': return siteRoot + 'ajax/get_popup_notices/';
|
||||
case 'thumbnail_get': return siteRoot + 'thumbnail/' + options.repo_id + '/' + options.size + options.path;
|
||||
|
||||
// Misc
|
||||
case 'view_raw_file': return siteRoot + 'repo/' + options.repo_id + '/raw' + options.path;
|
||||
|
||||
case 'get_popup_notices': return siteRoot + 'ajax/get_popup_notices/';
|
||||
case 'notifications': return siteRoot + 'api/v2.1/notifications/';
|
||||
case 'notification': return siteRoot + 'api/v2.1/notification/';
|
||||
case 'user_enabled_modules': return siteRoot + 'api/v2.1/user-enabled-modules/';
|
||||
|
Reference in New Issue
Block a user