mProjector^® AS3 beta

Welcome to mProjector AS3 beta page. This page gives you access to the latest mProjector builds, samples, and documentation.

We really appreciate ANY feedback you can give us. Drop us a post in the beta forum or send us an email ( b r i a n a t s c r e e n t i m e d o t c o m ).

What is mProjector?
Download Beta
Sample Applications
Beta Status and Known Issues
Suggestions

Coding your Application.

AS2 Support
AS2 Migration and the Missing AS3 Documentation

Working with Flash CS3

Getting Started with mProjector and Flash CS3
Debugging your application in Flash CS3
Building your application from inside Flash CS3

Working with Flex

Getting Started with mProjector and Flex 2.0
Debugging your application in Flex -- NATIVELY!
Building an mProjector application from inside Flex

mProjector enables you to build rich-internet applications for the desktop using Adobe Flash. mProjector AS3 beta adds support for ActionScript 3.0 and your favorite new Flash IDE - Flash CS3 or Flex.

mProjector apps are single file executables that require only the Flash plug-in be installed on the user's machine -- something that's probably already true if they are checking out your web site.

mProjector supports dynamic Flash-shaped windows, alpha channels, and anti-aliasing for both Windows and Mac OS X. Whatever you draw on the Stage will draw directly on the desktop -- in real time.

Your mProjector apps can be very lite (<300 Kb zipped).

See "mProjector… Crank it to Eleven" for more information.

Mac OS Download - The AS3 Beta has been rolled into mProjector 3.1 (simply check the AS3 box in the builder)
Windows OS Download - coming soon -- no specific availability date yet.

HelloWorld - demos some basic desktop application functionality (Flash CS3).
Download Image - demos how to download a file and how to handle mProjector events (Flash CS3 and Flex).
Multiple Windows - not ready yet - creates a child window and sends it a message.
Your App HERE - If you make something cool, we'll add it to our list.

BETA STATUS - We are wrapping development on the mProjector's API and the Mac Builder application but still working working on mProjector Windows and formal documentation.

Issues:

• Flash CS3 code hints and code completion don't work. We haven't groked the new Help Panel file format yet. If someone has figured it out or has found a published API from Adobe, drop us a line.
• AS3 UI components don't work with Flash-shaped windows. This is a Flash bug, transparent windows in a browser will exhibit the same behavior. We are looking into it.
• The "Build Application" command added to the Flash CS3 Commands menu does not work. If you are developing using Flash CS3, build your applications using mProjector directly.
• Window to window communication breaks mWindow calls. If a window creates a child and then sends it a message the parent will send any subsequent mWindow calls to the child rather than acting on them itself.
• Flash components do not render correctly with Flash Shaped windows. This is a bug in the flash player (as of r45). The workaround is to include the folder called "fl" that is included in the multple window sample in the same folder as any affected fla before publishing it.
• When building an application that includes "Additional" files the build status text will always read "Build Failed". In all the cases we have tested it works fine.

We really appreciate any feedback (good or bad) you can give us. Drop us a post in the beta forum or email us comment ( b r i a n a t s c r e e n t i m e d o t c o m ) if you run into a bug or have any suggestions.

mProjector AS3 Beta supports preivous versions of Flash and ActionScript. Before publishing your AS1 / AS2 SWF as a Desktop Application click mProjector's Publish tab and UNCHECK the AS3 check box.

We are working on mProjector 4 documentation but it's not ready. Most functionality is similar to AS2-based mProejctor V3, so we thought we'd get a release out using the V3 docs BUT please note the following IMPORTANT DIFFERENCES.

Differences between the AS2 and AS3 implementation of mProjector's Desktop Classes:

• Include the mProjector AS3 component and an "import" statement before using mProjector methods.
• Use addEventListener() to register your mApplication, mWindow, and mMenu event handlers.
• Use addEventListener() to register your download file progress event handler.
• Use mWindow.addCallback() to register callable user defined methods for Window to Window communication.
• Check the AS3 check box before publishing your AS3.0 based application.


1. mProjector AS3 classes are no longer global. To access mProjector classes make sure your FLA document library (Flash CS3) or project library path (Flex) contains the mProjector component (SWC in Flex).
   Call import stm.mprojector.mProjectorClassName before using the mProjector method.
   
   import stm.mprojector.mWindow;
mWindow.setPosition(50, 50);// set the window position to x=50, y=50 on the desktop.


2. mProjector Application, Window, and Menu event handlers, such as mApplication.onActivate(), have be replaced in the new AS 3.0 style event model where you add event listeners via className.addEventListener().
   
   The sample code below hooks up an event listener for each mProjector event type.

import stm.mprojector.*;
function initListeners():void {

   	mApplication.addEventListener(mApplicationEvent.APPLICATION_ACTIVATE, applicationEventHandler);
  	mApplication.addEventListener(mApplicationEvent.APPLICATION_DEACTIVATE, applicationEventHandler);
  	mApplication.addEventListener(mApplicationEvent.QUIT, applicationEventHandler);
  	mApplication.addEventListener(mApplicationEvent.SCREEN_CHANGE, applicationEventHandler);
  	mApplication.addEventListener(mApplicationEvent.MESSAGE, applicationEventHandler);
  	mApplication.addEventListener(mApplicationEvent.SYSTEM_TRAY, applicationEventHandler);
  	mApplication.addEventListener(mApplicationEvent.DOWNLOAD_FILE_PROGRESS, applicationEventHandler);
  	//
  	mApplication.addEventListener(mWindowEvent.WINDOW_ACTIVATE, windowEventHandler);
  	mApplication.addEventListener(mWindowEvent.WINDOW_DEACTIVATE, windowEventHandler);
  	mApplication.addEventListener(mWindowEvent.CLOSE, windowEventHandler);
  	mApplication.addEventListener(mWindowEvent.DOCK, windowEventHandler);
  	mApplication.addEventListener(mWindowEvent.UNDOCK, windowEventHandler);
  	mApplication.addEventListener(mWindowEvent.DRAG_FILES, windowEventHandler);
  	mApplication.addEventListener(mWindowEvent.DRAG_LEAVE, windowEventHandler);
  	mApplication.addEventListener(mWindowEvent.DRAG_STRING, windowEventHandler);
 	mApplication.addEventListener(mWindowEvent.MINIMIZE, windowEventHandler);
 	mApplication.addEventListener(mWindowEvent.RESTORE, windowEventHandler);
 	mApplication.addEventListener(mWindowEvent.SCROLL_WHEEL, windowEventHandler);
 	mApplication.addEventListener(mWindowEvent.MOUSE_MASK_DOWN, windowEventHandler);
 	mApplication.addEventListener(mWindowEvent.MOUSE_MASK_UP, windowEventHandler);
 	//
 	mApplication.addEventListener(mMenuEvent.COMMAND, menuEventHandler);
}
function applicationEventHandler(e:mApplicationEvent):void {
	mApplication.trace(new Date().toString() + ": mApplication " + e.type + " event");
	switch (e.type) {
		case mApplicationEvent.APPLICATION_DEACTIVATE:
			current_runmode = "inactive_app";
			// do something
			break;
		case mApplicationEvent.APPLICATION_ACTIVATE:
			current_runmode = "active_app";
			// do something
			break;
	 	case mApplicationEvent.RESTART:
	 		mApplication.trace("commandLineArgs: " + e.commandLineArgs.toString());
	 		// do something
			break;
	 	case mApplicationEvent.DOWNLOAD_FILE_PROGRESS:
	 		mApplication.trace("sessionID: " +  e.sessionID.toString()  + " total: " + 
				e.total.toString() + " read: "  + e.total.toString());
			// do something
			break;
	}
}
function windowEventHandler(e:mWindowEvent):void {
  mApplication.trace(new Date().toString() + ": mWindow " + e.type + " event");
	switch (e.type) {
 	case mWindowEvent.DRAG_FILES:
 		// handle drag
		break;
 	case mWindowEvent.DROP_FILES:
 		// handle drop
		mApplication.trace("files: " + e.files.toString());
 	case mWindowEvent.DRAG_STRING:
 	case mWindowEvent.DROP_STRING:
		mApplication.trace("string: " + e.text);
		// handle string
		break;
  	}
}
function menuEventHandler(e:mMenuEvent):void {
  	mApplication.trace(new Date().toString() + ": mMenu " + e.type + " event");
   	mApplication.trace(e.target.menu + " " + e.item);
   	// handle menu selection
 }

initListeners();

3. The AS2 mApplication.downloadFile() API have be replaced in the new AS 3.0 style event model. First define an event handler then register it with the mApplication class. The event object includes read and total bytes like mProjector AS2 implementation and adds a sessionID property. As with AS2, when you are returned read = total = 0, the download has failed.

   // Download File Event Handler
   import stm.mprojector.*;
   
   function downloadProgress(e:mApplicationEvent):void {
   	mApplication.trace("sessionID: " +  e.sessionID.toString()  + " total: " + 
   	e.total.toString() + " read: "  + e.total.toString());
   }
   mApplication.addEventListener(mApplicationEvent.DOWNLOAD_FILE_PROGRESS, downloadProgress);
   
   var sessionID:uint = mApplication.downloadFile(localFileName.jpg, http://www.screentime.com/temp/1.jpg);

4. The AS2 window to window communication API have be replaced with an flash.external.ExternalInterface style implementation where you define a communication method then register it as callable with the window's mWindow class.
   
   mProjector AS3 implementation
   

   // ActionScript in child.swf
   import stm.mprojector.mWindow;
   
   // define function 
   function messageReceiver (message: String):void {
   	message.text = message;
   };
   // register messageReceiver as callable by other windows.
   mWindow.addCallback("messageReceiver", messageReceiver);
   
   // ActionScript in parent.swf
   childWindow = mApplication.createWindow("child.swf", 50, 50, "CHILD", "CHILD", "STANDARD", 
   	160000, true, 100, true, true, "");
   	if (childWindow != null) {
   		mApplication.trace("childWindow: " + childWindow.toString());
   		childWindow.messageReceiver("hello from parent");
   	}
   };

   
   mProjector AS2 implementation
   

   // ActionScript in child.swf
   mWindow.messageReceiver = function (message: String):void {
   	message.text = message;
   };
   
   
   // ActionScript in parent.swf
   childWindow = mApplication.createWindow("child.swf", 50, 50, "CHILD", "CHILD", "STANDARD", 
   	160000, true, 100, true, true, "");
   	if (childWindow != null) {
   		mApplication.trace("childWindow: " + childWindow.toString());
   		childWindow.messageReceiver("hello from parent");
   	}
   };
   

5. Before publishing your AS3.0 SWF as a desktop application click mProjector's Publish tab and check the AS3 check box.

1. Install the mProjector 4.0.
• Close Flash CS3.
• Run mProjector 4 installer. You may need to download the latest Extensions Manager from Adobe to install the mxp that comes with mProjector.
• Re-launch Flash CS3.
2. Create a new AS3.0 FLA document.
3. Include the mProjector 4 component in your document's library.
• Open the Components panel (Window > Components) and drag the mProjector 4 component from the "Screentime Components" folder into the Library panel (Window > Library).
4. To access mProjector classes and methods add an import statement stm.mprojector.mClassName then utilize the class. All mProjector classes and methods are listed in the Flash Help Panel and online in our Dev Center. In this example the initApp() function sets the window title and centers the window.

   // set window title and center the application on the desktop.
   import stm.mprojector.mWindow;
   
   
   mWindow.setTitle("Hello mProjector");
   mWindow.center();

5. Publish your SWF in Flash CS3.
6. Publish your SWF as an application using mProjector.
   • Open mProjector.
   • Set your SWF as the main application SWF - Select mProjector's Application tab and drag-n-drop your SWF on mProjector.
   • Set your application settings - application title, icon, window type, included files, etc.
   • Set your publish settings to AS3 - Click mProjector's Publish tab and check the AS3 check box.
   • Click the Build button. By default mProjector will launch your application when it's ready.

Nothing here has changes since the last version. If you are developing using Flash CS3, you will use mApplication.trace() and the Console window (on the Mac or TraceViewer on the PC) to debug your application at runtime.

mProjector functionality is only available after the SWF is compiled into an application and NOT at SWF runtime in the Flash CS3 debugger. For example, when playing as SWF in the Flash IDE calling mWindow.center() does not move the window. If autotracing is on, you will see the command trace to the Flash IDE window but nothing will happen. The method becomes effective once the SWF is compiled into an application and run.

For more information on Flash IDE and mApplication.trace() debugging see Debugging your Application.

After you install mProjector you will see a bunch of "mProjector" items in the Flash IDE "Commands" menu. To compile and run an mProjector application from inside the Flash IDE perform the following steps.

1. Tell Flash where mProjector is located by clicking the "Find mProjector" in item in the Flash Commmands menu. You will need to repeat this step when you update to a new version of mProjector. You will find mProjector here:
   Windows: C:\Program Files\ScreenTime Media\mProjector v4\mProjector.exe
   Mac: /Applications/mProjector/\ 3.1/mProjector.app
   
   
2. Select the mProjector project you want to compile -- Click the "Select Project" in item in the Flash Commmands menu and specify the mProjector project file (.mpr) to be compiled.
   If you do not have a project file for your current application, click the "Launch mProjector" in item in the Flash Commmands menu, select your settings, click mProjector's "Save As" button, close mProjector, and perform Step 2.
3. Compile and Run -- Click the "Compile and Run" in item in the Flash Commmands menu to compile and launch your application from the Flash IDE. Close mProjector before selecting this command.

If you want to take it a step further, you can assign these commands keyboard shortcuts (Files->Keyboard Shortcuts).

1. Download and install mProjector 3.1.
2. Create a new MXML application. HelloWorld
   1. In Flex Builder, select File > New> Flex Project,
      If the New Flex Project dialog box asks you to select a Flex Server Technology, select Basic, and then click Next.
      Type HelloWorld as the Project Name, and then click Finish.
      Your new project will be created and should be showing in the Navigator panel. By default the project should already contain a file named HelloWorld.mxml, and that file should be open in the Editor panel.
   2. Open the HelloWorld.mxml file, and type the following code:

      <?xml version="1.0" encoding="utf-8"?>
      <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" xmlns="*" 
          layout="vertical"
          creationComplete = "initApp()" >
          
          <mx:Script>
              <![CDATA[
                  public function initApp():void 
                  {
                      //set window title and center the application on the desktop.
                      import stm.mprojector.mWindow;
      
      
                      mWindow.setTitle("Hello mProjector");
                      mWindow.center();
                  }
              ]]>
          </mx:Script>
      
          <mx:TextArea id = "mainTxt" width="400" />        
          
      </mx:Application>
      

      To access mProjector classes and methods add an import statement stm.mprojector.mClassName then utilize the class. All mProjector classes and methods are listed in the Flash Help Panel and online in our Dev Center. In this example the initApp() function sets the window title and centers the window.
3. Select File > Save to save the application.
4. Add the mProjector Desktop Classes (SWC File) to your project's library path:
• With a project selected in the Navigator view, select Project > Properties > Flex Build Path.
  Select the Library tab.
  The core library (SWC) files, such as frameworks.swc and playerglobal.swc, appear.
• Select Add SWC.
• Enter or browse to and select the location of the SWC file. It's installed in next to mProjector.
  Windows: C:/Program Files/ScreenTime Media/mProjector v4/Flex/mProjectorAS3Flex.swc
  Mac: /Applications/mProjector 4.0b/Flex/mProjectorAS3Flex.swc
  
  
5. Set your "link-type" option to merger the SWC into the application SWF file when compiled:
• With a project selected in the Navigator view, select Project > Properties > Flex Build Path.
• Select the Library tab, and then select and expand the SWC file entry to display the SWC options.
• Double-click the Link Type option. The Library Path Items Options dialog box appears.
• Select the Merged into Code option, and click OK.
  This procedure is the equivalent of using the library-path compiler option.
6. Publish your application SWF in Flex.
7. Publish your SWF as a Desktop Application using mProjector.
• Open mProjector
• Set your SWF as the main application SWF - Select mProjector's Application tab and drag-n-drop your SWF on the mProjector.
• Set your application settings - application title, icon, window type, included files, etc.
• Set your publish settings to AS3 - Click mProjector's Publish tab and check the AS3 check box.
• Click the Build button. By default mProjector will launch your application when it's ready.

If you are developing an application using Flex, you can debug your application NATIVELY within the Flex debugger with valid mProjector return values and full desktop functionality.

The trick to debugging in Flex is to change your "launch configuration" target to be the mProjector application created from your Flex SWF instead of the standard Flex web application. Once modified, you can can run your application using the "Run" menu or run/debug buttons in the Flex Debugging workspace.

1. In the Flex Navigator view, select a project. Build your SWF.
2. Open mProjector and build your application with the project's debug SWF. If your project name is HelloWorld, your debug swf with be called "HelloWorld-debug.swf" by default.
3. Open the Create, Manage, and Run Configurations dialog box.With a project file open in the code editor, right-click (Control-click on Macintosh) to display the pop-up menu and select Run As > Run or Debug As > Debug.
   The Create, Manage, and Run Configurations dialog box appears.
   
4. Select the launch configuration to edit. A number of configurations may be listed if you have other projects in the workspace, if you've set other project files as application files, or if other Eclipse plug-ins are installed. By default, the first time you run a project, Flex Builder creates a project-specific launch configuration, which is based on the default Flex application launch configuration.
5. Click the "Main" tab, uncheck the "Use defaults" check box and enter the path to your mProjector application.
6. Add "/Contents/MacOS/mPlayer" to the end of the application path.
7. To "Run" your application from inside Flex repeat steps 2-6 with your non-debug content, in this case with a new application using HelloWorld.swf".
8. After any changes to your ActionScript, rebuild your application in mProjector and relaunch your app in the Flex Debugger.

First build your swf. Then open mProjector and build your application with the project's debug SWF.

Flex provides a mechanism for running external tools like mProjector from inside the IDE. This enables you to run mProjector as if you where running it from the UNIX command line where you call mProjector with a "-c" command line flag and a path to the mProjector project file containing your application and publish settings.

/Applications/mProjector /mProjector.app/Contents/MacOS/mProjector -c "pathToMProjectorProjectFile"

Before configuring mProjector as an external tool, create an mProjector project file for your application (.mproj) and save it next to your applciation SWF in the Flex project's bin directory.

To configure an mProjector as an executable tool in Flex:

1. Click Run > External Tools > External Tools....
2. Select the Program configuration
3. Click the New button.
4. Enter a name for your external tool (mProjector).
5. Click the Browse File System button.
6. Find mProjector and add "/Contents/MacOS/mProjector" to the end of the returned path. The full "Location" path will be something like: /Applications/mProjector 4.0/mProjector.app/Contents/MacOS/mProjector. In the Arguments field enter the commandline flag (-c) followed by the path to your mProjector project file:
   
   -c "pathToMProjectorProjectFile"
   -c "${workspace_loc:/HelloWorld/bin/HelloWorld.mproj}" -- builds HelloWorld mproj file.
   -c "${workspace_loc}/${project_name}/bin/${project_name}.mproj" -- builds application using an .mproj file in the active Flex project's bin directory.
   .
   
7. Click Run.
These steps create a persisted launch configuration. The newly created configuration will appear in the launch history under Run > External Tools and will be available in the launch configuration dialog which is opened by clicking Run > External Tools > External Tools....

It is also possible to set up and run an external tool to build a project.

1. Select the desired project.
2. From its pop-up menu choose Properties.
3. Click Builders from the list, and configure the tool as described above.