Dynamic Text in FPP

Hi,

I've been trying to incorporate a small swf hotspot into my tours, one which simply loads text from a given file and presents it against a background. The concept is for presenting information about the room being viewed. This would mean that the controlling xml would not need to be maintained should the text need altering. It is also better suited to templates.

I've tried several methods, but each time the swf loads fine, presenting the chosen background, but the text does not get loaded into the hotspot. I retain the text file in the same directory as the swf and if I run it standalone it works fine.

The very simplest form uses one line of actionscript , basically:

loadVariables("sample.txt", this);

where the file sample.txt contains the variable values.

I'm quite new to Flash, so may be missing something very obvious.

Please can you advise
Thanks
Martin

This is actually quite easy

This is actually quite easy to do. I can get you some actual code to do this when I get to my other computer.

Zephyr

__________________

Zephyr Renner

Great!

Thanks Zephyr, I look forward to seeing how it's done.

I've also tried loading 'flipping book' swf engines as hotspots. Again they work if the page data is internally defined, but once they reference external jpegs/swfs as page data it doesn't appear. Usable, if a bit limited. I'm hoping the solution to my dynamic text woes may help ....

Cheers!

example textbox code

var id:String="descriptionbox";
var version:String="1.1";
var panoController:Object=null;
var pano:Object=null;
var hotspots:Object;
var waitTimer:Timer;
var myXML:XML;

/////////////  FUNCTIONS CALLED BY FPP

// function executes when FPP loads the plug-in we use it to set up a timer to wait for everything else to load and be ready for interactivity
function init (panoMain:Object) {
        if (panoMain.addExternal(this)) {
                panoController = panoMain;
//              redirect();
//              hotspots = panoMain.externals.hotspots;
                waitTimer = new Timer(50);
                waitTimer.addEventListener(TimerEvent.TIMER, waitHotspots, false, 0, true);
                waitTimer.start();
        }
}

function redirect() {
}

function newPano (link:Object) {
        pano = link;
        if (pano.loadersState!=null) {
//              setAttribute("disable","1");
        }
}

var params:Object = new Object();;
var defaultParams:Object={offsetx:"0", offsety:"0", width:"50%", height:"50%", align:"tl", disable:"0",
                                                        tpadding:5, bpadding:5, lpadding:5, rpadding:5,  text:"",
                                                        font:"Arial", fontsize:16, fontcolor:0x000000, bgcolor:0xFFFFFF, textalign:"left",
                                                        bgalpha:1, style:"", minheight:0, widthadjustment:0
                                                        };

// this function handle XML parameters
function newParams (str:String) {
//      myXML = XML(str);
//      var attributes:XMLList = myXML.attributes();
//      var count:int = attributes.length();
//      for( var i:int = 0; i <count; i++ )
//      {
//              var attribute:XML = attributes[ i ];
//              //trace( attribute.name(), attribute );
//              setAttribute(attribute.name(), attribute, null, null, null, null, 0, true);
//      }
        var lines:Array = str.match(/[^\s\n\r]+[^\n\r]+/g);
        for (var i:int=0;i<lines.length;i++) {
                var pair:Array = lines[i].split(/[\s]*=[\s]*/);
                if (pair[2] != null){
                        for (var j:Number=2; j<pair.length; j++){
                                pair[1] = pair[1].concat("=",pair[j]);
                        }
                }
                //trace(pair[1]);
                setAttribute(pair[0], pair[1], null, null, null, null, 0, true);
        }
}

// function is for external calls: "external.smartscale.mode=..."
function setAttribute (name:String, value:String, time:String=null, type:String=null, onDoneFunction:String=null, onInterruptFunction:String=null, relative:int=0, defFlag:Boolean=false) {
        if (defFlag == true){
                if (name != null ) { defaultParams[name.toLowerCase()] = value; }
                if (name == "disable") {
                        if (value == "1") { boxText.visible = false; boxbg.visible=false; params["disable"] = "1"}
                        if (value == "0") { boxText.visible = true; boxbg.visible=true; params["disable"] = "0"}
                }
        } else {
                if (name == "text" ) {
                        defaultParams["text"] = value;
                        descriptionBox();
                }
                if (name == "disable") { trace(value);
                        if (value == "1") {
                                if (params["disable"] == "1") { params["disable"] = "0"; value="0"; }
                                else { boxText.visible = false; boxbg.visible=false; params["disable"] = "1";}
                        }
                        if (value == "0") { boxText.visible = true; boxbg.visible=true; params["disable"] = "0" }
                }
        }
}

function waitHotspots (event:Event) {
        if (panoController.externals.hotspots!=null) {
                // wait for XML parsing
                if (panoController.externals.hotspots.ready) {
                        waitTimer.stop();
                        waitTimer = null
                        hotspots = panoController.externals.hotspots;
                        descriptionBox();
                }
        }
}

var boxbg:Boxbg = new Boxbg;

var format:TextFormat;
var fillCT:ColorTransform;
var strokeCT:ColorTransform;
var sheet:StyleSheet;
function descriptionBox () {
        for (var item:String in defaultParams) { params[item] = defaultParams[item]; }
       
        addChild(boxbg);
        addChild(boxText);
       
        setAlignmentPoint(stage.stageWidth, stage.stageHeight);
       
        setOffsetX(params["offsetx"]);
        setOffsetY(params["offsety"]);
       
        setLocation();
       
        if (params["style"] !="") {
                sheet = new StyleSheet();
        sheet.parseCSS( String(params["style"]) );
        boxText.styleSheet = sheet;
        }

        if (params["textalign"] == "left" ) { boxText.autoSize = TextFieldAutoSize.LEFT; }
        if (params["textalign"] == "center" ) { boxText.autoSize = TextFieldAutoSize.CENTER; }
        if (params["textalign"] == "right" ) { boxText.autoSize = TextFieldAutoSize.RIGHT; }
       
        var text:String = params["text"];
        if (text.indexOf("\\n")!=-1) {
                text = text.replace(/\\n/g, "\n")
        }
        if (text.indexOf("[")!=-1) {
                text = text.replace(/\[/g, "<")
        }
        if (text.indexOf("]")!=-1) {
                text = text.replace(/\]/g, ">")
        }
//      if (text.indexOf("'")!=-1) {
                text = text.replace(/&apos;/g, "'")
//      }
        boxText.htmlText = text;
       
        format = new TextFormat();
        format.font = String(params["font"]);
        format.size = Number(params["fontsize"]);  
        format.color = uint(params["fontcolor"]);  
        //boxText.setTextFormat(format);
       
        setWidth(params["width"]);
        setHeight(params["height"]);
       
        setBoxSize();
       
        boxbg.alpha = Number(params["bgalpha"]);
                       
        var fillCT:ColorTransform = new ColorTransform();
        fillCT = boxbg.transform.colorTransform;
        fillCT.color = uint(params["bgcolor"]);
        boxbg.transform.colorTransform = fillCT;
       
        hotspots.stage.addEventListener(Event.RESIZE, doResize);
//      addChild(boxbg);
//      addChild(boxText);
}

var relativetoX:Number;
var relativetoY:Number;
function setAlignmentPoint (stageWidth:Number, stageHeight:Number ) {
        var alignmentPoint:String = params["align"];
                        if ( alignmentPoint.toLowerCase() == "c" ) { relativetoX = int(stageWidth/2); relativetoY = int(stageHeight/2); }
                        else if ( alignmentPoint.toLowerCase() == "tl" ) { relativetoX = 0; relativetoY = 0; }
                        else if ( alignmentPoint.toLowerCase() == "tc" ) { relativetoX = int(stageWidth/2); relativetoY = 0; }
                        else if ( alignmentPoint.toLowerCase() == "tr" ) { relativetoX = int(stageWidth); relativetoY = 0; }
                        else if ( alignmentPoint.toLowerCase() == "lc" ) { relativetoX = 0; relativetoY = int(stageHeight/2); }
                        else if ( alignmentPoint.toLowerCase() == "rc" ) { relativetoX = int(stageWidth); relativetoY = int(stageHeight/2); }
                        else if ( alignmentPoint.toLowerCase() == "bl" ) { relativetoX = 0; relativetoY = int(stageHeight); }
                        else if ( alignmentPoint.toLowerCase() == "bc" ) { relativetoX = int(stageWidth/2); relativetoY = int(stageHeight); }
                        else if ( alignmentPoint.toLowerCase() == "br" ) { relativetoX = int(stageWidth); relativetoY = int(stageHeight); }
                }
var offsetX:Number;
var offsetY:Number;
function setOffsetX ( offsetXUnprocessed:String ) {
                        if (offsetXUnprocessed.search("%") > 0 ) { // % based slider length
                                var lengthArr:Array = new Array;
                                lengthArr = offsetXUnprocessed.split("%");
                                offsetX = (Number(lengthArr[0])/100) * stage.stageWidth;
                        }
                        else { // px based slider length
                                offsetX = Number(offsetXUnprocessed);
                        }
                }
function setOffsetY ( offsetYUnprocessed:String ) {
                        if (offsetYUnprocessed.search("%") > 0 ) { // % based slider length
                                var lengthArr:Array = new Array;
                                lengthArr = offsetYUnprocessed.split("%");
                                offsetY = (Number(lengthArr[0])/100) * stage.stageHeight;
                        }
                        else { // px based slider length
                                offsetY = Number(offsetYUnprocessed);
                        }
                }
function setLocation ():void {
        boxbg.x = relativetoX + offsetX;
        boxbg.y = relativetoY + offsetY;
        boxText.x = boxbg.x + Number(params["lpadding"]);
        boxText.y = boxbg.y + Number(params["tpadding"]);
}
var totalWidth:Number;
var totalHeight:Number;
function setWidth ( unprocessed:String ) {
                        if (unprocessed.search("%") > 0 ) { // % based slider length
                                var lengthArr:Array = new Array;
                                lengthArr = unprocessed.split("%");
                                totalWidth = ((Number(lengthArr[0])/100) * stage.stageWidth)+Number(params["widthadjustment"]);
                        }
                        else { // px based slider length
                                totalWidth = Number(unprocessed);
                        }
                }
function setHeight ( unprocessed:String ) {
                        if (unprocessed.search("%") > 0 ) { // % based slider length
                                var lengthArr:Array = new Array;
                                lengthArr = unprocessed.split("%");
                                totalHeight = (Number(lengthArr[0])/100) * stage.stageWidth;
                        }
                        else { // px based slider length
                                totalHeight = Number(unprocessed);
                        }
                }
function setBoxSize():void {
        boxText.width = totalWidth - Number(params["lpadding"]) - Number(params["rpadding"]);
        boxbg.width = totalWidth;
        boxbg.height = boxText.height + Number(params["tpadding"]) + Number(params["bpadding"]);
        if (boxbg.height < Number(params["minheight"]) ){ boxbg.height = Number(params["minheight"]);}
       
        //boxText.height = totalHeight - params["tpadding"] - params["bpadding"];
}

function doResize (e:Event=null) {
        setAlignmentPoint(stage.stageWidth, stage.stageHeight);
                       
        setOffsetX(params["offsetx"]);
        setOffsetY(params["offsety"]);
       
        setWidth(params["width"]);
        setHeight(params["height"]);
       
        setBoxSize();
       
        setLocation();
}

__________________

Zephyr Renner

Thanks!

Hey Zephyr, that's a very detailed reply, brilliant!

Many thanks for sharing your knowledge, it is most appreciated.

This will keep me quiet for a while.

Cheers!
Fremsley

Hi! Thx for the detailed

Hi!

Thx for the detailed reply but what is Boxbg in your source? It seems to be a missing custom class...
Could you please also post it here?

Text box hotspot

I also needed a hotspot just consisting of a text box where I could put some text, so I pieced together this little hotspot plugin. I wouldn't say it's perfected yet (there is some matter with the "justify" parameter), but it is definitely in working order, so you are welcome to try it.

You can download it here. The zip contains the .fla, .swf and a small text file listing the supported parameters, so if you have Flash (CS3) you can modify or add as much as you like.

Regards,
Tommy

Great download, helped me a

Great download, helped me a lot... thanks!