User:JimTittsler/Blog/2012

To subscribe to this blog with your news reader, subscribe to the parent blog page.

ePUB e-Book Publishing

In addition to exporting your collection of pages in PDF or ODT formats, you can also write an ePUB format e-Book for use on your e-reader phone, tablet, or computer.

--JimTittsler 04:20, 20 September 2012 (UTC)

WikiEducator IFramed Content Footer

At Wayne Mackintosh's suggestion I've made a subtle change to the footer displayed when you reuse WikiEducator content in an IFrame, such as when you embed it in an LMS or a CMS. If you embed a specific revision of a page, the footer now includes the date of that revision and the link back targets that revision.

Revision of 21:02, 29 December 2011 retrieved from http://WikiEducator.org/Copyright_for_Educators/Introduction

--JimTittsler 21:56, 14 June 2012 (UTC)

WEnotes Ask Feed

WEnotes now collects from a fifth source, the Askbot-powered Ask site that provides a crowd-sourced question and answer site supporting OERuniversity courses. Similar to the Moodle feed, the Ask feed takes the first 137 characters of an Ask question, answer, or comment and adds them to the collected timeline. This aggregated timeline of identi.ca, Twitter, WikiEducator, Moodle, and Ask postings provides a convenient single place to monitor discussions around an open course. Users are welcome to use their preferred tool(s), but are encouraged to monitor the wider community.

Ask uses the Gravatar service to provide icons for participants. If the user has not created a gravatar, a unique identicon is used.

An implementation detail: Because the Askbot RSS feeds do not return all of the information necessary for this application, I've extended the Ask.OERuniversity.org installation to include customized Atom feeds.

--JimTittsler 02:29, 14 June 2012 (UTC)

WikiEducator Content in an IFrame

WikiEducator includes some code in its MediaWiki:Common.js that attempts to detect when a wiki page is being displayed inside an iframe. If it is, the Javascript removes some of the page elements (particularly navigation or editing elements). If the browser supports the parent.PostMessage, the Javascript reports the display height of the content to the containing page, so that it has the option of adjusting the height of its iframe element. The message sent is of the form height^xxx^url where:

xxx 

is the approximate display height in pixels

url 

is the url involved (in case the containing page has more than one iframe)

The way the WikiEducator Moodle installation takes advantage of this is by embedding a bit of Javascript on every page that listens for the message and (optionally) adjusts the height. The Moodle author can prevent this automatic height change by adding the fixedheight class to the iframe tag (e.g. <iframe class="fixedheight" height="300" src="..."></iframe>).

handleIFrame = function(e) {
        var args = e.data.split('^', 3);
        var resize;
        if (args[0].toLowerCase() !== 'height') {
                return true;
        }
        var iframes = document.body.getElementsByTagName('iframe');
        for (var i=0; i<iframes.length; i++) {
                resize = true;
                if (iframes[i].getAttribute('src') === args[2]) {
                        var classes = iframes[i].class ? iframes[i].class.split(' ') : [];
                        for (var j=0; j<classes.length; j++) {
                                if (classes[j].toLowerCase() === "fixedheight") {
                                        resize = false;
                                        break;
                                } 
                        }
                        if (resize) {
                                iframes[i].scrolling = 'no';
                                iframes[i].height = args[1];
                                // width hack to try to hide horizontal scrollbar
                                if (iframes[i].width && iframes[i].width === '100%') {
                                        iframes[i].width = '99%';
                                }
                        }
                }
        }
}
 
if (window.addEventListener) {
        window.addEventListener('message', handleIFrame, false);
} else {
        window.attachEvent('message', handleIFrame);    // IE is special
}

This scheme could be extended to support other messaging from WikiEducator hosted content to the containing LMS, including quiz score reporting.

--JimTittsler 23:05, 30 April 2012 (UTC)

Slideshows with Narration

Almost a year ago I wrote a widget that allowed turning a specially crafted page of wikitext into a "slide" presentation based on the html5slides template. I also demonstrated how you could embed audio players on each page to narrate each slide.

One of the OERfoundation partner schools has a staggering number of Flash-based narrated slide shows. In an attempt to prototype an HTML/Javascript way to render an alternative version of these, I've added the ability to embed an overall narration track and cue sheet that "plays" the WikiEducator slide presentation in sync with the narration. This version takes advantage of the Mozilla Popcorn.js library.

This requires a modern HTML5 aware browser. If you are using IE, you will want a recent version of the Chrome Frame plugin installed. And with some browsers, it doesn't work if you are still using the old monobook skin. And the magic "?present" addition to the URL doesn't work yet with this feature. But it is a proof of concept.

--JimTittsler 05:36, 19 April 2012 (UTC)

Reader Mode

I have experimented using Javascript to convert the Vector skin to a more distraction-free reading environment. At the same time I have reduced the horizontal screen size by turning the left navigation bar into a slide-out drawer. This makes reading on a portrait mode tablet (or any other narrow window) more convenient. If you would like to try this mode (which will work not only in tablets, but in modern desktop browsers), you can add the following lines to your User:username/vector.js file:

// reader mode for narrow screens
// should follow googlesearch.js if used
//  to force using reader mode, regardless of width
//  window.weReader = true;  
importScript('User:JimTittsler/reader.js');

Or cut-and-paste the relevant part of my vector.js.

--JimTittsler 00:37, 16 March 2012 (UTC)

WEnotes

WEnotes has two functions:

1. it provides a micro-blogging interface for anyone with a WikiEducator account, allowing them to post 140 character thoughts and links to a WikiEducator stream
2. it caches and displays an amalgamated microblog stream with content pulled from
   • the WikiEducator-specific WEnotes stream
   • a WikiEducator Moodle social forum (posts can be truncated to fit 140 characters)
   • identi.ca
   • (optionally) Twitter

An example is the feed used in the OCL4Ed course.

--JimTittsler 04:30, 15 January 2012 (UTC)