General plugins

 
 
Picture of Rodney Wolford
Questions abou using "oohoo - Tab display"
 

Not sure this is the right forum for this -- but here goes.

I have been trying to use Tab display to allow side-by-side interactive demos with quizzesfrom a Lesson. In this manner, a trainee will be able to switch between the interactive demos and the quizzes, using the demo to aid in finding answers. Unfortunately, I have encountered two problems.

1. In the Tab Content area for Tab Display module, html code can be added. I have tried several times to add html for Adobe Director Shockwave (.DCR). It loads perfectly in the "editing" mode, but when saved and deployed the html rewrites itself as Adobe Flash Shockwave (.SWF). I have successfully used the Director Shockwave html in Lessons with great success. Not so with Tab Display. Why is this? How can I fix it? By the way, I can use the embed webpage option, but I am unable to control the dimensions of the Director Shockwave file.

2. What I am hoping to achieve is a set of tabs, one containing the interactive Director Shockwave DCR movie and the other tabs containing Quizzes from a lesson. Using the embed web page option on a tab, I can load my lesson quizzes, but it is bringing in the whole page with headers, sidebars and so on. Is there a method by which I can just add the lesson quizzes into the Tab?

Any guidance would be appreciated. Examples or screen shots are available if needed.

Thanks very much,

Rod Wolford (still a newbie)

 
Average of ratings: -
Picture of Nicolas Bretin
Re: Questions abou using "oohoo - Tab display"
 

Hi Rod,

I just posted a new version of the Tab Display on Moodle with a little modification.

The content of the tab was configured to be filtered (setType = PARAM_CLEAN ), so HTML tags like OBJECT were not allowed. I just replaced the filter to the same than classic Moodle editor (PARAM_RAW), so now it should be good and you should be able to put your HTML with your .DCR file !

For every questions or bugs, don't hesitate to put them directly on the issues page of the github project => https://github.com/oohoo/moodle-mod_tab/issues

Thanks,

Nicolas

 

 
Average of ratings:Useful (1)
Picture of Rodney Wolford
Re: Questions abou using "oohoo - Tab display"
 

No -- Thank You! This makes one of my two problems go away. As far as posting issues, I will be sure to do so in the future. As a Newbie I'm still learning my way around the community.

Thanks again,

Rod Wolford

 
Average of ratings: -
Picture of Nicolas Bretin
Re: Questions abou using "oohoo - Tab display"
 

Hi Rod,

Sorry I forgot to answer to your second problem!

The only solution that I have is a little trick on your theme because the tab display can not modify the layout of other pages.

The trick is to add in the theme a condition that said: if the param "embed" in the URL exists and is set to 1 force the layout to embed (Of course you need to have a embedded layout in your theme)

In your theme, file renderers.php, in the constructor, add:

public function __construct(\moodle_page $page, $target)
    {
        //Force embedded layout if param embed is active
        $embed = optional_param('embed', 0, PARAM_INT);
        if($embed == 1)
        {
            $page->set_pagelayout('embedded');
        }
        
        parent::__construct($page, $target);
    }

And you just have to call the page with an extra param embed=1 in the URL like http://mymoodle/mod/page/view.php?id=123&embed=1

I hope this will help you!

Nicolas Bretin

 
Average of ratings:Useful (1)
Picture of Rodney Wolford
Re: Questions abou using "oohoo - Tab display"
 

Hi Nicolas,

Sorry I didn't answer sooner. I was busy trying to get other parts of our site ready for testers to review.

Initially, I opted out of using the Tabs Display because I couldn't solve the emedding issue. Instead, I used a pop-up window that users would flip to while answering questions using the ALT + TAB keys. A very unsatisfying solution.

However, now that this fall back position is operational for the current review, I have turned to your recommendation as I know it will provide superior results. Unfortunately, I am unable to make it work ... YET!

I wanted to attach three screen shots, but even zipped, they were too big (187 kb). So here is a link, if you are interested.

http://www.fofcom.com/public/display_tabs_3_screens.pdf

Screen 1) Shows that the Demo in the Tab displays perfectly since you fixed the ability to embed Director Shockwave. Thank you!

Screen 2) Shows what Quiz Question 1 looks like using your solution above. Not perfect because of the red in the header, but probably fixable.

Screen 3) However, when using the submit button, it returns to the new screen with sidebars embedded again. I'm sure this means that the "embed" option needs to be added to the link on the submit button. And then on all subsequent buttons. I have reviewed the source html for the pages, but to me it is not clear how this can be done easily. Seems some sort of global property is needed.

Any thoughts? Of course, even if I am unable in this instance to get resolution, I will continue to work toward an eventual answer because I think the Tabs Display provides the best solution. Thanks again for your help.

Regards,

Rod

 
Average of ratings: -
Picture of Nicolas Bretin
Re: Questions abou using "oohoo - Tab display"
 

Hi Rod,

Screen 2: You can add specific css in your theme for the embedded page like:

body.pagelayout-embedded h2{
 //your css
}

Screen 3: This is a though one... you can't really update (in the proper way) the links of your page through the theme. It is why it will be great that moodle integrate a solution to do that.

  • A cheat will be to update the links via javascript in your theme to add the embed=1 to all urls but that can be heavy and risky.
  • An other solution will be to do the same thing that moodle does for the theme parameter => put the param in cookie for reminder in the next pages.
    If you activate it in your moodle you can change the theme of your moodle in the fly by adding &theme=mythemename. This will be kept in cookie so if you change the page, the theme will be the same.
    The problem is you don't want that because you will have this for ALL your pages, even out of the frames until you force it again to a different value.
  • One other idea will be to check what is your previous page url and look for embed=1 in this url with "$_SERVER['HTTP_REFERER']". You can do that for the second page but no more...
  • One last idea will be to detect if you are in an frame with javascript with something like "if (window!=window.top) { /* I'm in a frame! */ }". The problem is you can't change the layout from the javascript, so you will have to hide all blocks "manually" in javascript+css after you detect you are in a iframe.

Hope this will help you!

Nicolas

 
Average of ratings:Useful (1)
Picture of Rodney Wolford
Re: Questions abou using "oohoo - Tab display"
 

WOW!

Screen 2 response was something like what I figured could be done. Mostly uncomplicated and possible for a newbie like me.

As for Screen 3, the response is probably what I expected, but maybe a bit too complex for me at this moment.

I can see how a javascript could be used to say "if it is URL X or URL Y then embed = 1" but that would become a problem child very quickly.

I vaguely understand the cookie concept. I have done some basic cookie making and destroying, but I am not much of a baker! This would take me some time to figure out, but might be worth trying just for the learning. Though I can see the changing back and forth would present nearly the same problem as the javascript solution, though more generalized and so better, maybe?

I don't know anything about the "$_SERVER['HTTP_REFERER']" concept or how to use it. I will investigate it a little. It would be added into one of the existing php files, I assume? Maybe a combination of this idea and either the javascript or cookie concept could be worked together. For example, if this command returns the embed = 1 in the url, it adds a cookie???

Also, maybe just an appropriate question type needs to be added to the Moodle question or quiz options? Anyway, this all remains a bit beyond me right now. But I will continue to look for the answer and at least you have added some light on the path!

Would be great if Moodle would make something like this possible. It seems like it would be an obvious benefit. And I still love your Tab Display plugin. Just will have to use it in more limited conditions for the time being.

Thanks again for you guidance.

Rod Wolford

 

 

 
Average of ratings: -
Picture of Nicolas Bretin
Re: Questions abou using "oohoo - Tab display"
 

An example of Javascript for moodle to do that will be:

YUI().use('node', 'querystring',
function(Y)
{
    //Load on the document is ready
    Y.on('domready', function()
    {
        //You can do the same thing with forms so it will be Y.all('form') and var url = node.get('action');
        Y.all('a').each(function(node)
        {
            var url = node.get('href');
            var page = url.split('?');
            var paramsurl = '';
            //Exclude urls that contains #
            if(url.indexOf('#') == -1)
            {
                //If there is already params set the params
                if(page.length > 1)
                {
                    paramsurl = page[1];
                }
                page = page[0];
                //Get an object from the url
                var params = Y.QueryString.parse(paramsurl);
                //Set the embed=1
                params.embed = 1;
                //Reconstruct the url
                url = page + '?' + Y.QueryString.stringify(params);
                //Then update the attribute
                node.set('href', url);
            }
        });
    });
});

Read the comment in order to reproduce that for other elements like forms.

You just have to put this javascript on your embed template, in that way you will have all your links with the embed param

 

For the $_SERVER['HTTP_REFERER'], you just have to add a condition in your theme constructor like that

public function __construct(\moodle_page $page, $target)
    {
    //Here get the $_SERVER['HTTP_REFERER']
    $prevembed=0;
    //If embed available in the previous url set the $prevembed to 1 => the layout will be change to the embedded
    if (str_pos($_SERVER['HTTP_REFERER'], 'embed=1')!==false)
    {
        $prevembed = 1;
    }
    //Force embedded layout if param embed is active

    $embed = optional_param('embed', 0, PARAM_INT);
    if($embed == 1 || $prevembed == 1)
    {
        $page->set_pagelayout('embedded');
    }
    parent::__construct($page, $target);
}

 
Average of ratings: -
Picture of Rodney Wolford
Re: Questions abou using "oohoo - Tab display"
 

I want to thank you right now for this code. I have not used it yet. Hopefully some time during this week.

I will give you a report once done. With luck, the report will be simple: SUCCESS! But either way, I want you to know how it has worked out.

You have been very kind sharing this information.

Thank you,

Rod

 
Average of ratings: -