mirror_php/moodle
1
0
Fork 0
mirror of https://github.com/moodle/moodle.git synced 2025-01-18 05:58:34 +01:00
Code Issues Projects Releases Wiki Activity

MDL-69104 Questions: Drag and drop question family don't work with iOS

Browse Source 
- Drag and Drop marker question type
 - Drag and Drop onto image question type
 - Drag and Drop into text question type
This commit is contained in:
Huong Nguyen 2020-06-24 09:42:03 +07:00
parent c11e2517a7
commit 5fa8f1c811
9 changed files with 58 additions and 41 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
question/type/ddimageortext/amd/build/question.min.js vendored
View File

File diff suppressed because one or more lines are too long

2
question/type/ddimageortext/amd/build/question.min.js.map
View File

File diff suppressed because one or more lines are too long

20
question/type/ddimageortext/amd/src/question.js
View File

@ -336,6 +336,7 @@ define(['jquery', 'core/dragdrop', 'core/key_codes'], function($, dragDrop, keys
cloneDrag.removeClass('beingdragged');
cloneDrag.removeAttr('tabindex');
hiddenDrag.after(cloneDrag);
questionManager.addEventHandlersToDrag(cloneDrag);
drag.offset(cloneDrag.offset());
} else {
hiddenDrag.addClass('active');
@ -529,6 +530,7 @@ define(['jquery', 'core/dragdrop', 'core/key_codes'], function($, dragDrop, keys
cloneDrag.removeClass('beingdragged');
cloneDrag.removeAttr('tabindex');
hiddenDrag.after(cloneDrag);
questionManager.addEventHandlersToDrag(cloneDrag);
nextDrag.offset(cloneDrag.offset());
} else {
hiddenDrag.addClass('active');
@ -623,7 +625,7 @@ define(['jquery', 'core/dragdrop', 'core/key_codes'], function($, dragDrop, keys
{
duration: 'fast',
done: function() {
$('body').trigger('dragmoved', [drag, target, thisQ]);
$('body').trigger('qtype_ddimageortext-dragmoved', [drag, target, thisQ]);
M.util.js_complete('qtype_ddimageortext-animate-' + thisQ.containerId);
}
}
@ -962,17 +964,16 @@ define(['jquery', 'core/dragdrop', 'core/key_codes'], function($, dragDrop, keys
* Set up the event handlers that make this question type work. (Done once per page.)
*/
setupEventHandlers: function() {
// We do not use the body event here to prevent the other event on Mobile device, such as scroll event.
questionManager.addEventHandlersToDrag($('.que.ddimageortext:not(.qtype_ddimageortext-readonly) .draghome'));
$('body')
.on('mousedown touchstart',
'.que.ddimageortext:not(.qtype_ddimageortext-readonly) .draghome',
questionManager.handleDragStart)
.on('keydown',
'.que.ddimageortext:not(.qtype_ddimageortext-readonly) .dropzones .dropzone',
questionManager.handleKeyPress)
.on('keydown',
'.que.ddimageortext:not(.qtype_ddimageortext-readonly) .draghome.placed:not(.beingdragged)',
questionManager.handleKeyPress)
.on('dragmoved', questionManager.handleDragMoved);
.on('qtype_ddimageortext-dragmoved', questionManager.handleDragMoved);
$(window).on('resize', function() {
questionManager.handleWindowResize(false);
});
@ -989,6 +990,15 @@ define(['jquery', 'core/dragdrop', 'core/key_codes'], function($, dragDrop, keys
}, 100);
},
/**
* Binding the drag/touch event again for newly created element.
*
* @param {jQuery} element Element to bind the event
*/
addEventHandlersToDrag: function(element) {
element.on('mousedown touchstart', questionManager.handleDragStart);
},
/**
* Handle mouse down / touch start events on drags.
* @param {Event} e the DOM event.

2
question/type/ddmarker/amd/build/question.min.js vendored
View File

File diff suppressed because one or more lines are too long

2
question/type/ddmarker/amd/build/question.min.js.map
View File

File diff suppressed because one or more lines are too long

46
question/type/ddmarker/amd/src/question.js
View File

@ -568,6 +568,7 @@ define(['jquery', 'core/dragdrop', 'qtype_ddmarker/shapes', 'core/key_codes'], f
this.getDragClone(drag)
.removeClass('active')
.after(dragclone);
questionManager.addEventHandlersToMarker(dragclone);
}
};
@ -678,31 +679,9 @@ define(['jquery', 'core/dragdrop', 'qtype_ddmarker/shapes', 'core/key_codes'], f
* Set up the event handlers that make this question type work. (Done once per page.)
*/
setupEventHandlers: function() {
$('body')
.on('mousedown touchstart',
'.que.ddmarker:not(.qtype_ddmarker-readonly) div.draghomes .marker', questionManager.handleDragStart)
.on('mousedown touchstart',
'.que.ddmarker:not(.qtype_ddmarker-readonly) div.droparea .marker', questionManager.handleDragStart)
.on('keydown keypress',
'.que.ddmarker:not(.qtype_ddmarker-readonly) div.draghomes .marker', questionManager.handleKeyPress)
.on('keydown keypress',
'.que.ddmarker:not(.qtype_ddmarker-readonly) div.droparea .marker', questionManager.handleKeyPress)
.on('focusin',
'.que.ddmarker:not(.qtype_ddmarker-readonly) div.draghomes .marker', function(e) {
questionManager.handleKeyboardFocus(e, true);
})
.on('focusin',
'.que.ddmarker:not(.qtype_ddmarker-readonly) div.droparea .marker', function(e) {
questionManager.handleKeyboardFocus(e, true);
})
.on('focusout',
'.que.ddmarker:not(.qtype_ddmarker-readonly) div.draghomes .marker', function(e) {
questionManager.handleKeyboardFocus(e, false);
})
.on('focusout',
'.que.ddmarker:not(.qtype_ddmarker-readonly) div.droparea .marker', function(e) {
questionManager.handleKeyboardFocus(e, false);
});
// We do not use the body event here to prevent the other event on Mobile device, such as scroll event.
questionManager.addEventHandlersToMarker($('.que.ddmarker:not(.qtype_ddmarker-readonly) div.draghomes .marker'));
questionManager.addEventHandlersToMarker($('.que.ddmarker:not(.qtype_ddmarker-readonly) div.droparea .marker'));
$(window).on('resize', function() {
questionManager.handleWindowResize(false);
});
@ -719,6 +698,23 @@ define(['jquery', 'core/dragdrop', 'qtype_ddmarker/shapes', 'core/key_codes'], f
}, 100);
},
/**
* Binding the event again for newly created element.
*
* @param {jQuery} element Element to bind the event
*/
addEventHandlersToMarker: function(element) {
element
.on('mousedown touchstart', questionManager.handleDragStart)
.on('keydown keypress', questionManager.handleKeyPress)
.focusin(function(e) {
questionManager.handleKeyboardFocus(e, true);
})
.focusout(function(e) {
questionManager.handleKeyboardFocus(e, false);
});
},
/**
* Handle mouse down / touch start events on markers.
* @param {Event} e the DOM event.

2
question/type/ddwtos/amd/build/ddwtos.min.js vendored
View File

File diff suppressed because one or more lines are too long

2
question/type/ddwtos/amd/build/ddwtos.min.js.map
View File

File diff suppressed because one or more lines are too long

21
question/type/ddwtos/amd/src/ddwtos.js
View File

@ -212,6 +212,7 @@ define(['jquery', 'core/dragdrop', 'core/key_codes'], function($, dragDrop, keys
var cloneDrag = drag.clone();
cloneDrag.removeClass('beingdragged');
hiddenDrag.after(cloneDrag);
questionManager.addEventHandlersToDrag(cloneDrag);
drag.offset(cloneDrag.offset());
} else {
hiddenDrag.addClass('active');
@ -404,6 +405,7 @@ define(['jquery', 'core/dragdrop', 'core/key_codes'], function($, dragDrop, keys
cloneDrag.removeClass('beingdragged');
cloneDrag.removeAttr('tabindex');
hiddenDrag.after(cloneDrag);
questionManager.addEventHandlersToDrag(cloneDrag);
nextDrag.offset(cloneDrag.offset());
} else {
hiddenDrag.addClass('active');
@ -498,7 +500,7 @@ define(['jquery', 'core/dragdrop', 'core/key_codes'], function($, dragDrop, keys
{
duration: 'fast',
done: function() {
$('body').trigger('dragmoved', [drag, target, thisQ]);
$('body').trigger('qtype_ddwtos-dragmoved', [drag, target, thisQ]);
M.util.js_complete('qtype_ddwtos-animate-' + thisQ.containerId);
}
}
@ -738,16 +740,25 @@ define(['jquery', 'core/dragdrop', 'core/key_codes'], function($, dragDrop, keys
* Set up the event handlers that make this question type work. (Done once per page.)
*/
setupEventHandlers: function() {
$('body').on('mousedown touchstart',
'.que.ddwtos:not(.qtype_ddwtos-readonly) span.draghome',
questionManager.handleDragStart)
// We do not use the body event here to prevent the other event on Mobile device, such as scroll event.
questionManager.addEventHandlersToDrag($('.que.ddwtos:not(.qtype_ddwtos-readonly) span.draghome'));
$('body')
.on('keydown',
'.que.ddwtos:not(.qtype_ddwtos-readonly) span.drop',
questionManager.handleKeyPress)
.on('keydown',
'.que.ddwtos:not(.qtype_ddwtos-readonly) span.draghome.placed:not(.beingdragged)',
questionManager.handleKeyPress)
.on('dragmoved', questionManager.handleDragMoved);
.on('qtype_ddwtos-dragmoved', questionManager.handleDragMoved);
},
/**
* Binding the drag/touch event again for newly created element.
*
* @param {jQuery} element Element to bind the event
*/
addEventHandlersToDrag: function(element) {
element.on('mousedown touchstart', questionManager.handleDragStart);
},
/**