Adding Video to Tumult Hype

You can easily add video to a Tumult Hype project by copying and pasting a video’s iframe code into Hype’s HTML widget. Follow these steps:

1. Find your video on a video sharing site, such as YouTube, and click the Share button, and then the Embed button to copy the iframe code.

2. In Hype, create a new HTML Widget.

3. Double-click the HTML Widget, or click on the Pencil icon at the bottom edge. Paste the iframe code that you copied from YouTube into the text box.

4. Hype automatically pulls the video content from YouTube and displays it in the HTML widget. You can resize the HTML Widget so that it fits the dimensions of your video. Drag the bottom right corner to enlarge the width or height.

5. Click the Preview button at the top right corner of the Hype interface to preview your embedded video in your project.

Now, if you have several scenes, there is a bug that causes the audio from your video to continue even after you switch to a different scene. The solution is to add a little JavaScript to kill the audio if your reader leaves the current scene. Here’s how to add that script:

1. Click on the “Scene Inspector” tab on the panel on the far right of the Hype interface. This panel allows you to add interactivity to the general scene (and not individual buttons).

2. For the On Scene Unload (the very bottom event), choose “Run Javascript” and for Function, choose “New function”. This makes Hype execute a JavaScript function whenever the reader leaves this particular scene.

3. Hype automatically adds some JavaScript code in a new window.

4. Add this line of code in between the opening and closing curly braces of the script:

document.getElementById("uniqueIDhere").innerHTML = ' ';

Hype identifies a particular element on the stage, called “uniqueIDhere”, and makes the contents blank. That will kill the contents of your HTML widget, and consequently, the audio from the video. Those last punctuation marks are a pair of single straight quotation marks and a semi-colon. When you return to the scene, the video will reload into the HTML widget.

5. Last step…you have to identify your HTML widget on the scene with the unique ID that you referenced in Javascript. Select your scene where your video is embedded, and click on the video. Choose the last tab called the “Identity inspector” on the panel on the far right. Enter the unique ID in the last field. In this example, since the code in step 4 has “uniqueIDhere”, I entered uniqueIDhere. It’s best to choose a name that makes sense to you.

6. All done!

Wireframe for Project Snow Job

Data-Driven Journalism

Wireframe for Project Snow Job

Jane Sasseen and Kevin R. Convey

28 Nov. 2012

We propose to comb the city’s 311 complaint records to try to map street snow-clearance complaints either from last winter or from the last several winters to see which neighborhoods of New York City generate the most complaints on the subject, and thus, we infer, get the worst service from the city.

As winter settles in and the temperature drops, residents of the city’s five boroughs brace themselves for the inevitable: the first big snowstorm of the year and the accompanying blizzard of complaints about snow clearance along the city’s thousands of miles of roads.

Clearly, the city’s street-clearing performance is both a barometer of mayoral competence and a thermometer measuring the patience of snowbound city residents. The city’s epic fail during 2010’s “Snowmageddon” storm, for example produced an extraordinary mea culpa from Mayor Michael Bloomberg:

And a barrage of snarky tweets:

Some residents see conspiracies: Was the mayor’s upper-east-side townhouse plowed out first? Other see socio-economic favoritism: How come the city’s poorest neighborhoods always seem to be the last to see a snowplow? And others see only incompetence: Can’t this city do anything right? We intend to comb and chart the data to see if any of these ideas hold water, or whether another explanation suggests itself.

First, let’s take a look at the socioeconomic piece — a stacked bar chart showing median family income by community district compared with complaints:

We’ll draw some conclusions and possibly break this chart into five borough charts.

Now let’s map CDs, complaints and median family income together:

So now we either see that this is true and City Hall houses a bunch of evil bastards who hate poor people. Or, we see that it is not true and we explode a long-standing urban myth that poor neighborhoods always get the shaft when it comes to services.

Mayoral spokesman said, blah, blah, blah. Public Advocate Bill DiBlasio said blah, blah. And City Council President Christine Quinn said, blah, blah.

Either way, we’re done, and now we can all go home for Christmas dinner.