BTTC News

bttc-news.markdown

BTTC News

A Pen by thanos vassilakis on CodePen.

License.

index.html

<meta name = "viewport" content = "width = device-width, initial-scale = 1">      
<link rel = "stylesheet"
         href = "https://fonts.googleapis.com/icon?family=Material+Icons">
<link rel = "stylesheet" 
         href = "https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.3/css/materialize.min.css">

<script type = "text/javascript"
         src = "https://code.jquery.com/jquery-2.1.1.min.js"></script>           
<script src = "https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.3/js/materialize.min.js"> </script>
      
<script src="https://js.pusher.com/4.2/pusher.min.js"></script>
      
      
      
      <div class="row">
         <div class = "col s12">
            <ul class = "tabs">
               <li class = "tab col s3"><a href = "#Volume_Sentiment">Volume &amp; Sentiment</a></li>
               <li class = "tab col s3"><a  href = "#Trends">
                  Trends</a></li>
        
               <li class = "tab col s3"><a class = "active" href = "#Topics">Topics</a></li>
            </ul>
         </div>
         
         <div id = "Volume_Sentiment" class = "col s12">Inbox</div>
         <div id = "Trends" class = "col s12">Trends</div>
         <div id = "Topics" class = "col s12"></div>
     
      </div> 

      <script src = "http://mistic100.github.io/jQCloud/dist/jqcloud2/dist/jqcloud.min.js">
      </script>

script.js

var words = [
  {text: "Lorem", weight: 13},
  {text: "Ipsum", weight: 10.5},
  {text: "Dolor", weight: 9.4},
  {text: "Sit", weight: 8},
  {text: "Amet", weight: 6.2},
  {text: "Consectetur", weight: 5},
  {text: "Adipiscing", weight: 5},
  /* ... */
];



$('#Topics').jQCloud(words,
        { 
  //  width: 800,
   // height: 350,
  autoResize:true,
  center:	{x: 0.5, y:0.5}
                          });

var pusher = new Pusher('35461e5bcadb9e7ec3b1', {
  cluster: 'mt1'
});

var channel = pusher.subscribe('market');



channel.bind('ticker', function(data) {
  console.log('An event was triggered with message: ' + data.message);
});

style.css

.jqcloud{font:10px Helvetica,Arial,sans-serif;line-height:normal;overflow:hidden;position:relative}.jqcloud-word{margin:0;padding:0}.jqcloud-word.w1{color:#aab5f0;font-size:100%}.jqcloud-word.w2{color:#9ce;font-size:150%}.jqcloud-word.w3{color:#a0ddff;font-size:200%}.jqcloud-word.w4{color:#90c5f0;font-size:250%}.jqcloud-word.w5{color:#90a0dd;font-size:300%}.jqcloud-word.w6{color:#90c5f0;font-size:350%}.jqcloud-word.w7{color:#39d;font-size:400%}.jqcloud-word.w8{color:#0cf;font-size:450%}.jqcloud-word.w9{color:#0cf;font-size:500%}.jqcloud-word.w10{color:#0cf;font-size:550%}.jqcloud-word a{color:inherit;font-size:inherit;text-decoration:none}.jqcloud-word a:hover{color:#0cf}

#Topics {eight:100%;
  width:100%;
  height:100%;
  min-height:300px;
  min-width:300px;
}

body {
  background-color: black;
}