Flexbox bug Rotating Device with iOS Keyboard Up

Just discovered this bug today. It involves flexbox not rendering correctly when the user has the iOS keyboard up (they have focus on a text input or editable div) and then rotate the device. Here is a screenshot of what I am talking about.

flex box rendering issues

I am not sure where it comes from or how it is caused, but I do know how to fix it. Playing around in debug mode when you reset the window’s scroll:

?View Code JAVASCRIPT
1
window.scrollTo(0,0)

flexbox snapped correctly into position.  Combining this with iOS’s orientation change event from the window:

?View Code JAVASCRIPT
1
2
3
4
5
window.addEventListener("orientationchange", function() {
    window.setTimeout(function(){
        window.scrollTo(0, 0);
    }, 0);
}, false);

Gives you work around for the rendering issue. Hope this works for others.

Selenium User Extension: Unknown Command

So at work we are setting up a selenium RC 1 grid. We decided to use RC1 and not web drivers since we can setup user-extensions to create locations and custom actions for our QA team.

We’ve slowly got the grid running with our python test cases running the client drivers. Somewhere in the setup (we still don’t know the cause) our user extensions weren’t working anymore. We would receive the Unknown Command error from the selenium nodes. Testing on the ide confirmed we had the user extension correctly written because they would run in the ide.

After some research I came across Stuvel’s blog post about the same issue. For some reason this fix didn’t work for me. So after some digging around in the selenium source I came up with a slight modification to Stuvel’s fix, but the concept of what is happening is the same.

1
2
3
4
5
//This is a fix to get the user-extensions working for RC.  The check is to prevent a runtime error in the IDE
//since the IDE does not contain command factory.
if(this['commandFactory']){
    commandFactory.registerAll(selenium);
}

Place the above code at the bottom of your user extension file. Hopefully this works for you as it did for me. Let me know how it goes in the comments.

Getting Rain Fall Inches in Python

Rain Study 2 © by amandabhslater

Currently my wife and I are working on the house and decided to redo the front and back yards; they are what we love most about our house. We hired someone who knows a lot more about plants to help pick out what to plant and where. She has come up with some fun and neat ideas including lots of ferns, which I love. Georgia gets lots of rain in the fall, winter, and spring but summers can be very hit or miss. So our landscape architect gave me a rule for watering.



If the rainfall has been less than 1 inch in the last three days then water the garden. Wait three more days and repeat the same logic.

As soon as she told me this algorithm lights went off that this would work as great as a simple script that email’s me to water my new garden. I am also a new owner of a raspyberry pi (details later), which will work perfectly to do the monitoring and notifying.

Here is what I am currently thinking for the setup:

Python 2.7 using the following library’s

Here is what I have coded so far:

?Download raingauge.py
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
'''
Created on Sep 12, 2012
 
@author: csimpson
'''
import urllib2
import sqlite3
import datetime
from bs4 import BeautifulSoup
from bs4 import SoupStrainer
 
MORNINGSIDE_STATION = 'KGAATLAN54'
BASE_URL = 'http://www.wunderground.com/weatherstation/WXDailyHistory.asp?ID='
 
def fetchRainfall(station):
    print 'Retrieving rainfall from ' + station
    weatherData = urllib2.urlopen(BASE_URL+station)
    html = weatherData.read()
 
    onlyTables = SoupStrainer(class_="contentData") 
 
    soup = BeautifulSoup(html.encode("utf8"), "lxml", parse_only=onlyTables)
    contentTable = soup.find(text='Precipitation:')
    contentTable = contentTable.find_parent('tr')
 
    inchStr = contentTable.find(class_='b')
    rainfall = float(inchStr.contents[0].string)
    recordRainFall(rainfall)
 
def recordRainFall(inches):
    date = datetime.date.today()
    iso = date.isoformat()
    print 'Station reporting ' + str(inches) + ' inches on ' + iso
 
    sql = "INSERT INTO Rainfall(Inches, Date) VALUES('"+str(inches)+"','"+str(iso)+"');"
 
    db = sqlite3.connect('rainfall.db')
    db.execute(sql)
    db.commit()
    db.close()     
 
if __name__ == '__main__':
    fetchRainfall(MORNINGSIDE_STATION)

fetchRainfall uses the urllib to get the html page from wunderground.com. I limit my soup parsing to one contentData div on the site since it contains the actual data I care about. From there I found the first “Percipitation:” text node (note the second text node is the months total which is not what I wanted.) From there it was pretty simple the get the parent row and then from the parent dig back down to the reported inch level.

recordRainfall puts the inch level and date into a simple sql database for analysis. Note I configured the db and tables outside this script and if you want to run this example so will you.

This is just the start of the script, but I figured I should post this to give people ideas on how to get daily rain fall levels using python.

Future task include:

  • Setup a github repo
  • Setting up the logic for sending emails
  • Making it generic for all weather stations
  • Install scripts

The above script is current running as a cron job on my macbook at 11:55pm to collect the most recent rainfall levels for that day. I will eventually make it to were I can run the script on the next day, but get the rainfall levels for the previous day. This would allow me to collect the full 24 hours 0-24 data instead of data from 0 – 11:55. In Georgia 5 minutes can really be a 1/4 inch, so it is important.

Let me know what you find out about this script when you play around with it.

That Kind of Blog Post

(Sigh) We eventually we all make these kinds of blog posts, the “I don’t know what happened to the time it’s been three years since my last post!” post. Well here I am. The only thing stopping from completely shutting down this thing is I see that people are actually learning something from me and what to experiment with my code.

For awhile I thought these posts where just being thrown down the black hole that come with maintaining a blog. With my renewed excitement I have made some changes to the layout and will be updating my code so that you can check it out.

More hopefully soon and not in three years. P.S. I also need to remove some of the very Web 2.0 plug-ins that were cool three years ago. (I’m looking at you oversized RSS button)

Oh yeah(via)

Don’t judge. It was the 09′s.

Another use for ‘this’

So just as I was looking over the lase post about ‘this’. I realized that I skipped one of the best uses for the infamous property of ‘this’. Enough talk, more actionscript (sorry terrible pun).

So imagine this. Lets say that we have class A which creates an instance of class B. Now lets say when want to store an instance of class A in class B so that you can call class A methods. For smaller apps this is can be an acceptable code structure. So how do you pass an instance of a class in that same class? You guessed it. this!

?View Code ACTIONSCRIPT
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
class A 
{
	private var b:B;
 
	public function A()
	{
		b = new B(); //Creates instance of B class
		b.a = this; //this passes a reference of class A
		//to class B.  Now class B can call class A's
		//myCoolFunction.
	}
 
	public function myCoolFunction():Void
	{
		//Magic happens here. :)
	}
}

If you have any other handy uses for this (I’m sure there are), please let me know in the comments.

This is a good time to use ‘this’

I know for a lot of actionscript coders out there, especially beginners, ‘this’ in can be rather confusing. This issue can spark some pretty heated debates about this proper use. So before diving in here is a short explanation of ‘this’. In actionscript the object the code is currently running in is referred to as ‘this’. So lets say a class has a property myVar, putting this.myVar tells actionscript to look in the current object for the property myVar. Why do we need this? This doesn’t make any sense! Well look at the code below:

?View Code ACTIONSCRIPT3
1
2
3
4
5
6
7
public var age:Number;
 
public function myClass(age:Number)
{
   if(age > 0)
      this.age = age;
}

So lets say this is a class (myClass) with a public variable age. In actionscript you can declare local variables and parameters that only exist for the duration of the function. These local variables have the smallest scope, but have the highest preference, meaning if another variable is named the same the local variable, the local variable will be used instead of the class variable. In the above example we have a constructor the class myClass. Can you see were I am going with this? In the above constructor we have two age variables! The parameter is defined in the function. So to set the class variable we need to use ‘this’ to specify between the local variable and the class variable.

This example is the only the real time that you need to use ‘this’, of course this is only my opinion. What do you think? Coding vets how do you feel about ‘this’?

What makes you a good Developer? Part 1.

Ya, coding conventions!

(for the OCD developer)

  1. Follow coding conventions in your projects. That way you write clear and concise code. The problem is there are many conventions. In reality “conventions” is really a code word for someones arbitrary opinion on how to write neat code. So…which one do you follow? It doesn’t really matter; just follow one. Adobe recently lays one out and I can agree with most of it.  It is not complete and just because it is by Adobe does not mean it is the end all be all.

    While reading the document, I couldn’t help but feel like I was being scolded by my parents. Take a look:

    Do this:

    public function set label(value:String):void

    Not this:

    public function set label(lab:String):void
  2. Stick to those conventions!  I have to admit it is hard but practice it all the time.  Remember this is not the fun part of Flash & Flex development and it never will be but make it a habit.
  3. Lastly, you will eventually run into someone who doesn’t agree with your conventions.  In that situation just think about my first point.

Now time for me to go back to my old code and see what mistakes I’ve made.

Interactive Forest

From my previous post, animation.Float, I had the basic example of the animation class that I wrote to simulate dandelion seeds floating in the wind.  Well I had some free time this weekend and decided to keep my AS3 skills sharped and went on to add interactivity!    Depending on the location of your mouse will vary on the speed of the wind blowing the seeds around.  Farther away you go from the middle the faster the wind gets.  The interactivity is also directional and when you click on one of the seeds they disappear.


The Float class was one of the very first classes that I wrote on my own. Pretty much after I got done reading a book about OOP in AS2, I started this class.  Looking back now, it was pretty rough.  To add in the interactivity and to port the class over to AS3, I pretty much gutted the whole thing and started new, but it is neat to see that I have come a long way in such a short time.

Now the seeds are in a new Dandelion class that extends Float. Float contains a wind object which is shared among the other instances of dandelion seeds (kind of like a singleton, not really fond of them personally, but that is a different post).  After that is was simple to add in the required mouse detection class and update the wind velocity based on the mouse position.

Future:

There are still a few bugs left, if you are in FireFox switch to another tab and then come back.  Also I want to enforce the wind velocities a little better in case the mouse position is too extreme.  To enhance it I want to make it 3D by splitting the picture into layers and having the seeds go between the tree.  The 3d would also have the smaller seeds be removed from the stage earlier to make it look like it landed in the background of the image.

[UPDATE]: Github Repository for the Interactive Forest

Licensed under Creative Commons, so feel free to use them in your project and if you do please let me know.

Cartoons made in Flash

My first job in Flash was animating a children cartoon series. I had always drawn pictures and such as a child but freshly graduated I had no experience in animation. At first it was very frustrating to get any cartoons done, but I finally had a break through and this job became such a wonderful experience for me. I started with nothing and at the end of my two years with Kid Chess I had made 75 cartoon episodes of edutainment to teach kids (K-5th) how to play chess.

I would have never guessed the popularity of theses cartoons in the schools. To me I was just messing around try to make the knight’s lips sync with the audio. Despite my novice everyone wanted more, and so a got some great help from Josh Latta a great cartoonist to help me out on the videos.

And the weapon of choice for animating the cartoons….none other than Flash. At the time I didn’t know better but there is better animation software out there. I finally wised up and bought Preimer Pro and After Effects about a year into the job, but none the less it was and still is a great tool to create simple animations.

Below are some samples of my work. Head on over to KidChess.com to see more.