Enable the Moodle WYSIWYG editor on Chrome and Safari

This hack is awesome! At last, the WYSIWYG editor works for Mac Users and Google Chrome.

I can’t take any credit for this as it’s something I found on moodle.org.

Pall Thayer released the code so a big thank you to him.

The origial post can be found here but I have documented the process here and simplified the instructions below as they were a bit tricky to follow:

First we need to edit the file lib/moodlelib.lib

Find this code:

function can_use_html_editor() {
     global $USER, $CFG;
 
     if (!empty($USER->htmleditor) and !empty($CFG->htmleditor)) {
         if (check_browser_version('MSIE', 5.5)) {
             return 'MSIE';
         } else if (check_browser_version('Gecko', 20030516)) {
             return 'Gecko';
         }
     }
     return false;
 }

And replace with this code:

 function can_use_html_editor() {
     global $USER, $CFG;
 
     if (!empty($USER->htmleditor) and !empty($CFG->htmleditor)) {
         if (check_browser_version('MSIE', 5.5)) {
             return 'MSIE';
         } else if (check_browser_version('Gecko', 20030516)) {
             return 'Gecko';
         }
 else { 
 
             return 1; //Pall's Safari/Chrome editor hack
 
         } 
     }
     return false;
 }

Next we need to edit /lib/editor/htmlarea/htmlarea.php

Find this code:

HTMLArea.checkSupportedBrowser = function() {
     if (HTMLArea.is_gecko) {
         if (navigator.productSub < 20021201) {
             alert("You need at least Mozilla-1.3 Alpha.\n" +
                   "Sorry, your Gecko is not supported.");
             return false;
         }
         if (navigator.productSub < 20030210) {
             alert("Mozilla < 1.3 Beta is not supported!\n" +
                   "I'll try, though, but it might not work.");
         }
     }
     if(HTMLArea.is_safari) {
         return false;
     }
     return HTMLArea.is_gecko || HTMLArea.is_ie;
 };

Replace with this code:

HTMLArea.checkSupportedBrowser = function() { 
    if (HTMLArea.is_gecko) {
        if (navigator.productSub < 20021201) {
            alert("You need at least Mozilla-1.3 Alpha.\n" +
                  "Sorry, your Gecko is not supported.");
            return false;
        }
        if (navigator.productSub < 20030210) {
            //alert("Mozilla < 1.3 Beta is not supported!\n" +
            //      "I'll try, though, but it might not work.");
            return 'HTMLArea.is_gecko';
        }
    }
    if(HTMLArea.is_safari) {
        //return false;
        return 'HTMLArea.is_gecko';
    }
    return HTMLArea.is_gecko || HTMLArea.is_ie;
};

And that's it. We now have the Moodle WYSIWYG working in Google Chrome and Safari, which means it works on the iPhone and iPad too!

I have tested the above code on both my local Moodle installations and the Leeds City College Moodle. Our Apple Mac students will be a lot happier this year!