One textField with mutiple text styles

1

I’m attempting to dynamically create a textField, and then assign one of three different styles to the text within it. In a sense I’m recreating what HTML does, by searching a text string for a few characters of text, then saves the location to an array. By stepping through the array I then use :


display.setTextFormat(resultsArM[counta],resultsArM[countb],titlev1);

to set the styles, inside a while loop.

Now the problem I’m having is removing the saught after string form the original text, and keeping the correct posistion values in the array.

Lets say I use:

content = “(m)Alex Cook(m) - (s)Designer(s)§I design y0§§(m)Thy Than(m) - Creative Director§She designs, y0”;

as the text… I want to search for (m) and assign titlev1 to the space between it, and continue to do the same for each ‘tag’ inside the text string, assigning a different style to the space between the tags.

Make sense?

The problem I’m having is that the array values are off by 6 the further into the string it searches… heres the current code which is a little cluddgy but I’m trying to nail the functionality down before I streamline it… help help help?



//SET UP SOME ARRAYS
charAr = new Array();
resultsArP = new Array();

//This searches for the (p) and replaces it with \r
charAr = content.split("(p)")

count = 0;
while (count<charAr.length) {
        if (resultsArp.length <= 0) {
                resultsArp.push(charAr[count].length)
        } else {
                numMod = resultsArp[count-1];
                numMod = numMod + charAr[count].length;
                resultsArp.push(numMod)
        }
        content = content.split("(p)").join("\r");
        count++;
}

//Sets up a new charAr array, and creates resultsArM, which will hold the posistions of the (m) sequence in the string
charAr = new Array();
resultsArM = new Array();

charAr = content.split("(m)")

count = 0;
while (count<charAr.length) {
        trace(resultsArM.length)
        if (resultsArM.length <= 0) {
                resultsArM.push(charAr[count].length)
        } else {
                numMod = resultsArM[count-1];
                numMod = numMod + charAr[count].length;
                resultsArM.push(numMod)
        }
        content = content.split("(m)").join("");
        count++;
}

//trace(charAr);
trace(resultsArM);

//Sets up a new charAr array, and creates resultsArS, which will hold the posistions of the (s) sequence in the string

charAr = new Array();
resultsArS = new Array();

charAr = content.split("(s)")

count = 0;
while (count<charAr.length) {
        trace(resultsArS.length)
        if (resultsArS.length <= 0) {
                resultsArS.push(charAr[count].length)
        } else {
                numMod = resultsArS[count-1];
                numMod = numMod + charAr[count].length;
                resultsArS.push(numMod)
        }
        content = content.split("(s)").join("");
        count++;
}

//Set the text of the dynamic textField
display.text = content;
display.setTextFormat(textv1);

//Start moving through the arrays to assign styles to sections of the text
count = 0;
counta = 0;
countb = 1;
numMod = resultsArM.length;
numMod = numMod-1;
trace(numMod);
while (count<numMod) {
        display.setTextFormat(resultsArM[counta],resultsArM[countb],titlev1);
        counta = counta + 2;
        countb = countb + 2;
        count++;
}

count = 0;
counta = 0;
countb = 1;
numMod = resultsArS.length;
numMod = numMod-1;
trace(numMod);
while (count<numMod) {
        display.setTextFormat(resultsArS[counta],resultsArS[countb],titlev2);
        counta = counta + 2;
        countb = countb + 2;
        count++;
}

I dont know how to rectify this 6 characters off problem…

and to be honest, before I’m mocked for my code, I aint sure if .split is the way to go anyways, so suggestions will be much appreciated

2

well without getting too into it and from skimming the post, Im assuming the problem is that since you are replacing your homemade html tags with nothing ("") that it completely changes the position of where they were thought to be the first time you went through and found them?

So that just means basically that you’ll have to go through each one of those location sequentially and subtract from each one 3, then 6 then 9 etc. (probabaly byt throwing each location into some array by their positions and going through each subtracting another 3 when a value is reached).

With text formats though, you cant have nested ‘overlapping’ formats - atleast not without some fancy finagling - as would be needed with html for that matter. I say this because of your (m) set within your §:

§(m)Thy Than(m) - Creative Director§

Whichever one was done last would counter the previous. So there you would either selectively make § go first, or somehow recognise that (m) block as being within the § and include in that textFormat the § properties along with the (m) whatever they may be.

Anyway, back to what I was saying before about the subtraction… heres what I was thinking (mind you this is off the top of my head, so chances are there may be a better way. First let me think of a simple way to put this idea though heh…

ok, I actually went in flash and typed it all out and even commented :wink: you can just copy and past and test (after reading through of course)


// orig string
content = "(m)Alex Cook(m) - (s)Designer(s)(p)I design y0(p)(p)(m)Thy Than(m) - Creative Director(p)She designs, y0";
// string w/ no formatting (for testing)
content2 = "Alex Cook - DesignerI design y0Thy Than - Creative DirectorShe designs, y0";

// array to hold the positions of the formatting characters.  The position
// in the string determines the position in the array (almost like a duplicate
// of the string only in array form and without anything but the formatting segments)
positions = [];

// a function which takes a string (content) and seaches for all instances of the
// passed string (str - will be any of the formatting strings) and adds its position
// in that string to the corresponding position in the passed array (ary - positions)
String.prototype.addPositionsOf_To = function(str, ary){
	var pos = 0;	// initial 'position' 0, where we start searching
	do{				// do this following loop at least once
		// search this string for passed str starting from pos and assing its position
		// back to pos.  This keeps pos incrementing as it goes through the string
		pos = this.indexOf(str, pos);
		// indexOf returns -1 if the string is not found, so if the string IS found (ie
		// pos is NOT -1) add the position found into its position in the passed array
		if (pos != -1) ary[pos] = str;
		else break;	//otherwise break out of the loop since there are no more str's left
	}while(pos += str.length);
	// ^ this while adds the length of the string being searched for to pos each loop.  This
	// prevents the loop from finding the same position over and over again, starting the search
	// from the last pos plus its length.  This while actually does NOT control when the loop
	// stops, that handled entirely through the else break;  adding the pos+= here is
	// just a matter of convenience
}

// a function which generates an object containing arrays of 'actual' positions of the
// formatted text in relation to the actual text.  This works hand in hand with the array
// used in addPositionsOf_To but is to be used after all the positions have been searched
// for and added into the appropriate array.
GeneratePrecisePos = function(ary){
	var i, offset = 0, obj = {};		// looping i, offset, returned object
	// ^ offset is what is used to offset the found positions of the formatting text for 
	// each instance which they appeared in the string preventing from those formatted strings
	// to be counted in the actual position of the real content of the string
	for(i=0; i < ary.length; i++){		// for the length of the array
		if (ary* != undefined){		// if there exists a value (any one of our format strings)
			if (!obj[ary*]) obj[ary*] = [];			// makes an array to be associated
														// with this string in this object			
			obj[ary*][obj[ary*].length] = i - offset;	// add to this array the 'actual'
															// position of the strings occurence
															// usin offset to keep it accurate
			offset += ary*.length;	// update offset by this (format) strings length (3 here)
		}
	}
	return obj; // return the final object.
}

// Now you just need to put those functions to work:

// search for format strings within content and add their positions to the positions array
content.addPositionsOf_to("(m)", positions);
content.addPositionsOf_to("(s)", positions);
content.addPositionsOf_to("(p)", positions);
trace(positions); // display the positions array

positionsOf = GeneratePrecisePos(positions); // generate object containing their 'actual' positions
ms = positionsOf["(m)"]; // represents the positions of the (m) string.
// ^ each array in the object (as it was added in GeneratePrecisePos) is referenced using
// the object and the string which it pertains to. ie. for (s) it would be positionsOf["(s)"]
trace(ms); // display the array of positions of the m's

// To show how it worked, we can use the 3rd and 4th positions of the m's and see where it
// relates in the test no formatting string content2
trace(content2.substring(ms[2], ms[3])); // display the 2nd block of (m) encapsulation

this might help… though I dont know if you are going to fully get what you’re after :-\

:beam:

3

Ok, you rock, that did give me the arrays I needed… now my silly question is how to go about removeing the fake HTML text from the original string… unless I totally missed something in your code…

4

the easiest way to remove things from a string is through using

myString = myString.split("(m)").join("");

which breaks it to an array at the (m) points ( (m) not included) and joins it back to gether with nothing, therefore removing it from the string

which you did with content… so I thought you had that down :wink:

5

slaps forehead DUH!

Well, the .split.().join(); trick wasn’t working as I thought it would, but now that I just copied your code its fine… huh… scratches head

You rock, thansk again :slight_smile: