Tributary Users

_.md

[ Launch: Tributary Users ] 4eb7890692c4ddc0d051 by rickdg
[ Launch: An inlet to Tributary ] 4545400 by enjalot

config.json

{"description":"Tributary Users","endpoint":"","display":"html","public":true,"require":[],"fileconfigs":{"inlet.js":{"default":true,"vim":false,"emacs":false,"fontSize":12},"style.css":{"default":true,"vim":false,"emacs":false,"fontSize":12},"_.md":{"default":true,"vim":false,"emacs":false,"fontSize":12},"config.json":{"default":true,"vim":false,"emacs":false,"fontSize":12}},"tab":"edit","display_percent":0.7,"play":false,"loop":false,"restart":false,"autoinit":true,"pause":true,"loop_type":"period","bv":false,"nclones":15,"clone_opacity":0.4,"duration":3000,"ease":"linear","dt":0.01,"hidepanel":false,"fullscreen":false,"ajax-caching":true}

inlet.js

var display = d3.select("#display")
.style("overflow", "scroll");


var url = 'http://tributary.io/api/users';

display.append("input")
.attr({
  id: "fetch",
  type: "button",
  value: "fetch"
})
.on("click", function() {
  d3.json(url, function(err, res) {
    tributary.data = res;
    render();
  })
})


function render() {
  if(!tributary.data) return;
  console.log(tributary.data)
  
  var users = display.selectAll("div.user")
    .data(tributary.data)
  .enter()
  .append("div")
  .classed("user", true);
  
  users.append("img")
  .attr({
    src: function(d) { return d.avatar_url },
    width: 72,
    height: 72
  })
  users.append("br")
  users.append("span")
    .classed("login", true)
    .text(function(d) { return d.login });
  users.append("br")
  users.append("span")
    .classed("name", true)
    .text(function(d) { return d.name });
  users.append("br")
  users.append("span")
  .text(function(d) { return "inlets: " + (d.inlets || 0) });
  
  

  
};
render();
if(!tributary.data || !tributary.data.length) {
   d3.json(url, function(err, res) {
    tributary.data = res;
    render();
  })
}

style.css

#fetch {
  position:relative;
  margin-top: 20px;
  right: 40px;
  font-size:29px;
  float:right;
}

.user {
  float:left;
  margin-left: 10px;
  margin-top: 20px;
  height: 120px;
}