Another Inlet

_.md

[ Launch Inlet ]
Gist #3200444

config.json

{"description":"Another Inlet","endpoint":"","display":"svg","public":true,"require":[],"fileconfigs":{"inlet.js":{"default":true,"vim":false,"emacs":false,"fontSize":12}},"tab":"edit","display_percent":0.4541666666666664,"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}

inlet.js

var svg = d3.select("svg");




var theme_properties = { "thumbnail-standard-small" : {"circleRadius": 200 ,"backgroundColor": "#fff", "circle1Color" : "#fae34b", "circle2Color" : "#00adef", "fontColor":"#000" , "fontColor2": "#fff", "text1" : "DATA","text2" : "DESIGN", "intersection": "VISUALLY", "interface-color": "#201F24",
	"colorCombos" : [
		{"color1":"#f8e64b","color2":"#00aeef","font1": "#000","font2":"#000","fontFamily":"FSAlbert"},
		{"color1":"#f8e64b","color2":"#ec008c", "font1": "#000","font2":"#fff","fontFamily":"FSAlbert"},
		{"color1":"#00aeef","color2":"#ec008c","font1": "#000","font2":"#fff","fontFamily":"FSAlbert"},
		{"color1":"#6abf5a","color2":"#f8e64b","font1": "#000","font2":"#000","fontFamily":"FSAlbert"},
		{"color1":"#cb1c2c","color2":"#eec3b5","font1": "#000","font2":"#000","fontFamily":"FSAlbert"},
		{"color1":"#3c5a93","color2":"#d8dfe9","font1": "#000","font2":"#000","fontFamily":"FSAlbert"},
		{"color1":"#6abf5a","color2":"#e7e8e9","font1": "#000","font2":"#000","fontFamily":"FSAlbert"},
		{"color1":"#414142","color2":"#e7e8e9","font1": "#000","font2":"#000","fontFamily":"FSAlbert"},
		{"color1":"#777B7D","color2":"#fff","font1": "#2d2a2e","font2":"#ef452f","fontFamily":"FSAlbert"},
		{"color1":"#777b7d","color2":"#fff","font1": "#2d2a2e","font2":"#ef452f","fontFamily":"FSAlbert", "background":"#cee6f6"}
	]}};


var x = new ColorPicker(31,56, 200, 200, svg, theme_properties );


console.log("x",x.show())

function ColorPicker(colorPickX, colorPickY, width, height, container, theme_properties){
  
  this.colorPicker = container.append("svg:g")
      .attr("id","colorPicker")
      .attr("fill-opacity","0")
      .style("visibility","hidden")
      .attr("class","non-print")
      .attr("transform","translate("+[colorPickX, colorPickY]+")rotate(0)scale(1)");
  
  
  var colorPickerWidth = width;
  var colorPickerHeight = height;
  
  var colorCombos = theme_properties["colorCombos"];
  
  this.colorPicker.append("svg:rect")
    .attr("width",210)
    .attr("height",colorPickerHeight)
    .attr("rx",25)
    .attr("ry",25)
    .attr("x",-15)
    .attr("y",0)
    .attr("fill","#201F24");
  
  this.colorPicker.append('svg:path')
    .attr("fill","#201F24")
    .attr("d","m0,0 l35,0 l-17.5,20Z")
    .attr("fill","#201F24")
    .attr("transform","translate("+[83,colorPickerHeight]+")");  
  
  
  var colorGroup = this.colorPicker.append("svg:g")
      .attr("transform","translate("+[-15, 0]+")")
      .attr("id","colorPicks");
  

}



ColorPicker.prototype.show = function(){
	
  
		return "fff"
};