Categories
AS3 Design Flash Urban papercraft

Twitter rss reader in Flash as3

Update #1: must read this post, otherwise this code will fail when you place it on your server!

I recently started my own company (eMCeeKay.nl) and I need to make a website for it…. Not really a problem besides that I don’t have any time to create a design.

So I was thinking about a easy way to update this website without spending extra time on that.

Because the main focus of the company is papertoys (urban papertoys), I need design or papertoy related info in my my new website ().

And I came with two ways to update it without extra effort: twitter (I tweet about a lot of stuff but primarily about papertoys) and this the content on this blog (category: urban-papercraft).

I started with the Twitter part.
There are two Twitter AS3 libraries that “speak” to the Twitter API: twitterscript/ and tweetr/.
But after reading the source I concluded that it was a little bit to much: I don’t want to tweet from emceekay.nl or do searches, so that was not the way to go.

A little google search gave me the solution: http://www.theflashlogs.org/flash/displaying-twitter-feeds-in-flash-with-rss/, simple using the standard rss from Twitter (in my case: Matthijs Kamstra – Twitter – rss).

The code on theflashlogs.org is pritty simple, and very easy to use.
So my code is a little addition to that, I need some stuff done to the rss feed:

  • remove “MatthijsKamstra:” form the title
  • convert @paperkraft to a link
  • convert #Mecha6 to a link
  • convert http:// to a link

Here is my code:
[as light=”false” wraplines=”false”]
package nl.emceekay.twttr
{
import flash.display.MovieClip;
import flash.events.Event;
import flash.net.URLLoader;
import flash.net.URLRequest;
import flash.text.TextField;
/**
* // nl.emceekay.twttr.TwttrExample
* …
* @author Matthijs Kamstra aka [mck]
*/
public class TwttrExample extends MovieClip
{
//default: http://twitter.com/matthijskamstra
private var url:String = "http://twitter.com/statuses/user_timeline/27657030.rss";

private var _txt:TextField;

public function TwttrExample()
{
stage.scaleMode = "noScale";
stage.align = "TL";

// generate textfield
_txt = new TextField()
_txt.x = 10;
_txt.y = 10;
_txt.width = stage.stageWidth – 20;
_txt.height = stage.stageHeight – 20;
_txt.wordWrap = true;
_txt.multiline = true;
_txt.autoSize = "left";
addChild(_txt);

// start
getFeed(url);
}

//////////////////////////////////////// loading rss / show rss ////////////////////////////////////////

private function getFeed (inURL:String) : void
{
_txt.htmlText = "getting tweets";

var loader:URLLoader = new URLLoader();
loader.addEventListener(Event.COMPLETE, onFeedHandler);
loader.load(new URLRequest(inURL));
}

private function onFeedHandler (e:Event):void
{
_txt.htmlText = "";
var _feed:XML = new XML(e.target.data);
var _item:XMLList = _feed.channel.item;
for each (var feedItem:XML in _item){
var _title :String = feedItem.title;
var _pubDate :String = feedItem.pubDate;
var _link :String = feedItem.link;

_title = convertTweet(_title);

_txt.htmlText += _title + "<br><i>" + _pubDate + "</i><br><br>";
}
}

//////////////////////////////////////// twitter specific ////////////////////////////////////////

// one place to convert the tweet
private function convertTweet (inString:String):String
{
var _str:String = inString;
_str = twttrStripName(_str);
_str = twttrConvertHTTP(_str);
_str = twttrConvertMention(_str);
_str = twttrConvertHashtag(_str);
_str = twttrConvertSmileys(_str);
return _str;
}

// remove the writers name from the tweet
private function twttrStripName (inString:String):String
{
var _str:String = inString;
var _charNumber:Number = _str.indexOf(":");
return _str.substr(_charNumber + 2);
}

// convert http-strings to links
private function twttrConvertHTTP(inString:String):String
{
var _str:String = inString;
var _array:Array = _str.split(" ");
for (var i:int = 0; i < _array.length; i++)
{
var _str2:String = twttrStripChar(_array[i]);
if (_array[i].indexOf("http") != -1)
{
_array[i] = "<u><a href=’" + _str2 + "’ target=’_blank’>" +_array[i] + "</a></u>";
}
}
return _array.join(" ");
}

// convert mentions (@) to links
private function twttrConvertMention(inString:String):String
{
var _str:String = inString;
var _array:Array = _str.split(" ");
for (var i:int = 0; i < _array.length; i++)
{
var _str2:String = twttrStripChar(_array[i]);
if (_array[i].substr(0, 1) == "@")
{
_array[i] = "<u><a href=’http://www.twitter.com/" + _str2.split("@")[1] + "’ target=’_blank’>" +_array[i] + "</a></u>";
}
}
return _array.join(" ");
}

// convert hashtags (#) to links
private function twttrConvertHashtag(inString:String):String
{
var _str:String = inString;
var _array:Array = _str.split(" ");
for (var i:int = 0; i < _array.length; i++)
{
var _str2:String = twttrStripChar(_array[i]);
if (_array[i].substr(0, 1) == "#")
{
_array[i] = "<u><a href=’http://twitter.com/search?q=%23" + _str2.split("#")[1] + "’ target=’_blank’>" +_array[i] + "</a></u>";
}
}
return _array.join(" ");
}

// TODO: [mck] convert 🙂 to a smiley image
private function twttrConvertSmileys(inString:String):String
{
var _str:String = inString;
return _str;
}

// remove "strange" characters from the end of the string
private function twttrStripChar(inString:String):String
{
var _str:String = inString;
var _charArray:Array = [‘,’, ‘;’, ‘:’, ‘ ‘, ‘-‘, ‘_’];
for (var i:int = 0; i < _charArray.length; i++)
{
if (_str.charAt(_str.length – 1) == _charArray[i]) {
_str = _str.substr(0, _str.length – 1);
}
}
return _str;
}

} // end class

} // end package
[/as]

Currently I have only this proof of concept, but soon I will post the example on emceekay.nl

Because this is part one of what I want to do, and don’t want to search for every link again, I’m posting also the WordPress link here (it’s just because I’m lazy).

So here the feeds I will be using:

Categories
AS3 Open source / Freeware WordPress Plugin

Updated Syntaxhighlighter

Update #1: hmmmm, stupid but I write these post sometimes weeks ahead…. and this one caught up on me… The new version of SyntaxHighlighter Evolved has ActionScript support.. 🙂
Update #2: I could remove everything below, but I’m keeping this here, perhaps someone can use it…. and it took some time to write, so I really can’t kill my darlings.

A little change I made to the new updated plugin:
find the plugin-folder “syntaxhighlighter” and add the next line to “syntaxhighlighter.php”
[as highlight=”1,3″]
‘as’ => ‘as3’,
‘as3’ => ‘as3’,
‘actionscript’ => ‘as3’,
‘actionscript3’ => ‘as3’,
[/as]
and find in the plugin-folder “syntaxhighlighter”, the folder “scripts” and change the next line to “shBrushAS3.js”
[as wrapper=”true”]
// SyntaxHighlighter.brushes.AS3.aliases = [‘actionscript3’, ‘as3’]; // old line and the bottom of the .js file
SyntaxHighlighter.brushes.AS3.aliases = [‘actionscript3′,’actionscript’, ‘as3’, ‘as’]; // new line
[/as]

the new syntaxhighlighter only uses “as3” and “actionscript3“, and I just changed all my post to “as

Update #3: and update the css, that made the code not wrap….
I removed “white-space: pre;” form “code” and now it wraps:

code  { font-family: "Courier New", Courier, monospace; font-size: 1.2em; /*white-space: pre;*/ color: Gray; }

Today I updated my SyntaxHighlighter JavaScript package by Alex Gorbatchev and it was not easy…

I have a syntax highlighter installed on my blog to show my ActionScript source code in a nice way.
But the first time I installed it, I choose a WordPress plugin which isn’t add to WordPress Plugin Directoryand doesn’t appear to be update.
And if I remember correctly, it didn’t work as it should and I had to add ActionScript. Read my previous decision here.
So I had to upgrade to SyntaxHighlighter Evolved which of course came with some upgrading issues created by my previous install.

First problem: write ActionScript.
ActionScript is not default included in the Syntaxhighter, and you will be advised to use [ javascript ] tag, which is a good advice since AS is almost javascript. It would make your live easier if you choose this option.
But as in my last installment of syntaxhighlighter I want to use Actionscript highlighting.
So there we go:
To do that you need an Actionscript brush. I found two of them: cptloadtest.com has one but it looks like its more for AS2,
and yourpalmark.com which is also the one I choose, because I used his version also with my previous installment and it’s for AS3.

This is what you need to do: install SyntaxHighlighter and if you choose to use [ javascript ]
your done. I was not done yet, so lets continue… Download the shBrushAS3.zip, extract and place the shBrushAS3.js in the correct folder on the server (in my case .../wp-content/plugins/syntaxhighlighter/syntaxhighlighter/scripts). Now you need to change some code in the WordPress plugin:
You can do this in WordPress itself if you have writing permission set, or you can edit the php file on your desktop…
you need to add the highlighted code

// Register brush scripts
wp_register_script( 'syntaxhighlighter-core', plugins_url('syntaxhighlighter/syntaxhighlighter/scripts/shCore.js'), array(), $this->agshver );
wp_register_script( 'syntaxhighlighter-brush-actionscript3', plugins_url('syntaxhighlighter/syntaxhighlighter/scripts/shBrushAS3.js'), array('syntaxhighlighter-core'), $this->agshver);

and

// Create list of brush aliases and map them to their real brushes
$this->brushes = apply_filters( 'syntaxhighlighter_brushes', array(
	'as'       => 'actionscript3',
	'as2'       => 'actionscript3',
	'as3'       => 'actionscript3',
	'actionscript'       => 'actionscript3',
	'bash'       => 'bash',

and now you are ready to go.

I had to change some other stuff ([ source:as ]...[ /source ] into [ as ]...[ /as ] ) and it seems that my css is not playing nice with syntaxhighlighter. hmmmm this is more work then I thought it would be.

I had to deactivate one plugin: autoescape , it didn’t play nice with SyntaxHightlighter. I didn’t use it anymore, and the combination generated gibberish.

Categories
Misc Open source / Freeware WordPress Plugin

Headers broken again: sIFR update

My Flash rendered headers didn’t work after my host transferred my site to another server.
Well in retrospect it’s easy to blame it on the host (sorry guys), but the fault was/is simpler.

I had this problem before : firefox and sifr dont play nice, and just as last time I blamed the wrong person again: not my host but the new Flash Player version 10 killed my sIFR headers…

That would explain why I see my headers at home but not at my work (I didn’t upgrade to Flash Player 10 at home).

The solution is very simple: visit http://novemberborn.net/sifr/2.0.7 and download the latest version of sifr (2.0.7).

Find your sIFR javascript file and check if it’s 2.0.5 or higher:

If you are upgrading from sIFR 2.0.5 or 2.0.6, you must upgrade the sifr.js JavaScript file.

and overwrite it…

And that’s it.
So do you recognize this situation: update the Flash Player recently/ your sIFR headers work on one computer but not on another/ sIFR works in IE and not in Firefox (or the other way around)/ Flash headers are now html headers …. update your sIFR!

For the people that don’t know sIFR:

sIFR is meant to replace short passages of plain browser text with text rendered in your typeface of choice, regardless of whether or not your users have that font installed on their systems. It accomplishes this by using a combination of JavaScript, CSS, and Flash, which renders the font. It degrades gracefully if Flash is not present. sIFR 3 is open source and licensed under the CC-GNU LGPL.

And I use the WordPress plugin CG-FlashyTitles.

Categories
Misc

Upgrading WordPress 2.6

Today I upgraded to WordPress 2.6.

I followed the instructions how to upgrading WordPress and this has never failed… till today 🙁 .

This is what happened: I upgraded and everything was oke. I could login, the upgrading of the database worked fine. I could see my post, pages, etc, etc in the admin and edit them.
So I checked out my homepage: and everything was as it should: mission completed…. NOT!! 🙁

Every link to another page didn’t work, you can navigate by “older post” but not with “recent posts” or the title of the post.

It took me some time to find the correct way to search about this problem: it has something to do with the permalinks. In all cases, these people have permalink structures that contain “index.php”.
Example: “http://www.matthijskamstra.nl/blog/index.php/2008/07/09/drukks-the-selfish-series-drukkgrumm/

Still no idea? Go to your “[your WordPress install]/wp-admin/options-permalink.php” (Customize Permalink Structure) and you will probable see that you don’t have the default setting ( http://www.matthijskamstra.nl/blog/?p=123 :: no “index.php”) but have chosen something else (in my case: [x] Day and name — http://www.matthijskamstra.nl/blog/index.php/2008/07/16/sample-post/ )

I found the explanation here: 2.6 Permalink issues with “index.php” and in my case the second option worked.

2. If you need/want the index.php to be there, then on the Settings->Permalinks screen, add some values in for the category and tag bases. The words “category” and “tag” will do just fine. As long as they are not blank, this should work around the bug.

This is bug in WordPress 2.6, read more about it here: http://trac.wordpress.org/ticket/7306. It will be fixed in the next version (2.6.1)

But for now you can make your WordPress work again: visit your “[your WordPress install]/wp-admin/options-permalink.php” (Customize Permalink Structure) and fill in the two boxes at the bottom with “category” and “tag

happy blogging