Ok. So after
bildrCode is in alpha. I know, I know. It’s probably a lot to think about. You have been reading about this for such a long time, and it felt like it would never happen, but it’s true.
So… Without further ado, Lets see a video!
What’s been going on in the world of Adam as of late?
Well you saw a few days ago that I posted an early stage of the bildrCode front end, but I didnt really give you much info on that. I have actually made a good deal of enhancements on this since just a few days ago.
This front end is the part most users will actually use and see when they encounter bildrCode. This is the client end, the part that makes the code so available, and easy to find. This front end is a portal to the real bildrCode that can be embedded anywhere. This portal as seen in my last post was inserted with just a single line. That single line automatically builds this into the site where users can see and copy the code from a project. (as well as download the project if the user was logged in) – These will be placed in the wiki to correspond with the sensor (or other electronic part).
This portal was actually ended up being dumber than I ever thought it would be. As in… when I tried to make this before, it ended badly because I was trying to make it too complex. I wanted the system to only grab what the user needed at that time. But for many reasons, it wasn’t going to work as I would like. So this now actually takes all the code from all the modules in a project and places them together on a list. So if you select a file, it just scrolls to that file.
The addition of code highlighting (changing the color of the code text to match its function) actually takes a long time to render, and some of the portals where taking upwards of 10sec to render every time the page was loaded. This was obviously not ok, so the system actually creates a cache file the first time it is rendered, and is now under a third of a second to render the same thing.
But this gets bilder one step closer to being able to launch later this month (cross my fingers)
A part of bildrCode has been opened up and made available as open source. The code I wrote to allow of tab indents can now be found/ downloaded in the mootools forge. My mooTools class called mooIndent will hopfully come in handy for anyone needing this kind of functionality in your site.
Putting this up on github (required to use the mootools forge) was sadly hard. There is just too much special knowledge needed to make it work correctly. But after 2 weeks (just poking at it here and there) it’s there and ready for you to use. (i know, i know… it kinda specialized)
Any spare moment I get, I have been trying to finish up the bildrCode beta, but as I get closer, I seem to slow down. The last 10% takes 50% of the time right?
One of the major things I did was not even on my list of things needing to be done. Someone finally wrote a good article on mod-rewrites, and I had to take advantage. For those of you who don’t know…
When you go to http://www.adam-meyer.com/blog/ you are going to my site, and requesting the folder called blog. If you went to blog/this/that, you are going to a folder called that, who is in a folder called this, who is the blog folder. And so on.
Well this Rewrite thing changes all of that. You can have adam.com/400 actually go to adam.com/includes/files/api/index.php?fileId=400. So I took this idea and made the bildr code URLs much nicer. Before you would download a file and it would be like code.bildr.org/includes/php/download.php?id=82 . But now is actually code.bildr.org/82.zip . I made a rule that when you see the .zip extension, that the person actually wants “/includes/php/download.php”. This is also good, because now hovering over the link, the person knows they are about to download a zip file. I did the same for the dynamic java script files used to embed the bildrCode into the wiki articles. code.bildr.org/includes/php/render.php?id=795 is now code.bildr.org/795.js . I actually went a little nuts on the last one and actually made the page output a legit javascript file where before it thought it was html.
I also cleaned up/ rearranged the site a bit. Added some icons. Oh icons, what a pain you are, and how I wish I had a graphic designer to work with. All mine seem to be shots in the dark until I hot something. New is the ability to commit your session and comment on it. This is a change from before where you your session was committed automatically. I think this change makes it a little more like SVN.
So speaking of Icons, here are some boxes I was working with. Feel free to use them if you can. There is a PDF link below.
My favorite blog right now is by David Walsh. A post David made a few days back was about a writer making a cool function to restyle drop down menus, and he took it and made a Mootools class of it. I was inspired and took something I made for bildrCode and turned it into my first Mootools class. What I made is an OSX like drop down box that works as a confirmation. The class allows the user to set a function to fire when the user clicks on cancel or confirm, and even determine the text for each button as well as add custom html to the box itself (here seen with an input box).
Works really well.
At work? Im working on something really cool, but Im not sure I can share yet. I can say that Adobe Air is really cool.
So bildrCode is getting closer to being done. I have a list of things that I need to fix/ make happen before it is ready to go, and it is getting shorter by the day.
Since last write, you can add files and folders properly. There is a confirmation box for deleting a file, and file history is back working (I had killed it implementing the session way of working).
I think I am actually at a place now that I could actually start on the bildr video (showcasing the idea) but I gave my self till the end of July to finish it, so im going to see if I can before I start the video.
I have been thinking a lot about how I will explain the code part, and I think I have some good ideas for some visuals that will really explain everything that is going on and why it is better for what we are doing than using the plain wiki site, or even something as awesome and powerful as github.
On a quick side note, I have started working again in ActionScript again. This time for work. I love how whenever I do things in flash/ActionScript they are never for the web. (please do us all a favor, and don’t use flash to build entire sites).
Im often wondering how you go about doing things properly though. If I need to know the highest value in an array without resorting it is there a better way than making a copy of it, sorting the copy and returning it? What about finding if a value is in an array? Must I loop through it?
I guess I just have a human fear of loops (in that I think of computers as being too human). I always neglect to think of how powerful computers are, and hate looping through 500 values because I always assume that it is just too much work for them.
I made some more Icons for whoever wants them (no credit needed). I was doing something that needed some small file icons so I whipped these out. (size shown is at 200%)
So I got something else working I had been banking on. The sudo-API for bildrCode is working now. I even wrote a plugin for the bildr wiki that easily allows users to add the code to an article (the entire point). So as of now, all that happens is you request a file with the ID of the project you want, and it spits back javascript who then places the code on the page in a nice clean box with tools and a drop down to select the language. The code is even highlighted and inserts it’s own css along with it.
I got this idea from github who does this nearly the same way. It’s a little funny because I could actually use this to display code on any site. I will have to figure out how to stop that from happening.
So if all goes according to plan I will have bildrCode in beta version by the end of the month. After that I will be constructing a video to go along with the site that will help show my vision for the site and hopefully get people excited enough about the project that they will want to help out.
The next step after bildrCode will be to build a javascript schematic editor (yeah right). But if it could happen, it would be truly awesome. Imagine building schematics in a collaborative manner!
So something I have been putting off I managed to hack together yesterday, but it works. That is the ability to download code from the bildeCode. On any project module or session of code you can just hit the download button, and download a zip file of all the code in the proper files. This may sound like something rather simple, and it may be to some. But the interesting thing is that there are no real files on bildrCode, so how do you zip them. When you click the download button, the server grabs everyting needed out of the database and creates actual files and folders out of them (in a random named secret file for security (see below)), then zips it all together, deletes the files and folders and downloads the zip to your computer. To the user it is just like they clicked on a link to a zip file.
The security thing is like this. I was thinking how dangerous this could be . You can write any code you want on bildrCode, and pressing this button makes them actual files. That means a user could write malicious code, press download to make it real, navigate to the file, therefore executing them live on the server, and hacking us in 2 seconds flat. Im hoping that by doing all of this in a randomly named temp folder, and deleting it as soon as the zip is done will take care of this. But I think I have a lot more security to work on.
Anyways, I have been looking at letter pressing a lot lately, and I have been working on a latter pressed look in photoshop for some icons etc. I was making this nice one for the download button, but didn’t use it. I think it came out great, so I tried (to some success) to make a few others. But I offer them to you for use in what ever you want. You don’t even have to give credit.
It’s only been a few days, but I think I have gotten a lot done with bildr Code.
But first. Work has been good. A lot better now with the commute being manageable. I have had a few hours every night now to work which keeps me happy. I have been doing some web work and I am getting ready to start design on some software. I actually can’t talk too much about that so I won’t.
So bildr Code right?
Well Im about 80% there. Right now it works. Completely non destructive editing. In fact this is what happens. You go to the site and edit something. As soon as you change anything, the site creates a complete copy and slips it in (user never knows) so that you are working on a completely isolated version. So you can delete/ add files, rename things (soon to be able to move things around) all without changing a thing on all the other versions. Even if two people are editing at the same time, they are working in their own environments and will not affect each other.
This is needed because when programming, what you do in one file is often dependent on changes you made to a second or third file. So if you add dependency on a new file, someone else can’t accidently ruin that. It also means that anyone trying to ruin the program, can’t do much damage.
The only issue I have right now, is that they system seems incredibly wasteful (database wise) and I can’t figure out how to resolve that. I guess that will have to wait for version 1.0. This is after all a usable proof-of-concept. AKA a beta.
Time to get ready for work.
First of all I want to add something I forgot from my previous entry, and I fell a little bad about it. The look of the bildr code site is completely ripped from on of my favorite applications called Espresso by MacRabbit. While it works pretty differently and does have some different things, (and other than it dealing with code is completely different) I just wanted to note that. The look will change to not be such a ripoff I just wanted something that felt application-ish so I wouldnt figit with the looks too much.
So it’s been a week right? Id like to say I have made a ton of improvement on bildr code, but it’s actually in a much regressed state right now. How does that happen? I rethought the fundamental workings of how users will collaborate.
So how it was: You click on the file, and you edit and save it. It saves this new version, and anyone can see the history of that file.
But here is the problem. What if someone deletes a file and adds an other. What if that user also changes a file to require the presence of the new file? All these things that this user has done where previously saved as individual changes, when in reality it was really just one big edit.
Tha’t how it works now. When a user makes any changes, the system starts a new session, that is completely different from all other users. It tracks all the changes that the user does and saves it as one big change. (Though individual files still retain all their history).
This way you can quickly flip through changes made by a user as they saw fit. So now, when going back, you will see the files appear that they worked with (if deleted), the names they were during that session, folders where they were etc.
But this actually ended up being a HUGE pain and required several days to even figure out how I could make this happen.
I even made this chart to try to get help on it (that didnt work, but helped me)
Im sure there is ton better way to do what Im doing, but for now, I just want a proof of concept so we can improve on it.
But that’s that for bildr code.
I did start a new job last week. The job and people are really great, but the commute (2hr each way) is awful. So im going to start driving tomorrow to see if that makes it all better. (currently I have to wake up at 5:30 and dont get home until after 7). Driving will allow me to wake up at 7:30.
