YUI 3 effects

YUI 3 effects

by stephen S -
Number of replies: 17

I am struggling to find information to help me add YUI effects to a page. Let me illustrate with an example. The Open University - OpenLearn site has a number of courses and have customised some very elegant features. One being "Reveal Discussions" or "Hide Discussions" ( example here ) which uses YUI animation to show and hide text after a student has thought about the activity.

I have looked at the YUI documentation in Moodle Docs (e.g.  create YUI modules ) and it looks reasonable.

However, I am not wanting to create my own modules or plugins, I simply want to make use of some YUI effects in a course in the way illustrated by the OU anmation effect mentioned above. So, if I have created a course and I add a "page" (from the "resource" drop down box),  I can then add content to that page with the built in editor, but I can't see any documentation that shows me how to make use of the extensive built in YUI libraries and add some of the custom effects that YUI offers.

How can I add/integrate YUI effects to a course content and make use of the sophisticated functionality that is already built in to Moodle? That TinyMCE editor just seems so feeble at tapping into the feature rich YUI behind the scenes.

If you can point me in the right direction where I can find documentation/tutorials or examples of exploitng the built in YUI effects when designing courses I would be grateful.

Average of ratings: -
In reply to stephen S

Re: YUI 3 effects

by Davo Smith -
Picture of Core developers Picture of Particularly helpful Moodlers Picture of Peer reviewers Picture of Plugin developers

You cannot access javascript code via the html editor, it is only available if you are editing the code for a module or plugin (running arbitrary javascript code entered by users of the system is, rightly, regarded as a security risk).

In reply to Davo Smith

Re: YUI 3 effects

by stephen S -

"running arbitrary javascript code entered by users of the system is, rightly, regarded as a security risk" - So people keep saying!

By "users", you mean the teachers and those creating courses?

In essence then, what we have is some decent/slick features under the hood, but for use only by a privileged few - nerds? Teachers cannot access/use these features when designing courses because the "nerds" won't make it available via the tools provided for creating courses? Why not? 'Cos we must "employ" nerds to do it for us? What's that about, some job security strategy?

In reply to stephen S

Re: YUI 3 effects

by Marcus Green -
Picture of Core developers Picture of Particularly helpful Moodlers Picture of Plugin developers Picture of Testers

No, it is about system security. It is very important to control access to all categories of users.

In reply to stephen S

Re: YUI 3 effects

by Davo Smith -
Picture of Core developers Picture of Particularly helpful Moodlers Picture of Peer reviewers Picture of Plugin developers

I'm a little taken aback by this response.

The whole point of open source software is that it isn't kept secret with a 'specialised few' having access and charging money for everyone else to use their system. Anyone with the time and inclination can access the code and use it in whatever way they want.

The reason that people keep saying that 'allowing anyone on the system to run arbitrary javascript is a security risk' is not some kind of conspiracy to keep us in work (and I'll point out at this point, I am a teacher, who has developed a several free plugins in my spare time - not really an example of someone who is just trying to extort as much money as possible!). It means that it is a well documented security risk.

Maybe an interface to allow some fancy effects (based on YUI) within the web page resource would be a good idea. It would need to be properly written (again to avoid the security risks involved in allowing arbitrary code to run on user's browsers and to make it user friendly, so teachers don't have to learn YUI to use it), but it could be useful. However, someone will have to write the code to make that available.

In reply to Davo Smith

Re: YUI 3 effects

by Tim Hunt -
Picture of Core developers Picture of Documentation writers Picture of Particularly helpful Moodlers Picture of Peer reviewers Picture of Plugin developers

Probably the good way to do this is to create some standard JavaScript code (for example this could be added to the theme) that recognises certain HTML constructs (e.g. <div class="collapsible">) that people can easily use to add effects to their content.

In reply to Davo Smith

Re: YUI 3 effects

by Marcus Green -
Picture of Core developers Picture of Particularly helpful Moodlers Picture of Plugin developers Picture of Testers

I don't understand your reference to people charging money for everyone to use their system, who is charging who for what? You mention a conspiracy, I don't understand what this conspiracy is. If teachers have the ability to run arbitrary javascript it raises security issues, do disagree with that statement?  An interface to access certain limited javascript effects is a very different idea, possibly a good idea.

In reply to Marcus Green

Re: YUI 3 effects

by Davo Smith -
Picture of Core developers Picture of Particularly helpful Moodlers Picture of Peer reviewers Picture of Plugin developers
I was responding to the original poster and the idea that JavaScript is only disabled for teachers so that techies will continue to have jobs writing it for them (which stuck me as an accusation of a conspiracy). Sorry, I was annoyed at the response I got after trying to give a helpful answer and should have just dropped the subject (which is what I will now do).
In reply to stephen S

Re: YUI 3 effects

by Itamar Tzadok -

Admin can set the Moodle site wide to trust content (see image for illustration) in which case certain roles (e.g. teachers) may add content such as scripts. Then a teacher can add in, say, a web page resource, something like

<script type="text/javascript"> ... </script>

so as to apply client side effects. It may be possible to refer to the YUI libraries moodle already uses, but if not, the teacher can include the relevant js file in the course files in something like:

<script type="text/javascript" src="..."></script>

and refer to them.

For effects on the main page, you can add to the page an html block and put the scripts there.

hth smile

Attachment admin-trust-content.png
Average of ratings: Useful (1)
In reply to Davo Smith

Re: YUI 3 effects

by Itamar Tzadok -

Not entirely accurate. You can use javascript code via the html editor if you are a teacher and your content is trusted in the site level. See above. smile

In reply to Itamar Tzadok

Re: YUI 3 effects

by stephen S -

At least I stimulated a discussion, but I make no apology for the provocation.

If I were to sum up Moodle in a word - compromise. I am always having to compsomise and I will explain why. Davo unwittingly alludes to the reasons why I get frustrated:

"Anyone with the time and inclination can access the code and use it in whatever way they want" and "... who has developed several free plugins in my spare time"

I teach. I know my subject and I know teaching.

I have been experimenting with Moodle for some months now; I have bought a couple of books (Mary Cooch's Moodle 2.0 and Alistair Hole's Javascript and Moodle), I have spent hours browsing the moodle docs and youtube videos as well as researching some existing moodle sites to see how creative people can be with it. On the face of it, it seemed a powerful tool and after the excitement came the "gotcha's".

I create learning content, I want to deliver it "creatively" and I keep getting frustrated with a feeble wysiwyg editor when it comes to adding my learning content in pages, or lessons etc. Yet I see a load of examples of others delivering learning content quite creatively. I recently came accross regular expressions for analysing answers to open questions, and again after the initial excitement came the "gotcha's". Just something simple as wanting to change the headers on my theme became a mammoth research for "how to's" and then you delve under the hood to php code - Layout scripts, config files, output rendererer's etc. etc.

I mentioned the Open University site OpenLearn as an example of a creative delivery. I was impressed with their use of the YUI library to assist with their delivery and thought, yeah, I'll have some of that ... wrong!

I don't want to be a php expert, a javascript expert, a moodle internal expert and YUI library expert or learn "regular expression" speak!! I want to create learning content and spend my time being creative with the courses I design! Moodle has the power and sophistication under the hood but I can't access it that easily because the interface I have, to manipulate that functionality, is weak. Instead, I have to open it up and manipulate it from the inside or - employ techies to do it (like I suspect the OU do!).

Life is too short!

Davo probably enjoys writing plugins, that's his life choice on how to spend his spare time.

I teach, I know my subject, I know how to teach and I want to deliver my learning content to students (who are my consumers) creatively without also learning moodle internals, PHP, javascript, etc. etc. etc.

I am sorry you feel your "helpful answer" wasn't well received, but I am frustrated with Moodle and the answer did not move me forward to my goal, it just seemed like yet another "gotcha"!

I have to compromise my delivery because I can't get at the functionality that exists under the hood.

I can't speak for other teachers, but when I read the posts and questions from many of the threads on this forum I suspect there are others equally frustrated with the "gotcha's" they keep coming up against when all they really want to do is deliver their content to their consumers using the power offered by the tool without first transforming into a "nerd".

In reply to stephen S

Re: YUI 3 effects

by Itamar Tzadok -

I teach, I know my subject, I know how to teach and I want to deliver my learning content to students (who are my consumers) creatively without also learning moodle internals, PHP, javascript, etc. etc. etc.

This seems to me a decent challenge, no smaller than delivering learning content creatively with learning moodle internals, php, etc.

At any rate, the real power of moodle is not under the hood but in the open source and community which, with a bit of patience and luck, may help get you where you want even if you don't take up all these nerdy things. smile

In reply to Itamar Tzadok

Re: YUI 3 effects

by stephen S -

ok, some good ideas in the replies.

I have taken Tim's suggestion (hope I understood it) and added a simple script using:-

$PAGE->requires->js('javascript_file.js');

in the layout files of my theme (frontpage.php and general.php) in the footer section ( after the <!-- START OF FOOTER -->) and then added, as Tim suggested, a

<div id="container"></div>

using the wysiwyg editor to make a placeholder for the effect. It worked. This seems to give me a start point for a basic animation to add reveal/hide discussion effects (similar to the OU effect I liked). I might be able to do something basic with very little effort (a compromise, but moving forward at least).

I also think I might be able to experiment with Itamar's idea:-

"For effects on the main page, you can add to the page an html block and put the scripts there." I might see if I can get some animation up and running this way too and see which is easier.

Thanks guys, bit of a compromise for now, but at least I have some ideas to move forward ....

In reply to stephen S

Re: YUI 3 effects

by Marcus Green -
Picture of Core developers Picture of Particularly helpful Moodlers Picture of Plugin developers Picture of Testers

Yes Moodle is a compromise driven by the conflicting needs of a wide audience. If you want to have complete control over absolutly every aspect of it you will need to become expert at the underlying technologies.

In reply to Marcus Green

Re: YUI 3 effects

by stephen S -

An interesting point of view, Marcus. I feel a parallel could be drawn with Linux; written by nerds, for nerds (IMHO) and one could also say "If you want to have complete control over absolutley every aspect of it you will need to become expert at the underlying technologies." .... ...  then along came Bill Gates and offered something for the "user" that doesn't want to be an expert but just wants to get the most out of the tools and get on with their job! The rest is history, Linux strives to compete but even the "free" price tag doesn't compensate for the "nerdy" nature of Linux and IMHO, Microsoft have nothing to fear from Linux!

I feel the creators of systems (like Moodle) need to keep the "user" in the forefront of their mind; The user who wants to make the most of what is provided without being an expert of the underlying code! I don't need to know the internals of Windows programming, Word, Excel or Powerpoint to get the most of the tools, I just need to know the tool. I don't have to know OO or C++ I just have to be creative with the tool. I am asking no more of Moodle.

I may be asking too much. I may have misunderstood the concept of Moodle. However, I feel, what is the point of a tool to manage a course if I can't create the course I want to deliver to my consumers for the tool to manage?

Just my opinion as a user. Don't get me wrong (easy to do I know), I am impressed with what moodle delivers and think it is a great tool but I get frustrated with it sometimes and feel I have to be a PHP expert, javascript expert, YUI expert, moodle internal expert just to make changes to the standard themes, or include some special effects in my courses. If I want to be creative then I have to know the "underlying" technology. An interface to the underlying technology should be available to allow me to manipulate it. Is that asking too much? If it is, then I am sorry.

In reply to stephen S

Re: YUI 3 effects

by Marcus Green -
Picture of Core developers Picture of Particularly helpful Moodlers Picture of Plugin developers Picture of Testers

Stephen: An interesting point of view, Marcus. I feel a parallel could be drawn with Linux; written by nerds, for nerds (IMHO) and one could also say "If you want to have complete control over absolutley every aspect of it you will need to become expert at the underlying technologies." .... ...  then along came Bill Gates and offered something for the "user" that doesn't want to be an expert but just wants to get the most out of the tools and get on with their job! The rest is history, Linux strives to compete but even the "free" price tag doesn't compensate for the "nerdy" nature of Linux and IMHO, Microsoft have nothing to fear from Linux!
Marcus: I disagree, if you want to have complete control over every aspect of your operating system then Windows is not a wise choice.  However not every user requires complete control over their operating system and many are either very happy with Windows or never give it a second though (I am typing this on Windows).
Stephen: I feel the creators of systems (like Moodle) need to keep the "user" in the forefront of their mind;
Marcus: True indeed
Stephen: The user who wants to make the most of what is provided without being an expert of the underlying code! I don't need to know the internals of Windows programming, Word, Excel or Powerpoint to get the most of the tools, I just need to know the tool. I don't have to know OO or C++ I just have to be creative with the tool. I am asking no more of Moodle.
Marcus:  Remember that Moodle has a very modest development budget and Microsoft has effectively an infinite budget (i.e. they have more money than they can spend on development. Having been a commercial VBA programmer I know that the skills needed for total control over those tools is of a similar order to developing for Moodle.  I remember developing VBA for Excel for the Sydney Harbour Casino around 1992. There was a very, very subtle bug that took a huge amount of time to track down, partly because I did not have the source code of the tools I was working with.
Stephen: I may be asking too much. I may have misunderstood the concept of Moodle. However, I feel, what is the point of a tool to manage a course if I can't create the course I want to deliver to my consumers for the tool to manage?
Marcus: No harm in asking, I don't think you have misunderstood the concept of Moodle.  I was approached by some people a while ago who had a very specific visual need and I declined on the basis that I just couldn't do that with Moodle (which might have been me rather than Moodle). Have you used any of the main alternatives to Moodle? The main commercial alternative product I have used seems to offer no greater visual appeal than Moodle, actually I think it is rather ugly in its default guise and I have not been able to beautify my courses.  That is no reason of course why Moodle would not be improved by greater flexibility in the interface and I suspect there are other products that do offer this capability.
Stephen: Just my opinion as a user. Don't get me wrong (easy to do I know), I am impressed with what moodle delivers and think it is a great tool but I get frustrated with it sometimes and feel I have to be a PHP expert, javascript expert, YUI expert, moodle internal expert just to make changes to the standard themes, or include some special effects in my courses. If I want to be creative then I have to know the "underlying" technology. An interface to the underlying technology should be available to allow me to manipulate it. Is that asking too much? If it is, then I am sorry.
Marcus: Which comes back to the idea of a user. You appear to be more than an average user. You you have a vision of what Moodle could be, you have a desire for better appearance. But those ideas need to be fitted in with the need for security and the ability of the average user/teacher.  Moodle is unlikely to win beauty contests at the moment and it would be great if the average user/teacher could create a richer visual experience. Geeks like me (less pejorative than nerd in my view), concentrate on functionality over form, but looks are important.
I have been playing with some of the features of quiz recently and considering using some Javascript YUI features but been rather daunted by the prospect of learning another library after recently learning  JQuery.  Can you tell us about your specific need  in terms of YUI in enhancing Moodle.  In your original comment you mentioned about TinyMCE, have you explored it further?

In reply to Marcus Green

Re: YUI 3 effects

by stephen S -

I am not sure I can add more to this discussion and I apologise if my frustration has come through on my posts. There is a small misunderstanding that has crept in.

Marcus: ""if you want to have complete control over every aspect "

Stephen: I agree. However I don't want complete control over every aspect.

I recently discovered Moodle not only does what it says on the tin but does more than it says on the tin! Moodle is capable of delivering a modern look and feel with some very nice effects but accessibility requires, as you have discovered yourself, "[the] ... daunt[ing] ... prospect of learning another library".

I don't want complete control I merely want to use what it already does without needing to know how it does it.

Maybe what is needed is a commercial addon. I also use Joomla! and I have purchased Artisteer for creating themes and I have to say it is effortless. I can change my theme very easily, leaving me time to focus on creative look and feel and the content. Maybe what is needed is a similar tool that a) creates Moodle Themes and b) creates your lesson contents which can then be imported into Moodle. That sounds like a very big ask, but not impossible. Maybe Moodle needs to be split, seperate managing courses from creating courses. (just an idea!).

For me, the success of Windows and windows apps, and now other emerging technologies, is they enhance the user's creativity in what they do (my case teaching) without asking me to learn and manipulate directly the underlying technology. Geeks like to manipulate the technology (that's their passion), users just want to get the job done by focusing on creativity in their own field, not also in the field of the geek!

Moodle has more in the tin than than I can access (without becoming a geek). Let me access what it can do and I will do more with it! That's what I want. I am not after complete control, just let me use what it is, right now, capable of doing!

In reply to stephen S

Re: YUI 3 effects

by Marcus Green -
Picture of Core developers Picture of Particularly helpful Moodlers Picture of Plugin developers Picture of Testers

Making it easier to create and minipulate Moodle themes would be really useful.