Page 1 of 1

hardcoded background-pic in content:multimedia

Posted: Tue 20. Dec 2005, 18:06
by le block
hello everybody,

i'm currently working on a elearning-portal using phpwcms(for webbased training) in combination with flash-quiz-components. So I've got a proper amount of single quiz-components with filesizes > 150Kb. Unfortunally i've forgotten to implement a preloader. So my question is: how to implement (with your little php-help) a animated gif in den multimedia-content of the CMS. The file for the multimedia-contentpart is inc_front/content/cnt9.article.inc.php, right? (Found a list of all contentparts, right here in the forum-thx).
My goal is, during the loading progress of the swf-file, the user should see the animated gif. After finishing the quizfile, the embedded flashplugin should cover the background-pic(i know: background-transparency diabled). Or is there an easier way?
Thx a lot and merry christmas

le block

hmm

Posted: Wed 21. Dec 2005, 11:20
by phalancs
Well i guess thats far to fuzzy to do that.

Code your .swf files properly, thats the easiest solution if you still have the .fla files.

Posted: Wed 21. Dec 2005, 11:44
by le block
thanks phalancs,

thats not what i wanna here. Aprox. 50 flashfiles (i made these) to modify, where no preloader is allowed on _root. because of the quiz.superclass (but that's another field). The deadline is December 30th. --> No time left

So it can't be hard to modify the contentpart. I specify my quetsion:
Which file in the CMS is the right media-contentpart? Which is the proper PHP-Code to define a css-class. This css-class (my part) should specify the background-color and an background-image of part where the swf-file is load in?

any idea?

thanks in advance, le block

Posted: Thu 22. Dec 2005, 19:51
by le block
no help, out there?

maybe somebody can tell me, which the right contentpart (for multimedia - flash) is? I'll give a trial and error, to modify this file.
le block

Posted: Fri 13. Jan 2006, 15:37
by le block
A quick and dirty tutorial of hardcoded (animated) loading images.

So let's beginn.
The trick is to use the transparency of flashobjects emmbedded in html-sites. That means: while loading, the flashmovie is transparent (catchword:wmode=transparent) and the user will see the background-image. When the file is complete loaded, the symbols/grafix will cover the background-image(,what's still there).

OK, thats the theory - Now the practise.

Step 1: Modify the content part (works only for the flash-object)

Tweak the cnt9.article.inc.php located inc_front/content with the following code:

Code: Select all

case 3:	//Flash Player/Plugin
													$media["width"]  = ($media["media_width"]) ? "width=\"".$media["media_width"]."\" " : "";
													$media["height"] = ($media["media_height"]) ? "height=\"".$media["media_height"]."\" " : "";
													$media["code"]	= "<div class=\"flashmedia\"><OBJECT CLASSID=\"clsid:D27CDB6E-AE6D-11cf-96B8-444553540000\" ";
													$media["code"] .= $media["width"].$media["height"]." border=\"0\" id=\"".$randomID."\" ";
													$media["code"] .= "CODEBASE=\"http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0\">\n";
													$media["code"] .= "<PARAM name=\"movie\" VALUE=\"".$media["source"]."\">\n";
													$media["code"] .= "<PARAM name=\"quality\" VALUE=\"high\">\n";
													$media["code"] .= "<PARAM name=\"SCALE\" VALUE=\"noborder\">\n";
													$media["code"] .= "<PARAM name=\"LOOP\" VALUE=\"true\">\n";
													$media["code"] .= "<PARAM name=\"WMODE\" VALUE=\"transparent\">\n";
													$media["code"] .= "<PARAM name=\"PLAY\" VALUE=\"".$media["media_auto"]."\">\n";
													$media["code"] .= "<EMBED SRC=\"".$media["source"]."\" BORDER=\"0\" ";
													$media["code"] .= $media["width"].$media["height"]." id=\"".$randomID."\" ";
													$media["code"] .= "TYPE=\"application/x-shockwave-flash\" play=\"".$media["media_auto"]."\" ";
													$media["code"] .= "wmode=\"transparent\" quality=\"high\" scale=\"noborder\" pluginspace=\"http://www.macromedia.com/go/getflashplayer/\"></EMBED>\n";
													$media["code"] .= "</OBJECT></div>\n";
													break;
That will define
1.) a CSS-Class ".flashmedia" ,
2.) give the flash-object a new paramenter PARAM Name="WMODE" value ="transparent" and
3.) the browser a value wmode="transparent" <- this is needed for all the modern browsers, except IE, to show the transparency-effect

Step2: define a stylesheet-class (css)

Code: Select all

.flashmedia {
background:transparent url(http://www.yourdomain/animated.gif) no-repeat center;
}
Step3: Cover the background-image
In your flashprojects you must place a symbol in the background right on the place the animated-gif is look through. I used a simple white rectangle in stagesize.

Step 4: Lean back.Thats it.

Quit simple if you know how.:roll:
Hope this will help somebody outthere. For a demo look here http://www.uni-leipzig.de/~skisport/index.php?conquest and choose a link. (only in german)

le block