Category Archives: Uncategorized

Slack in the real world

I set up Slack teams for three groups I am part of.  Will they take to it? I get the feeling it won’t happen right away… probably six months from now when they hear that their little niece is using it to organize her soccer team or Girl Scout troop.

How it works

You get an email for a team you are on.  Like say – I don’t know you are getting married. Unless you are eloping, you are on a team… and your team is on a journey. Fasten your seat belt.

Slack does a lot… but the best thing is channels.  So #centerpieces – moms, there you go.

Brother and soon to be brother-in-law have strong opinions about craft beer? #craftbeer_to_be _served. Have at it fellas.

#expenses – Ooh.. Let’s make this one private and invite in only the people that need to be there.

That’s it.. that’s Slack.  Does a bunch of other shiz. Send documents. Direct messaging.  But the main deal.. you don’t have to read every dog gone email just because someone thinks it’s important and shot it out to the whole group.

 

Everyone can do their business in a safe setting

Let’s be very clear. Many of us have been in a nightclub bathroom where all the rules go out the window. People of both sexes, all sexual orientations, and identities, are doing their hair, taking a piss, doing blow, or maybe even starting a family in one of the stalls – in whatever bathroom happens to be free. And in the context for that night – the code of conduct is temporarily lowered by consensus. And you would hope, should something get out of hand – people would do something in pretty quick order.

That is not what we are talking about here. In your Walmarts, your schools, your goverment offices and business.. your highway rest stops – there are rules to make sure that creepy stuff is not happening and that everyone can do their business in a safe setting. Everyone. Creepy behavior does not belong in public bathrooms. If I walk into a public bathroom and see a straight man shooting up, i’m turning right around and filing a complaint.

Be-ing trans-gender is a real. It is not behavior – it is an identity. There’s nothing creepy about it. Here’s an expert link to get up to speed. If you are not up to speed, ok.. But no time like the present to get informed.

requireJS – got it

Continuing efforts to get more better at modular javascript.  Used requireJS to my Oscillating Dom elements animation.

This set up pulls in jQuery, TweenMax off of a CDN.

The dependency injection appears to work a lot like AngularJS.  I found the docs a little confusing in regards to configuration and just had to play around with it but trying different setups and checking what loaded in Chrome Tools confirmed my set up.

Happy to have this awesome tool in my kit.

Osciallating Divs – Looking back at old code

I went back and looked at some old code in an experiment with the GSAP (aka Greensock) animation library.
I and i thought – oh, wow, that’s how I coded javascript a few months ago. With a bunch of globals.
So I cleaned up the code hiding that nastiness away. And the code is now on github.

View the animation here on you desktop, tablet or phone.

Note that the animation plays  choppy on older mobile devices when the alpha is tweened.

Ipad Web App

Built out an Ipad esales webb app following a Lynd.com tutorial by Chris Converse.  See it in web browser here. Drop the hash #browser, to be prompted to add the app to an ipad. When the app loads on an Ipad, the user is prompted to add it to the home screen so that it looks and feels like a native IOS app. This is all javascript, but I applied revealing modular javascript pattern.  I’m applying this pattern to all my javascirpt  work.  It take more set up, but it really tames javascript. This app:

  • repsonds to Landscape/Portrait
  • has google map
  • animated home screen

RWD Sortable Gallery

Photo_GalleryI spent a a day going through a tutorial on creating a sortable photo gallery that scales to screen.

This relies on fancybox to provide light box functionality to hi-res images.

On resizing the screen, the thumbnails  animate to a new grid lay out.  Other design elements such as the navigation and background art adjust for computer, tablet or phone.

At phone screen size, the light box  behavior is disabled and a straight targeting of the hi-res photos occurs.

This is a type of  product I’ve built in Flash many times, but it’s good to now have one in javascript that i can pull off the shelf  and customize rapidly.

To do-

  • Make the gallery load content dynamically.
  • Test on IE.
  • Test on windows versions of Safari, Chrome, Firefox
  • add light box behavior back to images when screen goes from less than phone screen size up to tablet size or larger.

 

Box2DWebb, CreateJS Interactive Canvas animation

Interactive animation – bouncing balls – created with the Box2dWebb and CreateJS frameworks.  This is a canvas application that will play on mobile.

The bouncing ball logic is all handled by Box2dWebb – which is a port of a physics engine used in ActionScript.

Code break down:

Animation properties (bouncieness, etc) are set up in the init. A bit map (the soccer ball) is loaded into a createJS sprite and loaded on to the stage (canvas).  A box2d object is created and added as a property of the createJS objects.   On the ticker, the bitmap tracks the x,  y position, and rotation of the  physics object as it bounces around.

Basic game logic such as creating the balls, keeping and displaying the ball count on the canvas are all handled with standard javascript.

TODO
Dive into the Box2DWebb code and figure out collision detection.

Note – As a Flash developer, I have found the CreateJS frame work to be both helpful and a little frustrating.  There are a couple key version discrepancies that I had suss out on my own.  Although, I did not use Flash for this little example, the CreateJS Toolkit that is built into Flash CC exports versions of the frame work that are not the latest.  Apparently there is an update to Flash Professional that is due out soon and this will be addressed.

More canvas game set up experiments forth coming. Stand bye.

Wilhem! Game Template

I built this  game a couple years ago as a demo of coding skills for a client. It’s not a game so much as a template for building a more complex game.  And for laughs, there’s the  Wilhem scream built in as a sound effect.

How to play: Select a coin, select a square to move to…. or select another occupied square and watch your coin die.

The code is an example of well organized flexible OOP Action-script coding.  My general approach to building Flash applications  of any complexity is a home-rolled MVC set up, observer design pattern, and the use interfaces… for starters. The complexity of the Flash projects I was taking on in the late 2000s, demanded adopting a flexible code organization. The primary objective was not get it out the door, but rather to  build it so we can add bells/ whistles and pull them out on short notice – without starting over from scratch Here is the code for the game template.