Courses and course formats

 
 
Gareth J Barnard
The great Collapsed Topics arrow debate.
Group DevelopersGroup Particularly helpful Moodlers

Dear all,

I watched Rick's video - https://moodle.org/mod/forum/discuss.php?d=218505&parent=958292 - and understand where he is coming from, however, I am still convinced that the arrows on the toggles illustrate the state of the toggle - as with Microsoft Windows file navigation and Moodle menu navigation - however, the 'Open / Close' all sections functionality is 'signage' indicating what will happen when you perform the action and not representative of actual state.

To illustrate my point I created a special version of the format using open and closed door icons.  The next two posts will illustrate them.

Please feel free to make your comments on this thread.

Kind regards,

Gareth

 
Average of ratings: -
Gareth J Barnard
Re: The great Collapsed Topics arrow debate.
Group DevelopersGroup Particularly helpful Moodlers

In this screen shot I have made a direct replacement for the down and right arrows being that of open and closed doors respectively.  This is how I consider things should be.


 
Average of ratings: -
Gareth J Barnard
Re: The great Collapsed Topics arrow debate.
Group DevelopersGroup Particularly helpful Moodlers

In this screen shot I have swapped the icons for the 'Open / Close' all sections as proposed.


 
Average of ratings: -
Gareth J Barnard
Re: The great Collapsed Topics arrow debate.
Group DevelopersGroup Particularly helpful Moodlers

I do not doubt that the icons should be as with other systems to be consistent, which is why I agreed to change the up arrow to a right arrow.  But I am convinced that the 'Open / Closed' all section functionality represents what is going to happen and is not representative of state because they are 'detached' from the things they control, they are 'separate', and it is this key concept that distinguishes them from the navigational examples given thus far.

Kind regards,

Gareth

 
Average of ratings: -
Picture of Rick Jerz
Re: The great Collapsed Topics arrow debate.
Group Particularly helpful Moodlers

Gareth,

Let's see how others reply.  If the heading icons were not buttons and only there for illustration purposes, then you would be right that they signify the state of the sections below.  But these topic arrows are buttons, so their action should signify what happens when you press the button.  If, for example, one had to click on the word "Close", and could not click on the button, then the button would only be used to signify the state of the section (opened or closed).

Well, this has turned out to be an interesting discussion.

 
Average of ratings: -
Picture of Richard Oelmann
Re: The great Collapsed Topics arrow debate.
Group Particularly helpful MoodlersGroup Testers

Well, in terms of others replying - having followed the thread and looked at Rick's video and Gareth's screenshots, I have to say that for the default option, I'm with Gareth.

But at the same time, I would have thought if you want the arrows the other way around, this should not be too difficult to personalise for a given installation simply by changing or renaming the images.

Richard

 
Average of ratings: -
Gareth J Barnard
Re: The great Collapsed Topics arrow debate.
Group DevelopersGroup Particularly helpful Moodlers

Thanks Richard smile

If you wish to use the non-supplied method for the 'Open / Close' all sections then edit 'styles.css' and swap 'a.on / a.off' at the end of the selectors:

#toggle-all .content .sectionbody h4 a.on {
background: transparent url([[pix:format_topcoll|arrow_down]]) no-repeat 0px 45%;
}

#toggle-all .content .sectionbody h4 a.off {
background: transparent url([[pix:format_topcoll|arrow_right]]) no-repeat 0px 45%;
}

Then do a 'Purge all caches' as described in the Readme.

Cheers,

Gareth

 
Average of ratings: -
It's only an avatar...
Re: The great Collapsed Topics arrow debate.
Group DevelopersGroup Documentation writersGroup Particularly helpful MoodlersGroup Testers

Actually it's in the language where it is wrong.

Opened ▼/ Closed ►

Click ► to OPEN 

Click ▼ to CLOSE 

 

 
Average of ratings: -
Picture of Rick Jerz
Re: The great Collapsed Topics arrow debate.
Group Particularly helpful Moodlers

Mary, I like your thinking about the language.  If the arrow was showing the "state", then the word should be changed from "Open" to "Opened", likewise for "Closed".

If we think about the use of the "+" and "-" symbols used in Moodle's blocks, the "+" symbol is shown when you want to "Open" a block.  Once opened, the "-" symbol is shown.  So block symbols are using the "verb" form (i.e., if you want to open a block, click on the "+" symbol, if you then want to close a block, click on the "-" symbol.  This is why I think that the arrows in Gareth's heading should be changed.

It is no problem for anyone to make these match their own idea (by changing code or pictures in the plug-in, but I think that Gareth wants to really get it correct (whatever that means).

Thanks for your thoughts.

 
Average of ratings: -
It's only an avatar...
Re: The great Collapsed Topics arrow debate.
Group DevelopersGroup Documentation writersGroup Particularly helpful MoodlersGroup Testers

Staying up late here to do some GIT work on a dying BT Broadband line which has been hard works these last couple of days. Must be all the snow!

Anyway, here is my 2cents worth.

In the custom menu there is a...

horizontal-menu-submenu-indicator.png

which always seems to be labeled wrongly to me because we know that a horizontal line looks like this — so why is the arrow pointing down and not to the right (or left) ?

And then there is the...

vertical-menu-submenu-indicator.png

Here again this seems to be labeled wrongly, because a vertical line looks like this | so why is the label pointing to the side and not down?

In the Post-IT theme I use two encoded characters ▲ and ▼ which show up as ▲ for CLOSE and ▼ for OPEN.

But I think I have said this before.

smile

Cheers

Mary

 

 
Average of ratings: -
Picture of Rick Jerz
Re: The great Collapsed Topics arrow debate.
Group Particularly helpful Moodlers

Mary, I like your thoughts about "as ▲ for CLOSE and ▼ for OPEN."

However, if Gareth were to do this, then I think the arrow directions in Moodle's blocks (such as the Settings block) would need to be changed for consistency.

 
Average of ratings: -
Gareth J Barnard
Re: The great Collapsed Topics arrow debate.
Group DevelopersGroup Particularly helpful Moodlers

Dear Mary and Rick,

Thank you for your thoughts.

The application of Mary's concept:

Click ► to OPEN 

Click ▼ to CLOSE 

Applies correctly as it currently does to the toggles.

"▲ for CLOSE and ▼ for OPEN" is what I did use to have for the 'Open / Close all' functionality until the request for the right arrow was implemented in line with the navigation block.

I disagree that the wording is wrong as "Opened ▼/ Closed ►" refers to after the event interms that it has already happened, however it has not.  But, perhaps if 'Open / Close all sections" was constructed in such as way as "All opened ▼/ All closed ►" then I would be willing to make such a change given that I have had negative comments regarding the post fixing of 'all sections'.  But this will take time as I have over ten language files to change.

Cheers,

Gareth

 
Average of ratings: -
Picture of Rick Jerz
Re: The great Collapsed Topics arrow debate.
Group Particularly helpful Moodlers

Gareth, after all of this discussion, I think that we all agree that if arrows are going to be used, within a section they should following Moodle's convention (until Moodle changes) of pointing down with a section, or block, is opened and displaying contents beneath it (like this, arrow points down when open, click on this down arrow to close).

We seem to just be struggling with what the major heading (open all/close all) should do.   I think that if the heading's function was to fully-collapse all sections (not even showing their heading), what I am suggesting would be correct.  However, having the heading as you do might be the real issue.  I am not suggesting removing your Open All/Close All heading, because I like it.  I can work around what you are currently doing by modifying your code a little.

 
Average of ratings: -
Gareth J Barnard
Re: The great Collapsed Topics arrow debate.
Group DevelopersGroup Particularly helpful Moodlers

Dear Rick,

My gut is now telling me just to remove the icons and leave the text, however that would be of detriment to a chort of visual learners.

Cheers,

Gareth

 
Average of ratings: -
Picture of Rick Jerz
Re: The great Collapsed Topics arrow debate.
Group Particularly helpful Moodlers

My gut reaction is to leave the icons as you best think they should be.  They are a good feature, and we are only debating a UI feature (which way they should point).  Maybe give them some time, and then see what others have to say.

 
Average of ratings:Useful (1)
Gareth J Barnard
Re: The great Collapsed Topics arrow debate.
Group DevelopersGroup Particularly helpful Moodlers

Dear all,

Following on from looking at the shower's power button at home, an idea by Ben Kelada on CONTRIB-4098 and wanting to diverge the toggles from that of the folders completely to remove confusion as arrows are too similar I have created an adaption of the IEC 5009 standby power symbol - attached.

Screen shots will be in the next two posts, but you can get all of the code from:

https://github.com/gjb2048/moodle-format_topcoll/tree/MOODLE_24_POWER_TOGGLE

It's based upon V2.4.2.1 which is only currently released on GitHub - https://github.com/gjb2048/moodle-format_topcoll/archive/V2.4.2.1.zip as it's minor release.

Comments please smile - Unless there are a lot of negative ones (I'll reconsider) I have a desire to change to the new plus / minus (below), but I will leave the old images in the pix folder for you to use.

Cheers,

Gareth


 
Average of ratings: -
Gareth J Barnard
Re: The great Collapsed Topics arrow debate.
Group DevelopersGroup Particularly helpful Moodlers

This is want I really want to move to with the plus and minus symbols.


 
Average of ratings: -
Gareth J Barnard
Re: The great Collapsed Topics arrow debate.
Group DevelopersGroup Particularly helpful Moodlers

This just uses a rotation of the standby symbol akin to the direction of the arrow.  However they may not be appropriate in all institutions.


 
Average of ratings: -
Picture of Rick Jerz
Re: The great Collapsed Topics arrow debate.
Group Particularly helpful Moodlers

Hi Gareth,

You might not have realized this, but the above symbol scheme is exactly what I have been saying all along about how the arrows should point.  As you know, I have modified your defaults so that my CT arrows point they way I think they should.  Look at my method below and realize that my arrows are pointing in the exact same direction as your "handles".

I have been taking note of other websites that use arrows.  There is some inconsistency, but in general, I am finding more that use my proposed method (and now yours, too), of how the arrows should point.

 
Average of ratings: -
Gareth J Barnard
Re: The great Collapsed Topics arrow debate.
Group DevelopersGroup Particularly helpful Moodlers

Interesting Rick smile - do you like the new icons?

Cheers,

Gareth

 
Average of ratings: -
Picture of Rick Jerz
Re: The great Collapsed Topics arrow debate.
Group Particularly helpful Moodlers

Good question.  I personally think you did a good job with the new icons.  But the problem might be that others will not recognize them.  I think that icons should be consistent within a theme, where ever possible.  So until Formal White adopts your icons, it might be better to stick with the arrows.

I think your analogy of a water facet is good (for most parts of the world). 

For now, I would probably do what it takes to make the arrows point in my preferred direction.  With CT from a few days ago (the GIT one), I end up changing ([[pix:format_topcoll|arrow_right)) and ([[pix:format_topcoll|arrow_down) and  near the bottom of your styles.css file.  It is pretty straightforward for me to make these edits.

 
Average of ratings: -
It's only an avatar...
Re: The great Collapsed Topics arrow debate.
Group DevelopersGroup Documentation writersGroup Particularly helpful MoodlersGroup Testers

I like the new icons, and since a theme can over ride icons using a renderer, it does not really matter what icon you add, just as long as it does the job of either opening or closing a given section.

The new icons are typical of Mobile devices so I reckon most mobile device savy Moodlers will instinctively know which is which and if not will soon find out when they click it! smile

You could go one better and add sound...

Hear the next to last on this page...

http://www.soundjay.com/door-sounds-2.html

this is a lovely cascading sound that would be great for Collapsed Topics. smile

 

 

 
Average of ratings: -
moi!!! it is what is is...
Re: The great Collapsed Topics arrow debate.
Group Documentation writersGroup Particularly helpful Moodlers

Well, I have a hearing problem, so sounds to me are an unneccessary affectation. Unfortunately, some sounds can grate on me, and I do not believe that I am in a minority here. I am aware of my problem, and develop ways to deal with it. However, how many others are not. I suspect that for others noise might be a strong inducement for going postal. Good idea Mary, for some, but not, for me and many others, not an attractive option. If the flexibility for sounds to be on or off depending on a loginid, can be developed, then why not?

 
Average of ratings: -
Gareth J Barnard
Re: The great Collapsed Topics arrow debate.
Group DevelopersGroup Particularly helpful Moodlers

Thank you everybody for your feedback, really helps smile

I'm still going to do some thinking in light of Ben's concept of difference between action and state in conjunction with Rick's consistency.  I do like Mary's idea of sound but the website does not allow redistribution.  However, I'm not adverse to creating my own, but that would impact on page load times and users would want a 'turn off' feature as Colin states, so perhaps something for the future if funded or if Moodle core introduced a 'sounds' API.

The new icons Ben are actually the same 24x24 px size as the arrows.  I do like the idea of a 'hover' state so will add that into the power icon branch for evaluation.

Please keep the thoughts comming smile

Cheers,

Gareth

 
Average of ratings: -
Picture of Ben Kelada
Re: The great Collapsed Topics arrow debate.
 

some quick comments sorry for brevity!

- I dislike sounds i dont think they add value, and agree they get annoying, 

- with the consistency issue raised, i did realise that the plus icons weren't consistent with the arrows, but then again it is a different navigational item, i.e. the moodle ui uses arrows for "tree" navigation, whereas this slightly different open/close functionality (but also overlapping), 

-in regards the hover icon, most ui's just highlight on hover they dont change the icon until the click.

-in regards size, imho, i think the arrows also are too big i like navigation to be clear but unobtrusive, i'm using 16x16, but again no big deal as it is customizable!

 

 
Average of ratings: -
Picture of Rick Jerz
Re: The great Collapsed Topics arrow debate.
Group Particularly helpful Moodlers

I too agree with Colin (I also have a hearing problem).  If sounds are added to Moodle, then you have to have some way of allowing students, and everyone else, an easy way to mute sounds.  I actually have my PC (Windows 7) set to not use sounds, because they are distracting to me.  Yep, they are cute for the first two or three times, but after that, I do not find them useful.  Also, since some students might use Moodle in an open classroom (and some students don't know how to mute sounds), these sounds could become distracting.

 
Average of ratings: -
Gareth J Barnard
Re: The great Collapsed Topics arrow debate.
Group DevelopersGroup Particularly helpful Moodlers

Hi,

I've implemented the 'hoover' idea of Ben's and as it's a dynamic thing produced a screen cast of what it looks like, please see:

You can try out the code from the same place:

https://github.com/gjb2048/moodle-format_topcoll/tree/MOODLE_24_POWER_TOGGLE

Feedback appreciated, plus don't be scared, I do have an English accent.

Cheers,

Gareth

 
Average of ratings: -
Picture of Michele Turre
Re: The great Collapsed Topics arrow debate.
 

Gareth, sorry to pitch in late on this issue.  I think you are headed pretty much in the right direction, but I don't think the power-button image on your latest idea for an icon is suitable.

I say, just use the standard arrows, as in the navigtion block: Your users already know what they mean.

Here's how we are doing it at UMass Amherst. Our users get it.

UMass toggles

Note that we changed the "toogle all" area from "▸ Open ▾ Close all sections," to "▸ Open All   ▾ Close All."  People know we are talking about the sections. Also we made the toggle arrows smaller and more like the standard fly-out icons, but that's just a matter of taste.

 
Average of ratings: -
Gareth J Barnard
Re: The great Collapsed Topics arrow debate.
Group DevelopersGroup Particularly helpful Moodlers

Dear all,

I have made an improvement that I hope will satisfy all by the addition of a new bit of functionality called 'Icon sets', please view:

I made this at the same time as Michele was making her post.  So I think I will change to the 'Open all / Close all' wording despite the language file issue - but I think that AMOS performs automatic translation - so therefore I can eliminate all bar the English US and English Pirate files.  But I think there will be a lower case 'a' on 'All'.

It is relatively easy to add in the pointy arrows as the third set.

You can download this version from the same place: https://github.com/gjb2048/moodle-format_topcoll/tree/MOODLE_24_POWER_TOGGLE

Feedback appreciated, cheers,

Gareth

 
Average of ratings: -
Gareth J Barnard
Re: The great Collapsed Topics arrow debate.
Group DevelopersGroup Particularly helpful Moodlers

Dear all,

'Point' icon set now added to https://github.com/gjb2048/moodle-format_topcoll/tree/MOODLE_24_POWER_TOGGLE.

Cheers,

Gareth


 
Average of ratings: -
Picture of Rick Jerz
Re: The great Collapsed Topics arrow debate.
Group Particularly helpful Moodlers

Gareth, I tried your latest concept and it seems acceptable to me.  I still can't say if the animated arrows are great (yet), because this still seems a feature that is somewhat unique.  But I can say that it is not bothersome.  I just tried your "point" option, and it appears that this option is not animated, which I really like.  Am I seeing this correctly, that "point" are not animated?

Well, you have really put in a lot of work to take everyone's thoughts into consideration.  Just the other day, I was on a website that was using the "power" icons, but I can't remember what site this was.

Thanks once again for making all these improvements.  It is somewhat unbelievable that you have taken into account everyone's ideas.  Let's see how other's comment on all of this.

 
Average of ratings: -
Gareth J Barnard
Re: The great Collapsed Topics arrow debate.
Group DevelopersGroup Particularly helpful Moodlers

Dear Rick,

Oh, the 'point' arrow does not highlight because I've not done that bit yet!

It is quite easy to stop the hover by editing 'styles.css' and removing any selectors with a ':hover' pseudo-class, e.g.:

#toggle-all .content .toggle-arrow h4 a.off:hover {
background: transparent url([[pix:format_topcoll|arrow_right_glow]]) no-repeat 0px 45%;
}

If you could let me know the website with the power icons then that would be appreciated so that I can see them in context.

There is lots more I want to do with the format like:

  • Custom capabilities so that admins can restrict the editing capabilities of users.
  • Proper integration with the MyMobile theme.

But now running out of time and have to concentrate on job hunting.  If anybody has need of improvements and is willing to fund them, I would like to hear from you.

Cheers,

Gareth

 
Average of ratings: -
Picture of Rick Jerz
Re: The great Collapsed Topics arrow debate.
Group Particularly helpful Moodlers

Gareth,

I thought that you might have intentionally left off the hover for arrows.

Is it possible to turn off the hoover by putting something into the custom CSS for this theme?  I like this approach instead of editing styles.css.

Already, I have put the following code into my custom CSS in order to slightly modify the section titles.

.course-content ul.ctopics li.section .content .toggle a h3.sectionname {
font-size: 10pt;
padding-left: 5px;
line-height: 120%;
}

Might I simply add to following (is it as easy as this)?

.toggle-arrow h4 a.off:hover {
background: transparent url([[pix:format_topcoll|arrow_right_glow]]) no-repeat 0px 45%;
}

I am sorry I cannot remember the website that used power buttons.  I saw it, said to myself "I need to let Gareth know", but forgot to take a screen shot.

Good luck on your job hunting.  It would seem to me that there could be many schools needing Moodle support people, if this work is in your area of interest.

 

 
Average of ratings: -
Gareth J Barnard
Re: The great Collapsed Topics arrow debate.
Group DevelopersGroup Particularly helpful Moodlers

Dear Rick,

Instead of you adding more custom css to your theme, I have added a new option in the format to turn on / off the hover ('on' by default, see the bottom of the tcconfig.php file) - screen shot attached.

You can get the code from the same place:

https://github.com/gjb2048/moodle-format_topcoll/tree/MOODLE_24_POWER_TOGGLE

I hope this helps, cheers,

Gareth


 
Average of ratings: -
Picture of Rick Jerz
Re: The great Collapsed Topics arrow debate.
Group Particularly helpful Moodlers

Well Gareth, I think that you are finished with everything on my list.

I just upgraded my experimental Moodle to Moodle 2.4.1+ (Build: 20130131).  I installed your latest TC.  I have debugging on.  I have absolutely no problems at all, and every option that you now provide has been very useful.

Wow!  Thanks much.  I hope others who have had requests can let you know how their Moodle sites are working.

 
Average of ratings: -
Picture of David Kimball
Re: The great Collapsed Topics arrow debate.
 

Is there a way to hide the Open all / Close all toggle line?

 
Average of ratings: -
Gareth J Barnard
Re: The great Collapsed Topics arrow debate.
Group DevelopersGroup Particularly helpful Moodlers

Only globally by editing the code.

 
Average of ratings: -
Picture of Ben Kelada
Re: The great Collapsed Topics arrow debate.
 

Hi Guys,

I've been on a break, so haven't been actively contributing, but it looks like you have all been having fruitful debate.

as the images are customizable i'm ok with whatever is chosen, as our users are really happy with our customization. I'll add my 2c worth into this discussion though in the hope of being somehow useful.

In my view icons should be "intuitive", "simple", "consistent" and clear, which i guess is what this debate is all about.

the icons seem to have run into the hurdle as i mentioned in a nother post about representing "state" vs "action"

what it looks like being debated above is having individual section toggles represent "state" and the "open/close  all" toggles represent "action"

Can i suggest implementing different icons for the "open all"/ "close all" and the individual icons to hopefully clear some confusion

if sticking with the arrows for individual toggles, google/windows/moodle all use the arrows to represent state, google/windows tend to have a hover action as well though increasing usability, and as previously mentioned i think windows 7 having the angled triangle instead of the down triangle is better.

I think the power plus icons are ok, a little large, and not quite as simple as i would prefer but that is just my personal preference, i dont like the power/faucet icons as although they look nice are not a "regular" uii type icon to represent open/close, it usually represents "power/turn off"

Here is the screenshot again of our theme, note the different open all / close all icons, i havent put a hover image on the individual "+" icon but i'd like to if i get some time to play with it. Both "individual" and "open/close all" represent action to hopefully be intuitive (as this is how other systems behave), consistent (all action) and clear

Anyhow don't know if i've been helpful or just rambled, hopefully i've at least summed up discussion thus far ;)

cheers,

Ben

latrobe collapsed topic theme

 
Average of ratings: -
Picture of Rick Jerz
Re: The great Collapsed Topics arrow debate.
Group Particularly helpful Moodlers

Ben, very good work.  I kind of like it.  But if you look just to the left side of your figure, Moodle is using the triangle icons, not the "+" and "-".  So you might be violating your "consistent" rule.  This is the perspective that I am coming from, that I prefer the triangles only because that's what Moodle is using.  If you look at your "EN100" course, you will see that the "down arrow" is performing the function of "open all".  Everything below it is opened, and can be closed by clicking on the down arrow.

 
Average of ratings: -
Picture of Ben Kelada
Re: The great Collapsed Topics arrow debate.
 

hi rick, as i have jsut commented above (only repeating for clarity) the open/close all in the navigation is intuitive because its is a tree structure, it only opens/closes all for child nodes of that tree, sometimes ui's will have a "collapse all" to close all parent/child nodes as well

 
Average of ratings: -
Picture of Rick Jerz
Re: The great Collapsed Topics arrow debate.
Group Particularly helpful Moodlers

Okay.  I was just noticing the differences.  I did see Gareth's new "hoover" idea, which is interesting.  At this point, I am not sure what to say.  I think that I need to think about this.

 
Average of ratings: -