hot fixes

index.html

@@ -22,11 +22,12 @@
                          <meta property="og:site_name" content="Bloomberg.com"/>
                          <meta property="og:title" content="What is code? If you don't know, you need to read this:">
                          <meta property="og:longTitle" content="What is code? If you don't know, you need to read this:">
-                         <meta property="og:image" content="http://www.bloomberg.com/graphics/2015-paul-ford-what-is-code/img/commencementspeakersfb.png"/>
+                         <meta property="og:image" content="http://www.bloomberg.com/graphics/2015-paul-ford-what-is-code/images/promo.jpg"/>
                          <meta property="og:description" content="The world belongs to people who code. Those who don’t understand will be left behind."/>
                          <meta name="keywords" content="Bloomberg Graphics, BusinessWeek, code"/>
                          <meta property="og:url" content="http://www.bloomberg.com/graphics/2015-paul-ford-what-is-code/"/>
 
+
                          <meta name="parsely-type" content="post" data-ephemeral="true">
                          <meta name="parsely-section" content="graphics" data-ephemeral="true">
 
@@ -132,7 +133,7 @@
                          <div class="vertCenter">
                                                   <h1 id="fit">WHAT <em>IS</em></h1>
                                                                            <div class="byline">
-                                                                                                    <h2 class="bylineDate">BUSINESSWEEK JUNE 11, 2015</h2>
+                                                                                                    <h2 class="bylineDate"><span class="hide-mobile">BUSINESSWEEK </span>JUNE 11, 2015</h2>
                                                                                                     <h2 class="bylinePaul">BY PAUL FORD</h2>
                                                                            </div><h1 id="fit2">CODE?<span class="blinking-cursor">|</span></h1>
                          </div>
@@ -207,7 +208,7 @@ <h2 id="sec-1">The Man in the Taupe Blazer</h2>
     <div class="videoWrapper">
 
     <div class="videoWrapper2">
-<script src='//cdn.gotraffic.net/projector/latest/bplayer.js'>BPlayer(null, {"id":"P4_i7PihRGiWcPh3gdNMhg","htmlChildId":"bbg-video-player-P4_i7PihRGiWcPh3gdNMhg","serverUrl":"http://www.bloomberg.com/api/embed","idType":"BMMR","autoplay":false,"video_autoplay_on_page":false,"log_debug":false,"ui_controls_popout":false,"use_js_ads":true,"ad_code_prefix":"","ad_tag_gpt_preroll":true,"ad_tag_gpt_midroll":true,"ad_tag_sz_preroll":"1x7","ad_tag_sz_midroll":"1x7","ad_tag_sz_overlay":"1x7","ad_network_id_preroll":"5262","ad_network_id_midroll":"5262","ad_network_id_overlay":"5262","ad_tag_cust_params_preroll":"","ads_vast_timeout":10000,"ads_playback_timeout":10000,"wmode":"opaque","use_comscore":true,"comscore_ns_site":"bloomberg","comscore_page_level_tags":{"bb_brand":"bbiz","bss_cont_play":0,"bb_region":"US"},"use_chartbeat":true,"chartbeat_uid":"15087","chartbeat_domain":"bloomberg.com","use_share_overlay":true,"share_metadata":{"canonical_url":"http://bloom.bg/1GzwRDU"},"vertical":"business","ad_tag_overlay":"business/videooverlay","zone":"video","source":"BBIZweb","module_conviva_insights":"enabled","conviva_account":"c3.Bloomberg","width":640,"height":360,"ad_tag":"","ad_tag_midroll":"","offsite_embed":true});</script>
+<script src='//cdn.gotraffic.net/projector/latest/bplayer.js'>BPlayer(null, {"id":"P4_i7PihRGiWcPh3gdNMhg","htmlChildId":"bbg-video-player-P4_i7PihRGiWcPh3gdNMhg","serverUrl":"http://www.bloomberg.com/api/embed","idType":"BMMR","autoplay":false,"video_autoplay_on_page":false,"log_debug":false,"ui_controls_popout":false,"use_js_ads":true,"ad_code_prefix":"","ad_tag_gpt_preroll":true,"ad_tag_gpt_midroll":true,"ad_tag_sz_preroll":"1x7","ad_tag_sz_midroll":"1x7","ad_tag_sz_overlay":"1x7","ad_network_id_preroll":"5262","ad_network_id_midroll":"5262","ad_network_id_overlay":"5262","ad_tag_cust_params_preroll":"","ads_vast_timeout":10000,"ads_playback_timeout":10000,"wmode":"opaque","use_comscore":true,"comscore_ns_site":"bloomberg","comscore_page_level_tags":{"bb_brand":"bbiz","bss_cont_play":0,"bb_region":"US"},"use_chartbeat":true,"chartbeat_uid":"15087","chartbeat_domain":"bloomberg.com","use_share_overlay":true,"share_metadata":{"canonical_url":"http://bloom.bg/1GzwRDU"},"vertical":"business","ad_tag_overlay":"business/videooverlay","zone":"video","source":"BBIZweb","module_conviva_insights":"enabled","conviva_account":"c3.Bloomberg","width":640,"height":360,"ad_tag":"","ad_tag_midroll":"","offsite_embed":false});</script>
     </div>
 
     </div>
@@ -643,10 +644,7 @@ <h3><span class="section">2.5</span> The Sprint</h3>
 <h3><span class="section">2.6</span> What&rsquo;s With All These Conferences, Anyway?</h3>
     <p>Conferences! The website Lanyrd lists hundreds of technology conferences for June 2015. There&rsquo;s an event for software testers in Chicago, a Twitter conference in São Paulo, and one on enterprise content management in Amsterdam. In New York alone there&rsquo;s the Big Apple Scrum Day, the Razorfish Tech Summit, an entrepreneurship boot camp for veterans, a conference dedicated to digital mapping, many conferences for digital marketers, one dedicated to Node.js, one for Ruby, and one for Scala (these are programming languages), a couple of breakfasts, a conference for cascading style sheets, one for text analytics, and something called the Employee Engagement Awards.</p>
 
-    <p>Tech conferences look like you&rsquo;d expect. Tons of people at a Sheraton, keynote in Ballroom D. Or enormous streams of people wandering through South by Southwest in Austin. People come together in the dozens or thousands and attend panels, ostensibly to learn; they attend presentations and brush up their skills, but there&rsquo;s a secondary conference function, one of acculturation. You go to a technology conference to affirm your tribal identity, to transfer out of the throng of dilettantes and into the zone of the professional. You pick up swag and talk to vendors, if that&rsquo;s your thing.<sup>
-            <a id="fnr.11" name="fnr.11" class="footref" href="#fn.11">11</a>
-         </sup>
-      </p>
+    <p>Tech conferences look like you&rsquo;d expect. Tons of people at a Sheraton, keynote in Ballroom D. Or enormous streams of people wandering through South by Southwest in Austin. People come together in the dozens or thousands and attend panels, ostensibly to learn; they attend presentations and brush up their skills, but there&rsquo;s a secondary conference function, one of acculturation. You go to a technology conference to affirm your tribal identity, to transfer out of the throng of dilettantes and into the zone of the professional. You pick up swag and talk to vendors, if that&rsquo;s your thing.</p>
 
                          <div class="bigimgWrap">
                                                   <img class="conference" src="images/sec1_conference04.jpg"><img class="conference" src="images/sec1_conference02.jpg"><img class="conference" src="images/sec1_conference06.jpg"><img class="conference" src="images/sec1_conference11.jpg"><img class="conference" src="images/sec1_conference09.jpg"><img class="conference" src="images/sec1_conference03.jpg"><img class="conference" src="images/sec1_conference07.jpg"><img class="conference" src="images/sec1_conference08.jpg"><img class="conference" src="images/sec1_conference05.jpg"><img class="conference" src="images/sec1_conference10.jpg"><img class="conference" src="images/sec1_conference01.jpg"><img class="conference" src="images/sec1_conference12.jpg">
@@ -677,10 +675,7 @@ <h3><span class="section">2.6</span> What&rsquo;s With All These Conferences, An
     <p class="indent">The Atlanta Java Users Group (AJUG) is dedicated to providing an outstanding conference experience for all attendees, speakers, sponsors, volunteers, and organizers involved in DevNexus (GeekyNerds) regardless of gender, sexual orientation, disability, physical appearance, body size, race, religion, financial status, hair color (or hair amount), platform preference, or text editor of choice.
                          <br/>&mdash;<em><a target="_blank" href="https://www.devnexus.com/s/code-of-conduct">devnexus</a></em></p>
 
-    <p>When people started talking about conference behavior, they also began to talk about the larger problems of programming culture. This was always an issue, but the conference issues gave people a point of common reference. Why were there so many men in this field?<sup>
-            <a id="fnr.12" name="fnr.12" class="footref" href="#fn.12">12</a>
-         </sup> Why do they behave so strangely? Why is it so hard for them to be in groups with female programmers 
-         and behave in a typical, adult way?</p>
+    <p>When people started talking about conference behavior, they also began to talk about the larger problems of programming culture. This was always an issue, but the conference issues gave people a point of common reference. Why were there so many men in this field? Why do they behave so strangely? Why is it so hard for them to be in groups with female programmers and behave in a typical, adult way?</p>
 
 <div class="thirty"><img class="centered" src="images/emotes/swagbot.gif"></div><div class="thirty"><img class="centered" src="images/emotes/conferencebot.gif"></div><div class="thirty"><img class="centered" src="images/emotes/drinkbot.gif"></div>
 
@@ -704,7 +699,7 @@ <h4>Famous women in coding history</h4><br>
 
     <p>Which leads one to the inescapable conclusion: The problem with women in technology isn&rsquo;t the women.</p>
 
-                         <div class="bigimgWrap"><img class="centered" fsrc="images/sec1_demographics.jpg"></div>
+                         <div class="bigimgWrap"><img class="centered" src="images/sec1_demographics.jpg"></div>
 
 
 </div></section>
@@ -724,10 +719,7 @@ <h4>Famous women in coding history</h4><br>
 <div class="sectionNum sectionNum3">3</div>
 <h2 id="sec-1">Why Are Programmers So Intense About Languages?</h2>
 
-      <p>Many conferences are organized around specific programming languages or specific communities (PyCon for Python programmers; the Strata conference for big data; Oscon for open-source coders); these are ritual events for the people in those communities. Attendees gather, talk, and post the videos on YouTube. Language matters. <sup>
-            <a id="fnr.13" name="fnr.13" class="footref" href="#fn.13">13</a>
-         </sup> 
-      </p>
+      <p>Many conferences are organized around specific programming languages or specific communities (PyCon for Python programmers; the Strata conference for big data; Oscon for open-source coders); these are ritual events for the people in those communities. Attendees gather, talk, and post the videos on YouTube. Language matters.</p>
 
       <p>Programmers track the success of computer languages the way other people track sports rankings, commenting on Web forums such as Reddit (where many languages get their own &ldquo;subreddit,&rdquo; and <a href="http://www.reddit.com/r/programming" target="_blank">reddit.com/r/programming</a> currently has 620,202 readers), or <a href="https://news.ycombinator.com/" target="_blank">Hacker News</a>, run by the venture capital firm Y Combinator (a company named after a special kind of function that operates on other functions), or <a href="http://lambda-the-ultimate.org/" target="_blank">Lambda the Ultimate</a> (named after a series of papers written mostly in the 1970s about the influential programming language Scheme&mdash;the more inside-baseball the name, the nerdier the subject matter).</p>
 
@@ -1386,7 +1378,7 @@ <h3><span class="section">4.2</span> The Thing About Real Artists Is That They&m
                                                   <div class="photoCaption">Boru O&rsquo;Brien O&rsquo;Connell for Bloomberg Businessweek; Set design: Dave Bryant</div>
                          </div>
 
-    <p>As a class, programmers are easily bored, love novelty, and are obsessed with various forms of productivity enhancement. God help you if you&rsquo;re ever caught in the middle of a conversation about nutrition; standing desks;<sup><a id="fnr.21" name="fnr.21" class="footref" href="#fn.21">21</a></sup> the best keyboards; the optimal screen position and distance; whether to use a plain text editor or a large, complex development environment; chair placement; the best music to code to; the best headphones; whether headphone amplifiers actually enhance listening; whether open-plan offices are better than individual or shared offices; the best bug-tracking software; the best programming methodology; the right way to indent code and the proper placement of semicolons; or, of course, which language is better. And whatever you do, never, ever ask a developer about productivity software.</p>
+    <p>As a class, programmers are easily bored, love novelty, and are obsessed with various forms of productivity enhancement. God help you if you&rsquo;re ever caught in the middle of a conversation about nutrition; standing desks; the best keyboards; the optimal screen position and distance; whether to use a plain text editor or a large, complex development environment; chair placement; the best music to code to; the best headphones; whether headphone amplifiers actually enhance listening; whether open-plan offices are better than individual or shared offices; the best bug-tracking software; the best programming methodology; the right way to indent code and the proper placement of semicolons; or, of course, which language is better. And whatever you do, never, ever ask a developer about productivity software.</p>
 
 <div id="productivity">
                          <h4>Productivity Enhancers</h4>
@@ -2206,8 +2198,6 @@ <h3><span class="section">6.2</span> What Is Debugging?</h3>
       <p>Polymer is a &ldquo;Web components&rdquo; library, which means it gives you little reusable code components you can use on your Web pages&mdash;sliding drawers and drop-down menus, buttons, etc. OK.</p>
       <p>So what we know now is that the combination of Angular, ui-router, Yeoman, Gulp, and Polymer is somehow not working for TheOncomingCode. All of these things are tools designed to make it easier to code. But they all introduce their own complexity. This person is trying to make a Web browser do something in JavaScript, and it&rsquo;s crapping out.</p>
 
-      <p>Someone came in to answer this question, too. &ldquo;To be able to use the header state in the home state,&rdquo; wrote Stack Overflow user Matt Tester, &ldquo;they will need to [be] nested (chained).&hellip; So, it&rsquo;s not obvious, but you can safely make one state the parent of another in separate files/configs because of the way registration works.&rdquo; So. There you go. That solves it.</p>
-
      <div class="ephemeraR" style="color:#f94600">
                             <strong>The top ten tags on Stack Overflow's help wanted listings, June 1st:</strong>
                             <img src="images/sec3_helpwanted.jpg">

modules/gcd/gcd.css

@@ -1,6 +1,6 @@
 [data-module="gcd"]{
   width: 960px;
-  height: 375px;
+  height: 420px;
   margin-left: -0px;
   font-family: "HaasTextBold",Arial,Helvetica;
   padding-top: 30px;

modules/gcd/gcd.js

@@ -140,6 +140,7 @@
     text.append('div.btn')
         .on('click', drawGCD)
         .text('Calculate again!')
+        .style('margin-left', '225px')
 
     text.selectAll('div')
         .style('opacity', 0)

modules/paulbot/paulbot.js

@@ -18,7 +18,7 @@ var paulbot;
   }
 
   var dialogue = [
-    { "speak": message },
+    { "emote": "waving", "speak": message },
     { "mode": "off" }
   ];
 
@@ -64,7 +64,7 @@ var paulbot;
   function alertTooFast() {
     var dialogue = [
       {
-        "emote": "jumps",
+        "emote": "dizzy",
         "speak": fastSass.pop(),
         "wait": 7000
       },
@@ -135,19 +135,16 @@ var paulbot;
   $(document).keydown(function(e) {
     kkeys.push( e.keyCode );
     if ( kkeys.toString().indexOf( konami ) >= 0 ) {
-      $(document).unbind('keydown',arguments.callee);
-      // do something
-      var dialogue = [
-        {
-          "emote": "jumps",
-          "speak": "EASTER EGG",
-          "wait": 5000
-        },
-        {
-          "mode": "off"
+
+      kkeys = [];
+
+      if(d3.select("#reggaegg").empty()) {
+        d3.select("body").append("iframe")
+          .attr("id", "reggaegg")
+          .attr("src", "reggaegg.html");
+        } else {
+          d3.select("#reggaegg").remove();
         }
-      ]
-      paulbot.dialogue(dialogue);
     }
   });
 

modules/tree/tree.css

@@ -2,7 +2,7 @@
 
 [data-module="tree"] {
   position: relative;
-  height: 1110px;
+  height: 1035px;
 }
 
 [data-module="tree"] .svg-container {
@@ -100,4 +100,8 @@
   display: none !important
 }
 
+[data-mname="tree"]{
+  top: -36px;
+  position: relative;
+}