| @@ -0,0 +1,124 @@ | ||
| /* HTML5 ✰ Boilerplate | ||
| * ==|== normalize ========================================================== | ||
| */ | ||
|
|
||
| article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { display: block; } | ||
| audio, canvas, video { display: inline-block; *display: inline; *zoom: 1; } | ||
| audio:not([controls]) { display: none; } | ||
| [hidden] { display: none; } | ||
|
|
||
| html { font-size: 100%; overflow-y: scroll; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; } | ||
| body { margin: 0; font-size: 13px; line-height: 1.231; } | ||
| body, button, input, select, textarea { font-family: sans-serif; color: #222; } | ||
|
|
||
| ::-moz-selection { background: #fe57a1; color: #fff; text-shadow: none; } | ||
| ::selection { background: #fe57a1; color: #fff; text-shadow: none; } | ||
|
|
||
| a { color: #00e; } | ||
| a:visited { color: #551a8b; } | ||
| a:hover { color: #06e; } | ||
| a:focus { outline: thin dotted; } | ||
| a:hover, a:active { outline: 0; } | ||
|
|
||
| abbr[title] { border-bottom: 1px dotted; } | ||
| b, strong { font-weight: bold; } | ||
| blockquote { margin: 1em 40px; } | ||
| dfn { font-style: italic; } | ||
| hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; } | ||
| ins { background: #ff9; color: #000; text-decoration: none; } | ||
| mark { background: #ff0; color: #000; font-style: italic; font-weight: bold; } | ||
| pre, code, kbd, samp { font-family: monospace, monospace; _font-family: 'courier new', monospace; font-size: 1em; } | ||
| pre { white-space: pre; white-space: pre-wrap; word-wrap: break-word; } | ||
| q { quotes: none; } | ||
| q:before, q:after { content: ""; content: none; } | ||
| small { font-size: 85%; } | ||
| sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } | ||
| sup { top: -0.5em; } | ||
| sub { bottom: -0.25em; } | ||
| ul, ol { margin: 1em 0; padding: 0 0 0 40px; } | ||
| dd { margin: 0 0 0 40px; } | ||
| nav ul, nav ol { list-style: none; list-style-image: none; margin: 0; padding: 0; } | ||
| img { border: 0; -ms-interpolation-mode: bicubic; vertical-align: middle; } | ||
| svg:not(:root) { overflow: hidden; } | ||
| figure { margin: 0; } | ||
|
|
||
| form { margin: 0; } | ||
| fieldset { border: 0; margin: 0; padding: 0; } | ||
| label { cursor: pointer; } | ||
| legend { border: 0; *margin-left: -7px; padding: 0; } | ||
| button, input, select, textarea { font-size: 100%; margin: 0; vertical-align: baseline; *vertical-align: middle; } | ||
| button, input { line-height: normal; *overflow: visible; } | ||
| table button, table input { *overflow: auto; } | ||
| button, input[type="button"], input[type="reset"], input[type="submit"] { cursor: pointer; -webkit-appearance: button; } | ||
| input[type="checkbox"], input[type="radio"] { box-sizing: border-box; } | ||
| input[type="search"] { -webkit-appearance: textfield; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; } | ||
| input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; } | ||
| button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; } | ||
| textarea { overflow: auto; vertical-align: top; resize: vertical; } | ||
| input:valid, textarea:valid { } | ||
| input:invalid, textarea:invalid { background-color: #f0dddd; } | ||
|
|
||
| table { border-collapse: collapse; border-spacing: 0; } | ||
| td { vertical-align: top; } | ||
|
|
||
|
|
||
| /* ==|== primary styles ===================================================== | ||
| Author: | ||
| ========================================================================== */ | ||
|
|
||
|
|
||
|
|
||
|
|
||
|
|
||
|
|
||
|
|
||
|
|
||
|
|
||
|
|
||
|
|
||
|
|
||
|
|
||
|
|
||
|
|
||
|
|
||
| /* ==|== non-semantic helper classes ======================================== */ | ||
| .ir { display: block; border: 0; text-indent: -999em; overflow: hidden; background-color: transparent; background-repeat: no-repeat; text-align: left; direction: ltr; } | ||
| .ir br { display: none; } | ||
| .hidden { display: none !important; visibility: hidden; } | ||
| .visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; } | ||
| .visuallyhidden.focusable:active, .visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; } | ||
| .invisible { visibility: hidden; } | ||
| .clearfix:before, .clearfix:after { content: ""; display: table; } | ||
| .clearfix:after { clear: both; } | ||
| .clearfix { zoom: 1; } | ||
|
|
||
|
|
||
| /* ==|== media queries ====================================================== */ | ||
|
|
||
| @media only screen and (min-width: 480px) { | ||
|
|
||
|
|
||
| } | ||
|
|
||
| @media only screen and (min-width: 768px) { | ||
|
|
||
| } | ||
|
|
||
|
|
||
|
|
||
| /* ==|== print styles ======================================================= */ | ||
|
|
||
| @media print { | ||
| * { background: transparent !important; color: black !important; text-shadow: none !important; filter:none !important; -ms-filter: none !important; } | ||
| a, a:visited { text-decoration: underline; } | ||
| a[href]:after { content: " (" attr(href) ")"; } | ||
| abbr[title]:after { content: " (" attr(title) ")"; } | ||
| .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; } | ||
| pre, blockquote { border: 1px solid #999; page-break-inside: avoid; } | ||
| thead { display: table-header-group; } | ||
| tr, img { page-break-inside: avoid; } | ||
| img { max-width: 100% !important; } | ||
| @page { margin: 0.5cm; } | ||
| p, h2, h3 { orphans: 3; widows: 3; } | ||
| h2, h3 { page-break-after: avoid; } | ||
| } |
| @@ -0,0 +1,108 @@ | ||
|
|
||
| body { | ||
| background-color: #90EE90; | ||
| text-align: center | ||
| } | ||
|
|
||
| a, a:visited { | ||
| color:#333; | ||
| } | ||
|
|
||
| #container { | ||
| background-color: yellow; | ||
| padding-top:20px; | ||
| width: 980px; | ||
| border-left: 2px #ddd solid; | ||
| border-right: 2px #ddd solid; | ||
| } | ||
|
|
||
| header { | ||
| padding: 10px; | ||
| } | ||
|
|
||
| #book-title { | ||
| font-family: georgia, "times new roman", times, serif; | ||
| color: #555; | ||
| font-size: 2.3em; | ||
| text-align: center; | ||
| } | ||
|
|
||
| #text-select { | ||
| float:right; | ||
| margin-right: 10px; | ||
| } | ||
|
|
||
| #vis { | ||
| overflow: hidden; | ||
| position: relative; | ||
| } | ||
|
|
||
| #status { | ||
| padding:0 0 20px 20px; | ||
| } | ||
|
|
||
| #controls { | ||
| padding: 20px; | ||
| background-color: yellow; | ||
| margin: 10px; | ||
| width: 350px; | ||
| } | ||
|
|
||
| #bubble-background { | ||
| fill: none; | ||
| pointer-events: all; | ||
| } | ||
|
|
||
| .bubble-node { | ||
| -webkit-animation: myfirst 5s; /* Chrome, Safari, Opera */ | ||
| animation: myfirst 5s; | ||
| fill: #90EE90; | ||
| } | ||
| /* Chrome, Safari, Opera */ | ||
| @-webkit-keyframes myfirst { | ||
| from {fill: blue;} | ||
| to {fill: #90EE90;} | ||
| } | ||
|
|
||
|
|
||
| .bubble-hover { | ||
| /* fill: #b8c7d9; */ | ||
| fill: orange; | ||
| } | ||
|
|
||
| .bubble-selected { | ||
| /* fill: #a8c8ee; */ | ||
| fill: red; | ||
| /* stroke: #6081a3; */ | ||
| stroke: #A6BA92; | ||
| stroke-width: 1.5px; | ||
| } | ||
|
|
||
| .active { | ||
| color: red | ||
| } | ||
|
|
||
| a.bubble-label { | ||
| font-family: georgia, "times new roman", times, serif; | ||
| color: inherit; | ||
| cursor: pointer; | ||
| display: block; | ||
| text-align: center; | ||
| text-decoration: none; | ||
| line-height: 1em; | ||
| position: absolute; | ||
| } | ||
|
|
||
|
|
||
| .bubble-label .bubble-label-value { | ||
| font: 11px sans-serif; | ||
| white-space: nowrap; | ||
| } | ||
|
|
||
| footer p { | ||
| text-align: center; | ||
| padding-top:20px; | ||
| padding-bottom:20px; | ||
| font: 15px sans-serif; | ||
| } | ||
|
|
| @@ -0,0 +1,100 @@ | ||
| name,count | ||
| aaronsmithcnn,1 | ||
| youre,5 | ||
| really,10 | ||
| tempting,1 | ||
| fate,1 | ||
| by,31 | ||
| posting,2 | ||
| that,38 | ||
| twitter,3 | ||
| whitneymallett,3 | ||
| as,21 | ||
| long,4 | ||
| im,13 | ||
| getting,7 | ||
| least,3 | ||
| two,6 | ||
| bars,1 | ||
| i,37 | ||
| dont,10 | ||
| freak,1 | ||
| switching,1 | ||
| my,25 | ||
| phone,12 | ||
| airplane,1 | ||
| mode,1 | ||
| night,2 | ||
| feels,1 | ||
| like,14 | ||
| modest,2 | ||
| spiritual,1 | ||
| act,3 | ||
| what,13 | ||
| happened,2 | ||
| when,4 | ||
| canadian,1 | ||
| town,4 | ||
| tried,3 | ||
| guaranteed,1 | ||
| basic,1 | ||
| income,2 | ||
| ,323 | ||
| great,22 | ||
| piece,5 | ||
| httptcot2cpbavgxb,1 | ||
| inside,6 | ||
| airbnb,1 | ||
| awesome,5 | ||
| interactive,2 | ||
| project,1 | ||
| nyc,4 | ||
| listings,1 | ||
| murrayscox,1 | ||
| httptco1h6abrjod3,1 | ||
| aidanfeldman,1 | ||
| thanks,11 | ||
| bunch,1 | ||
| looking,5 | ||
| forward,3 | ||
| catching,1 | ||
| you,47 | ||
| again,4 | ||
| soon,4 | ||
| comcast,3 | ||
| pr,1 | ||
| ghostwriting,1 | ||
| politician,2 | ||
| letters,1 | ||
| support,3 | ||
| comcasttwc,1 | ||
| merger,2 | ||
| scoop,1 | ||
| spencerwoodman,1 | ||
| httptcofiedhms4zq,1 | ||
| midnitesnak,1 | ||
| lets,3 | ||
| go,4 | ||
| energy,1 | ||
| civichall,1 | ||
| open,2 | ||
| house,5 | ||
| today,13 | ||
| psyched,1 | ||
| see,10 | ||
| this,39 | ||
| community,1 | ||
| develop,1 | ||
| delint,2 | ||
| where,1 | ||
| slideshow,3 | ||
| elderly,1 | ||
| track,2 | ||
| amp,2 | ||
| field,2 | ||
| competitors,1 | ||
| httptcokrp66rg4oh,1 | ||
| seems,4 | ||
| worth,4 | ||
| resurfacing,1 | ||
| greek,4 |
| @@ -0,0 +1,26 @@ | ||
| Copyright (c) 2010-2014, Michael Bostock | ||
| All rights reserved. | ||
|
|
||
| Redistribution and use in source and binary forms, with or without | ||
| modification, are permitted provided that the following conditions are met: | ||
|
|
||
| * Redistributions of source code must retain the above copyright notice, this | ||
| list of conditions and the following disclaimer. | ||
|
|
||
| * Redistributions in binary form must reproduce the above copyright notice, | ||
| this list of conditions and the following disclaimer in the documentation | ||
| and/or other materials provided with the distribution. | ||
|
|
||
| * The name Michael Bostock may not be used to endorse or promote products | ||
| derived from this software without specific prior written permission. | ||
|
|
||
| THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" | ||
| AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE | ||
| IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE | ||
| DISCLAIMED. IN NO EVENT SHALL MICHAEL BOSTOCK BE LIABLE FOR ANY DIRECT, | ||
| INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, | ||
| BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, | ||
| DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY | ||
| OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING | ||
| NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, | ||
| EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE. |
| @@ -0,0 +1,5 @@ | ||
| window.log=function(){log.history=log.history||[];log.history.push(arguments);if(this.console){arguments.callee=arguments.callee.caller;var a=[].slice.call(arguments);(typeof console.log==="object"?log.apply.call(console.log,console,a):console.log.apply(console,a))}}; | ||
| (function(b){function c(){}for(var d="assert,count,debug,dir,dirxml,error,exception,group,groupCollapsed,groupEnd,info,log,timeStamp,profile,profileEnd,time,timeEnd,trace,warn".split(","),a;a=d.pop();){b[a]=b[a]||c}})((function(){try | ||
| {console.log();return window.console;}catch(err){return window.console={};}})()); | ||
|
|
||
|
|
| @@ -1,26 +1,70 @@ | ||
| <!doctype html> | ||
| <!--[if lt IE 7]> <html class="no-js ie6 oldie" lang="en"> <![endif]--> | ||
| <!--[if IE 7]> <html class="no-js ie7 oldie" lang="en"> <![endif]--> | ||
| <!--[if IE 8]> <html class="no-js ie8 oldie" lang="en"> <![endif]--> | ||
| <!--[if gt IE 8]><!--> <html class="no-js" lang="en"> <!--<![endif]--> | ||
| <head> | ||
| <meta charset="utf-8"> | ||
| <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> | ||
|
|
||
| <title>vis</title> | ||
| <meta name="description" content=""> | ||
| <meta name="author" content=""> | ||
|
|
||
| <meta name="viewport" content="width=device-width,initial-scale=1"> | ||
|
|
||
| <!-- CSS concatenated and minified via ant build script--> | ||
| <link rel="stylesheet" href="css/reset.css"> | ||
| <link rel="stylesheet" href="css/bootstrap.min.css"> | ||
| <link rel="stylesheet" href="css/style.css"> | ||
| <!-- end CSS--> | ||
|
|
||
| <script src="js/libs/modernizr-2.0.6.min.js"></script> | ||
| </head> | ||
|
|
||
| <body> | ||
|
|
||
| <div id="container" class="container"> | ||
| <header> | ||
| <h1><em><strong>Tweeter Pan</strong></em></h1> | ||
| <h2>The most commonly used words from @<%=handle%>:</h2> | ||
| <h2 id="book-title"></h2> | ||
| </header> | ||
| <div id="main" role="main"> | ||
| <div id="vis"></div> | ||
| <div id="status"></div> | ||
| <div id="controls"> | ||
| <h3>Jitter</h3> | ||
| <form id="jitter" oninput="output.value = (jitter_input.value / 200).toFixed(3)" > | ||
| <input id="jitter_input" type="range" min="0" max="400" value="100" style="width:240px;"> | ||
| <output name="output" for="input">0.5</output> | ||
| </form> | ||
| </div> | ||
| </div> | ||
| <footer> | ||
| <p>Shoutout to Jim Vallandingham for the <a href="http://vallandingham.me/building_a_bubble_cloud.html">tutorial</a> and <a href="https://github.com/vlandham/bubble_cloud">original visualization code</a>, plus The New York Times for<a href="http://www.nytimes.com/interactive/2012/09/04/us/politics/democratic-convention-words.html"> the initial inspiration.</a></p> | ||
| </footer> | ||
| </div> <!--! end of #container --> | ||
| <!-- <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> --> | ||
| <script>window.jQuery || document.write('<script src="js/libs/jquery-1.7.2.min.js"><\/script>')</script> | ||
| <script>window.csv = <%=csv_response.inspect%></script> | ||
| <script defer src="js/plugins.js"></script> | ||
| <script src="js/libs/coffee-script.js"></script> | ||
| <script src="js/libs/d3.min.js"></script> | ||
| <script type="text/coffeescript" src="coffee/vis.coffee"></script> | ||
| <script type="text/javascript"> | ||
| </script> | ||
|
|
||
|
|
||
|
|
||
|
|
||
| <!--[if lt IE 7 ]> | ||
| <script src="//ajax.googleapis.com/ajax/libs/chrome-frame/1.0.3/CFInstall.min.js"></script> | ||
| <script>window.attachEvent('onload',function(){CFInstall.check({mode:'overlay'})})</script> | ||
| <![endif]--> | ||
|
|
||
| </body> | ||
| </html> |