If you asked me to evaluate my knowledge of Flex / ActionScript I am not sure what I would say. I don't use them enough to
say either way but I think at this point I understand programming enough to get around any language.
RocketFM is my file manager application that I started a couple months ago and has
turned into a great project. I found a strange bug and It was nothing I have seen before so I was not quite sure where to begin.
First let's take a look at the issue and then we can walk through the path to the answer.
If you take a look at the video below you can see the bug. When you open a folder pay attention to the number and then
watch as I scroll all the way down and then all the way back up. When you get back to the top the wrong folder is open / selected.
Someone emailed me about porting my RocketFM application over to another language such as Java/Groovy. I am unable to locate that email so please contact me if you are reading this. Thinking about that brought up some interesting questions for me that I would love some thoughts on. Right now I just have a single project that is hosted over at RIAForge. How can I create a new project based off of this. While most of the changes are back end I think there needs to be a few changes in a couple places and I am not quite sure how to make these changes available to others. Do I treat it as a totally new project? Any ideas would be great, thanks!
Today I thought I would walk you through 2 features I pushed into the repository last night. The first is the ability to download an entire directory by right clicking on it. The other was a naming issue with the zip file download so we are going to change how that works.
We will start with the ability to download an entire directory. Right now if you clicked on a directory and selected every single file in the directory you are essentially downloading that directory. The selected files are passed to a download method and if its more than one we pass an array of file paths to our download zip method. What we want to do is add a right clicking menu to our tree to download directory menu item. To do that we are going to update our Tree Item Renderer (com.rocketfm.customTreeItemRenderer). The only addition is the new download menu item and when its clicked we are going to dispatch a custom event named download directory that will pass the data for that tree item with it.
Working through some bugs and upgrades to my RocketFM application I came across a pretty inter sting problem. I was trying to rename a directory from dan to DAN. It is the same directory but the file sytem is case sensitive so this should work right? Wrong! If you try and do this using cfdirectory you will get the following error.
The specified newdirectory attribute value is invalid.
c:\DAN already exists and cannot be overwritten. The exception occurred during a cfdirectory action="rename".
This is because of the fact that ColdFusion does not care about case. This was a bummer for me because users in the end will come back with I am unable to rename this directory and explaining the nature of case sensitivity is not really an answer. Lucky for me I always have a beast in the bullpen (Java) so this should be a pretty easy fix. This is the old rename directory method in my File manager component.
To make sure we allow for case sensitive changes we can simply change our code to the following.
This will be the last post in this series. While I will continue to add features to this project and share the details with you, I wanted to find a clear line where I could close this series. The last feature is probably the most important. What good is a file manager if you can't upload new files. This post will cover the upload component.
First we are going to create a new file components/RocketUploader. The component we are creating is going to be based on a Title Window because we are going to launch the uploader as a popup from our application. The layout of the component is pretty simple. I know we talked about layouts at the beginning of this series and I am doing the exact opposite of what I preached but I just like the look and feel of the panel component here. In the panel we have some buttons, a data grid to display the files and progress bar to show file upload progress.
Here is quick little tip that I thought I would share with you. Someone pointed out to me that there is no process to confirm with the user while deleting a file. This is always a good idea before deleting a file from the file system.
To do this we can use the built in alert class but lets take a look at how its different from what your probably used to in the world of html/js. When the user clicks on the delete file icon the deleteFiles method is triggered. This is the method where we were deleting the files before. We are going to move that out of there and use the static Alert class to popup a little dialog box. The 3rd parameter in the Alert.show method is what buttons to display. If we use the OR operator we can add multiple buttons to the alert box. Next we add an event listener to call a method when either of the buttons are clicked.
When the onConfirmDelete method is called our event.detail property will return the integer of the button that was pressed. If you take a look at the Alert class you will see that each button is a static const represented by an integer. So we you can check to see if event.detail is equal to Alert.YES and that will tell us if the yes button was pressed.
Nothing fancy but I was not aware of how to do this before tonight so hopefully someone else will learn something.
A couple of readers were kind enough to whip up a some icons so I could get rid of those buttons on the lower left side. I want to walk through how you can add these to the application. We want to always think ahead so knowing that I might get other submissions we should break it up in a way that we can easily switch between icons.
Since we are going to have multiple submissions I am going to create a new folder under assets/images for each submission. Our first submission came from Rob Parkhill so I am going to create a robp folder. You could simply create all of the buttons and set the different states inline.
Today we are going to walk through a pretty cool feature of our application. I want to add drag and drop support from the grid to the tree. If I am in one folder I want to be able to copy/move multiple files to another folder.
The first step is to add drag support to the grid. We want to enable both the drag enabled and drag move enabled properties.
I just thought I would throw this out there to see If anyone would be willing to help. As you know the project we have been walking through (RocketFM) needs a little more help on the UI side. If you take a look at the screen shot below its coming along nicely but I think its missing a couple of important elements.
First we really need to come up with a logo that we can use in place of the text. We can build some logic to so that if the file is not there to display the text in its place. Finally I really think the button on the bottom right stink. We should probably have some buttons along the top right aligned for download/upload/delete/about. The problem is I am not sure if we should use regular icons or come up with buttons that have a nice over/disable/click states. Any help would be greatly appreciated.
Working through the Rocket FM series I said I would come back and explain this a little further so here we are. First lets take a look at the problem and then we can take a look at the solution.
If we take a look at a dump of our directories object as the tree is loaded (base directories) we can get a visual of what the structure is. What If I said to you please give me the object where the path is C:\dan\css. If you knew that this was the only level to search through you could easily do a loop looking at each path property. If I said to you though there could be 100 levels that you would have to search though. You still might say that you could start doing recursive loops. This gets to be a tedious process and we really need a better way to do this.
