Giving students a feel good factor with the Online Users block (Moodle 1.9.x and Moodle 2.2)

Fourteen days ago, I set out to modify Andy J. Davis' Online Users block. My objective was to make my Moodle site more engaging. I think that with the generous help of PHP developer, Matteo Scaramuccia of Italy, and Stephane Gully's Shoutpro Creative Commons Attribution-ShareAlike 2.5 License code,  the objective has been achieved.

New Features of the Online Users block

I started out with the challenge to make the Administrator invisible on the Online Users block. Well one thing led to another and this challenge has turned into a programming quest to make the Online Users block more engaging and visceral to users. I have since, with invaluable from Matteo, added these features:

1. The student (Student, Teacher and Administrator) is able to make himself or herself invisible.
   
   
   
   
   
2. The Administrator can see how many students at any one time are invisible, but not who they are on the Online Users block. Hint: As Administrator, you can still detect who is logged on by checking the Live Logs. Alternatively, you could install the Chat Console to see who has logged on.
3. The student is able to choose from a fixed list of moods (mostly positive moods) set by the Teacher or Administrator
   
   
   
   
4. The student can display a custom text mood on the block. 
5. The student can display a fixed set of animated GIFs on the block alongside the username
6. The student can choose to display an animated GIF by supplying the URL of any animated GIF file from any website. The sky's the limit now.
7. Both Features #4 and #6 are filtered by a profanity list (what!? why!??). This is to make sure that any custom text displayed is suitable for educational consumption (clean). It is also to ensure that no adult or unsavoury GIFs are chosen by the student.

Here's what the block looks like on my Moodle site:

Figure 1: Static picture of my Moodle 1.9.15 Website

Live Demo - Moodle 1.9.x

For a live demo, surf over to: http://www.moodurian.com

Username: alex

Password: alex

Figure 2: Static picture of my Moodle 2.2 Website

Live Demo - Moodle 2.2

For a live demo, surf over to: http://moodurian.com/m2

Username: me

Password: me

How to use

After logging in, check out the Online Users block on the right. See the animated gifs? Those can be set by the user! In the image above, one of the users has displayed a custom text mood: (Awesome!).

After that, try Edit Profile, and choose any of the animated gifs in the drop down list of the

Choice Icon Moods User Profile field.

To see all the icons, click on the Question Mark ? found at the Online Users block.

Purpose of this post

In this post, I want to share with the rest of the Moodle world how you can modify Andy J. Davis' Online Users block so that your users can have that feel good factor when logging into your Moodle site. The code that I am presenting to you is the result of hard work from many talented programmers and developers in the Moodle community.

I see myself an artist dabbling with PHP code. I want to make my Moodle production site more engaging for my students, more edgy, more Web 2.0, more feel good factor. Like Remy, the Rat in Pixar's Ratatouille (2007) who loves to come up with creative food dishes, I too want to experiment with Moodle's GNU General Public License code.

Figure 3: Remy the French Rat-Chef
(source: http://disney-clipart.com)

 I want to tweak existing code and to create derivations, whilst acknowledging the original authors and their copyrighted works. The end in mind is to liven up my Moodle course pages for my students. I mean, shouldn't and couldn't learning online be fun? Shouldn't we bring back the fun into learning?

Figure 4: Friendster, so long to an old friend.

Remember Friendster? Well world's first real Social Networking site bowed out to Facebook. In its heyday, almost every teenager and college student in Malaysia was crazy about Friendster. Young people loved Friendster because it allowed you to decorate your webpage with all kinds of animated GIFs, bling-bling, shiny and colourful stuff and Web paraphanalia.

So why not have a mini-make-over of your Moodle site by implementing these 'new' features of the already fit-for-purpose Online Users block? Will the text and icon-based moods be a distraction for you users? Will they be taken upon positively by your users? How many users will ignore them as time-waster? For those who use the new features, do they get a feel-good-factor?

Figure 5: Cupcakes. Another way to feel good.

Source: http://www.markdrechsler.com/?p=281

Will the student moods (textual or grahical) just be a fad, no longer used after 5 weeks into the semester? There are questions that I am as yet unable to convincingly answer. I'll let you know in 5 weeks time then. Perhaps if you implement the 'new' Online Users block on your site, then you can let me know how your users are taking to the new features.

Profanity Check - Just in case

Figure 6: A disgruntled or frustrated student may vent his or
her anger on the Moodle Online Users block.
How do we deal with this?

The idea of using the fixed list of text or icon moods was that the student would be limited to a fixed set of "safe and family-friendly" moods. However, with the inclusion of Feature #4, the custom mood, the student is now free to think of and to type in his or her own mood text. I am sure that 99% of the class will be well-behaved and will type in something "safe" for others to read. So your users are responsible for what mood they choose to display on the Online Users block.

Call me paranoid, but please don't call me prudish - I have decided to filter the custom mood text AND the custom icon URL for a set of undesirable names, slang-words and profanities. Why!?? Well, I did this for three reasons:
(1) I don't want to leave anything to chance! Sure, my student can type in anything, and I mean anything, for a custom mood, but that doesn't mean that he or she can type in some text that others may take offence to. As in swear words or profanities.
(2) Some animated gifs border on the edge of human and moral decency. Hence some control is needed to ensure that animated gifs chosen by the student is clean and unoffensive to others in the same online course.
(3) I did it as a programming challenge. It wasn't too difficult because I had some experience here. Most, if not all of the anti-Profanity PHP code is copyrighted by Stephane Gully who is the author of ShoutPro. 

If the student were to chose a vulgar or swear-word as the custom text mood, assuming that that word or phrase is inside the profanity.php file, then the text mood will appear as a harmless "angel":

Figure 7: The word "angel" appears in place of
some profanity or swear word.

In the same vein, if the student were to choose a custom icon URL mood that originates from a suggestive, adult or tripleX-related webpage, it is possible to control the output. If the URL contains an offensive word that exists inside the long swear-word list found inside the file profanity.php, then an "angel" icon will appear:

Figure 8: An innocent "angel" icon appears in place of
some adult or unsavoury icon from some URL on the web .

So some form of imperfect censorship is enforced. Some of you reading this may be shaking your heads in disbelief. You may strongly believe in using only self-censorship or in prevention of negative use of the online block through educating the student on the dos and donts. Perhaps a combination of software filtering (like the one used above) AND educating the student on the Moodle usage dos-and-donts will be more effective.


Update on the block - Wiggling animated gifs!
Now the animated gif icons can wiggle as well!






Click here to download the modified (Moodle 1.9) block_online_users.php file that has the wiggle code built into it!


Installation Instructions

Note: Screenshots are of Moodle 1.9.X, but the process is similar for Moodle 2.2 

Step 1: Backup your original online_users block!!!

      Step 2: Create these FIVE User Profile Fields:

Figure 9: Here are the FIVE User Profile fields
used on my Moodle Production site.

       Step 2.1: Create the stealth User Profile Field  (Checkbox)

Figure 10: Ah...Stealth Mode!
Now I can login in in the wee hours of the morning
and not be detected by other users.

       Step 2.2: Create the mood User Profile Field  (Menu of Choices)

Figure 11: Wow! So many moods to choose from.
How about 'crabby'?

Here is the full list of row text you can just copy and paste the rows inside the Menu Options edit box. How convenient eh? ;-)

      Step 2.3: Create the iconmood User Profile Field  (Menu of Choices)

Figure 12: Wow! So many icon moods to choose from.
But what if I wanted my special animated icon from www.yahoo.com?

Here is the full list of row text you can just copy and paste the rows inside the Menu Options edit box. How convenient eh? ;-)
Note: the names in each row MUST match the contents of the file smilies.php.

      Step 2.4: Create the customicon User Profile Field  (Text edit)

Figure 13: Now you can enter the URL of an animated icon

located anywhere on the Net!

      Step 2.5: Create the  custommood User Profile Field  (Text edit)

Figure 14: Anothor custom feature.
I can now type any mood text to express myself.

Step 3: Download the modified online_users block (Choose either the Moodle 1.9.x or 2.2 version)
Download link for Moodle 1.9.x :
online_users.zip



Download link for  Moodle 2.2 :
Moodle2_2_online_users_interactive_Jan2012.zip
Question: Will the Moodle 2.4 code also work for Moodle 2.3 / 2.2 / 2.1 / 2.0.x ? 
You can give it a try, but make sure to protect yourself with backups!




Step 4: Unzip the files

inside your existing MoodleSite/blocks/online_users folder of your Moodle site. Important: your existing online_users folder should already have a settings.php file as well as db folder. The settings.php and db folder are NOT included in the downloaded zip file.




Step 5: Test out the block
Just as a precaution, set your Site Administration | Server | Debugging setting to "Show all messages" in case of any problems. If you encounter any warning messages, please let me know about them. If you set your Site Administration | Server | Debugging setting to "None: show only fatal errors", that will shut off the warning messages.


Next, try these moods setting permutations (variety of) and then check out the resulting Online Users block:




Step 5.1: Edit the User Profile

Step 5.2: Edit the User Profile field settings


A. Setting a Choice Text mood from the drop-down list...

..gives this!

---

B. Setting the Choice Icon mood from the drop-down list....

..gives this!

---

C. Setting the Custom Icon URL mood to http://www.animated-gifs.eu/avatars-100x100-computing/0002.gif

...gives this!

---

D. Setting the Custom Text mood....

..gives this!

---

That should be it! Have fun!! 

If you would like to have Online Users Block installed on your Moodle site, please contact me for a quotation. You can do so by clicking the big Orange pointy logo on the top-right corner of this blog.

Or you could just click on this image:

Frankie Kam  boonsengkam@gmail.com,
Websites: http://moodurian.blogspot.com,
               http://moodurian.com

Stamford College Malacca
Melaka, Malaysia
29^th January 2012

If you like this post or site
a small donation would be nice but would last only a day,
otherwise leaving a comment (or a compliment) below will last me a month!