Get a href from xml file into a flash button - actionscript-3

I have a flash file where I'm trying to change the value of the same button depending on the image that is clicked but I can't make it work with different values (I can only make it work with a static value).
AS:
var weblinkXML:XML = new XML();
weblinkXML.ignoreWhite = true;
weblinkXML.load("xml/main.xml");
weblinkXML.onLoad = function(success) {
trace("success = "+success);
for (var i:Number = 0; i< weblinkXML.childNodes.length; i++) {
PPTBUTTON.addEventListener(MouseEvent.CLICK, fl_ClickToGoToWebPage_1);
function fl_ClickToGoToWebPage_1(event:MouseEvent):void
{
navigateToURL(new URLRequest("test/test.html"), "_blank");
}
}
}
my XML:
<?xml version="1.0" encoding="iso-8859-1"?>
<content>
<!-- general vars -->
<settings>
<item name="copyright"><![CDATA[<font letterspacing="0.5">© 2012 | PRIVACY POLICY</font>]]></item>
<item name="companyName"><![CDATA[<font letterspacing="-2"><b>TANITA</b></font>]]></item>
<item name="companySlogan"><![CDATA[<font letterspacing="1">PHOTO PORTFOLIO</font>]]></item>
<!--mp3Url srcUrl="music.mp3"/-->
<imagesPage>
<image imageUrl="images/tfile_splash_pic_main.jpg" />
</imagesPage>
</settings>
<!-- menu -->
<menu>
<button><![CDATA[PORTFOLIO]]></button>
<button><![CDATA[ABOUT]]></button>
<button><![CDATA[NEWS]]></button>
<button><![CDATA[CONTACTS]]></button>
</menu>
<gallery gallName="Crystal Cabin Awards 2012">
<image imageUrl="gallery/tfile_gall_small_01.jpg" imagesBig="gallery/tfile_gall_big_01.jpg" buttonName="PPTBUTTON" targ="_self" href="http://www.google.com"/>
<image imageUrl="gallery/tfile_gall_small_02.jpg" imagesBig="gallery/tfile_gall_big_02.jpg" buttonName="PPTBUTTON" targ="_self" href="http://www.youtube.com"/>
<image imageUrl="gallery/tfile_gall_small_03.jpg" imagesBig="gallery/tfile_gall_big_03.jpg" buttonName="PPTBUTTON" targ="_self" href="http://www.yahoo.com"/>
<image imageUrl="gallery/tfile_gall_small_04.jpg" imagesBig="gallery/tfile_gall_big_04.jpg"/>
<image imageUrl="gallery/tfile_gall_small_05.jpg" imagesBig="gallery/tfile_gall_big_05.jpg"/>
<image imageUrl="gallery/tfile_gall_small_06.jpg" imagesBig="gallery/tfile_gall_big_06.jpg"/>
<image imageUrl="gallery/tfile_gall_small_07.jpg" imagesBig="gallery/tfile_gall_big_07.jpg"/>
<image imageUrl="gallery/tfile_gall_small_08.jpg" imagesBig="gallery/tfile_gall_big_08.jpg"/>
</gallery>
I realize my xml is complex but it's being used through the entire flash. Maybe I could reduce it to a stand alone xml just like:
<image imageUrl="gallery/tfile_gall_small_02.jpg" imagesBig="gallery/tfile_gall_big_02.jpg" buttonName="PPTBUTTON" targ="_self" href="http://www.youtube.com"/>
my issue is that I've tried to get the href into a variable and use it instead of "test/test.html" but it never works.
I also realize I have a method inside a for but at this point I've iterated so much over this code that I'm unsure how to proceed.

Here's how i would retrieve the list of href attributes:
var loader:URLLoader = new URLLoader();
var request:URLRequest = new URLRequest("xml/main.xml");
loader.addEventListener(IOErrorEvent.IO_ERROR, function errorHandler(event:IOErrorEvent):void {
trace("Error loading XML" + event.type);
});
loader.addEventListener(Event.COMPLETE, function(event:Event):void {
trace("success = " + event);
var xml:XML = new XML(loader.data);
var xmllist:XMLList = xml.gallery.children();
for (var i:Number = 0; i < xmllist.length(); i++) {
trace(XML(xmllist[i]).attribute("href"));
}
});
loader.load(request);
I had the following output:
success = [Event type="complete" bubbles=false cancelable=false eventPhase=2]
http://www.google.com
http://www.youtube.com
http://www.yahoo.com
I hope that helps.

Related

Why do I get label displacement when I export a pie or line chart?

I have been trying to figure out why this happens for quite a while. My page have three kinds of charts: bar, line and pie models. The pie and line gets labels displacement when I export it and the bar its just fine.
I think it has something to do with jqplot css. But still, it is quite frustrating.
My pie chart is in a dialog...
xhtml code:
<p:dialog id="expanded-mission-distribution-dialog" resizable="false"
widgetVar="expanded-mission-distribution-dialog-var" modal="true"
dynamic="true">
<p:panel id="expanded-mission-distribution-panel"
styleClass="expanded-chart-panel ">
<p:chart id="expanded-mission-distribution-chart" type="pie"
styleClass="jqplot-target legend-spacing legend-size chart-dimension-3"
widgetVar="expanded-mission-distribution-chart-var"
model="#{fatigueDataSummaryAircraftAnalysisH.expandedMissionDistributionChart}" />
<p:commandButton id="mission-distribution-export-button"
type="button" icon="ui-circle-export" styleClass="ui-command-button"
title="Click to save the chart as image"
onclick="exportChart('expanded-mission-distribution-chart-var')" />
</p:panel>
</p:dialog>
The javascript that exports charts (I had to use a different approach compared to the one used in Primefaces' showcase, due compatibility purposes):
function b64toBlob(b64Data, contentType, sliceSize) {
contentType = contentType || '';
sliceSize = sliceSize || 512;
var byteCharacters = atob(b64Data);
var byteArrays = [];
for (var offset = 0; offset < byteCharacters.length; offset += sliceSize) {
var slice = byteCharacters.slice(offset, offset + sliceSize);
var byteNumbers = new Array(slice.length);
for (var i = 0; i < slice.length; i++) {
byteNumbers[i] = slice.charCodeAt(i);
}
var byteArray = new Uint8Array(byteNumbers);
byteArrays.push(byteArray);
}
var blob = new Blob(byteArrays, {type: contentType});
return blob;
}
function exportChart(chart) {
// Exportando o gráfico como uma imagem.
var image = PF(chart).exportAsImage();
var fileName = "image.png";
var src = image.getAttribute('src');
var type = 'image/png';
var b64Data = src.split(',')[1];
var blob = b64toBlob(b64Data, type);
var link = document.createElement("a");
if (link.download !== undefined) { // feature detection
// Browsers that support HTML5 download attribute
link.setAttribute("href", window.URL.createObjectURL(blob));
link.setAttribute("download", fileName);
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
} else {
alert('Chart export only works in Chrome (v20+), Firefox (Gecko v13+), IE (v10+), Safari (v6+) and Opera (v12.10+).');
}
Image of chart in dialog:
Pie chart inside my dialog
Image of exported chart:
Exported pie chart
There is nothing similar over internet or whatsoever, what could be the reason of this issue?

AJAX-based auto-completion script for filling in an HTML <form>

So, I have this HTML-form that I want to fill in with the names of the US states. I have all of 50 of them (Alabama to Wyoming) stored in the following format:
<?xml version="1.0"?>
<states xml:lang="EN">
<item>
<label>Alabama</label>
<value>AL</value>
</item>
<item>
<label>Alaska</label>
<value>AK</value>
</item>
...
When the user starts typing "Ne", the script would list in a pop-box the suggestions Nebraska, Nevada, New Hampshire, New Jersey, etc. As the user continues typing: "New", the list of suggestions would narrow down to New Hampshire, New Jersey, New Mexico, New York, until there is only one state left. What AJAX should I use to get this thing working?
function ajaxFunction(str) {
if (str.length==0) {
document.getElementById("search").innerHTML="";
document.getElementById("search").style.border="0px";
return;
}
var input=document.getElementById('text1').value;
var ajaxRequest = new XMLHttpRequest();
ajaxRequest.onreadystatechange = function() {
if (ajaxRequest.readyState==4 && ajaxRequest.status==200) {
var res=ajaxRequest.responseXML;
var states=res.getElementsByTagName("states");
var elem=states[0];
var items=res.getElementsByTagName("item");
document.getElementById("search").innerHTML="";
for(var i=0;i<items.length;i++){
var item=items[i].getElementsByTagName("label");
var state=item[0].innerHTML;
var len=str.length;
var match=state.substr(0,len);
if(match.toUpperCase()==input.toUpperCase()){
var val=items[i].getElementsByTagName("value");
var value=val[0].innerHTML;
var e = document.createElement('span');
e.innerHTML = state+"("+value+") ";
document.getElementById("search").appendChild(e.firstChild);
}
}
document.getElementById("search").style.border="1px solid #A5ACB2";
}
}
ajaxRequest.open("GET","USA_States.xml",true);
ajaxRequest.send();
}

ArcGIS API for Flex : dynamic InfoSymbols

I am trying to add some InfoSymbols in my map, here is what I did :
<esri:InfoSymbol id="infoSymbol1">
<esri:infoRenderer>
<fx:Component>
<s:DataRenderer>
<s:layout>
<s:VerticalLayout/>
</s:layout>
<s:Image id="eventImg" source="{imgSource}"/>
<s:Label id="eventName" text="{eventTitle}"/>
</s:DataRenderer>
</fx:Component>
</esri:infoRenderer>
</esri:InfoSymbol>
And I am filling a list from the data passed to the view, ( the application is a mobile view based app)
public function fillDataGrid():void {
for each(var object:Object in data) {
initDG.addItem(object);
drawEvent(object);
}
}
Finally I add the InfoSymbols the drawEvent(objt) method :
private function drawEvent(object:Object):void{
var myGraphicText:Graphic = new Graphic(new WebMercatorMapPoint(
object.local.longitude, object.local.latitude));
var event:InfoSymbol = new InfoSymbol();
imgSource = "http://192.168.0.22:3000" + object.logo_thumb_url;
eventTitle = object.name;
event = infoSymbol1;
myGraphicText.symbol = event;
myGraphicsLayer.add(myGraphicText);
}
of course imgSource and eventTitle are Bindable,
The issue is that I am getting
Description Resource Path Location Type
1120: Access of undefined property eventTitle.
And the same message for imgSource,
Any help would be much appreciated !!
You need to declare eventTitle before you assign a value to it.
var eventTitle:String = object.name;

How to detect two simultaneous touches?

Detecting touch in Windows Phone 8 leverages the System.Windows.Input.Touch.FrameReported event which is the most raw and certainly the most responsive touch event available to developers.
You would use the event like this:
public MainPage()
{
InitializeComponent();
// setup sounds
Ellipse1.Tag = new Uri("Sounds/GVD_snr1.wav", UriKind.Relative);
Ellipse2.Tag = new Uri("Sounds/GVD_snr2.wav", UriKind.Relative);
Ellipse3.Tag = new Uri("Sounds/GVD_snr3.wav", UriKind.Relative);
Ellipse4.Tag = new Uri("Sounds/GVD_snr4.wav", UriKind.Relative);
Ellipse5.Tag = new Uri("Sounds/GVD_snr5.wav", UriKind.Relative);
Ellipse6.Tag = new Uri("Sounds/GVD_snr6.wav", UriKind.Relative);
Ellipse7.Tag = new Uri("Sounds/Gong.wav", UriKind.Relative);
// respond to touch(es)
var _Ellipses = new[] { Ellipse1, Ellipse2, Ellipse3, Ellipse4, Ellipse5, Ellipse6, Ellipse7 };
System.Windows.Input.Touch.FrameReported += (s, e) =>
{
var _Touches =
from touch in e.GetTouchPoints(null)
where touch.Action == System.Windows.Input.TouchAction.Down
let ellipse = touch.TouchDevice.DirectlyOver as Ellipse
where _Ellipses.Contains(ellipse)
select ellipse;
System.Diagnostics.Debug.WriteLine("{0} touch(es).", _Touches.Count());
foreach (var ellipse in _Touches)
{
var _Stream = Application.GetResourceStream(ellipse.Tag as Uri).Stream;
var _SoundEffect = Microsoft.Xna.Framework.Audio.SoundEffect.FromStream(_Stream);
Microsoft.Xna.Framework.FrameworkDispatcher.Update();
_SoundEffect.Play();
}
};
}
(tested with a Lumia 920)
This works like a charm - as long as there is only a single touch at a time. When the user attempts to touch two or more points simultaneously (and I mean exactly the same time) the event is not raised at all. When the user attempts to touch two or more points almost simultaneously (just a split second apart) then the event is raised and both points are reported.
How can I detect two simultaneous touches?
In case you want to see the XAML, here's the XAML:
<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
<Grid.Resources>
<Style TargetType="Ellipse">
<Setter Property="HorizontalAlignment" Value="Left" />
<Setter Property="VerticalAlignment" Value="Top" />
</Style>
</Grid.Resources>
<Ellipse x:Name="Ellipse1" Fill="Blue" Height="177" Margin="17,17,0,0" Width="177"/>
<Ellipse x:Name="Ellipse2" Fill="#FFFFA300" Height="223" Margin="212,25,0,0" Width="223"/>
<Ellipse x:Name="Ellipse3" Fill="#FFFF00E8" Height="97" Margin="89,207,0,0" Width="97"/>
<Ellipse x:Name="Ellipse4" Fill="#FF00C135" Height="162" Margin="186,249,0,0" Width="162"/>
<Ellipse x:Name="Ellipse5" Fill="#FF00AEFF" Height="272" Margin="59,416,0,-81" Width="272"/>
<Ellipse x:Name="Ellipse6" Fill="Red" Height="97" Margin="320,395,0,0" Width="97"/>
<Ellipse x:Name="Ellipse7" Fill="#FFF3FF00" Height="133" Margin="10,304,0,0" Width="133"/>
</Grid>
Adding this resolved the problem:
var _Timer = new DispatcherTimer { Interval = TimeSpan.FromMilliseconds(50) };
_Timer.Tick += (s, e) =>
{
try { Microsoft.Xna.Framework.FrameworkDispatcher.Update(); }
catch { }
};
_Timer.Start();

How to get info from background_page to popup?

I'm following the official Chrome Extension tutorial called Chritter where they fetch tweets from Twitter and place them into the extension. I'm trying to do similar except im trying to fetch items from an xml file.
My XML
<xml>
<item>
<title>Title 1</title>
<description>Description 1</description>
<duration>55:00</duration>
<published>28/01/2011</published>
</item>
<item>
<title>Title 2</title>
<description>Description 2</description>
<duration>55:00</duration>
<published>28/01/2011</published>
</item>
</xml>
background.html
<!--
To change this template, choose Tools | Templates
and open the template in the editor.
-->
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript">
var fetchFreq = 30000; // how often we fetch new items (30s)
var req; // request object
var unreadCount = 0; // how many unread items we have
var items; // all currently fetched items
getItems();
//setInterval(getItems, fetchFreq);
function getItems(){
req = new XMLHttpRequest();
req.open("GET", "http://urltoxml.com/xmlfile.xml", false);
req.onload = processItems;
req.send();
}
function processItems(){
xmlDoc = req.responseXML;
items = xmlDoc.getElementsByTagName("item");
unreadCount += items.length;
if (unreadCount > 0) {
chrome.browserAction.setBadgeBackgroundColor({
color: [255, 0, 0, 255]
});
chrome.browserAction.setBadgeText({text: '' + unreadCount});
}
items = xmlDoc.concat(items);
}
</script>
</head>
</html>
I don't know how to get the fetched items from the background.html and displayed onto the popup.html ?
popup.html
<html>
<head>
<link rel="stylesheet" href="popup.css" />
<script src="util.js"></script>
<script>
var bg; // background page
// timeline attributes
var timeline;
var template;
var title;
var link;
var description;
onload = setTimeout(init, 0); // workaround for http://crbug.com/24467
// initialize timeline template
function init() {
chrome.browserAction.setBadgeText({text: ''});
bg = chrome.extension.getBackgroundPage();
bg.unreadCount = 0;
timeline = document.getElementById('timeline');
template = xpath('//ol[#id="template"]/li', document);
title = xpath('//div[#class="text"]/span', title);
content = xpath('//div[#class="text"]/span', template);
update();
}
function update(){
// how to do this ?
// See Chritter example below with JSON,
// except i want to it with xml ?
}
</script>
</head>
<body>
<div id="body">
<ol id="timeline" />
</div>
<ol id="template">
<li>
<div class="text">
<a></a>
<span></span>
</div>
<div class="clear"></div>
</li>
</ol>
</body>
</html>
The way the Chritter extension does it only seems to work with JSON. Here is how they do it:
// update display
function update() {
var user;
var url;
var item;
for (var i in bg.tweets) {
user = bg.tweets[i].user;
url = 'http://twitter.com/' + user.screen_name;
// thumbnail
link.title = user.name;
link.href = openInNewTab(url);
image.src = user.profile_image_url;
image.alt = user.name;
// text
author.href = openInNewTab(url);
author.innerHTML = user.name;
content.innerHTML = linkify(bg.tweets[i].text);
// copy node and update
item = template.cloneNode(true);
timeline.appendChild(item);
}
}
Chritter background.html
<html>
<head>
<script type="text/javascript">
var fetchFreq = 30000; // how often we fetch new tweets (30s)
var req; // request object
var unreadCount = 0; // how many unread tweets we have
var tweets; // all currently fetched tweets
getTweets();
setInterval(getTweets, fetchFreq);
// fetch timeline from server
function getTweets() {
req = new XMLHttpRequest();
req.open('GET', 'http://twitter.com/statuses/public_timeline.json');
req.onload = processTweets;
req.send();
}
// process new batch of tweets
function processTweets() {
var res = JSON.parse(req.responseText);
unreadCount += res.length;
if (unreadCount > 0) {
chrome.browserAction.setBadgeBackgroundColor({
color: [255, 0, 0, 255]
});
chrome.browserAction.setBadgeText({text: '' + unreadCount});
}
tweets = res.concat(tweets);
}
</script>
</head>
</html>
Any help much appreciated! Thanks!
If you want to access items var from a background page then:
var items = chrome.extension.getBackgroundPage().items;
I am not sure what the exact question is, but the general practice is to store the data from background page into localstorage and then access this data from the popup page.
http://www.rajdeepd.com/articles/chrome/localstrg/LocalStorageSample.htm