Flash module add-on: New Flash Module project

Flash module add-on: New Flash Module project

by Matt Bury -
Number of replies: 15
Picture of Particularly helpful Moodlers Picture of Plugin developers
Ok, the other thread was just getting too long!

For any new-comers, here's a summary of what I'm proposing so far:

Already agreed upon by contributors:
* Create a new Flash module that integrates SWFs into Moodle, similar to the old Flash Activity Module.
* The new module must be Flash version independent - that is, you can use any version of Flash from MX 2004 (version 6) to Flash CS3 (version 9), and be upwardly compatible with any future versions of Flash. i.e. a PHP wrapper.
* Create a library of video tutorials and top-notch documentation with example source code to give the maximum possible help to anyone proposing to use this system. Making it accessible will be vital to its success.

Further proposals:
* The database and PHP code should be geared toward a dynamic media handling system using XML so a working module installation would have something like:
  • Folders containing media GIFs, JPEGs, PNGs, FLVs, MP3s, SWFs (media only) and TXT.
  • A folder containing XML files.
  • A folder containing SWF presentations.
Any SWF presentation can, therefore, use any of the resources in the folders, negating the need to make a large number of duplicates as in the SCORM model, and making a very efficient, dynamic organisation of resources that is easy to maintain and edit. e.g. If you want to change a graphic or you find a typo, you don't have to open up every single zipped SCORM package that contains it to edit it. This is pretty much the same way that website media is handled anyway.

A developer will be able to create a presentation SWF, for example a quiz, that contains no media. The SWF loads an XML file that contains the questions and answers and references any necessary media such as video, MP3 files and images which make up a particular quiz. In this way, only a small number of SWFs are necessary to create a great number of quizzes.

I believe that, with this model, a new Flash activity module will be extremely powerful and versatile. Developers and resource designers will be free to explore the possibilities and come up with creative new ways to convey information and teach skills.

* There are currently 2 Javascript files that make it quick and easy to embed Flash: swfobject.js and AC_RunActiveContent.js. Although swfobject is by far the best option to date, some Flash users may want to use the standard AC_RunActiveContent.js that Flash CS3 publishes automatically just for convenience. A third, non-javascript version, would also be desirable.

Have I missed anything?

Comments, criticisms, ideas and support are all welcome. I'm a Flash developer, AS 2.0 and AS 3.0 including OOP, and just getting started in PHP and SQL. There are a number of areas that I'll need a lot of help with, so don't be shy, come and give me a hand!
Average of ratings: -
In reply to Matt Bury

Re: Flash module add-on: New Flash Module project

by Twisted Studio -
Hey Matt,

No i didnt fall off the face of the earth, just been buried in talks for business. Not going to pollute this thread other than to say my hands are officially tied. "It MUST be SCORM complient!" thats the final note of my last email. Im sure they just read its the defacto standard and said okay...if only they knew the bane of it all.

I have something to contribute with you and i wonder if your research has come across it. Its not SCORM specific but it is communication between swf and server specific.

AMFPHP

I'm only just getting to looing more deeply into it but the long and short of it is, Flash MX had extensions for it and the new CS3 actually included it. It compresses data (xml for example) etc into effectively smaller binary packets to enable faster communication with databases etc. It might a good thing to consider in your new project.

Moodle Specific Thread

Its worth considering i would think anyway. In the mean time im off playing SCORM related packagers and thinking of ways to get this project done as quickly as possible. It wont be the last time i use Moodle im sure but certainly hope your projects well on its way by then so i can jump in and use that ;)



Average of ratings: -
In reply to Twisted Studio

Re: Flash module add-on: New Flash Module project

by Matt Bury -
Picture of Particularly helpful Moodlers Picture of Plugin developers
Compelled to use SCORM? I feel your pain and I'm sorry. Martin Dougiamas is working hard to make Moodle and SCORM more compatible. He's put out an ad for a SCORM consultant to help him. Good luck!

Something else has occurred to me about this proposed framework/system - it would be very easy for developers to create 3rd party lessons (SWF presentations) that would be simple and easy to distribute and deploy. So if your Actionscript skills aren't advanced or you don't have the precious time to create your desired presentations, you could just get some that are ready-made 'off-the-shelf'. You'd get a SWF, a corresponding XML file (as a template/example) and some sample media (images, audio, video,etc.) just to see how it works, then the course designer just has to substitute the XML data and media. How easy would that be, especially with good docs and tutorials?!!

Being a newbie to PHP and SQL, I've been taking baby steps. Here's what I've been up to (comments and advice are most welcome):

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<?php

// Database access info
include("db.php");

// Connect to database
mysql_connect($host,$user,$pass);
mysql_select_db($database);

// Retrieve entire table (it's very small at the moment)
$result = mysql_query("SELECT * FROM `aa_mdl_newflash`");

// Get the table row number from the URL query string - e.g. ?rowno=3
// This will ultimately be retrieved from another MySQL table (courses + lessons)
// We also need to retrieve the lesson's corresponding XML file
$row = $_GET['rowno'];

// Make sure the 'rowno' query string variable isn't greater
// than the number of rows in the database table
// (This needs to be more dynamic i.e. get the length of the SQL table)
if ($row > 8) {
$row = 1;
}

// Assign the data to variables
$url = mysql_result($result,$row,"filename");
$swf = mysql_result($result,$row,"name");
$width = mysql_result($result,$row,"width");
$height = mysql_result($result,$row,"height");
$version = mysql_result($result,$row,"version");
$bgcolor = mysql_result($result,$row,"bgcolor");

// Always close the database connection when
// you've finished with it!
mysql_close();

// Define HTML page <head> parameters including CSS
$css = "<head>
<meta http-equiv=\"Content-Type\" content=\"text/html; charset=utf-8\" />
<title>Embed using PHP and SWFObject experiment</title><style type=\"text/css\">
<!--
.style1 {
font-family: Arial, Helvetica, sans-serif;
font-weight: bold;
color: #666666;
}
-->
</style>
</head>";

// SWFObject embed code uses variables retrieved from MySQL database
// and a separate swfobject.js script that needs to be included

/*
SWFObject can also pass extra variables into the Flash SWF
It would be nice to be able to get the lesson's corresponding XML file
and pass it in here.
Does anyone know if you can pass an XML object in this way?
*/
$embed_swf = "<body><script type='text/javascript' src='swfobject.js'></script>
<div id='content'>To view the Flash content, please enable JavaScript in your browser.</div>
<script type='text/javascript'>
var so = new SWFObject('$url', '$swf', '$width', '$height', '$version', '$bgcolor');
so.addParam('wmode', 'transparent');
so.write('content');
</script>";

// Print out the database SWF embed data to the screeen
$embed_info = "<br />
<p class=\"style1\">This is an experiment using PHP code to output Javascript code to embed a SWF. If this works, you should see a Flash movie clip on the screen above. The specific variables to embed the SWF were retrieved from a MySQL database. Here they are:</p>
<p class=\"style1\">SQL rowno: '$row'</p>
<p class=\"style1\">SWF url: '$url'</p>
<p class=\"style1\">SWF name: '$swf'</p>
<p class=\"style1\">SWF width: '$width'</p>
<p class=\"style1\">SWF height: '$height'</p>
<p class=\"style1\">SWF version: '$version'</p>
<p class=\"style1\">SWF bgcolor: '$bgcolor'</p></body>";

// Display the page
echo $css.$embed_swf.$embed_info;

?>

</html>
Average of ratings: -
In reply to Matt Bury

Re: Flash module add-on: New Flash Module project

by Matt Bury -
Picture of Particularly helpful Moodlers Picture of Plugin developers

New Moodle Flash Module Database Schematic

I'm new to databases, so comments and constructive criticism from anyone who can see problems with these tables are most welcome. So, is there anything I've missed out? Do we need more than 2 tables? Is this as open and flexible as it should be for all e-learning purposes?

lesson_database

Field Type Collation Attributes Null Default Extra
id int(11) No auto_increment
lessontype* varchar(255) No
xmlurl** varchar(255) Yes NULL***
lessonname varchar(255) No
swfurl varchar(255) No
swfname varchar(255) No
width varchar(4) No
height varchar(4) No
version varchar(2) No
bgcolor varchar(7) No

* lessontype = the particular SWF presentation. It could be a slideshow presentation, a video presentation with captions, a quiz, a test, a game, etc.

** The XML files contain the URLs to all the media content and any captions, text, questions and answers, etc., necessary to create a lesson in a SWF movie clip presentation. It's also possible to make the same XML files compatible with more than one lesson type.

*** Some SWF lessons may be self-contained (i.e. have all the media stored inside the SWF file) and not require external media. In such cases an XML file is not required. Of course a developer, in such cases, has to provide the main SWF presentation (large file size) and a preloader.

Presentation SWFs, because the don't contain any bulky media files, very often have very small file sizes, sometimes as small as 2KB, and don't require preloaders. They can also very precisely sequence and control the download of media.

user_accesses_database

Field Type Collation Attributes Null Default Extra
id int(11) No auto_increment
lessonname varchar(255) No
userid varchar(255) No
answer text Yes NULL
timeaccessed varchar(11) No
grade varchar(11) Yes NULL

Imagine that you have these databases set up within Moodle and something like the following directories set up for your media:

/mod/flashnew/anim/... ...animations such as cartoons

/mod/flashnew/flv/... ...FLV video clips, Flash is also introducing support for MP4 and AAC (advanced audio compression)

/mod/flashnew/mp3/... ...MP3 files

/mod/flashnew/pix/... ...bitmap images - JPEG, BMP, GIF (non-animated but animated GIFs can be easily converted into SWFs), PNG

/mod/flashnew/swf/... ...SWF presentations to combine with XML files to create lessons

/mod/flashnew/xml/... ...XMl files to combine with SWF presentations to create lessons

This is an example of typical lesson XML code:

<lesson>

<node>

<image>/pix/animals/butterfly.jpg</image>

<audio>/mp3/questions/what_kind_of_animal_is_this.mp3</audio>

<question>What kind of animal is this?</question>

<answers correct=0>

<answer>It's a butterfly.</answer>

<answer>It's a bird.</answer>

<answer>It's a dinosaur.</answer>

</answers>

</node>

<node>

<image>/pix/food/bread.jpg</image>

<audio>/mp3/questions/what_do_you_make_toast_from.mp3</audio>

<question>What do you make toast from?</question>

<answers correct=2>

<answer>Cookie dough.</answer>

<answer>Toast.</answer>

<answer>Bread.</answer>

</answers>

</node>

</lesson>

It is relatively easy to understand and edit, even for a non-developer. The resource designer only has to edit the XML files and provide the related media. Most bitmap graphics editors are very accessible and easy to learn, as are MP3 and video editors. A few good tutorials on how to set up lessons in this way can empower resource designers to create whole courses from just a small number of SWF presentations and a few open source WYSIWYG editors, making the abiltity to create high quality e-learning resources accessible to even the poorest schools and universities.

Average of ratings: -
In reply to Matt Bury

Re: Flash module add-on: New Flash Module project

by Matt Bury -
Picture of Particularly helpful Moodlers Picture of Plugin developers
Ok, my code is noew getting too long to post. I've zipped it up and attached it instead.

Here's what happens so far:

The set_db.php script sets up the mdl_newflash_lessons table.

The user can create a Flash lesson with a Flash SWF, an XML file and the necessary media on their desktop. Since it'll all run client side, it's easy to test before deployment.

The user uploads the SWF, XML and media to the server, in the correct directories:
moodle/mod/flashnew/flv/..
moodle/mod/flashnew/mp3/..
moodle/mod/flashnew/pix/..
moodle/mod/flashnew/swf/yourSWF.swf
moodle/mod/flashnew/xml/yourXML.xml
('flashnew' is the root directory for the module so you can use relative paths)

The user enters the lesson data into the database through the flash_data_input.html form:

The posted data is inserted into the database by the insert_lesson.php script which then makes a call to the database to retrieve the last input record to confirm that the data was input successfully.

The lesson can be displayed by write_java.php in the browser by typing the URL with a query string into your browser:
'http://yourserver.com/moodle/mod/flashnew/write_java.php?nm=lessonname'

write_java.php takes the 'nm' variable from the query string and searches the database for that lesson - 'lessonname' is a UNIQUE field in mdl_newflash_lessons so there can only ever be one lesson with that name.

write_java.php then retrieves the lessonname data and uses the parameters to embed the lesson SWF into the page and passes the xmlurl string into the SWF, all with SWFObject.

In AS 3.0, the code to retrieve the xmlurl variable would be something like:

// Retrieve any data passed in through SWFObject (flashVars)
// i.e. so.addVariable('xmlurl','$xmlurl');
var flashVars:Object = this.loaderInfo.parameters;
var xmlurl:String;

for(var variable:String in flashVars){
xmlurl = variable;
}

This code will also work if you want to pass a number of variables into the SWF using SWFObject, and you could push them into an array like this:

// Retrieve any data passed in through SWFObject (flashVars)
// i.e. so.addVariable('xmlurl','$xmlurl');
var flashVars:Object = this.loaderInfo.parameters;
var varArray:Array = new Array();

for(var variable:String in flashVars){
 varArray.push(variable);
}

The same techinique, but with slightly different AS code works for earlier versions of Flash too.
Average of ratings: -
In reply to Matt Bury

Re: Flash module add-on: New Flash Module project

by Matt Bury -
Picture of Particularly helpful Moodlers Picture of Plugin developers
Ok, now that the embedding the lesson part is taking shape, I need to turn my attention to the Moodle gradebook. Basically, I'd like to integrate the new Flash module with it seamlessly.

Question:

Do I need to create a new database table to record the results or is there a general Moodle gradebook table that I need to write to?

Another point is that so far, what I've written works completely independently of Moodle. Can anyone give me any help on how to integrate it with Moodle. I suspect that I'll have to put my code onto the appropriate pages and scripts in the NEWMODULE.zip template package. I'm new to this stuff so please don't be shy - help me!
Average of ratings: -
In reply to Matt Bury

Re: Flash module add-on: New Flash Module project

by Matt Bury -
Picture of Particularly helpful Moodlers Picture of Plugin developers

Here's an idea:

newflash module score table:

Field
Type
Collation
Attributes
Null
Default
Extra
Action
id int(11) No auto_increment UNIQUE KEY
userid bigint(10) No
lessonname varchar(255) No
courseid int(11) No
groupid int(11) Yes NULL
grade int(3) No
attempt mediumint(6) No
answer text Yes NULL
timeelapsed int(11) Yes NULL
timemodied bigint(10) No

This score table seems to be unnecessarily large. Have I included too much? Should I organise the tables differently? Please advise.

Average of ratings: -
In reply to Matt Bury

Re: Flash module add-on: New Flash Module project

by Matt Bury -
Picture of Particularly helpful Moodlers Picture of Plugin developers
Here's a quick demo of what I've got working so far. Please don't be offended by the character being hung - the aim of the game is to save him after all!

There's one SWF presentation and 3 XML files that make up these three lessons:

Introductions Hangman

Introductions and Nationalities Hangman

Possessive Adjectives Hangman

I hope that this'll make what I'm talking about a little clearer and easier to understand how powerful and versatile this module will be.
Average of ratings: -
In reply to Matt Bury

Re: Flash module add-on: New Flash Module project

by wowow turk -
I believe this module is gonna be great!

Seems these 3 links are dead? All I got is

Error 404 - Wrong page 複雑な

Average of ratings: -
In reply to wowow turk

Re: Flash module add-on: New Flash Module project

by Matt Bury -
Picture of Particularly helpful Moodlers Picture of Plugin developers
Sorry, I'm constantly updating this project and adding/deleting pages, etc.

Here's a link to the latest demo page: get_all_lessons.php


Average of ratings: -
In reply to Matt Bury

Re: Flash module add-on: New Flash Module project

by Matt Bury -
Picture of Particularly helpful Moodlers Picture of Plugin developers
I'm now working on adding another database table that'll keep track of all the media that's in the assets folders. You'll be able to do specific searches for types of media and have a look at them i.e. a photo, an XML file, etc. Inspecting FLV and SWF files will need a little more work, as I'll have to create a Flash interface to view them.

The table entries might be:

id - auto-increment unique key
type - type of media FLV, SWF, JPEG, XML, etc.
url - location on the server. Must be unique too.
description - a short text description of what it is - very useful for SWF files as they'll be 'empty' if you view them through this system.
timemodified - the last time it was uploaded

I'm still experimenting and and think about this one. Please give suggestions!
Average of ratings: -
In reply to Matt Bury

Re: Flash module add-on: New Flash Module project

by Vincent Short -
Wow !!!
Average of ratings: -
In reply to Vincent Short

Re: Flash module add-on: New Flash Module project

by Ger Tielemans -

What a fantastic demo!

http://amfphp.sourceforge.net/ 

Does this help?

Average of ratings: -
In reply to Ger Tielemans

Re: Flash module add-on: New Flash Module project

by Matt Bury -
Picture of Particularly helpful Moodlers Picture of Plugin developers
Hi Ger,

No, not as far as I know, although I haven't used AMFPHP before. It's basically an open source version of Adobe's Flash Communication Server, which allows you to keep more server-side data in the very lightweight Actionscript Message Format.

AMF is ideal for 'live' server connections for stuff like chat rooms, on-line games, true streaming audio and video (as opposed to progressive download) and VoIP. Anyone who wanted to do that would be talking about an entirely different module. There seems to be a number of people who are interested in having these kinds of functions, so why not start it as a project?

The embedded Flash movies in the new Flash Activity Module would only send basic data that the PHP wrapper can interpret and send to the Moodle database.

I'm gradually learning how to make my PHP, as basic as it is, fit in with Moodle's API. But with very slow progress, I'm afraid. Don't hold your breath!

If you'd like to help speed things along, please contact me.
Average of ratings: -
In reply to Twisted Studio

Re: Flash module add-on: New Flash Module project

by Stowe Spivey -
AMFPHP is a remote service provider for flash files using php. It's bascially a generic flavor of what adobe charged $$ for.
Average of ratings: -
In reply to Stowe Spivey

Re: Flash module add-on: New Flash Module project

by Marcus Potter -
Hey All
Sorry to crash in on this subject, (Mat as always great work) I am new to Moodle and trying to get my head around all different flash usages with moodle. My personal interest is in building up a "moodle AMF" via AS3 & amfphp.
Click here to view "moodleAMF" post

I'm also trying to make sure all the right people are following this, to either help out or enlighten a newbie (being right or wrong) by atleast pointing me in the right direction for getting moodle AMF'd up! :P

Cheers
Marcus
Average of ratings: -