{"id":939,"date":"2010-04-01T16:46:56","date_gmt":"2010-04-01T15:46:56","guid":{"rendered":"http:\/\/alittleb.it\/?p=939"},"modified":"2010-04-01T16:46:56","modified_gmt":"2010-04-01T15:46:56","slug":"aprire-un-popup-facebook-utilizzando-actionscript","status":"publish","type":"post","link":"https:\/\/www.alittleb.it\/it\/actionscript-it\/aprire-un-popup-facebook-utilizzando-actionscript\/","title":{"rendered":"Aprire un popup Facebook utilizzando Actionscript"},"content":{"rendered":"<p style=\"text-align: center;\">L&#8217;articolo \u00e8 disponibile solo in inglese. Ci scusiamo per il disagio.<\/p>\n<hr \/>\n<p>The first step to open a facebook \u00a0dialog popup using ActionScript 3.0 is to create a bridge between our swf and fbjs\u2019 (<a href=\"http:\/\/wiki.developers.facebook.com\/index.php\/FBJS\" target=\"_blank\">facebook  javascript<\/a>)  page.<\/p>\n<p style=\"text-align: left;\">In order to open a popup, facebook introdouced a fbml tag that must be inserted in the application callback page. As <a href=\"http:\/\/wiki.developers.facebook.com\/index.php\/Fb:fbjs_bridge\" target=\"_blank\">described in the Wiki<\/a>, it\u2019s important to put the fbjs tag:<\/p>\n<div class=\"codecolorer-container javascript mac-classic\" style=\"overflow:auto;white-space:nowrap;width:608px;\"><div class=\"javascript codecolorer\"><span class=\"sy0\">&lt;<\/span>fb<span class=\"sy0\">:<\/span>fbjs<span class=\"sy0\">-<\/span>bridge<span class=\"sy0\">\/&gt;<\/span><\/div><\/div>\n<p>before the swf\u2019s inclusion tag<\/p>\n<div class=\"codecolorer-container javascript mac-classic\" style=\"overflow:auto;white-space:nowrap;width:608px;\"><div class=\"javascript codecolorer\"><span class=\"sy0\">&lt;<\/span>fb<span class=\"sy0\">:<\/span>swf swfsrc<span class=\"sy0\">=<\/span><span class=\"st0\">&quot;URL_SWF&quot;<\/span> width<span class=\"sy0\">=<\/span><span class=\"st0\">&quot;SWF_WIDTH&quot;<\/span> height<span class=\"sy0\">=<\/span><span class=\"st0\">&quot;SWF_HEIGHT&quot;<\/span><span class=\"sy0\">\/&gt;<\/span><\/div><\/div>\n<p>and it must be followed by the script tag<\/p>\n<div class=\"codecolorer-container javascript mac-classic\" style=\"overflow:auto;white-space:nowrap;width:608px;\"><div class=\"javascript codecolorer\"><span class=\"sy0\">&lt;<\/span>script<span class=\"sy0\">&gt;<\/span><br \/>\n<span class=\"sy0\">&lt;!--<\/span><br \/>\n<span class=\"sy0\">--&gt;<\/span><br \/>\n<span class=\"sy0\">&lt;\/<\/span>script<span class=\"sy0\">&gt;<\/span><\/div><\/div>\n<p style=\"text-align: left;\"><!--more--><br \/>\nThis code, if it\u2019s inserted in the application page (which can contain html, php, ruby\u2026), loads the swf and automatically creates the bridge between the application and fbml.<\/p>\n<p>Bridge\u2019s name is passed throught a parameter stored in a flashVar called <em>fb_local_connection<\/em>.<\/p>\n<p><strong>How to use this method to call a function from AS3<\/strong><br \/>\nWe have to save the name of the <em>fbjs-bridge<\/em> we\u2019ve just created. FlashVars are stored in\u00a0<em>stage.loaderInfo.parameters<\/em>:<\/p>\n<div class=\"codecolorer-container actionscript3 mac-classic\" style=\"overflow:auto;white-space:nowrap;width:608px;\"><div class=\"actionscript3 codecolorer\"><span class=\"kw2\">var<\/span> connName<span class=\"sy0\">:<\/span> <a href=\"http:\/\/www.google.com\/search?q=string%20inurl:http:\/\/livedocs.adobe.com\/flex\/201\/langref\/%20inurl:string.html\"><span class=\"kw5\">String<\/span><\/a> = <span class=\"kw7\">stage<\/span><span class=\"sy0\">.<\/span><span class=\"kw7\">loaderInfo<\/span><span class=\"sy0\">.<\/span><span class=\"kw7\">parameters<\/span><span class=\"sy0\">.<\/span>fb_local_connection<span class=\"sy0\">;<\/span><\/div><\/div>\n<p>Then we have to create a new Local Connection:<\/p>\n<div class=\"codecolorer-container actionscript3 mac-classic\" style=\"overflow:auto;white-space:nowrap;width:608px;\"><div class=\"actionscript3 codecolorer\"><span class=\"kw2\">var<\/span> conn<span class=\"sy0\">:<\/span> <a href=\"http:\/\/www.google.com\/search?q=localconnection%20inurl:http:\/\/livedocs.adobe.com\/flex\/201\/langref\/%20inurl:localconnection.html\"><span class=\"kw5\">LocalConnection<\/span><\/a> = <span class=\"kw1\">new<\/span> <a href=\"http:\/\/www.google.com\/search?q=localconnection%20inurl:http:\/\/livedocs.adobe.com\/flex\/201\/langref\/%20inurl:localconnection.html\"><span class=\"kw5\">LocalConnection<\/span><\/a><span class=\"br0\">&#40;<\/span><span class=\"br0\">&#41;<\/span><span class=\"sy0\">;<\/span><\/div><\/div>\n<p>Now we can call the fbjs function using LocalConnection\u2019s Send Method:<\/p>\n<div class=\"codecolorer-container actionscript3 mac-classic\" style=\"overflow:auto;white-space:nowrap;width:608px;\"><div class=\"actionscript3 codecolorer\">conn<span class=\"sy0\">.<\/span><span class=\"kw7\">send<\/span><span class=\"br0\">&#40;<\/span>connName<span class=\"sy0\">,<\/span> <span class=\"st0\">&quot;callFBJS&quot;<\/span><span class=\"sy0\">,<\/span> <span class=\"st0\">&quot;Facebook.streamPublish&quot;<\/span><span class=\"sy0\">,<\/span> <span class=\"br0\">&#91;<\/span><span class=\"st0\">'User Message'<\/span><span class=\"sy0\">,<\/span> attachment<span class=\"sy0\">,<\/span> action_links<span class=\"sy0\">,<\/span> <span class=\"st0\">''<\/span><span class=\"sy0\">,<\/span><span class=\"st0\">'User Message Prompt'<\/span><span class=\"br0\">&#93;<\/span><span class=\"br0\">&#41;<\/span><span class=\"sy0\">;<\/span><\/div><\/div>\n<p>This function accepts the following parameters:<\/p>\n<ul>\n<li>Connection name, in this case <em>connName<\/em>;<\/li>\n<li>Connection method (<em>callFBJS<\/em>);<\/li>\n<li>The fbjs\u2019s method name we need to open the pop-up (<em>Facebook.streamPublish<\/em>);<\/li>\n<li>An Array which contains the parameters that must be sent to <em>Facebook.streamPublish<\/em>;<\/li>\n<\/ul>\n<p>To create the pop-up Facebook provides us the function <em><a href=\"http:\/\/wiki.developers.facebook.com\/index.php\/Facebook.streamPublish\" target=\"_blank\">Facebook.streamPublish<\/a><\/em>.<br \/>\nLet&#8217;s have a look to the array&#8217;s parameters:<\/p>\n<div class=\"codecolorer-container actionscript3 mac-classic\" style=\"overflow:auto;white-space:nowrap;width:608px;\"><div class=\"actionscript3 codecolorer\"><span class=\"br0\">&#91;<\/span><span class=\"st0\">'User Message'<\/span><span class=\"sy0\">,<\/span> attachment<span class=\"sy0\">,<\/span> action_links<span class=\"sy0\">,<\/span> <span class=\"st0\">''<\/span><span class=\"sy0\">,<\/span><span class=\"st0\">'User Message Prompt'<\/span><span class=\"br0\">&#93;<\/span><\/div><\/div>\n<p><em>\u201cUser Message\u201d<\/em><br \/>\nThis is the message that appears near the name, when we post to contento f the pop-up to the wall.<\/p>\n<p><em>\u201cattachment\u201d <\/em><br \/>\nThis is the body of the message (later we\u2019ll say more about this)<\/p>\n<p><em>\u201caction_links\u201d<\/em><br \/>\nits an array of objects, in this case, the code is:<\/p>\n<div class=\"codecolorer-container actionscript3 mac-classic\" style=\"overflow:auto;white-space:nowrap;width:608px;\"><div class=\"actionscript3 codecolorer\"><span class=\"br0\">&#91;<\/span><span class=\"br0\">&#123;<\/span><span class=\"kw7\">text<\/span><span class=\"sy0\">:<\/span><span class=\"st0\">'Try My MostShared!'<\/span><span class=\"sy0\">,<\/span> href<span class=\"sy0\">:<\/span><span class=\"st0\">'http:\/\/apps.facebook.com\/mymostshared\/'<\/span><span class=\"br0\">&#125;<\/span><span class=\"br0\">&#93;<\/span><span class=\"sy0\">;<\/span><\/div><\/div>\n<p>Action Link is shown in position bottom-left once pop-up is posted.<\/p>\n<p>Here we go, this is the final result:<br \/>\n<img loading=\"lazy\" decoding=\"async\" style=\"margin-top: 20px; margin-bottom: 20px; margin-left: 100px; margin-right: 100px;\" title=\"Facebook-popup\" src=\"http:\/\/alittleb.it\/wp-content\/uploads\/post\/AS3FBpopup_1.gif\" alt=\"\" width=\"509\" height=\"160\" \/><\/p>\n<p><strong>Analysis of <em>attachment<\/em> parameter<\/strong><\/p>\n<p>The <em>attachment<\/em> is the core of the pop-up function, an <a href=\"http:\/\/wiki.developers.facebook.com\/index.php\/Attachment_(Streams)\" target=\"_blank\">entire page of the wiki<\/a> is dedicated to this parameter.<br \/>\nIn AS3 this is a generic object with several standard properties:<\/p>\n<pre>\n\n<div class=\"codecolorer-container actionscript3 mac-classic\" style=\"overflow:auto;white-space:nowrap;width:608px;\"><div class=\"actionscript3 codecolorer\"><span class=\"kw2\">var<\/span> obj<span class=\"sy0\">:<\/span> <a href=\"http:\/\/www.google.com\/search?q=object%20inurl:http:\/\/livedocs.adobe.com\/flex\/201\/langref\/%20inurl:object.html\"><span class=\"kw5\">Object<\/span><\/a> = <span class=\"br0\">&#123;<\/span><br \/>\n&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <span class=\"kw7\">name<\/span><span class=\"sy0\">:<\/span><span class=\"st0\">'Attachment name'<\/span><span class=\"sy0\">,<\/span><br \/>\n<br \/>\n&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; href<span class=\"sy0\">:<\/span><span class=\"st0\">'http:\/\/apps.facebook.com\/mymostshared\/'<\/span><span class=\"sy0\">,<\/span><br \/>\n<br \/>\n&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <span class=\"kw7\">caption<\/span><span class=\"sy0\">:<\/span><span class=\"st0\">&quot;Attachment caption<span class=\"es0\">\\n<\/span>Attachment caption2&quot;<\/span><span class=\"sy0\">,<\/span> &nbsp;<br \/>\n<br \/>\n&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <span class=\"kw7\">description<\/span><span class=\"sy0\">:<\/span><span class=\"st0\">&quot;Attachment description<span class=\"es0\">\\n<\/span>Attachment description2&quot;<\/span><span class=\"sy0\">,<\/span><br \/>\n<br \/>\n&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; properties<span class=\"sy0\">:<\/span><span class=\"br0\">&#123;<\/span><br \/>\n&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <span class=\"st0\">&quot;Label&quot;<\/span><span class=\"sy0\">:<\/span><br \/>\n&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <span class=\"br0\">&#123;<\/span> <span class=\"kw7\">text<\/span><span class=\"sy0\">:<\/span> <span class=\"st0\">&quot;Attachment properties&quot;<\/span><span class=\"sy0\">,<\/span> href<span class=\"sy0\">:<\/span><span class=\"st0\">&quot;http:\/\/apps.facebook.com\/mymostshared\/&quot;<\/span><span class=\"br0\">&#125;<\/span><span class=\"sy0\">,<\/span>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <span class=\"st0\">&quot;Label2&quot;<\/span><span class=\"sy0\">:<\/span><br \/>\n&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <span class=\"br0\">&#123;<\/span> <span class=\"kw7\">text<\/span><span class=\"sy0\">:<\/span> <span class=\"st0\">&quot;Attachment properties&quot;<\/span><span class=\"sy0\">,<\/span> href<span class=\"sy0\">:<\/span><span class=\"st0\">&quot;http:\/\/apps.facebook.com\/mymostshared\/&quot;<\/span><span class=\"br0\">&#125;<\/span><br \/>\n&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <span class=\"br0\">&#125;<\/span><span class=\"sy0\">,<\/span><br \/>\n<br \/>\n&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; media<span class=\"sy0\">:<\/span>&nbsp; <span class=\"br0\">&#91;<\/span><span class=\"br0\">&#123;<\/span><span class=\"kw7\">type<\/span><span class=\"sy0\">:<\/span><span class=\"st0\">'image'<\/span><span class=\"sy0\">,<\/span> src<span class=\"sy0\">:<\/span><span class=\"st0\">'http:\/\/mymostshared.beatall.net\/images\/mymostsharedlogo.jpg'<\/span><span class=\"sy0\">,<\/span> href<span class=\"sy0\">:<\/span><span class=\"st0\">'http:\/\/apps.facebook.com\/mymostshared\/'<\/span><span class=\"br0\">&#125;<\/span><span class=\"br0\">&#93;<\/span><br \/>\n<span class=\"br0\">&#125;<\/span><span class=\"sy0\">;<\/span><\/div><\/div>\n\n<\/pre>\n<p>Final image:<br \/>\n<img loading=\"lazy\" decoding=\"async\" class=\"aligncenter\" style=\"margin-top: 10px; margin-bottom: 20px;\" title=\"Facebook-popup-2\" src=\"http:\/\/alittleb.it\/wp-content\/uploads\/post\/AS3FBpopup_2.gif\" alt=\"\" width=\"621\" height=\"344\" \/><br \/>\nColor&#8217;s image notes:<\/p>\n<ul>\n<li>red indicates the whole attachment object;<\/li>\n<li>purple indicates the name. It accepts a String. It is linked to the href property (also a String), it\u2019s clickable and it redirects to the specified url;<\/li>\n<li>orange indicates the caption, a subtitle for the post. It plays the {*actor*} property and when it\u2019s posted to wall it\u2019s replace by the name of the logged user (\u201cDavide\u201d in this case). It also play regular expression: \u201c\\n\u201d and starts a new line.<\/li>\n<li>pink indicates the description: this doesn\u2019t play the role of the {*actor*} or \u201c\\n\u201d. Bold text is not allowed and only the first 300 characters are shown. If  the description is longer a \u201cSee More\u201d  button will appear and we can click it to read the whole message;<\/li>\n<li>lighter green indicates the \u201cproperties\u201d object:  an array that can contain an infinite number of links. The value can be a string and it can\u2019t contain spaces (It\u2019s possible to specify a \u201cLabel2\u201d, not \u201cLabel 2\u201d). It\u2019s followed by \u201ctext\u201d, a String which points to \u201chref\u201d, a link. If a Label is not defined, Facebook will us \u201c0\u201d as default value.<\/li>\n<li>darker green indicates the &#8220;madium&#8221; property: it is possible to implement one ore more images, although facebook will display by default only the first image defined. To display the other images the user will have to click on &#8220;see more&#8221;. Besides &#8216;image&#8217; type its accepts also &#8216;flash&#8217; or &#8216;mp3&#8217; types. Every array has an its <a href=\"http:\/\/wiki.developers.facebook.com\/index.php\/Attachment_(Streams)\" target=\"_blank\">own structure<\/a>.<\/li>\n<\/ul>\n<p>I hope this is post will be useful for you next awesome Facebook applications!<\/p>\n<p style=\"text-align: right;\"><em>Author: Davide Maggioni<\/em><\/p>\n","protected":false},"excerpt":{"rendered":"<p>L&#8217;articolo \u00e8 disponibile solo in inglese. Ci scusiamo per il disagio. The first step to open a facebook \u00a0dialog popup using ActionScript 3.0 is to create a bridge between our [&hellip;]<\/p>\n<p><a href=\"https:\/\/www.alittleb.it\/it\/actionscript-it\/aprire-un-popup-facebook-utilizzando-actionscript\/\" class=\"more-link style2-button\">Read More<\/a><\/p>","protected":false},"author":9,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"content-type":"","_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"footnotes":""},"categories":[79,81,80],"tags":[],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/www.alittleb.it\/it\/wp-json\/wp\/v2\/posts\/939"}],"collection":[{"href":"https:\/\/www.alittleb.it\/it\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.alittleb.it\/it\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.alittleb.it\/it\/wp-json\/wp\/v2\/users\/9"}],"replies":[{"embeddable":true,"href":"https:\/\/www.alittleb.it\/it\/wp-json\/wp\/v2\/comments?post=939"}],"version-history":[{"count":0,"href":"https:\/\/www.alittleb.it\/it\/wp-json\/wp\/v2\/posts\/939\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.alittleb.it\/it\/wp-json\/wp\/v2\/media?parent=939"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.alittleb.it\/it\/wp-json\/wp\/v2\/categories?post=939"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.alittleb.it\/it\/wp-json\/wp\/v2\/tags?post=939"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}