четверг, 19 ноября 2009 г.

Flash Builder on Linux

Great news for people who develop in Flex on Linux.
A great person feiy made a breakthrough. After half a year of discussion on Abode Jira THE feiy made a post:

hi,don't waiting....
this is a port version for linux:
a project to port the Adobe Flash Builder to Linux
http://code.google.com/p/fb4linux/

So I took a try and here are the results:


Installation

  1. Download tar archive from here
  2. Try to extract. So, I couldn't do it properly, so simply rename archive file to Adobe_Flash_Builder_Beta_2_For_Linux_Alpha1.tar, just remove .gz and then try tar -xvf [archive_name]
  3. After extraction you get a folder Adobe Flash Builder Beta 2 Linux Alpha1 with eclipse folder inside
  4. Copy all the files from this new eclipse folder to your eclipse folder

Actually this is it for installation. Now everything should work.


Testing Flash Builder 4 under Linux

During testing I had some problems:

First problem with Flash Player and Flex 4

So I installed flex 4 sdk, made a test project and tried to run it. I got an error about different version of Flash Player, so I have to set in properties of the project to use Falsh Player 10.0.0. To do so go to: Project Properties/Flex Compiler/Adobe Flash Player options, check Use specific version. After that you can compile and get to debug mode.

Second problem with Flash Player

I didn't solve it yet but I'm in the process. Each time when I'm try to start the project or get into debug it gives me an Alert window


General Impressions

Sometimes eclipse gets stuck and I have to reload it. It happens on different operations, but I think it's just because it's beta version.

Also the most important was the improvement in installation process. I think right now it's the correct one, so I don't need to run wizards to setup plugin for eclipse as it was with Flex Builder 3 alpha for Linux and as it is right now on Windows. I can install it once and then give it to someone else, this is a basic idea of eclipse (I think so).

Anyway it's incredible to have flash builder 4 on linux, thanks a lot to feiy. I'll continue testing this version of builder and updating this post.


Have a nice code :)


Update:

November 21, 2009 - Flash Builder Alpha 2

New features in Alpha 2

понедельник, 7 сентября 2009 г.

Highlighting your code on Blogger.com

I don't know why but there is no plugin for highlighting code in blogger.com.
Maybe I was searching in the wrong place but steel I've faced this problem and I'd like to share my solution.


First let's find a free, nice highlighter online. I'd like to say that this one http://alexgorbatchev.com/wiki/SyntaxHighlighter is the most interesting I could found in Internet.

Then configure the layout of your page. Go to: Layout -> Edit HTML. In this section you'll have ability to change your html-template manually. All you need is to add some javascript and css files in the header. You can use my configuration.

<script src='http://alexgorbatchev.com/pub/sh/2.0.278/scripts/shCore.js' type='text/javascript'/>
 <script src='http://alexgorbatchev.com/pub/sh/2.0.278/scripts/shBrushBash.js' type='text/javascript'/>
 <script src='http://alexgorbatchev.com/pub/sh/2.0.278/scripts/shBrushCpp.js' type='text/javascript'/>
 <script src='http://alexgorbatchev.com/pub/sh/2.0.278/scripts/shBrushCSharp.js' type='text/javascript'/>
 <script src='http://alexgorbatchev.com/pub/sh/2.0.278/scripts/shBrushCss.js' type='text/javascript'/>
 <script src='http://alexgorbatchev.com/pub/sh/2.0.278/scripts/shBrushJava.js' type='text/javascript'/>
 <script src='http://alexgorbatchev.com/pub/sh/2.0.278/scripts/shBrushJScript.js' type='text/javascript'/>
 <script src='scripts/shBrushPhp.js' type='text/javascript'/>
 <script src='http://alexgorbatchev.com/pub/sh/2.0.278/scripts/shBrushPlain.js' type='text/javascript'/>
 <script src='http://alexgorbatchev.com/pub/sh/2.0.278/scripts/shBrushSql.js' type='text/javascript'/>
 <script src='http://alexgorbatchev.com/pub/sh/2.0.278/scripts/shBrushVb.js' type='text/javascript'/>
 <script src='http://alexgorbatchev.com/pub/sh/2.0.278/scripts/shBrushXml.js' type='text/javascript'/>
 <link href='http://alexgorbatchev.com/pub/sh/2.0.278/styles/shCore.css' rel='stylesheet' type='text/css'/>
 <link href='http://alexgorbatchev.com/pub/sh/2.0.278/styles/shThemeDefault.css' rel='stylesheet' type='text/css'/>
 <script type='text/javascript'>
  SyntaxHighlighter.config.clipboardSwf = &#39;http://alexgorbatchev.com/pub/sh/2.0.278/scripts/clipboard.swf&#39;;
  SyntaxHighlighter.all();
 </script>
 <style type='text/css'>
  .syntaxhighlighter  div.line {
   margin:0px;
  }
 </style>

This is for configuration.
Now, how you should write your article?
Where ever you'd like to insert a piece of code you need to use this element:

<pre class="brush:html">
    &lt;h2&gt;Hello world!&lt;/h2&gt;
</pre>

The result is:
<h2>Hello world!</h2>

If you need another language to use you need to change a attribute class. For example for java you need to set it in class="brush:java".


Another cool feature is a string-highlighting. To do so you need to add string in class attribute of pre element. For example I need to highlight a 2-nd line of code, just type highlight: [2]. To highlight more then 1 line of code just use comma to separate the lines numbers highlight: [10, 11, 12, 13, 14]


An example with highlighting of lines 9 and 11

package ua.ekta.observer.bean.basis;
import java.util.List;

import ua.ekta.observer.bean.IBean;
import ua.ekta.observer.persistence.system.IDomain;

public interface IBasisManager extends IBean {
 
 IDomain detectDomain(String url);
 List<IDomain> loadBases();
 void clearBases();
}

Have a nice code :)

вторник, 21 июля 2009 г.

Compiling Flex with Maven 2 (Flexmojos)

Over several months I've been compiling my flex applications using Ant and Adobe Flex-Tasks, but here comes a day when our company decides to use Maven. So here is my advice for those who happened to find themselves in the same situation.

For now
flex is not very popular in maven community and there are not so many repositories for flex libraries and plugins as well. So I'd like to recommend a great plugin for maven to compile flex applications - Flexmojos from Sonatype. It's well documented, supporting flex 2-4 versions, rsl, modules, localization and has it's own repositories.

For those who haven't work with maven at all, I strongly recommend to read this book at least first two chapters to understand the philosophy of maven. For those who think that he or she is a God of maven then I recommend to read the same book from chapter 17.

As for me I like to use maven as much as possible. So first I'll create a folder structure for our flex project. For this action maven has a great plugin archetype that will create a folder structure and necessary pom.xml files for you.

Flexmojos has its own archetypes for flex application, so here they are:

Create library:
mvn archetype:generate -DarchetypeRepository=http://repository.sonatype.org/content/groups/public -DarchetypeGroupId=org.sonatype.flexmojos -DarchetypeArtifactId=flexmojos-archetypes-library -DarchetypeVersion=3.2.0

Create application:
mvn archetype:generate -DarchetypeRepository=http://repository.sonatype.com/content/groups/public -DarchetypeGroupId=org.sonatype.flexmojos -DarchetypeArtifactId=flexmojos-archetypes-application -DarchetypeVersion=3.2.0

Create modular application:
mvn archetype:generate -DarchetypeRepository=http://repository.sonatype.org/content/groups/public -DarchetypeGroupId=org.sonatype.flexmojos -DarchetypeArtifactId=flexmojos-archetypes-modular-webapp -DarchetypeVersion=3.2.0

We will use the second one flexmojos-archetype-application to create a simple flex application. To run this archetype simply copy it from post and past into a shell. You'll need to answer some questions before the plugin will create you a folder structure. If everything was good you'll be able to have such a screen.

If you haven't installed Flexmojos yet, maven will do it automatically.
Now let's take a look at the folder structure that maven has created for us.
So, all your code goes to src/main/flex folder. In this folder you should create your packages and write your code. As you see Flexmojos already has created the main application file Main.mxml. Also there is a test folder for all your tests: src/test/flex/{groupId}, so you can write tests for your application.
But the most interesting part is pom.xml. Let's take a look.
<project xmlns="http://maven.apache.org/POM/4.0.0"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://maven.apache.org/POM/4.0.0
http://maven.apache.org/maven-v4_0_0.xsd">

  <modelVersion>4.0.0</modelVersion>
  <groupId>ua.com.xoas</groupId>
  <artifactId>testapp</artifactId>
  <version>1.0</version>
  <packaging>swf</packaging>

  <name>testapp Flex</name>

  <build>
   <sourceDirectory>src/main/flex</sourceDirectory>
   <testSourceDirectory>src/test/flex</testSourceDirectory>
   <plugins>
    <plugin>
     <groupId>org.sonatype.flexmojos</groupId>
     <artifactId>flexmojos-maven-plugin</artifactId>
     <version>3.2.0</version>
     <extensions>true</extensions>
    </plugin>
   </plugins>
  </build>

  <dependencies>
   <dependency>
    <groupId>com.adobe.flex.framework</groupId>
    <artifactId>flex-framework</artifactId>
    <version>3.2.0.3958</version>
    <type>pom</type>
   </dependency>

   <dependency>
    <groupId>org.sonatype.flexmojos</groupId>
    <artifactId>flexmojos-unittest-support</artifactId>
    <version>3.2.0</version>
    <type>swc</type>
    <scope>test</scope>
   </dependency>
  </dependencies>

</project>

If you need to configure your build simply add a configuration element inside of the build element, like this:

<build>
 <sourceDirectory>src/main/flex</sourceDirectory>
 <testSourceDirectory>src/test/flex</testSourceDirectory>
 <plugins>
  <plugin>
    <groupId>org.sonatype.flexmojos</groupId>
    <artifactId>flexmojos-maven-plugin</artifactId>
    <version>3.2.0</version>
    <extensions>true</extensions>
    <configuration>
      <!-- put your configuration options here -->
      <debug>true</debug>
      <allowSourcePathOverlap>true</allowSourcePathOverlap>
    </configuration>
  </plugin>
 </plugins>
</build>

I've added two more options to build:
debug - Turn on generation of debuggable SWFs.
allowSourcePathOverlap - Allow the source-path to have path-elements which contain other path-elements.
Use this link to get a list of available configuration options.

To compile this application you'll need to run: mvn install -DflashPlayer.command={path to flexplayer} (path to flashplayer is required otherwise you'll get an error during test phase) If you want to skip test phase run this: mvn install -Dmaven.test.skip=true

The last thing I'd like to pay your attention to is dependencies element. One of the pros of the Flexmojos is that you don't have to install flex-sdk - it will be downloaded automatically and all you need is to add a dependency, in "maven style", to flex-sdk.
<dependency>
 <groupId>com.adobe.flex.framework</groupId>
   <artifactId>flex-framework</artifactId>
   <version>3.2.0.3958</version>
   <type>pom</type>
 </dependency>
P.S.
Great documentation, great support makes Flexmojos the best plugin for maven to compile flex application.

Almost forgot: use flexmojos:flexbuilder goal to configure environment files for flexbuilder.

Have a nice code :)