crypto-nodes/genericExchange.ui.js

var exchangeManager = {

	drawExchangeSelect: function(data) {

		var that = this;

		var sel = $("<select>");
		for(x in data) {

			var opt = $('<option>').html(data[x].name)
								   .attr('value', data[x].id)
								   .attr("data-style", 'background-image: url(' + data[x].urls.logo + ');');
			sel.append(opt);
		}

		return sel;

	},
	getCB: function(id, label, on) {

		var wrap = $("<div>").addClass('ex_cb_' + id);
		var lbl  = $("<label>").html(label);
		var cb   = $("<input>").attr("type", "checkbox").attr('checked', on);

		return wrap.append(lbl, cb);

	},
	getInp: function(id, label, val, t) {

		var wrap = $("<div>").addClass('ex_cb_' + id);
		var lbl  = $("<label>").html(label);
		var inp   = $("<input>").val(val);

		if(t) {
			inp.attr('type', t);
		}

		return wrap.append(lbl, inp);

	},
	findExchange: function(exchange_id) {

		for(x in this.exchanges.config) {
			if(this.exchanges.config[x].id == exchange_id) {
				return this.exchanges.config[x];
			}
		}
		return false;

	},
	drawExchange: function(exchange_id, is_fees, is_limits, is_disabled, is_test, is_balance, auth) {

		var ex = this.findExchange(exchange_id);
		if(!ex) {
			return;
		}
		if(!auth) {
			auth = {
				login: "",
				key: "",
				secret: "",
			}
		}

		var wrp = $("<div>").addClass('exchange-wrap');
		var lbl = $("<h4>").html(ex.name).attr('exchange_id', exchange_id);
		var img = $("<img>").attr("src", ex.urls.logo);
		var rm  = $("<button>").text("X").addClass('exchange-remove');

		var fees     	 = this.getCB('fees', 'Load CCXT Fees', is_fees);
		var limits   	 = this.getCB('limits', 'Load CCXT Limits', is_limits);
		var disabled 	 = this.getCB('disabled', 'Disable Exchange', is_disabled);
		var testnet      = this.getCB('testnet', 'Use Testnet if possible', is_test);
		var balance      = this.getCB('balance', 'Load CCXT Balance', is_balance);

		
		var auth_key      = this.getInp('auth_key',      'Key', auth.key);
		var auth_secret   = this.getInp('auth_secret',   'Secret', auth.secret, 'password');
		var auth_password = this.getInp('auth_password', 'Password', auth.password, 'password');

		rm.click(function () {
			wrp.remove();
		});

		$('input', balance).on('change', function () {

			val = $(this).is(":checked");
			if(val) {
				auth_password.show();
				auth_key.show();
				auth_secret.show();
			} else {
				auth_password.hide();
				auth_key.hide();
				auth_secret.hide();
			}	

		}).trigger('change');

		return wrp.append(rm, img, lbl, fees, limits, disabled, testnet, balance, auth_key, auth_secret, auth_password);

	},
	draw: function() {

		var that = this;

		var el  = $("#exchange-manager-container");
		var sel = this.drawExchangeSelect(this.exchanges.config);
		
		this.ex_el = $("<div>").addClass('exchanges-config');

		// Append existing config
		if(this.conf.exchanges) {
			for(x in this.conf.exchanges) {
				var tmp = this.conf.exchanges[x];
				that.ex_el.append(that.drawExchange(tmp.id, tmp.fees, tmp.limits, tmp.disabled, tmp.testnet, tmp.balance, tmp.auth));
			}
		}

		el.append('<h4>Exchange Configuration</h4><br>', sel,this.ex_el, '<br>');

		sel.iconselectmenu({
	       change: function( event, data ) {
	       	console.log(event);
	       	console.log(data);
	       	that.ex_el.append(that.drawExchange(data.item.value, false, false, false, false, false, false));
	        $(".ui-selectmenu-text").html('Add an exchange');
	       }
     	});
     	$(".ui-selectmenu-text").html('Add an exchange');

	},

	init(node) {
		
		var that = this;
		this.node = node;
		this.conf = { exchanges: {} };

		if(node.conf) {
			try {
				this.conf = JSON.parse(node.conf);
			} catch(e) {
				// this.conf = {};
			}
		}

		$.getJSON('all_crypto_exchanges', function (data) {
			that.exchanges = data;
			that.draw();
		});

	},
	save(node) {

		var conf = { exchanges: {} };

		$(".exchanges-config .exchange-wrap").each(function () {

			var ex = {
				id: $('h4', this).attr('exchange_id'),
				name: $('h4', this).text(),
				fees: $('.ex_cb_fees input', this).is(":checked"),
				limits: $('.ex_cb_limits input', this).is(":checked"),
				disabled: $('.ex_cb_disabled input', this).is(":checked"),
				testnet: $('.ex_cb_testnet input', this).is(":checked"),
				balance: $('.ex_cb_balance input', this).is(":checked"),
				auth: {
					key:    $('.ex_cb_auth_key input', this).val(),
					secret: $('.ex_cb_auth_secret input', this).val(),
					password:  $('.ex_cb_auth_password input', this).val(),
				}
			}

			conf.exchanges[ex.id] = ex;

		});

		this.node.conf = JSON.stringify(conf);
		$("#node-input-conf").val(this.node.conf);

	}
}

symbolConfig = {

	drawExchangeSelect: function(data) {

		var that = this;

		var sel = $("<select>");
		for(x in data) {

			var opt = $('<option>').html(data[x].name)
								   .attr('value', data[x].id)
								   .attr("data-style", 'background-image: url(' + data[x].urls.logo + ');');
			sel.append(opt);
		}

		return sel;

	},
	save: function() {

		var extra = { flipped: [], exchanges: {} };

		$("#symbol-config-container .dir_wrap").each(function () {
			if($(".dir_2_inp", this).is(":checked")) {
				extra.flipped.push($(".dir_1_lbl", this).text());
			}
		});

		$(".exchanges-config .exchange-wrap").each(function () {

			var ex = {
				id: $('h4', this).attr('exchange_id'),
				name: $('h4', this).text(),
				fees: $('.ex_cb_fees input', this).is(":checked"),
				limits: $('.ex_cb_limits input', this).is(":checked"),
				disabled: $('.ex_cb_disabled input', this).is(":checked"),
				testnet: $('.ex_cb_testnet input', this).is(":checked"),
				balance: $('.ex_cb_balance input', this).is(":checked"),
				auth: {
					key:    $('.ex_cb_auth_key input', this).val(),
					secret: $('.ex_cb_auth_secret input', this).val(),
					password:  $('.ex_cb_auth_password input', this).val(),
				}
			}

			extra.exchanges[ex.id] = ex;

		});

		this.node.extra = JSON.stringify(extra);
		$("#node-input-extra").val(this.node.extra);

	},
	getCB: function(id, label, on) {

		var wrap = $("<div>").addClass('ex_cb_' + id);
		var lbl  = $("<label>").html(label);
		var cb   = $("<input>").attr("type", "checkbox").attr('checked', on);

		return wrap.append(lbl, cb);

	},
	getInp: function(id, label, val, t) {

		var wrap = $("<div>").addClass('ex_cb_' + id);
		var lbl  = $("<label>").html(label);
		var inp   = $("<input>").val(val);

		if(t) {
			inp.attr('type', t);
		}

		return wrap.append(lbl, inp);

	},
	findExchange: function(exchange_id) {

		for(x in this.exchanges.config) {
			if(this.exchanges.config[x].id == exchange_id) {
				return this.exchanges.config[x];
			}
		}
		return false;

	},
	drawExchange: function(exchange_id, is_fees, is_limits, is_disabled, is_test, is_balance, auth) {

		var ex = this.findExchange(exchange_id);
		if(!ex) {
			return;
		}
		if(!auth) {
			auth = {
				login: "",
				key: "",
				secret: "",
			}
		}

		var wrp = $("<div>").addClass('exchange-wrap');
		var lbl = $("<h4>").html(ex.name).attr('exchange_id', exchange_id);
		var img = $("<img>").attr("src", ex.urls.logo);
		var rm  = $("<button>").text("X").addClass('exchange-remove');

		var fees     	 = this.getCB('fees', 'Load CCXT Fees', is_fees);
		var limits   	 = this.getCB('limits', 'Load CCXT Limits', is_limits);
		var disabled 	 = this.getCB('disabled', 'Disable Exchange', is_disabled);
		var testnet      = this.getCB('testnet', 'Use Testnet if possible', is_test);
		var balance      = this.getCB('balance', 'Load CCXT Balance', is_balance);

		
		var auth_key      = this.getInp('auth_key',      'Key', auth.key);
		var auth_secret   = this.getInp('auth_secret',   'Secret', auth.secret, 'password');
		var auth_password = this.getInp('auth_password', 'Password', auth.password, 'password');

		rm.click(function () {
			wrp.remove();
		});

		$('input', balance).on('change', function () {

			val = $(this).is(":checked");
			if(val) {
				auth_password.show();
				auth_key.show();
				auth_secret.show();
			} else {
				auth_password.hide();
				auth_key.hide();
				auth_secret.hide();
			}	

		}).trigger('change');

		return wrp.append(rm, img, lbl, fees, limits, disabled, testnet, balance, auth_key, auth_secret, auth_password);

	},
	draw: function() {

		var that = this;

		//console.log('SCONFIG DRAW');

		var sel = this.drawExchangeSelect(this.exchanges.config);
		  
		console.log(this.exchanges);

		var el  = $("#symbol-config-container");
		var sym = this.node.symbols.split("\n");
		this.ex_el = $("<div>").addClass('exchanges-config');

		// Append existing config
		if(this.conf.exchanges) {
			for(x in this.conf.exchanges) {
				var tmp = this.conf.exchanges[x];
				that.ex_el.append(that.drawExchange(tmp.id, tmp.fees, tmp.limits, tmp.disabled, tmp.testnet, tmp.balance, tmp.auth));
			}
		}

		var fs = $("<fieldset>");

		for(x in sym) {

			var sym_1    = sym[x];
			var sym_2    = sym[x].split('/').reverse().join('/');

			var sym_1_checked = this.conf.flipped.indexOf(sym[x]) > -1 ? false : true;
			var sym_2_checked = !sym_1_checked;

			var wrp = $("<div>").addClass('dir_wrap');

			var lbl1 = $("<label>").html(sym_1).attr("for", "radio-" + sym_1).addClass('dir_1_lbl');
			var rad1 = $("<input>").attr("type", "radio").attr("name", "radio-" + sym_1).addClass('dir_1_inp').attr('checked', sym_1_checked);

			var lbl2 = $("<label>").html(sym_2).attr("for", "radio-" + sym_1).addClass('dir_2_lbl');
			var rad2 = $("<input>").attr("type", "radio").attr("name", "radio-" + sym_1).addClass('dir_2_inp').attr('checked', sym_2_checked);

			fs.append(wrp.append(rad1, lbl1, lbl2, rad2));

		}

		// Some Inline HTML..
		el.append('<h4>Set exchange specific configuration</h4>', sel,this.ex_el);
		el.append('<h4>Set exchange symbol direction</h4>', fs);

		sel.iconselectmenu({
	       change: function( event, data ) {

	       	that.ex_el.append(that.drawExchange(data.item.value, false, false, false, false, false, false));
	        $(".ui-selectmenu-text").html('Add an exchange');

	       }
     	});
		$(".ui-selectmenu-text").html('Add an exchange');

	},
	init: function(node) {

		$("#node-input-exchanges").parent().hide();

		

		var that = this;

		//console.log(node);

		this.node = node;
		this.conf = { flipped: [ 'XBT/USD' ], exchanges: [] };

		if(node.extra) {
			try {
				this.conf = JSON.parse(node.extra);
			} catch(e) {
				// this.conf = {};
			}
		}

		$.getJSON('all_crypto_exchanges', function (data) {
			that.exchanges = data;
			that.draw();
		});

	}

}

genericExchange = {
	save: function () {
		//this.node.name = this.name;
		this.node.icon = this.node.exchange_id.toLowerCase() + '.png';
	},
	draw_exchange: function(data) {

		var that = this;

		$('#generic_exchange').remove();
		var el = $('<div>').attr('id', 'generic_exchange');
		$('#node-input-name').after(el);

		var reset = $("<button>").html('Reset').click(function () {
			that.node.name = '';
			that.node.exchange_id = '';
			that.node.icon = '';
			$('#node-input-name').val(that.node.name);
			$('#node-input-exchange_id').val(that.node.exchange_id);
			that.init(that.node);
		});

		el.append(reset);
		el.append($("<img>").attr('src', data.config.urls.logo));
		el.append('<br>URLS ::');
		el.append(JSON.stringify(data.config.urls));
		el.append('<br>FEES ::');
		el.append('<br>');
		el.append(JSON.stringify(data.config.fees));

	},
	draw_exchange_select: function(config) {

		var that = this;
		$('#generic_exchange').remove();
		var el = $('<div>').attr('id', 'generic_exchange');
		$('#node-input-name').after(el);

		var data = config.config;

		for(x in data) {

			var name = $('<label>').html(data[x].name).attr('exchange-id', data[x].id);
			var icon = $('<img>').attr('src', data[x].urls.logo);
			el.append($("<div>").append(name,icon));

			name.click(function () {
				that.node.name 		 = $(this).html();
				that.node.icon 		 = $(this).next().attr('src');
				that.node.exchange_id = $(this).attr('exchange-id');
				$('#node-input-name').val(that.node.name);
				$('#node-input-exchange_id').val(that.node.exchange_id);
				that.init(that.node);
			});

		}

	},
	init: function (node) {

		var that = this;
		this.node = node;
		console.log(node);

		//if(node.icon) { this.icon = node.icon };
		//if(node.exchange_id) { this.exchange_id = node.exchange_id };
		//if(node.name) { node.exchange_id };

		if(node.name && node.exchange_id) {
			
			$.getJSON('crypto_exchange_markets?exchange=' + node.exchange_id, function (data) {
				that.draw_exchange(data);
			});

		} else {
			$.getJSON('all_crypto_exchanges', function (data) {
				that.draw_exchange_select(data);
			});
			

		}
		
	}
}

/*
$(function () {

	$.widget( "custom.iconselectmenu", $.ui.selectmenu, {

		_renderItem: function( ul, item ) {

			var li = $( "<li>" ),
			wrapper = $( "<div>", { text: item.label } );

			if ( item.disabled ) {
			  li.addClass( "ui-state-disabled" );
			}

			$( "<span>", {
			  style: item.element.attr( "data-style" ),
			  css: { position: 'absolute', left: 140, width: 90, height: 24 }
			})
			  .appendTo( wrapper );

			return li.append( wrapper ).appendTo( ul );

		}

	});

});
*/