mbirth/LuckyCoinkydink
1
0
Fork 0
Code Issues Pull Requests Activity

Only execute dragdrop.js if device does not support touch events.

Browse Source 
Also hide noscript controls for plugin manager differently, but show
them on no-js and touch devices. This is supposed to compensate the
fact that the dragdrop JS does not work on touch devices. Might need
a better solution long-term here.
This commit is contained in:
Matthias Mees 2014-01-20 12:32:36 +01:00
parent 98e2d2fd7c
commit c731c371d3
3 changed files with 40 additions and 27 deletions

48
templates/2k11/admin/js/dragdrop.js vendored

@ -1,29 +1,31 @@
$("document").ready(function() {
$('.pluginmanager_sidebar .pluginmanager_container').sortable(getDragdropConfiguration('plugins_sidebar'));
$('.pluginmanager_event .pluginmanager_container').sortable(getDragdropConfiguration('plugins_event'));
$('.configuration_group .pluginmanager_container').sortable(getDragdropConfiguration('plugins_event'));
if (! Modernizr.touch){
$('.pluginmanager_sidebar .pluginmanager_container').sortable(getDragdropConfiguration('plugins_sidebar'));
$('.pluginmanager_event .pluginmanager_container').sortable(getDragdropConfiguration('plugins_event'));
$('.configuration_group .pluginmanager_container').sortable(getDragdropConfiguration('plugins_event'));
function getDragdropConfiguration(group) {
return {
containerSelector: '.pluginmanager_container',
group: group,
handle: '.pluginmanager_grablet',
function getDragdropConfiguration(group) {
return {
containerSelector: '.pluginmanager_container',
group: group,
handle: '.pluginmanager_grablet',
onDrop: function ($item, container, _super) {
var placement = $item.parents('.pluginmanager_container').data("placement");
$item.find('input[name$="placement]"]').val(placement);
$item.removeClass("dragged").removeAttr("style")
$("body").removeClass("dragging")
$.autoscroll.stop();
},
onDragStart: function ($item, container, _super) {
$.autoscroll.init();
$item.css({
height: $item.height(),
width: $item.width()
})
$item.addClass("dragged")
$("body").addClass("dragging")
onDrop: function ($item, container, _super) {
var placement = $item.parents('.pluginmanager_container').data("placement");
$item.find('input[name$="placement]"]').val(placement);
$item.removeClass("dragged").removeAttr("style")
$("body").removeClass("dragging")
$.autoscroll.stop();
},
onDragStart: function ($item, container, _super) {
$.autoscroll.init();
$item.css({
height: $item.height(),
width: $item.width()
})
$item.addClass("dragged")
$("body").addClass("dragging")
}
}
}
}

6
templates/2k11/admin/show_plugins.fnc.tpl

@ -56,8 +56,7 @@
{/if}
</li>
<noscript>
<li class="pluginmanager_place">
<li class="pluginmanager_place nojs-controls">
<select name="serendipity[placement][{$plugin_data['name']}]">
{foreach $plugin_data.gopts as $k => $v}
{if {$plugin_data.is_plugin_editable} && $k == 'hide'}
@ -67,7 +66,7 @@
{/foreach}
</select>
</li>
<li class="pluginmanager_move">
<li class="pluginmanager_move nojs-controls">
{if $plugin_data.sort_idx == 0}
{else}
<a href="?{$serendipity_setFormTokenUrl}&amp;serendipity[adminModule]=plugins&amp;submit=move+up&amp;serendipity[plugin_to_move]={$plugin_data.key}{if $event_only}&amp;serendipity[event_plugin]=true{/if}">
@ -82,7 +81,6 @@
</a> {* i18n *}
{/if}
</li>
</noscript>
</ul>
</li>
{/foreach}

13
templates/2k11/admin/style.css

@ -1933,6 +1933,19 @@ form > .button_link:first-of-type,
z-index: 2000;
}
/* Touch/no-js fallback */
.nojs-controls,
.touch .pluginmanager_grablet {
display: none;
visibility: hidden;
}
.no-js .nojs-controls,
.touch .nojs-controls {
display: block;
visibility: visible;
}
/* MEDIA DB
----------------------------------------------------------------- */