Moodle
  1. Moodle
  2. MDL-38367

Course drag & drop UI improvement

    Details

    • Type: Bug Bug
    • Status: Closed
    • Priority: Major Major
    • Resolution: Fixed
    • Affects Version/s: 2.5
    • Fix Version/s: 2.5
    • Component/s: Course, Usability
    • Labels:
    • Testing Instructions:
      Hide
      1. Enable text drag & drop under Experimental settings
      2. Turn on course editing
      3. Drag some text onto a course
        1. Check a Moodle-themed dialog box appears
        2. Check the 'name' box is disabled when 'add label to course page' is selected
        3. Check the 'name' box is enabled when 'create page resource' is selected
        4. Check the 'submit' button is disabled when 'create page resource' is selected and no name entered
        5. Check the 'submit' button is enabled when a name is entered (and disabled again if the text is deleted)
        6. Check that when editing the name 'enter' submits the form and creates a page
      4. Drag some more text
        1. Check that selecting 'label' and submitting creates a label with the text
      5. Drag a file or some text (or a link)
      6. Move the mouse over the 'Add X here' text in the section
        1. Check that you can drop directly onto the 'Add X here' text and that it uploads as expected

      As always, this needs testing in Firefox, Chrome, Safari and IE10

      Show
      Enable text drag & drop under Experimental settings Turn on course editing Drag some text onto a course Check a Moodle-themed dialog box appears Check the 'name' box is disabled when 'add label to course page' is selected Check the 'name' box is enabled when 'create page resource' is selected Check the 'submit' button is disabled when 'create page resource' is selected and no name entered Check the 'submit' button is enabled when a name is entered (and disabled again if the text is deleted) Check that when editing the name 'enter' submits the form and creates a page Drag some more text Check that selecting 'label' and submitting creates a label with the text Drag a file or some text (or a link) Move the mouse over the 'Add X here' text in the section Check that you can drop directly onto the 'Add X here' text and that it uploads as expected As always, this needs testing in Firefox, Chrome, Safari and IE10
    • Affected Branches:
      MOODLE_25_STABLE
    • Fixed Branches:
      MOODLE_25_STABLE
    • Pull Master Branch:
      MDL-38367_dnd_ui_improvements
    • Rank:
      48259

      Description

      Here are some screenshots and things that could/should be improved in regard to the Drag & Drop on a course page:

      Text DND

      • Unlike when dropping a file, there is no introductory text, perhaps "What do you want to do with this text makes sense"
      • "What do you want to call this text" does not sound very good to me, especially that so far we only have a title/name for the text added as a "Page"

      Prompt

      • The prompt window is not standard to the new moodle dialogues
        • Buttons are too big
        • Alignment is different
        • No title bar and close button
        • The colour, size and line-hight of the text is different
      • <enter> does not trigger the submit action
      • Upload button should be greyed out when no title is entered

      Course page

      • Add text/link/file(s) here is not visible when the section is really long
      • The loading icon
        • is not aligned with the text
        • is not standard to the rest of the icons
        • does not have the proper original size
      • The progress bar style does not seem to match Moodle one's
      • DND on the text Add text/link/file(s) here does not work, you have to drag any where else in the section

        Issue Links

          Activity

          Hide
          Frédéric Massart added a comment -

          (Added Helen for the wording part)

          Show
          Frédéric Massart added a comment - (Added Helen for the wording part)
          Hide
          Dan Poltawski added a comment -

          Assigning to davo

          Show
          Dan Poltawski added a comment - Assigning to davo
          Hide
          Davo Smith added a comment -

          Some of these I can address, some I'm not sure I can sort out myself.

          Text DND

          • The introductory text was 'what do you want to call this page?'. Now that has been tweaked and moved down, I should be able to add some replacement text ('What do you want to do with this text?')
          • Theoretically any 3rd-party add-on could extend this, so we shouldn't really mention 'page'. How about simply 'Name'?

          Prompt

          • This is just using a plain YUI3 panel - I don't really know how to style it differently to how it is now (and it is the same styling since these dialogues were introduced in 2.3)
          • I raised the lack of 'Enter' trigger when the code was first integrated, I'm still not sure how to trigger a submit when enter is pressed on a YUI panel
          • I assume you only mean the upload should be disabled if a handler that requires a name is selected?

          Course page

          • I can easily add a class to the entire section, but would probably need some help with suitable styling for it.
          • I can't quite sure what is wrong with the loading icon - it is inserted and styled in exactly the same way as the other icons on the page; when the upload is complete the only change to the icon is the 'src' attribute to show the correct final icon (which then matches the other icons on the page correctly?). It also uses the standard Moodle AJAX loading icon.
          • Could you give some examples of other progress bars in Moodle that this one does not match? Also, could you explain how this one should be changed to match the style of the others?
          • The 'add files here' text is to indicate where the resource will be created, not a target to drop onto. However, I did make sure that it worked as well as dropping files onto the rest of the section and cannot reproduce the problem you have mentioned.
          Show
          Davo Smith added a comment - Some of these I can address, some I'm not sure I can sort out myself. Text DND The introductory text was 'what do you want to call this page?'. Now that has been tweaked and moved down, I should be able to add some replacement text ('What do you want to do with this text?') Theoretically any 3rd-party add-on could extend this, so we shouldn't really mention 'page'. How about simply 'Name'? Prompt This is just using a plain YUI3 panel - I don't really know how to style it differently to how it is now (and it is the same styling since these dialogues were introduced in 2.3) I raised the lack of 'Enter' trigger when the code was first integrated, I'm still not sure how to trigger a submit when enter is pressed on a YUI panel I assume you only mean the upload should be disabled if a handler that requires a name is selected? Course page I can easily add a class to the entire section, but would probably need some help with suitable styling for it. I can't quite sure what is wrong with the loading icon - it is inserted and styled in exactly the same way as the other icons on the page; when the upload is complete the only change to the icon is the 'src' attribute to show the correct final icon (which then matches the other icons on the page correctly?). It also uses the standard Moodle AJAX loading icon. Could you give some examples of other progress bars in Moodle that this one does not match? Also, could you explain how this one should be changed to match the style of the others? The 'add files here' text is to indicate where the resource will be created, not a target to drop onto. However, I did make sure that it worked as well as dropping files onto the rest of the section and cannot reproduce the problem you have mentioned.
          Hide
          Andrew Nicols added a comment -

          Hi Davo,

          For the YUI3 panel, IIRC you should just be able to replace it with M.core.dialogue instead of Y.Panel. You'll need to use depend on moodle-core-notification.

          Andrew

          Show
          Andrew Nicols added a comment - Hi Davo, For the YUI3 panel, IIRC you should just be able to replace it with M.core.dialogue instead of Y.Panel. You'll need to use depend on moodle-core-notification. Andrew
          Hide
          Helen Foster added a comment -

          More drag & drop in Moodle - wonderful! Many thanks Davo.

          My suggested wording (from looking other drag & drop dialogues) is:

          What do you want to do with the text?

          • Add a label to the course page
          • Create a page resource
            Name ...........

          Note: The words 'a' and 'the' could be omitted - Add label to course page - but I think if there's space, it's nicer to include them.

          Show
          Helen Foster added a comment - More drag & drop in Moodle - wonderful! Many thanks Davo. My suggested wording (from looking other drag & drop dialogues) is: What do you want to do with the text? Add a label to the course page Create a page resource Name ........... Note: The words 'a' and 'the' could be omitted - Add label to course page - but I think if there's space, it's nicer to include them.
          Hide
          Davo Smith added a comment -
          • Switched to Moodle-style dialog boxes (thanks Andrew for the pointer)
          • Enter button now submits the form (from within the 'name' field)
          • Upload button is disabled when the name is empty (if the name is required for the selected handler)
          • Dialog now has 'What do you want to do with this text?' and 'Name' for the text
          • Entire course section is now highlighted as you drag into it - please note I regard this as temporary styling - I'm hoping that someone will take it and tweak it (but this should do as a placeholder for now)
          Show
          Davo Smith added a comment - Switched to Moodle-style dialog boxes (thanks Andrew for the pointer) Enter button now submits the form (from within the 'name' field) Upload button is disabled when the name is empty (if the name is required for the selected handler) Dialog now has 'What do you want to do with this text?' and 'Name' for the text Entire course section is now highlighted as you drag into it - please note I regard this as temporary styling - I'm hoping that someone will take it and tweak it (but this should do as a placeholder for now)
          Hide
          Frédéric Massart added a comment -

          Hi Davo,

          Wow, this looks really good! Thanks!

          • The problem with the loading icon is that it's not a proper 24x24 image, and so it's a bit blunt. Also, you are right, no need to change the alignment.
          • I can't think of any other progress bar, but I just feel like that one does not fit in the new greyscale'd theming (icons, prompts, ...). I don't have any idea, I am just raising a point
          • That would be really good if I could drag and drop on "Add files here". I tend to drop on "Here" and am always frustrated to see that it didn't work.

          About the patch itself, keeping in mind that I don't know much about Moodle dialogues at all:

          • Could you have the same look and feel of the buttons than on "Add resource or activity"? Or is it the modchooser that has to be updated to match this?
          • I don't think we should pull in something with "temporary styling". Worse case scenario it'll sit there for months. I don't think the current style is good enough to make it in. I have just thought that perhaps, instead of changing the style of the section, we could use Gmail method: have a div overlapping the whole section with a nice display "Drag here" (see screenshot). The same kind of mask than the one used when we drop a section.
          • I see you change the order of the arguments of a function, is it safe?
          • The new handlermessage seem to be able to be passed by each type (I might have read too quickly), how will we decide on which handlermessage to be displayed?

          Many thanks!
          Fred

          Show
          Frédéric Massart added a comment - Hi Davo, Wow, this looks really good! Thanks! The problem with the loading icon is that it's not a proper 24x24 image, and so it's a bit blunt. Also, you are right, no need to change the alignment. I can't think of any other progress bar, but I just feel like that one does not fit in the new greyscale'd theming (icons, prompts, ...). I don't have any idea, I am just raising a point That would be really good if I could drag and drop on "Add files here". I tend to drop on "Here" and am always frustrated to see that it didn't work. About the patch itself, keeping in mind that I don't know much about Moodle dialogues at all: Could you have the same look and feel of the buttons than on "Add resource or activity"? Or is it the modchooser that has to be updated to match this? I don't think we should pull in something with "temporary styling". Worse case scenario it'll sit there for months. I don't think the current style is good enough to make it in. I have just thought that perhaps, instead of changing the style of the section, we could use Gmail method: have a div overlapping the whole section with a nice display "Drag here" (see screenshot). The same kind of mask than the one used when we drop a section. I see you change the order of the arguments of a function, is it safe? The new handlermessage seem to be able to be passed by each type (I might have read too quickly), how will we decide on which handlermessage to be displayed? Many thanks! Fred
          Hide
          Frédéric Massart added a comment -

          (The "Add files here" could look more like the File Manager actually: removing/hiding the content and having a nice message coming over)

          Show
          Frédéric Massart added a comment - (The "Add files here" could look more like the File Manager actually: removing/hiding the content and having a nice message coming over)
          Hide
          Davo Smith added a comment -

          The 'Add files here' should be a valid drop target - the only reason it isn't is due to a bug in Firefox that means that changing the text of the element stops it from inheriting the drag and drop events from the parent element.

          I think I have a workaround (that involves directly manipulating the value of the text node, rather than setting the content of the 'span' element), but needs some checking & cross-browser testing.

          As for the highlighting of the whole span - I will remove the styling I've put in place, but I'll leave the adding / removing of the class from the section. That way, someone with a clear idea of how the section should be styled when a drag happens over it can do that styling at a later date (and probably as a separate issue).

          Show
          Davo Smith added a comment - The 'Add files here' should be a valid drop target - the only reason it isn't is due to a bug in Firefox that means that changing the text of the element stops it from inheriting the drag and drop events from the parent element. I think I have a workaround (that involves directly manipulating the value of the text node, rather than setting the content of the 'span' element), but needs some checking & cross-browser testing. As for the highlighting of the whole span - I will remove the styling I've put in place, but I'll leave the adding / removing of the class from the section. That way, someone with a clear idea of how the section should be styled when a drag happens over it can do that styling at a later date (and probably as a separate issue).
          Hide
          Davo Smith added a comment -

          I've amended the first commit to remove the CSS change - the new class 'dndupload-over' is still added to the relevant section, but no styling takes advantage of that yet (I'm going to open a separate issue to see if someone could take that on).

          I've also added a second commit to work around the firefox bug that prevents the 'Add X here' from being a drop target.

          Show
          Davo Smith added a comment - I've amended the first commit to remove the CSS change - the new class 'dndupload-over' is still added to the relevant section, but no styling takes advantage of that yet (I'm going to open a separate issue to see if someone could take that on). I've also added a second commit to work around the firefox bug that prevents the 'Add X here' from being a drop target.
          Hide
          Frédéric Massart added a comment - - edited

          Thanks Davo,

          glad to hear you found a workaround for Firefox. Before I proceed to the second review, could you please comment on those points:

          • Could you have the same look and feel of the buttons than on "Add resource or activity"? Or is it the modchooser that has to be updated to match this? (on a second look, I think your way is right. I'll have a word with Andrew Nicols to see if addButtons were avoided for a reason).
          • I see you change the order of the arguments of a function, is it safe?
          • The new handlermessage seem to be able to be passed by each type (I might have read too quickly), how will we decide on which handlermessage to be displayed?

          Thanks!
          Fred

          Show
          Frédéric Massart added a comment - - edited Thanks Davo, glad to hear you found a workaround for Firefox. Before I proceed to the second review, could you please comment on those points: Could you have the same look and feel of the buttons than on "Add resource or activity"? Or is it the modchooser that has to be updated to match this? (on a second look, I think your way is right. I'll have a word with Andrew Nicols to see if addButtons were avoided for a reason). I see you change the order of the arguments of a function, is it safe? The new handlermessage seem to be able to be passed by each type (I might have read too quickly), how will we decide on which handlermessage to be displayed? Thanks! Fred
          Hide
          Davo Smith added a comment -
          • I have used the standard Moodle dialog box and added a couple of buttons onto it. If there is a problem with the styling, then I think that needs to be raised with whoever styled the Moodle dialog.
          • add_type is only called directly from within dnduploadlib.php - any plugin that want to add an additional type (which is very unlikely anyway, as I've already covered the types that browsers actually return), does this through the array returned by 'PLUGINNAME_dndupload_register' (which already handles the lack of 'handlermessage').
          • I'm confused by the 'handlermessage' question. It displays the handler message relevant to the data type that has been dropped onto a course (in exactly the same way that it doesn't offer to create a URL when you drop some text onto a page, it only displays the options / message relevant to that type).
          Show
          Davo Smith added a comment - I have used the standard Moodle dialog box and added a couple of buttons onto it. If there is a problem with the styling, then I think that needs to be raised with whoever styled the Moodle dialog. add_type is only called directly from within dnduploadlib.php - any plugin that want to add an additional type (which is very unlikely anyway, as I've already covered the types that browsers actually return), does this through the array returned by 'PLUGINNAME_dndupload_register' (which already handles the lack of 'handlermessage'). I'm confused by the 'handlermessage' question. It displays the handler message relevant to the data type that has been dropped onto a course (in exactly the same way that it doesn't offer to create a URL when you drop some text onto a page, it only displays the options / message relevant to that type).
          Hide
          Mary Evans added a comment -

          Davo have you rebased this recently? If not you probably need to.

          Show
          Mary Evans added a comment - Davo have you rebased this recently? If not you probably need to.
          Hide
          Davo Smith added a comment -

          Rebased onto master, as requested (no merge conflicts)

          Show
          Davo Smith added a comment - Rebased onto master, as requested (no merge conflicts)
          Hide
          Mary Evans added a comment -

          Hi thanks.

          I've tried testing this. First off I was using FireFox then read your note to Fred saying that there is a bug with that browser. So I swapped to Chrome. Got no joy there.

          So that I am on the right track, is there a problem with Chrome too, if so which browser should I be using to test this.

          You said drag anything on a course page, does this include moving blocks and resources?

          Show
          Mary Evans added a comment - Hi thanks. I've tried testing this. First off I was using FireFox then read your note to Fred saying that there is a bug with that browser. So I swapped to Chrome. Got no joy there. So that I am on the right track, is there a problem with Chrome too, if so which browser should I be using to test this. You said drag anything on a course page, does this include moving blocks and resources?
          Hide
          Frédéric Massart added a comment -

          Hi Davo,

          Here are a few comments, I don't know which ones follow your patch, so please ignore the irrelevant ones:

          1. On Firefox
            • I see "Add file(s) here", instead of text.
            • Dropping text from Chromium returns random kanjis and other characters: "猼慰瑳汹㵥挢汯牯›杲⡢ⰰ〠‬⤰※潦瑮昭浡..."
          2. On Chrome, dragging from Firefox results in: "This upload does not have any content".
          3. You're not introducing it, but I noticed that the button could perhaps be renamed to something else than "Upload" when dragging text.
          4. Thanks for commenting on the parameters swap, I am not sure it's ok, but I'll let the integrators decide.
          5. I was just seeking your opinion about the theming of the dialogues. I think it makes more sense to use the built-in addButton method.
          6. Sorry about handlermessage, I thought that plugins could overwrite previous definition of it, my bad.

          Please feel free to push for integration whenever you are ready. Thanks!

          Fred

          Show
          Frédéric Massart added a comment - Hi Davo, Here are a few comments, I don't know which ones follow your patch, so please ignore the irrelevant ones: On Firefox I see "Add file(s) here", instead of text . Dropping text from Chromium returns random kanjis and other characters: "猼慰瑳汹㵥挢汯牯›杲⡢ⰰ〠‬⤰※潦瑮昭浡..." On Chrome, dragging from Firefox results in: "This upload does not have any content". You're not introducing it, but I noticed that the button could perhaps be renamed to something else than "Upload" when dragging text. Thanks for commenting on the parameters swap, I am not sure it's ok, but I'll let the integrators decide. I was just seeking your opinion about the theming of the dialogues. I think it makes more sense to use the built-in addButton method. Sorry about handlermessage, I thought that plugins could overwrite previous definition of it, my bad. Please feel free to push for integration whenever you are ready. Thanks! Fred
          Hide
          Davo Smith added a comment -

          1.

          Show
          Davo Smith added a comment - 1. Cannot reproduce This is unfixable and not new please see comments here onwards: https://tracker.moodle.org/browse/MDL-22504?focusedCommentId=158332&page=com.atlassian.jira.plugin.system.issuetabpanels:comment-tabpanel#comment-158332 2. See last comment. 3. The text is still being 'uploaded' to the server, but not that important.
          Hide
          Davo Smith added a comment -

          Mary - I'm not quite sure what you are trying to do.

          The Firefox bug is very minor - it stops you from dropping files, etc. onto the text that reads 'Add X here', the entire rest of the section is still a drop target (and if you grab the latest version of the code attached here, then Firefox works properly anyway).

          If you are referring to MDL-38396 then there is currently no styling added to the section when you drag over it, this current patch just adds a class to the section, but no styling (Fred specifically asked me to remove the styling that I had put in place, see: https://tracker.moodle.org/browse/MDL-38367?focusedCommentId=207184&page=com.atlassian.jira.plugin.system.issuetabpanels:comment-tabpanel#comment-207184 )

          Show
          Davo Smith added a comment - Mary - I'm not quite sure what you are trying to do. The Firefox bug is very minor - it stops you from dropping files, etc. onto the text that reads 'Add X here', the entire rest of the section is still a drop target (and if you grab the latest version of the code attached here, then Firefox works properly anyway). If you are referring to MDL-38396 then there is currently no styling added to the section when you drag over it, this current patch just adds a class to the section, but no styling (Fred specifically asked me to remove the styling that I had put in place, see: https://tracker.moodle.org/browse/MDL-38367?focusedCommentId=207184&page=com.atlassian.jira.plugin.system.issuetabpanels:comment-tabpanel#comment-207184 )
          Hide
          Mary Evans added a comment -

          Ah...now you've added some test instructions, this makes it easier. Sorry but I was unaware of the Experimental Text dnd which seems to hinge on this being either right or wrong.

          Show
          Mary Evans added a comment - Ah...now you've added some test instructions, this makes it easier. Sorry but I was unaware of the Experimental Text dnd which seems to hinge on this being either right or wrong.
          Hide
          Eloy Lafuente (stronk7) added a comment -

          The main moodle.git repository has just been updated with latest weekly modifications. You may wish to rebase your PULL branches to simplify history and avoid any possible merge conflicts. This would also make integrator's life easier next week.

          TIA and ciao

          Show
          Eloy Lafuente (stronk7) added a comment - The main moodle.git repository has just been updated with latest weekly modifications. You may wish to rebase your PULL branches to simplify history and avoid any possible merge conflicts. This would also make integrator's life easier next week. TIA and ciao
          Hide
          Damyon Wiese added a comment -

          Hi Davo,

          Thanks for working on this issue - it looks very nice in the course page.

          Some comments:
          1. In course/dndupload.js:

          // Horrible work-around to allow the 'Add X here' text to be a drop target in Firefox.
          +        var node = preview.one('span')._node;
          

          _node is not part of the public API of Node and we can't start using it.

          Perhaps the solution here is to use delegate instead of Y.on for the listeners.

          Re: the add_type - I can see that it is only part of the internal API - but the function is public so we should at least document the change in upgrade.txt. Especially because there is an optional arg to the function so code will potentially not fail - just do the wrong thing. (My preference would be to add a new protected function and call it from the existing one, while deprecate the existing one).

          Everything else looks OK - once I get comments on the above I will re-do the integration review.

          Thanks, Damyon

          Show
          Damyon Wiese added a comment - Hi Davo, Thanks for working on this issue - it looks very nice in the course page. Some comments: 1. In course/dndupload.js: // Horrible work-around to allow the 'Add X here' text to be a drop target in Firefox. + var node = preview.one('span')._node; _node is not part of the public API of Node and we can't start using it. Perhaps the solution here is to use delegate instead of Y.on for the listeners. Re: the add_type - I can see that it is only part of the internal API - but the function is public so we should at least document the change in upgrade.txt. Especially because there is an optional arg to the function so code will potentially not fail - just do the wrong thing. (My preference would be to add a new protected function and call it from the existing one, while deprecate the existing one). Everything else looks OK - once I get comments on the above I will re-do the integration review. Thanks, Damyon
          Hide
          Davo Smith added a comment -

          Thanks for the feedback Damyon.

          I've updated the code with the following changes:

          • Javascript now uses the API function getDOMNode instead of secret member variable _node
          • public add_type function deprecated and protected add_type_internal function now replaces it

          I hope that is OK now,

          Davo

          Show
          Davo Smith added a comment - Thanks for the feedback Damyon. I've updated the code with the following changes: Javascript now uses the API function getDOMNode instead of secret member variable _node public add_type function deprecated and protected add_type_internal function now replaces it I hope that is OK now, Davo
          Hide
          Damyon Wiese added a comment -

          Thanks for the extra changes Davo,

          I added one more commit - I didn't like "_internal" in the function name so I changed it to "register_type". I also deprecated add_type_handler and add_file_handler as they had the exact same usage pattern.

          This is now integrated to master.

          Show
          Damyon Wiese added a comment - Thanks for the extra changes Davo, I added one more commit - I didn't like "_internal" in the function name so I changed it to "register_type". I also deprecated add_type_handler and add_file_handler as they had the exact same usage pattern. This is now integrated to master.
          Hide
          Ankit Agarwal added a comment -

          When am draging a link in a section it says "Add files here" in ff where as "Add text here" in chrome.
          Text drag and drop doesnt work in ie9
          Will test on ie10 and safari tomorrow and report.
          Thanks

          Show
          Ankit Agarwal added a comment - When am draging a link in a section it says "Add files here" in ff where as "Add text here" in chrome. Text drag and drop doesnt work in ie9 Will test on ie10 and safari tomorrow and report. Thanks
          Hide
          Davo Smith added a comment -

          Ankit - where are you dragging the text from? Is it from another Firefox window or from Chrome? Dragging from one browser to another does not work (and is unfixable via Javascript code).

          Show
          Davo Smith added a comment - Ankit - where are you dragging the text from? Is it from another Firefox window or from Chrome? Dragging from one browser to another does not work (and is unfixable via Javascript code).
          Hide
          Ankit Agarwal added a comment -

          Hi Davo,
          I was dragging from pidgin to firefox. Dragging from firefox to firefox, seems to be working fine. Cant still get it working on IE9.
          Raj is testing it on ie10 and safari.
          Thanks

          Show
          Ankit Agarwal added a comment - Hi Davo, I was dragging from pidgin to firefox. Dragging from firefox to firefox, seems to be working fine. Cant still get it working on IE9. Raj is testing it on ie10 and safari. Thanks
          Hide
          Rajesh Taneja added a comment -

          Sorry guys, it's not working in Safari 5.1.7 (on windows), and 4.0.3 on Mac.
          Also, "Drag and drop files, text or links onto course sections to upload them" is not showing up in Safari.

          Sorry don't have ie10... Will try see if I can download it in time.

          Show
          Rajesh Taneja added a comment - Sorry guys, it's not working in Safari 5.1.7 (on windows), and 4.0.3 on Mac. Also, "Drag and drop files, text or links onto course sections to upload them" is not showing up in Safari. Sorry don't have ie10... Will try see if I can download it in time.
          Hide
          Davo Smith added a comment -

          Ankit,

          When you switch on course editing in Firefox or Chrome you should notice a big yellow banner appear to let you know that drag and drop upload is available in that browser.

          Now try the same in IE9 - it won't appear. That is because IE9 (and IE8, IE7, IE6, etc.) has never supported HTML5 drag and drop upload. This is why the Moodle release notes state that IE10 (or, alternatively, a properly written browser such as Firefox/Chrome) is needed for drag and drop upload. This is why the testing instructions on this issue mention IE10, not IE9, IE8, etc.

          If you would like to be able to use drag and drop in IE9, please contact Microsoft directly and ask them to backport their fixes from IE10. Other than that please stop reporting lack of drag and drop upload in browsers that do not support this feature.

          Rajesh, similarly, if the yellow banner does not appear in earlier versions of Safari, then the browser does not support drag and drop upload. That is the entire reason for having the yellow banner - to inform people that drag and drop upload is supported in the browser they are using. I have had it reported to me that the latest version of Safari on Mac does support this feature, but I do not have a Mac to test this on.

          As for dragging text into Firefox from certain sources showing the 'Add file(s) here' message, that is down to the content of the drag, as declared by the browser to the javascript. If the browser tells the javascript that the drag contains files, then the 'Add file(s) here' message is shown. If this is happening consistently, then I suggest you file a bug with Firefox for declaring the wrong content for the drag. There is nothing I can do from the javascript side of things if the browser is declaring the wrong content. This is also the reason why the 'text/url' dragging feature is marked as 'experimental' - it works pretty consistently well in Chrome (unless dragging text from Firefox). It has a lot of quirks in Firefox.

          Please also note that this issue covers:

          • Improvements to the styling and operation of the dialog boxes which appear when doing drag and drop
          • Being able to drag onto the 'Add X here' text

          If there are other issues with the drag and drop itself (aside from the ones that I have already addressed above), could they be raised as a separate issue (as they will be pre-existing bugs that are not related to the changes made by this issue).

          Show
          Davo Smith added a comment - Ankit, When you switch on course editing in Firefox or Chrome you should notice a big yellow banner appear to let you know that drag and drop upload is available in that browser. Now try the same in IE9 - it won't appear. That is because IE9 (and IE8, IE7, IE6, etc.) has never supported HTML5 drag and drop upload. This is why the Moodle release notes state that IE10 (or, alternatively, a properly written browser such as Firefox/Chrome) is needed for drag and drop upload. This is why the testing instructions on this issue mention IE10, not IE9, IE8, etc. If you would like to be able to use drag and drop in IE9, please contact Microsoft directly and ask them to backport their fixes from IE10. Other than that please stop reporting lack of drag and drop upload in browsers that do not support this feature. Rajesh, similarly, if the yellow banner does not appear in earlier versions of Safari, then the browser does not support drag and drop upload. That is the entire reason for having the yellow banner - to inform people that drag and drop upload is supported in the browser they are using. I have had it reported to me that the latest version of Safari on Mac does support this feature, but I do not have a Mac to test this on. As for dragging text into Firefox from certain sources showing the 'Add file(s) here' message, that is down to the content of the drag, as declared by the browser to the javascript. If the browser tells the javascript that the drag contains files, then the 'Add file(s) here' message is shown. If this is happening consistently, then I suggest you file a bug with Firefox for declaring the wrong content for the drag. There is nothing I can do from the javascript side of things if the browser is declaring the wrong content. This is also the reason why the 'text/url' dragging feature is marked as 'experimental' - it works pretty consistently well in Chrome (unless dragging text from Firefox). It has a lot of quirks in Firefox. Please also note that this issue covers: Improvements to the styling and operation of the dialog boxes which appear when doing drag and drop Being able to drag onto the 'Add X here' text If there are other issues with the drag and drop itself (aside from the ones that I have already addressed above), could they be raised as a separate issue (as they will be pre-existing bugs that are not related to the changes made by this issue).
          Hide
          Ankit Agarwal added a comment -

          Hi Davo,
          Thanks for your response.
          Please understand that reporting something observed during testing doesn't mean we are going to fail the issue. We even note down things that are not at all related to the patch if observed during the testing of a particular issue.
          Anyways as suggested by Damyon, I have created MDL-38626 , so we can further investigate text dragging from different window and report to firefox if needed.

          Passing this.
          Thanks

          Show
          Ankit Agarwal added a comment - Hi Davo, Thanks for your response. Please understand that reporting something observed during testing doesn't mean we are going to fail the issue. We even note down things that are not at all related to the patch if observed during the testing of a particular issue. Anyways as suggested by Damyon, I have created MDL-38626 , so we can further investigate text dragging from different window and report to firefox if needed. Passing this. Thanks
          Hide
          Davo Smith added a comment -

          Thanks Ankit - I'm sometimes a bit oversensitive when IE9 is mentioned with drag and drop as it is a deficiency in Microsoft supporting a published standard, not something I can work around in my code.

          I'll take a look at MDL-38626 later on and see if I can create a simple JS Fiddle that can be submitted as a bug report to Firefox.

          Show
          Davo Smith added a comment - Thanks Ankit - I'm sometimes a bit oversensitive when IE9 is mentioned with drag and drop as it is a deficiency in Microsoft supporting a published standard, not something I can work around in my code. I'll take a look at MDL-38626 later on and see if I can create a simple JS Fiddle that can be submitted as a bug report to Firefox.
          Hide
          Damyon Wiese added a comment -

          This issue has been integrated upstream and is now available via git (and in some hours, via mirrors and downloads).

          Thanks for your contributions!

          Show
          Damyon Wiese added a comment - This issue has been integrated upstream and is now available via git (and in some hours, via mirrors and downloads). Thanks for your contributions!

            People

            • Votes:
              1 Vote for this issue
              Watchers:
              9 Start watching this issue

              Dates

              • Created:
                Updated:
                Resolved: