addsubmissionpanel.mxml

flex 实现的一个showcase 喜欢flex的朋友可以

<?xml version="1.0" encoding="utf-8"?>
<components:FlexDotOrgWindow
	xmlns:mx="http://www.adobe.com/2006/mxml"
	xmlns:components="com.flexShowcase.components.*"
	xmlns:remote="com.flexShowcase.net.remote.*"
	
	width="425"
	height="400"
	
	label="Add Application"
	creationComplete="creationCompleteHandler(event)">
	
	
	<mx:Script>
		<![CDATA[
		
			//////////////////////////////////////////////////
			//import
			
			import com.flexShowcase.constants.TextRestrictions;
			import com.flexShowcase.data.*;
			import com.flexShowcase.events.ProjectEvent;
			import com.flexShowcase.net.remote.parsers.*;
			import com.flexShowcase.net.remote.*;
			
			import mx.controls.Alert;
			import mx.effects.Fade;
			import mx.events.*;
			import mx.rpc.events.*;
			import mx.validators.Validator;
			
			//////////////////////////////////////////////////
			//public variables
			
			[Bindable] public var flexShowcaseServiceConfig:FlexShowcaseServiceConfig;
			[Bindable] public var user:User;
			
			//////////////////////////////////////////////////
			//private variables
			
			[Bindable] private var projectFormIsEmpty:Boolean;
			[Bindable] private var projectFormIsValid:Boolean;
			[Bindable] private var screenshotLoaded:Boolean;
			[Bindable] private var selectedFile:FileReference;
			[Bindable] private var urlRegularExpression:String;
			
			private var urlRequest:URLRequest;
			private var fileFilter:FileFilter;
			private var fileReferenceList:FileReferenceList;
			private var focussedFormControl:DisplayObject;
			private var newProject:Project;
			
			//////////////////////////////////////////////////
			//initialization
			
			private function creationCompleteHandler(event:Event):void {
				urlRegularExpression = 'http://|https://';
				
				fileFilter = new FileFilter("Image Files (*.jpeg, *.jpg)", "jpeg; *.jpg");
				fileReferenceList = new FileReferenceList();
				fileReferenceList.addEventListener(Event.SELECT, selectHandler);
				screenshotLoaded = false;
			}
			
			
			//////////////////////////////////////////////////
			//overridden public functions
			
			override public function show():void {
				super.show();
				
				urlRequest = new URLRequest(flexShowcaseServiceConfig.screenshotService);
				urlRequest.method = URLRequestMethod.POST;
				
				projectName.text = "";
				projectName.errorString = "";
				projectURL.text = "http://";
				projectURL.errorString = "";
				projectDescription.text = "";
				projectDescription.errorString = "";
				fileName.text = "";
				fileName.errorString = "";
				
				status.text = "Status: Idle";
				
				projectFormIsEmpty = true;
				screenshotLoaded = false;
				projectFormIsValid = false;
				
				focusManager.setFocus(projectName);
			}
			
			
			//////////////////////////////////////////////////
			//private functions
			
			private function validateProjectForm():void {
				projectFormIsEmpty = (projectName.text == "" && projectURL.text == "" && projectDescription.text == "" && fileName.text == "");
				
				projectFormIsValid = true;
				
				validateProject(projectNameValidator);
				validateProject(projectURLValidator);
				validateProject(projectDescriptionValidator);
				validateProject(fileNameValidator);
				
				projectFormIsValid = projectFormIsValid && screenshotLoaded;
			}
			private function validateProject(validator:Validator):Boolean {
				var validatorSource:DisplayObject = validator.source as DisplayObject;
				var suppressEvents:Boolean = (validatorSource != focussedFormControl);
				var event:ValidationResultEvent = validator.validate(null, suppressEvents);
				var currentControlIsValid:Boolean = (event.type == ValidationResultEvent.VALID);
				
				projectFormIsValid = projectFormIsValid && currentControlIsValid;
				
				return currentControlIsValid;
			}
			private function addFile(event:Event):void {
				fileReferenceList.browse(new Array(fileFilter));
			}
			private function uploadFile():void {
				urlRequest.url = flexShowcaseServiceConfig.screenshotService;
				
				var fileReference:FileReference;
				fileReference = FileReference(selectedFile);
				fileReference.addEventListener(Event.COMPLETE, uploadCompleteHandler);
				fileReference.addEventListener("uploadCompleteData", uploadDataCompleteHandler);
				fileReference.upload(urlRequest);
				
				status.text = "Status: Uploading screenshot...";
			}
			
			//////////////////////////////////////////////////
			//dispatch functions
			
			private function dispatchAddProjectEvent():void {
				var projectEvent:ProjectEvent = new ProjectEvent(ProjectEvent.ADD);
				projectEvent.project = newProject;
				
				dispatchEvent(projectEvent);
			}
			
			
			//////////////////////////////////////////////////
			//handler functions
			
			private function cancelClickHandler(mouseEvent:MouseEvent):void {
				hide();
			}
			private function hideCompleteHandler(tweenEvent:TweenEvent):void {
				visible = false;
			}
			private function closeButtonClickHandler(mouseEvent:MouseEvent):void {
				hide();
			}
			private function changeHandler(event:Event):void {
				focussedFormControl = event.target as DisplayObject;
				
				validateProjectForm();
			}
			private function selectHandler(event:Event):void {
				selectedFile = fileReferenceList.fileList[0];
				
				fileName.text = selectedFile.name;
				
				screenshotLoaded = true;
				
				validateProjectForm();
			}
			private function projectURLFocusInHandler(event:Event):void {
				projectURL.setSelection(projectURL.text.length, projectURL.text.length);
			}
			private function saveClickHandler(mouseEvent:MouseEvent):void {
				var project:Object = new Object();
				project.type = "showcase_entry";
				project.title = projectName.text;
				project.teaser = "";
				project.body = projectDescription.text;
				project.field_website = new Array({value:projectURL.text});
				project.field_video = new Array({value:""});
				project.field_client_name = new Array({value:""});
				project.field_client_url = new Array({value:""});
				project.field_client_email = new Array({value:""});
				project.field_developer_name = new Array({value:""});
				project.field_developer_url = new Array({value:""});
				project.field_developer_email = new Array({value:""});
				project.status = "0";
				project.comment = "2";
				project.sticky = "0";
				project.promote = "0";
				project.userid = user.id;
				project.name = user.username;
				project.taxonomy = new Array();
				project.files = new Array();
				
				nodeService.node.save.addEventListener(ResultEvent.RESULT, nodeSaveResultHandler);
				nodeService.node.save.addEventListener(FaultEvent.FAULT, nodeSaveFaultHandler);
				nodeService.node.save(project);
				
				status.text = "Status: Generating project...";
			}
			private function nodeSaveResultHandler(resultEvent:ResultEvent):void {
				nodeService.node.save.removeEventListener(ResultEvent.RESULT, nodeSaveResultHandler);
				nodeService.node.save.removeEventListener(FaultEvent.FAULT, nodeSaveFaultHandler);
				
				var project:Project = ProjectParser.parse(resultEvent.result, flexShowcaseServiceConfig.showcaseURL);
				
				var variables:URLVariables 	= new URLVariables();
				variables.nid = project.id;
				variables.uid = user.id;
				urlRequest.data = variables;
				
				newProject = project;
				
				uploadFile();
			}
			private function nodeSaveFaultHandler(faultEvent:FaultEvent):void {
				nodeService.node.save.removeEventListener(ResultEvent.RESULT, nodeSaveResultHandler);
				nodeService.node.save.removeEventListener(FaultEvent.FAULT, nodeSaveFaultHandler);
			}
			private function uploadCompleteHandler(event:Event):void {
				Alert.buttonHeight=31;
				Alert.show("Project successfully created", "Add submission");
			}
			private function uploadDataCompleteHandler(event:Event):void {
				status.text = "Status: Project creation complete!";
				
				hide();
				dispatchAddProjectEvent();
			}
			
		]]>
	</mx:Script>
	
	<remote:NodeService
		id="nodeService"
		flexShowcaseServiceConfig="{flexShowcaseServiceConfig}"/>
		
	<mx:StringValidator id="projectNameValidator" source="{projectName}" property="text" minLength="1" />
	<mx:RegExpValidator id="projectURLValidator" source="{projectURL}" property="text" expression="{urlRegularExpression}" noMatchError="Please enter a valid URL" />
	<mx:StringValidator id="projectDescriptionValidator" source="{projectDescription}" property="text" minLength="1" />
	<mx:StringValidator id="fileNameValidator" source="{fileName}" property="text" minLength="1" />
	
	<mx:VBox height="100%" width="100%">
		<mx:HBox width="100%" >
			<mx:HBox width="55" horizontalAlign="right">
				<mx:Label text="Name" styleName="flexDarkLabel"/>
			</mx:HBox>
			<mx:HBox width="100%">
				<mx:TextInput id="projectName" maxChars="{TextRestrictions.SMALL}" 
					styleName="flexDarkTextBox" width="100%" change="changeHandler(event)"/>
				<mx:Image source="@Embed('/assets/images/form_requiredStarDark.png')"/>
			</mx:HBox>
		</mx:HBox>
		<mx:HBox width="100%">
			<mx:HBox width="55" horizontalAlign="right">
				<mx:Label text="URL" styleName="flexDarkLabel"/>
			</mx:HBox>
			<mx:HBox width="100%">
				<mx:TextInput id="projectURL" focusIn="projectURLFocusInHandler(event)" 
					maxChars="{TextRestrictions.SMALL}" styleName="flexDarkTextBox" width="100%" 
					change="changeHandler(event)" />
				<mx:Image source="@Embed('/assets/images/form_requiredStarDark.png')"/>
			</mx:HBox>
		</mx:HBox>
		
		<mx:HBox width="100%">
			<mx:HBox width="55" horizontalAlign="right">
				<mx:Label text="Description" styleName="flexDarkLabel"/>
			</mx:HBox>
			<mx:VBox width="100%">
				<mx:HBox width="100%">
					<mx:TextArea id="projectDescription" maxChars="{TextRestrictions.LARGE}" 
						styleName="flexDarkTextBox" width="100%" height="66"  
						change="changeHandler(event)" />
					<mx:Image source="@Embed('/assets/images/form_requiredStarDark.png')"/>
				</mx:HBox>
				<mx:HBox width="100%">
					<mx:Text text="To ensure your screenshots look their best, make sure their width/height ratio is 4:3. Maximum dimensions are 1280x1280 and maximum file size is 3MB." 
						styleName="flexDarkLabel" width="100%"/>
					<mx:Spacer width="10"/>
				</mx:HBox>
			</mx:VBox>
		</mx:HBox>
		
		<mx:HBox width="100%">
			<mx:HBox width="55" horizontalAlign="right">
				<mx:Label text="Screenshot" styleName="flexDarkLabel"/>
			</mx:HBox>
			<mx:VBox width="100%">
				<mx:HBox width="100%">
					<mx:TextInput id="fileName" maxChars="{TextRestrictions.SMALL}" 
						styleName="flexDarkTextBox" width="100%"/>
					<mx:Image source="@Embed('/assets/images/form_requiredStarDark.png')"/>
				</mx:HBox>
				<mx:HBox width="100%">
					<mx:HBox width="100%" horizontalAlign="left">
						<mx:Button styleName="blackButton" label="Browse" buttonMode="true" 
						click="addFile(event);" width="90"/>
					</mx:HBox>
					<mx:HBox width="100%" horizontalAlign="right">
						<mx:Text id="status" text="Status: Idle" styleName="flexDarkLabel" />
						<mx:Spacer width="5"/>
					</mx:HBox>
				</mx:HBox>
			</mx:VBox>
		</mx:HBox>
		
		<mx:HBox bottom="40" horizontalAlign="center" width="100%" paddingTop="17">
			<mx:Spacer width="0"/>
			<mx:Button styleName="blackButton" label="Save" width="90"
				enabled="{projectFormIsValid}" buttonMode="{projectFormIsValid}" 
				click="saveClickHandler(event);" />
			<mx:Button styleName="blackButton" label="Cancel" width="90"
				buttonMode="true" click="cancelClickHandler(event);" />
		</mx:HBox>
	</mx:VBox>
	
</components:FlexDotOrgWindow>