✨ 改进 contextjs，完善移出相册功能
This commit is contained in:
Wisp X
31
resources/js/context-js.js
vendored
31
resources/js/context-js.js
vendored
@@ -16,8 +16,6 @@ window.context = window.context || (function () {
|
||||
compress: false
|
||||
};
|
||||
|
||||
let selection;
|
||||
|
||||
function initialize(opts) {
|
||||
|
||||
options = $.extend({}, options, opts);
|
||||
@@ -48,7 +46,7 @@ window.context = window.context || (function () {
|
||||
options = $.extend({}, options, opts);
|
||||
}
|
||||
|
||||
function buildMenu(data, id, subMenu) {
|
||||
function buildMenu(event, data, id, subMenu) {
|
||||
let subClass = (subMenu) ? ' dropdown-context-sub' : '',
|
||||
compressed = options.compress ? ' compressed-context' : '',
|
||||
$menu = $('<ul class="dropdown-menu dropdown-context' + subClass + compressed + '" id="dropdown-' + id + '"></ul>');
|
||||
@@ -71,29 +69,38 @@ window.context = window.context || (function () {
|
||||
} else {
|
||||
$sub = $('<li><a tabindex="-1" href="' + data[i].href + '"' + linkTarget + '>' + data[i].text + '</a></li>');
|
||||
}
|
||||
// show or hide?
|
||||
if (typeof data[i].visible === 'function') {
|
||||
if (! data[i].visible(event)) {
|
||||
$sub.hide();
|
||||
}
|
||||
}
|
||||
let $a = $sub.find('a');
|
||||
// custom classes
|
||||
if (typeof data[i].classes !== 'undefined') {
|
||||
for (const classKey in data[i].classes) {
|
||||
$a.addClass(data[i].classes[classKey]);
|
||||
}
|
||||
}
|
||||
// custom attributes
|
||||
if (typeof data[i].attributes !== 'undefined') {
|
||||
for (const attributesKey in data[i].attributes) {
|
||||
$a.attr(attributesKey, data[i].attributes[attributesKey]);
|
||||
}
|
||||
}
|
||||
// click callback
|
||||
if (typeof data[i].action !== 'undefined') {
|
||||
let actionID = 'event-' + new Date().getTime() * Math.floor(Math.random() * 100000),
|
||||
eventAction = data[i].action;
|
||||
$a.attr('id', actionID);
|
||||
$('#' + actionID).addClass('context-event');
|
||||
$(document).on('click', '#' + actionID, function () {
|
||||
eventAction.call(this, selection);
|
||||
eventAction.call(this, event);
|
||||
});
|
||||
}
|
||||
$menu.append($sub);
|
||||
if (typeof data[i].subMenu != 'undefined') {
|
||||
let subMenuData = buildMenu(data[i].subMenu, id, true);
|
||||
let subMenuData = buildMenu(event, data[i].subMenu, id, true);
|
||||
$menu.find('li:last').append(subMenuData);
|
||||
}
|
||||
}
|
||||
@@ -117,20 +124,22 @@ window.context = window.context || (function () {
|
||||
*/
|
||||
function addContext(selector, data, open) {
|
||||
|
||||
let d = new Date(),
|
||||
id = d.getTime(),
|
||||
$menu = buildMenu(data, id);
|
||||
|
||||
$('body').append($menu);
|
||||
let id = new Date().getTime();
|
||||
|
||||
$(document).on('contextmenu', selector, function (e) {
|
||||
e.preventDefault();
|
||||
e.stopPropagation();
|
||||
selection = e;
|
||||
|
||||
let $menu = buildMenu(e.target.closest(selector), data, id);
|
||||
// clear dropdowns
|
||||
$('body .dropdown-menu.dropdown-context').remove();
|
||||
// create dropdown
|
||||
$('body').append($menu);
|
||||
|
||||
$('.dropdown-context:not(.dropdown-context-sub)').hide();
|
||||
|
||||
let $dd = $("#dropdown-" + id);
|
||||
|
||||
if (typeof options.above == 'boolean' && options.above) {
|
||||
$dd.addClass('dropdown-context-up').css({
|
||||
top: e.pageY - 20 - $('#dropdown-' + id).height(),
|
||||
|
||||
@@ -212,6 +212,7 @@
|
||||
|
||||
const resetImages = (params) => {
|
||||
$photos.addClass('reset').html('').justifiedGallery('destroy');
|
||||
ds.clearSelection();
|
||||
params = $.extend({page: 1}, params)
|
||||
imagesInfinite.refresh(params);
|
||||
}
|
||||
@@ -267,6 +268,7 @@
|
||||
}
|
||||
resetImages({page: 1, album_id: selectedAlbum});
|
||||
drawer.close();
|
||||
ds.clearSelection();
|
||||
});
|
||||
|
||||
const resetAlbums = () => {
|
||||
@@ -381,7 +383,7 @@
|
||||
copy: {
|
||||
text: '复制',
|
||||
action: e => {
|
||||
let src = $(e.target.closest(PHOTOS_ITEM)).find('img').attr('src');
|
||||
let src = $(e).find('img').attr('src');
|
||||
CopyImageClipboard.copyImageToClipboard(src).then(() => {
|
||||
toastr.success('复制成功')
|
||||
}).catch(e => {
|
||||
@@ -393,9 +395,7 @@
|
||||
rename: {text: '重命名', action: e => {}},
|
||||
open: {
|
||||
text: '新窗口打开',
|
||||
action: e => {
|
||||
window.open($(e.target.closest(PHOTOS_ITEM)).find('img').attr('src'))
|
||||
},
|
||||
action: e => window.open($(e).find('img').attr('src')),
|
||||
},
|
||||
copies: {
|
||||
text: '复制链接',
|
||||
@@ -404,47 +404,41 @@
|
||||
text: 'Url',
|
||||
classes: ['copy'],
|
||||
attributes: {"data-link-type": "url"},
|
||||
action: e => {},
|
||||
},
|
||||
{
|
||||
text: 'Html',
|
||||
classes: ['copy'],
|
||||
attributes: {"data-link-type": "html"},
|
||||
action: e => {},
|
||||
},
|
||||
{
|
||||
text: 'BBCode',
|
||||
classes: ['copy'],
|
||||
attributes: {"data-link-type": "bbcode"},
|
||||
action: e => {},
|
||||
},
|
||||
{
|
||||
text: 'Markdown',
|
||||
classes: ['copy'],
|
||||
attributes: {"data-link-type": "markdown"},
|
||||
action: e => {},
|
||||
},
|
||||
{
|
||||
text: 'Markdown with link',
|
||||
classes: ['copy'],
|
||||
attributes: {"data-link-type": "markdown_with_link"},
|
||||
action: e => {},
|
||||
},
|
||||
],
|
||||
},
|
||||
move: {
|
||||
movements: {
|
||||
text: '移动到相册',
|
||||
action: _ => {
|
||||
let selected = [];
|
||||
ds.getSelection().map(item => selected.push($(item).data('id')));
|
||||
getAlbums({title: '选择相册'}, e => {
|
||||
$(e).off('click', '>a').on('click', '>a', function () {
|
||||
axios.put('{{ route('user.images.movement') }}', {
|
||||
selected: selected,
|
||||
selected: ds.getSelection().map(item => $(item).data('id')),
|
||||
album_id: $(this).data('id')
|
||||
}).then(response => {
|
||||
if (response.data.status) {
|
||||
drawer.close();
|
||||
resetImages();
|
||||
toastr.success(response.data.message);
|
||||
} else {
|
||||
toastr.warning(response.data.message);
|
||||
@@ -454,11 +448,29 @@
|
||||
})
|
||||
},
|
||||
},
|
||||
remove: {
|
||||
text: '移出所在相册',
|
||||
action: _ => {
|
||||
axios.put('{{ route('user.images.movement') }}', {
|
||||
selected: ds.getSelection().map(item => $(item).data('id')),
|
||||
album_id: null,
|
||||
}).then(response => {
|
||||
if (response.data.status) {
|
||||
drawer.close();
|
||||
resetImages();
|
||||
toastr.success(response.data.message);
|
||||
} else {
|
||||
toastr.warning(response.data.message);
|
||||
}
|
||||
})
|
||||
},
|
||||
visible: _ => selectedAlbum !== 0,
|
||||
},
|
||||
detail: {text: '详细信息', action: e => {}},
|
||||
delete: {text: '删除', action: e => {}},
|
||||
};
|
||||
// 点击容器
|
||||
context.attach(PHOTOS_GRID, [
|
||||
context.attach('#photos-scroll', [
|
||||
methods.refresh,
|
||||
], _ => ds.clearSelection());
|
||||
// 点击图片
|
||||
@@ -468,7 +480,8 @@
|
||||
methods.copy,
|
||||
methods.copies,
|
||||
methods.open,
|
||||
methods.move,
|
||||
methods.movements,
|
||||
methods.remove,
|
||||
{divider: true},
|
||||
methods.rename,
|
||||
methods.delete,
|
||||
|
||||
Reference in New Issue
Block a user