Click event on HTML Element of htmlText Property of TextArea - actionscript-3

I have multiple anchor tags created inside the htmlText property of a TextArea object. I want to get the event dispatched whenever user clicks on any one of the anchor tag.
Example code:
myTextArea.htmlText = "somelabel1<br/>somelabel2";

.htmlText is not property of MovieClip but TextField
var t:TextField = new TextField();
t.htmlText = "somelabel1";
this.addChild(t);
t.addEventListener(TextEvent.LINK, onLinkClicked);
function onLinkClicked(e:TextEvent):void {
trace("Event text:", e.text);
}
You can read more about at given pages.

Related

AS3: change Font in Radio button

How can I change font used in Radio Button that existing in default components of flash professional?
To change the font of your RadioButton component label, you can use the RadioButton.setStyle() function to set the TextFormat which will be applied to the label (a TextField object) of the RadioButton component.
For that, you can do like this for example :
var text_format:TextFormat = new TextFormat();
text_format.font = 'Verdana';
text_format.color = 0xff0000;
RadioButton(radio_button).setStyle('textFormat', text_format);
you can also apply that directly to the label using the RadioButton.textField property which return the TextField object :
RadioButton(radio_button).textField.setTextFormat(text_format);
Hope that can help.

Ckeditor - Add multiple child elements to list element

In CKeditor is it possible to add multiple child elements to a list element?
E.g.
- Heading
Paragraph
- Heading2
Paragraph2
Backstory-
I've created a style that lets the user style up an order list. Part of this style is to have a heading and a paragrpah within each list item element.
Problem-
When the adding the heading element and pressing enter, to be able to add the paragraph, a new list item is added instead. If the shift+enter/shift+enter button combination is pressed, a new list is created without creating a new list item, however the cursor remains within the heading element, and so no paragraph can be added this way.
Is there a way around this?
I've found a way to fix the problem by overriding the key press event in CKEditor. When a key is pressed, it checks that:
It was the Enter key that was pressed;
The cursor is within a list;
The node the cursor is in isn't empty;
The cursor is at the end of the node.
If so it
Adds a paragraph after the current node.
Moves the cursor into it.
The code:
CKEDITOR.on(
'instanceReady',
function(ev) {
var editorInstance = CKEDITOR.instances[ev.editor.name];
var editorWindow = editorInstance.window.$;
var editorDocument = $editor_instance.document.$;
var editorBody = editorDocument.body;
/***
* Fix the editor not letting you add sub elements to lists
*/
editorInstance.on( 'key', function( event ) {
// Get the HTML event
var e = event.data;
// If the enter key was pressed
if(e.keyCode == 13) {
// Find which element the cursor is in
var selection = editorWindow.getSelection();
var cursorElem = $(selection.anchorNode);
// Only override the default behaviour if we're in a list element, and the user has typed something
if(cursorElem.closest('li').length && cursorElem.text().trim().length) {
// get the current cursor position
var range = editorWindow.getSelection().getRangeAt(0)
// create range to find how many characters are after the cursor
var postRange = editorDocument.createRange();
postRange.selectNodeContents(cursorElem[0]);
postRange.setStart(range.endContainer, range.endOffset);
var nextText = postRange.cloneContents();
var isAtEnd = nextText.textContent.length === 0;
// Only override if we're at the end of the list element
if(isAtEnd) {
// cancel the default event
event.cancel();
// get the element to add the new paragraph after
var after = cursorElem;
// if the cursor is in a TEXT not instead of an actual HTML node then get the parent HTML code
if(cursorElem[0].nodeType == Node.TEXT_NODE) {
after = cursorElem.parent();
}
// Add the new paragraph
after.after('<p></p>');
var newParagraph = after.next();
// set selection to the new paragraph
var range = editorDocument.createRange();
range.setStart(newParagraph[0], 0);
selection.removeAllRanges();
selection.addRange(range);
}
}
}
});
}
);
CSS needed to make the new paragraph display:
p {
min-height: 1em;
}
P.s. Thanks for this answer showing how to check if the cursor was at the end of an element Contenteditable DIV - how can I determine if the cursor is at the start or end of the content

Actionscript make image in TextField.htmlText clickable?

Actionscript's TextField.htmlText property allows for img tag. I''m wondering if it's somehow possible to make image clickable. More specifically, I would like to open a new window where I can display more information.
you can surround it in a <a> tag. like so:
var tt:String = '<img src="image.jpg">';
var tf:TextField = new TextField;
tf.htmlText = tt;
tf.addEventListener("link",clickHandler);
addChild(tf);
then in callback:
public function clickHandler(e:TextEvent):void{
trace(e.text); // someThing
}
of course once you have it in callback you can do whatever you want. open dialog, open webpage etc...

As3 text field issue

I'm trying to make a button(movieClip-button), that when you hover over it(MOUSE_OVER), it calls a function that displays some text. The only problem is that it doesn't work :p. Or atleast not the way i want it to work. The thing is when i hover over it the first time, nothing displays. If i then remove the mouse from the movieclip and hover over it again it works just fine. Here's my code:
private var priceString:TextField = new TextField();
private function addText(price:String):void{
var priceStringFormat = new TextFormat;
priceStringFormat.color = 0xFF0000;
priceStringFormat.font = 'TradeGothic';
priceStringFormat.size = 30;
priceString.x = 285;
priceString.y = 15;
priceString.setTextFormat(priceStringFormat);
priceString.autoSize = TextFieldAutoSize.LEFT;
priceString.text = "Upgrade Costs: " + price;
getStage.addChild(priceString);
}
I can't myself see the problem:s. Other text fields in the same format in the same class works just fine. The getStage var is holding the stage access. (It works with other text fields). Strange is also that if i try to add a movieclip instead of the textfield, it works just fine.
This is how it should look:
http://i.stack.imgur.com/5a0jf.png
setTextFormat needs to happen after you set the text property. If for whatever reason you need to do the formatting before you set the textFormat, use
priceString.defaultTextFormat = priceStringFormat
If you're saying you want to create a tooltip when you hover over a button, you should probably put the TextField into a Sprite object. Add the TextField as a child of the Sprite, and the Sprite as a child of the stage. Then, either tween the alpha value of the Sprite or toggle its visibility using Sprite.visible.
PS: for a detailed tutorial, see:
http://hub.tutsplus.com/tutorials/create-a-customizable-tooltip-in-actionscript-30--active-1793
EDIT:
Based on the image you provided, what you would need is to create a sprite with the TextField as its child in the constructor of your button, and set the sprite's visible property to false.
In your mouseover handler for the button, set the sprite's visible property to true, and in reset it in your mouseout handler.

How can I detect StaticText in AS3?

I have StaticText fields in my flash project and I need to run some code when the mouse is hovering over them. So I tried this code
stage.addEventListener(MouseEvent.MOUSE_OVER, mouseRollOver);
function mouseRollOver(event:MouseEvent):void {
var tf:StaticText = event.target as StaticText;
if (tf){
//my code
}
}
but it doesn't work. When I use dynamic text fields and replace StaticText with TextField in the var tf, it works fine. I also thought that I could get this thing working with static text fields if I could make the mouse detect not StaticText as a target but some kind of object that has certain text properties (like "selectable" set to true), but I couldn't figure out how to do this. Anyway, I need to detect a static text field as a target somehow. Any help would be appreciated.
Thanks in advance
Your best option would be to put the static text box in a movieclip, and then assign your code based around that. Static text boxes don't have instance names, and can't be manipulated.
It is hard to do this. See this link enter link description here
As you can see you can check if the DisplayObject is StaticText and by checking the mousX and MouseY properties you can find if the rollover is related to this field. By if you use Dynamic text and uncheck selectable field you will get a textfield that acts as StaticField
EDIT
this is an explanation what I mean:
Let we have a StaticText field into stage in Black flash document.
var myFieldLabel:StaticText
var i:uint;
//This for check for all staticFields in state and trace its text. It is possible and it is working. I my case I have only one field and I get reference to it in myFieldLabel:StaticText var. Also I change it's alpha to 0.3.
for (i = 0; i < this.numChildren; i++)
{
var displayitem:DisplayObject = this.getChildAt(i);
if (displayitem instanceof StaticText) {
trace("a static text field is item " + i + " on the display list");
myFieldLabel = StaticText(displayitem);
trace("and contains the text: " + myFieldLabel.text);
trace( myFieldLabel.mouseX);
myFieldLabel.alpha = 0.3;
}
}
//Adds event listener to the stage for mouse move event
stage.addEventListener(MouseEvent.MOUSE_MOVE, mouseRollOver);
//This is an event handler. I check if the mouse position is within the static field
function mouseRollOver(evnt:MouseEvent):void
{
if ( 0 <= myFieldLabel.mouseX && myFieldLabel.mouseX <= myFieldLabel.width && 0 <= myFieldLabel.mouseY && myFieldLabel.mouseY <= myFieldLabel.height )
{
mouseOverStaticText( evnt)
}
else
{
mouseNotOverStaticText( evnt)
}
}
// this two methods change the static field alpha. Thay are only to show that is posible to detect and manipulate some properties of the StaticField.
function mouseOverStaticText( evnt)
{
myFieldLabel.alpha = 1;
}
function mouseNotOverStaticText( evnt)
{
myFieldLabel.alpha = 0.3;
}
I'm not sure what is the purpose of the managing of the StaticText field. StaticText is not design to be managed if you have to do something this is almost sure that the field must not be a static - they can be dynamic ( without selectible property ) or can be capsulated with MovieClip or there can be a different solution in your case.