Now that I’ve become more familiar with the MSDN Library I’ve decided to compile all the major functions for the JavaScript reference into one easy reference point with links branching out to the MSDN library. The MSDN library is amazing but can be rough to navigate and find what you really want fast.

Hope others find this cheat sheet useful.

If you have anything to add, feel free to leave a comment.

One of my current projects I am working on is an educational game aimed at teaching the concepts of Mendelian Genetics to students.

What I’ve been working on for the last few days is optimizing the game for the web and iPad deployment.

My first shot at optimizations is making the game load up faster.

Comparing Processing.js to Native JAVA Processing on my PC I found the following results and they were surprising!

While the speed results for different pieces of code were different between browsers one thing was clear that the overall total time to complete running the setup() function was fastest in the browser in all cases except for IE9 and Safari on Windows 7. For individual test results only once was one piece of code faster in the JAVA environment compared to the browser.

Test System: Intel core i7, 12gb ram, Windows 7.

The green boxes show the fastest time for that section, when a time was within 1ms I have called it close enough to be a tie. I ran each test 5 times per browser and averaged the results to make sure there were no one offs.

Running the setup() loop to initialize the game

I’m sure I will be able to further optimize it in the next few days to be even faster this is just an initial observation. Now that I know whats slow I can work on some async loading or deferred loading. Or just better code.

Windows Server 2008 R2 on Macbook Pro 2011

Sounds simple enough right? The thing is my only laptop is from 2007 and has no video driver for 64bit server so I cant attach it to a projector. Otherwise I could use my old dell laptop. So what I am working on is installing Windows Server 2008 on a core i7 Macbook Pro with 8gb of ram

I started off thinking I could just use boot camp assistant to install Windows 7 and then put Server 2008 inside a VM on Windows 7 with Virtual Box but the problem with that is I have to cover a lecture in one of the weeks on Hyper-V. Hyper-V is Windows Server’s virtualization hypervisor technology. You cannot install Hyper-V inside a VM environment and have a scenario where you have a VM inside a VM inside a host.

So my only option is to install Windows Server 2008 R2 as the main host and dual boot OSX Lion with it.

So to begin you’ll need to have a few things up front.

• Windows Server 2008 R2 DVD
• A USB with about 2GB of free space formatted as FAT32 not NTFS for storing boot camp support files
• At least 60GB or more of free space on the HDD, I set aside 200GB (of 500GB total) because I may install Win 7 VM’s that can take 30GB+ each.

Steps involved:

1. I started out by running the boot camp assistant in OSX. The boot camp assistant lets you download the Windows drivers for the Mac and stick them on a USB for later. It also helps you partition the HDD for Win7.
2. Once you have a partition ready you’ll reboot and do a normal install of server by booting from the DVD. you’ll have to format the BOOTCAMP partition as NTFS for server. Make sure you dont format the wrong partition or you’ll could wipe out your OSX partition.
3. Once the install finishes you’ll notice that there is a lot of devices that wont work. You can start by installing all the boot camp drivers on that USB from earlier that boot camp assistant created for you. WARNING: if you do not install boot camp drivers before rebooting you will not be able to press ctrl+alt+del to login to server because the option key is not remapped to alt until you install the bootcamp drivers. You can get around this problem by plugging in a USB keyboard to be able to press ctrl+alt+del.
4. This will leave you with about 3-4 things still not working. Wireless, Video, Bluetooth, and sound will all not be working.
5. Windows 7 and Windows Server 2008 R2 were developed in parallel and most windows 7 drivers will work ok in server 2008 R2 just fine. This is mostly the case for everything but video and bluetooth.
6. The Macbook Pro I have has an Intel HD Graphics 3000 video adapter, and an AMD Radeon HD 6490M graphics card, bootcamp tried to install Nvidia drivers for my video from the USB.
7. Windows Server 2008 R2 installs as a bare-bones OS with almost everything turned off. This includes wireless and sound. You will need to add the ‘Wireless LAN Service’ feature in Server Manager to enable wireless networking.
   

   Enable 'Wireless LAN Service'

8. Sound can be enabled by trying to go into sound properties in control panel. You will get a popup saying the windows audio service is not enabled, do you want to enable it? click yes and your sound should start working and be adjustable by the mac volume keys.
   

   Enable Windows Audio Service

9. I started searching the web for discussions about getting the audio working and came across a good post about catalyst not detecting the hardware but the drivers still being able to be installed manually.
10. I was able to find two different versions of drivers one from ati.com and one from guru3d.com. I installed the one from Guru3D as it was 11.10 instead of 11.9 and it worked but once i enabled Hyper-V I started getting tons of blue screen errors revolving around atikmpag.sys.  When I did some searching I found out that when installing Hyper-V before SP1 on 2008 with Sandy Bridge chipset it can cause BSOD on video errors. And more specifically the AVX feature on Sandy Bridge chips was the cause. A hotfix is available here but I just installed SP1 instead. I ended up uninstalling the video drivers temporarily. If you find yourself getting blue screens boot into safe mode menu with f5 then press f8 for more options and choose last known good configuration and you should be able to boot up and uninstall the video drivers.
11. If the video drivers are not installed you can probably safely installed the Hyper-V role now.
12. Do all the Windows Updates now there will be probably about 120 of them in waves because some require others to be installed first. SP1 will show up in Windows Update after about 4 sets of updates. If Hyper-V throws an error saying can’t initialize a VM when trying to start it and the event log shows error 3040 its related to the SP1 fix and Sandy Bridge chipset most likely.

Enjoy.

Below is a step by step guide to setup VirtualBox with the Fedora Live ISO on Windows 7.

Step 1: Download Fedora live cd ISO at:
http://fedoraproject.org/en/download-splash?file=http://download.fedoraproject.org/pub/fedora/linux/releases/16/Live/x86_64/Fedora-16-x86_64-Live-Desktop.iso

Step 2: Install virtual box. (Seneca lab computers already have it included in the image).

Step 3: Run Oracle VM VirtualBox Manager.

VirtualBox Manager

Step 4: Click New to create a new Virtual Machine using the Fedora ISO you downloaded.

Step 5: Click Next on the Create New Virtual Machine wizard window

Step 6: Setup OS

Step 6: Give the VM a Name you can recognize easily like “Fedora Live”, Choose “Linux” from the Operating System list and “Fedora (64 bit)” from the Version list.

Step 7: Allocate RAM for VM

Step 7: Set the memory to the amount of RAM you want to allocate to the VM. The default of 768mb is fine for most needs. Make sure this amount is less than the host machines total ram  minus 2GB to leave 2GB for windows 7 minimum.

Step 8: Create new hard disk

Step 8: Use defaults for Virtual Hard Disk at 8GB space and “create a new hard disk” options, click next.

Step 9: Select VDI option

Step 9: Use defaults for File type of the “virtual disk with VDI”, click next.

Step 10: Dynamically allocated HDD size

Step 10: Use defaults for “Dynamically allocated disk size”, click next.

Step 11: VM file size and location

Step 11: For Virtual disk file location and size you might want to have students put their VDI file on a USB so they can save it and reuse it in other sessions by remounting it. If they are just using it for one session and throwing away the VM each class session and recreating it then the default settings are fine.

Step 12: Press create to create the VM.

Step 13: Start up the VM for the first time

Step 13: Click on the new VM and press start to start it up the first time.

Step 14: Press next to begin, then select the ISO file for Fedora that you downloaded earlier. Press next.

Step 15: Click start to start up the VM.

Running the VM

Notes about using the VM:

When you click inside the VM sometimes the VM hijacks the mouse cursor to the window and wont let it move outside the window. To release it the default key is RIGHT CTRL.

you can map a CD or USB drive from the host machine to the fedora VM so you can access files from the local hosts CD, USB, DVD, or HDD even.

The VM will use whatever amount of RAM you allocated it in the setup from the host. If you set it to use 3GB and the host only has 4GB only 1gb would remain for windows which may cause slow downs or virtual box may not let you start the VM at all if the memory amount is to high that it would starve the host machine.

To close the VM you exit it the same way you would if the OS was running normally with Shutdown from the top right menu. the VM will shutdown and close its window automatically.

You can run the VM in fullscreen mode and it will operate similar to how a remote desktop session would work in windows with a small popup tab at the bottom center of the screen to switch back to windowed mode or close the VM window.

I’ve been at this all day and I have been getting errors along the lines of “Error: Object expected” thrown at me from Dynamics when testing on the form.

It turns out the website I was using an example from used the quote characters “ ” instead of ” “.

It took me close to 4 hours to figure out why my ENTIRE SCRIPT LIBRARY was broken because of this when I was following some online examples exactly.

Yes that’s right my entire script library broke because one function had improper quotes and therefor a field object wasn’t being returned even though the function wasn’t being called it broke every other function in the library.

So word to the wise if you get an Error: Object expected in Dynamics CRM2011 check the following things:

1. Is your field name spelled EXACTLY right including case? my_fieldname is not the same as my_FieldName
2. Are there any spaces added by mistake in the name?
3. Are you using the entity field name or the display name? entity name is correct EX: new_mycustomfield not “My Custom Field Label”
4. Reduce down your JScript library and check for missing semi colons or other functions that may be broken to isolate the proper broken function it may not be where you think it is.
5. Finally did you copy paste an example from another website? if so check the quotes to make sure they are the proper double quote character it should be ” “ not “ ”

EX: Xrm.Page.getAttribute("new_mycustomfield"); not Xrm.Page.getAttribute(“new_mycustomfield”);

As a side note always remember to add code to the onSave event handler for the form as well as the onChange handler for a field if you are using read only fields you need to forceSubmit those values to save them.

EX: Xrm.Page.getAttribute("new_mycustomfield").setSubmitMode("always");

The presentation covered our development story. It covered what our industry partner does and why they wanted to change from Flash to Processing.js, our development story, and a demo of the game in its beta state.

I created the presentation using the deck.js library which allows you to create slide show presentations in a web browser using HTML and JavaScript. What’s cool about this is that it allows you to do things like put a HTML 5 canvas, audio, or video element in your slide.

With this library I was able to have a live demo of the game in a slide or embed other HTML 5 content.

Here is the video of our talk.

This game is designed to help teach the basics of Mendelian Genetics to high school aged students and above.  The concept is to collect and breed different dragons and learn how the genetics of it all works because the offspring are created based on the genetics of the parents.

One of the challenges I ran into when building this game was figuring out a way to handle all the different combinations of dragons.  The dragons have 9 genetic traits that differentiate them from one another and each trait has two or three different phenotypes associated with it.  The end result is there are 2592 different dragons that can be created and collected in the game.

These dragons were being dynamically built from a combination of 27 smaller images and then blended together, colorized, and then had patterns applied to them.  In the native Processing JAVA environment this process took only about 100 milliseconds to build each dragon.  But in the Processing.js environment this process took 700ms on Chrome, 1000ms on Firefox, 2500ms on IE9, and a whopping 4500ms on Safari.

This created a lot of problems, such as slow script warnings, when there were more than 4-5 dragons to build on game load.

To solve this problem I created a sketch in Processing to dynamically build every combination of dragon and call save() on it from a PGraphic to save out an image for every dragon in the game.  Now with an automated build process I can quickly (roughly 5 minutes) generate all 2600 dragons into images and load them up with loadImage() or requestImage() in Processing.js significantly improving the load times when starting the game.

As a side challenge to this sketch to generate all the images I added some code to build a massive collage to stick in a copy of every dragon in the game in a giant PGraphics image.

PGraphics massiveImage = createGraphics(27648,24576,JAVA2D);

Immediately I had problems with this with not enough memory being able to be allocated to the JRE. Because java runs in a 32 bit environment for the PDE I could only allocate about 1600mb of ram to the environment. This meant I would have to create eight separate images and then composite them later in Photoshop unfortunately.  I was still able to do it though and through some crafty code I was able to make eight images that were 6144×13824 in size and then patch them together into a giant 680 megapixel composite image showing all 2592 dragons at 512×512 resolution.

reduced size collage of all 2592 dragons Generated with Processing

Compositing the image in Photoshop took 11 GB of ram, 679477248 pixels, and created a 60MB PNG image file in the end.

If I had been able to allocate 4-5GB of RAM to the PDE I think I could have generated the entire image in one shot and I would have liked to have been able to add a sitting and flying image of each dragon bumping up the resolution to 1.35Gigapixels in total.

For those who aren’t familiar with Dropbox it is a service that allows you to store 2GB of files in the cloud on Amazon’s S3 service for free. It also has Windows and Mac clients that sync files from a special folder on your hard drive to the cloud. The service is super simple to use and the integration with a local folder on your PC makes it extremely easy to work from multiple locations or computers with the same set of files because you can sync your files to multiple computers or with multiple Dropbox users by sharing folders.

When you combine this with the power of GitHub and a web server you can create a system that allows you to develop a web project, have it hosted from that folder on the web, and sync all the files between multiple machines as well as check in files to a managed repository cloud for others to work as well.

I can work from home and all my files are automatically synced from work, when I change a file at home it automatically syncs the file to the web server for me and because IIS points to the synced folder to serve to the web it means as I develop remotely my web server is always up to date within a few seconds of saving a file and the website is updated as well.

Recently though we had a power failure at Seneca and something caused IIS to throw permission errors when linking a virtual directory to the Dropbox folder containing my website.

It turned out I had to add the ‘Authenticated Users’ to the list of authorized accounts that can access the folder. I am also using Basic Authentication for password protection on the website for a quick and easy way to block anonymous access to the website.

The basic steps for creating a password protected development website that you can sync all your files between machines goes like this:

1. Install Dropbox on all computers you will be working from including your host web server.
2. Setup your website folder but do not share this folder with other people to modify. This is bad practice you don’t want others changing files on your website from a folder on their computer. Use a source control repository like Github to manage code.
3. Install IIS on your host machine.
4. Verify the port your using to host websites is open (usually port 80) on your network.
5. Create a user for people who will be accessing the website remotely on the host web server.
6. Create a virtual directory in the default website and set the alias to whatever name you want your users to access like mydevsite which will be accessed by myserveripordomainurl/mydevsite.
7. Set the physical path to point to your Dropbox folder.
8. Click on ‘Connect As…’ and check ‘specific User’, then enter a user that has permissions to access this folder and their password.
9. Click ‘Test Settings…’ and verify both checks pass ok.
10. If you have a domain name point it to your server ip or create a CNAME record that points to your IIS server ip to make a friendly url for those accessing your website.
11. In IIS manager, select your virtual directory and pick ‘Authentication’. Disable Anonymous Authentication and enable Basic Authentication.
12. Ideally you should Enable SSL and use HTTPS and also use a better authentication method than Basic Authentication but that is beyond the scope of this checklist.

Now that I’ve graduated I’ve taken a position with the Office of Research and Innovation at Seneca in the Center for Development of Open Source Technology for the next year working on some projects with industry partners.

Some of them will use Processing.js in part and others will be other technologies. At this point that’s about all I can say though.

One of the things thats been holding me back from blogging besides limited time availability has been the fact that I’m waiting on one last grade to officially _officially_ be able to state that I am graduating.

Part of the reason for this was a final project I have been working on for a professor that includes two processing sketches for use with his course website to help teach game programming students the basics of vectors and matricies. Specifically how vector notation works and what the notation means visually.  The sketch shows how a vectors coordinates change. As you move the head of the vector around it updates the vector notation in realtime and shows the angle of theta. The second sketch is a matrix multiplication calculator that lets the user type in values for two 4×4 matricies and then press the calculate button to see the result of multiplying them together.

I used standard HTML input boxes and then with JavaScript and Processing.js I take the numbers and multiply them out and show the result in a matrix on a canvas.  Sure I could have done it in pure JS and made it simple but I wanted to make use of Processing.js and the canvas element so that I can add more functionality in the future that shows an animation of how the math works to get the result for each piece of the matrix.

This week I continue work on a few projects here at CDOT. One being a game using Processing.js and another being a dashboard app that will show status of the projects going on at CDOT.

So I pickup a Netgear ReadyNAS NV+ from Canada Computers on boxing day and it was the best purchase I’ve made in a long time.

It is so much more than a file server with RAID.

• iTunes streaming media server
• DLNA streaming media server
• Squeezebox streaming service
• Bit Torrent web client
• FTP server
• CIFS/SMB/NFS/AFP file sharing (WIN/MAC/XNIX)
• HTTPS web admin like a router
• Remote access from the internet
• SSH remote access capabilities

And most of this can also be port forwarded from your router so you can access it anywhere on the internet. Add a subdomain DNS record and you have a friendly URL to connect to it all too!

So tonight I spent a few hours setting up the Firefly open source media server that it comes with which allows you to stream music from the NAS to iTunes as a share and selectively play any songs you want as if the music was stored locally.

Sure you can say oh I could just connect iTunes to a shared folder on another computer and do the same and yes you could but can you build a computer with RAID5 and 4TB of space for under $500? You’ll spend $300 on the HDD’s alone.

So after I got the iTunes server up and running I started thinking how can I stream to my iPhone now and also I wonder if the apple remote app will work to control my iTunes server now.

The answer was yes to both!

You can grab the Apple Remote app from the app store and connect to your wifi network and authorize your iPhone/iPad/iPod to control iTunes on your PC.  You can then access the iTunes streaming server and have full control over iTunes. You could build a HTPC and connect it up to a home theater and then have wireless control of your music from iPhone with all your media redundantly stored or just store it on the HTPC as well.

Apps

iTunes Server

iTunes Server Playlist

8Player browser

8Player movie selection

MLPlayer lite browser

District9 in HD streaming (MLPlayer)

Subtitles supported while streaming from DLNA

Update Jan 7 2012: I’m now using 8Player on iPhone and iPad. Best app purchase I’ve ever made on the app store. In 8Player the server URL you will want to specify is http://youripordnsname:8200/rootDesc.xml. Default port for the service is 8200, but you could map it with your router to any external port to 8200 internal if your router is more sophisticated.