cancer_predict/app/assets/javascripts/cancer_predict.js

$(document).ready(function(){
	Array.prototype.remove_item_from_array = function(){
		var result_array = this;
		for(var i=0;i<arguments.length;i++){
			if(Array.isArray(arguments[i])){
				for(var j=0;j<arguments.length;j++){
					var index = result_array.indexOf(arguments[i][j]);
					if(index == -1)
						continue;
					else{
						result_array = result_array.slice(0, index).concat(result_array.slice(index + 1, result_array.length));
					}
				}
			}else{
				var index = result_array.indexOf(arguments[i]);
				if(index == -1)
					continue;
				else{
					result_array = result_array.slice(0, index).concat(result_array.slice(index + 1, result_array.length));
				};
			};
		};
		result_array.push = this.push;
		result_array.remove_item_from_array = this.remove_item_from_array;
		return result_array;
	};
	$('.cancer_help_btn').append('<i aria-hidden="true" class="fa fa-question"></i>');
	$('.cancer_help_btn').off("click").on('click',function(){
		var modal_head = "";
		try{ modal_head = $(this).parent().find(">label").html()}catch{};
		var modal_body = "";
		try{ modal_body = $(this).parent().find(">input.help_texts").attr('value')}catch{};
		$('#show_help_modal').html("<div class='modal-dialog'><div class='modal-content'><div class='modal-header'><button type='button' aria-hidden='true' class='close'>×</button><h4 class='modal-title'>"+modal_head+"</h4>"+
			"</div><div class='modal-body'>"+modal_body+"</div><div class='modal-footer'><button type='button' class='btn btn-default'>Close</button></div></div></div>")
		$('#show_help_modal').modal('show');
		$('#show_help_modal .close').off("click").on('click',function(){
			$('#show_help_modal').modal('hide');
		});
		$('#show_help_modal .modal-footer button').off("click").on('click',function(){
			$('#show_help_modal').modal('hide');
		});
	});
	$('.btn-add').click(function(){
		$(this).parent().find('.num_only').removeClass('cancertable_empty');
		if($(this).parent().find('.num_only').val()!=""){
			var input_value = Number($(this).parent().find('.num_only').val());
			if(Array.isArray($(this).parent().find('.num_only').data('range'))){
				var compare_value = $(this).parent().find('.num_only').data('range')[1];
				if(compare_value != undefined){
					if(input_value+1 <= Number(compare_value))
						$(this).parent().find('.num_only').val(input_value+1);
					else{
						input_value = $(this).parent().find('.num_only').data('range')[0];
						if(input_value != undefined)
							$(this).parent().find('.num_only').val(input_value);
					};
				}else{
					$(this).parent().find('.num_only').val(input_value+1);
				};
				compare_value = $(this).parent().find('.num_only').data('range')[0];
				if(compare_value != undefined){
					if($(this).parent().find('.num_only').val() >= compare_value){
						$(this).parent().find('.num_only').removeClass('cancertable_empty');
						$(this).parent().find('.num_only').css('color','#333');
					};
					if($('.cancertable_empty').length == 0){
						$('#danger_texts').remove();
					};
				}else{
					$(this).parent().find('.num_only').removeClass('cancertable_empty');
					$(this).parent().find('.num_only').css('color','#333');
					if($('.cancertable_empty').length == 0){
						$('#danger_texts').remove();
					};
				};
			};
		}else{
			try{
				var input_value = $(this).parent().find('.num_only').data('range')[0];
				if(input_value != undefined)
					$(this).parent().find('.num_only').val(input_value);
			}catch{
				$(this).parent().find('.num_only').val(0);
			};
			if($(this).parent().find('.num_only').val() != ""){
				$(this).parent().find('.num_only').removeClass('cancertable_empty');
				$(this).parent().find('.num_only').css('color','#333');
			};
		};
	});
	$('.btn-sub').click(function(){
		if($(this).parent().find('.num_only').val()!=""){
			var input_value = Number($(this).parent().find('.num_only').val());
			if(Array.isArray($(this).parent().find('.num_only').data('range'))){
				var compare_value = $(this).parent().find('.num_only').data('range')[0];
				if(compare_value != undefined){
					if(input_value-1 >= Number(compare_value))
						$(this).parent().find('.num_only').val(input_value-1);
					else{
						input_value = $(this).parent().find('.num_only').data('range')[1];
						if(input_value != undefined)
							$(this).parent().find('.num_only').val(input_value);
					};
				}else{
					$(this).parent().find('.num_only').val(input_value-1);
				};
				compare_value = $(this).parent().find('.num_only').data('range')[1];
				if(compare_value != undefined){
					if($(this).parent().find('.num_only').val() <= compare_value){
						$(this).parent().find('.num_only').removeClass('cancertable_empty');
						$(this).parent().find('.num_only').css('color','#333');
					};
					if($('.cancertable_empty').length == 0){
						$('#danger_texts').remove();
					};
				}else{
					$(this).parent().find('.num_only').removeClass('cancertable_empty');
					$(this).parent().find('.num_only').css('color','#333');
					if($('.cancertable_empty').length == 0){
						$('#danger_texts').remove();
					};
				};
			};
		}else{
			try{
				var input_value = $(this).parent().find('.num_only').data('range')[1];
				if(input_value != undefined){
					$(this).parent().find('.num_only').val(input_value);
				}else{
					input_value = $(this).parent().find('.num_only').data('range')[0];
					if(input_value != undefined)
						$(this).parent().find('.num_only').val(input_value);
				}
			}catch{
				$(this).parent().find('.num_only').val(0);
			};
			if($(this).parent().find('.num_only').val() != ""){
				$(this).parent().find('.num_only').removeClass('cancertable_empty');
				$(this).parent().find('.num_only').css('color','#333');
			};
		};
		if($('.cancertable_empty').length == 0){
			$('#danger_texts').remove();
		};
	});
	$('.cancer_table_btn').off('click').on('click',function(){
		var index = $(this).index()/2;
		try{
			$(this).parent().find('>input').attr('value',0);
			$(this).parent().find('>input').eq(index).attr('value',1);
			$(this).parent().find('>button').removeClass('active');
			$(this).parent().removeClass('cancertable_empty');
			if($('.cancertable_empty').length == 0){
				$('#danger_texts').remove();
			};
		}catch{};
		$(this).addClass('active');
	});
	$('#cancer_table_reset').click(function(){
		$('.cancer_table_btn').removeClass('active');
		$('.cancer-btn-group input').attr('value',0);
		$('.num_only').val('');
		$('#cancer_table .cancer_form_field').removeClass('cancertable_empty');
		$('#cancer_predict_result_block').css('display','none');
	});
	$('#cancer_table_submit').click(function(){
		var flag;
		flag = 1;
		for(var i = 0;i < $('#cancer_table .cancer_form_field').length;i++){
			if($('#cancer_table .cancer_form_field').eq(i).hasClass('num_only')){
				if($('#cancer_table .cancer_form_field').eq(i).val()==""){
					flag = 0;
					$('#cancer_table .cancer_form_field').eq(i).addClass('cancertable_empty');
				}else{
					$('#cancer_table .cancer_form_field').eq(i).removeClass('cancertable_empty');
				};
			}else{
				if($('#cancer_table .cancer_form_field').eq(i).find('[value="1"]').length == 0){
					flag = 0;
					$('#cancer_table .cancer_form_field').eq(i).addClass('cancertable_empty');
				}else{
					$('#cancer_table .cancer_form_field').eq(i).removeClass('cancertable_empty');
				}
			};
		}
		if($('.cancertable_empty').length != 0){
			flag = 0;
			$('#cancer_table_submit').parent().before('<a id="danger_texts" style="color:red;">請注意紅框的輸入資料是否符合要求</a>');
			$('#danger_texts').css('margin-left',$(window).width()/2-$('#danger_texts').width()/2);
		}else{
			$('#danger_texts').remove();
		};
		if(flag == 1){
			var post_json= {};
			for(var i = 0;i < $('#cancer_table .cancer_form_field').length;i++){
				var name = $('#cancer_table .cancer_form_field').eq(i).attr('id')
				if($('#cancer_table .cancer_form_field').eq(i).hasClass('num_only'))
					post_json[name] = $('#cancer_table .cancer_form_field').eq(i).val();
				else{
					var index = ($('#cancer_table .cancer_form_field').eq(i).find('[value="1"]').index()+1)/2;
					post_json[name] = index;
				};
			};
			post_json['locale'] = I18n.locale;
			var result = $.post("/cancerpredictResult",{"data":post_json});
			result.done(function(){
				var load_heml = $('#result_table_content').html(result.responseJSON.table);
				load_heml.ready(function(){
					$('#result_table_content .cancer_years').eq(0).addClass('active');
					for(var i = 0;i < $('#result_table_content .cancer_years').length;i++){
						$('#result_table_content .cancer_years').eq(i).attr('index',i)
					};
					$('#result_table_content .cancer_years').off('click').on('click',function(){
						try{
							$(this).parent().find('.cancer_years').removeClass('active');
							//$('#result_text_content .cancer_years').eq($(this).attr('index')).click();
						}catch{};
						$(this).addClass('active');
						$('#current_year').attr('index',$(this).attr('index'));
						$('#current_year').attr('value',$(this).html());
						$('#current_year').change();
					});
				});
				load_heml = $('#result_text_content').html(result.responseJSON.texts);
				load_heml.ready(function(){
					$('#result_text_content .cancer_years').eq(0).addClass('active');
					for(var i = 0;i < $('#result_text_content .cancer_years').length;i++){
						$('#result_text_content .cancer_years').eq(i).attr('index',i)
					};
					$('#result_text_content .cancer_years').off('click').on('click',function(){
						try{
							$(this).parent().find('.cancer_years').removeClass('active');
							//$('#result_table_content .cancer_years').eq($(this).attr('index')).click();
						}catch{};
						$(this).addClass('active');
						$('#current_year').attr('value',$(this).html());
						$('#current_year').attr('index',$(this).attr('index'));
						$('.surgery_year').html($(this).html());
						$('#current_year').change();
					});
					$('#cancer_table_right_result .cancer-btn-group .cancer_table_btn').removeClass('active');
					$('#cancer_table_right_result .cancer-btn-group >input').attr('value',"0");
					for(var i = 0;i < $('#cancer_table_left_result .cancer-btn-group').length;i++){
						$('#cancer_table_right_result .cancer-btn-group').eq(i).find('.cancer_table_btn').eq(0).addClass('active');
						$('#cancer_table_right_result .cancer-btn-group').eq(i).find('>input').eq(0).attr('value',"1");
					};
					for(var i = 0;i < $('#cancer_table_right_result .cancer-btn-group').length;i++){
						$('#cancer_table_right_result .cancer-btn-group').eq(i).find('.cancer_table_btn').eq(0).addClass('active');
						$('#cancer_table_right_result .cancer-btn-group').eq(i).find('>input').eq(0).attr('value',"1");
					};
					var treatmeny_method = result.responseJSON.treatmeny_method;
					$('tr.'+treatmeny_method[0]).addClass('tr_show')
					var lpv = [0,-0.8397,-0.4147,-0.3203,0.3321];
					var servive_ratio_arr = [result.responseJSON.servive_ratio]
					var yes = (I18n.locale=="zh_tw") ? "是" : "yes";
					var year = $('#current_year').attr('value');
					var active_treatment = ['Surgery_only'];
					$('tr.'+active_treatment[0]+' .Overall_Survival').html(servive_ratio_arr[0]+'%');
					$('#cancer_predict_result_block').css('display','block');
					var lpv_real = [result.responseJSON['lpv']];
					var lpv_dict={}
					var lpv_calc={1:-0.001476145,3:-0.01261639,5:-0.02519608}
					active_treatment.push = function() {
						if(arguments.length == 1){
							var year = $('#current_year').attr('value');
							var lpv_current = lpv_real[lpv_real.length-1]+lpv_dict[arguments[0]];
							lpv_real.push(lpv_current);
							var servive_ratio = Math.round((Math.exp(lpv_calc[year])**Math.exp(lpv_current))*100);
							var benefit = servive_ratio - servive_ratio_arr[servive_ratio_arr.length - 1];
							servive_ratio_arr.push(servive_ratio);
							$('tr.'+arguments[0]+' td.Overall_Survival').html(servive_ratio+'%');
							$('tr.'+arguments[0]+' td.Additional_Benefit').html(benefit+'%');
							$('tr.'+arguments[0]).css('display','table-row');
							$('tr.tr_show').eq(-1).after($('tr.'+arguments[0]));
							$('tr.'+arguments[0]).addClass('tr_show');
							if(this.length == 1){
								$('.addition').css('display','block');
								$('#result_text_content .extra-text').css('display','inline-block');
							}
							var add_choices = this.slice(1,this.length);
							add_choices.push(arguments[0]);
							var add_choices_transform = [];
							for(var i = 0;i<add_choices.length;i++){
								add_choices_transform.push($('[for="'+add_choices[i]+'"]').html())
							};
							var add_choices_str = add_choices_transform.slice(0,add_choices_transform.length-1).join('、');
							if(add_choices_transform.length >= 2)
								add_choices_str += ('以及'+add_choices_transform[add_choices_transform.length-1])
							else
								add_choices_str = add_choices_transform[0];
							var new_text = '<p class="texts_show">'+'<a>100 位在術後有接受</a><a class="'+arguments[0]+' choices">'+add_choices_str+'</a><a>的婦女中，有 </a>'+'<a class="'+arguments[0]+' Overall_Survival">'+servive_ratio+'</a>'+'<a> 位婦女，術後 </a>'+'<a class="surgery_year">'+year+'</a>'+'<a>年仍為存活(多了</a>'+'<a class="'+arguments[0]+' Additional_Benefit">'+benefit+'</a><a>位)</a>'+'</p>';
							$('#result_text_content .extra-text .texts_show').eq(-1).after(new_text)
							return Array.prototype.push.apply(this, arguments);
						}else{
							return Array.prototype.push.apply(this, arguments);
						}
					};
					active_treatment.remove_item_from_array = function(){
						if(arguments.length == 1 && !Array.isArray(arguments[0])){
							var index = this.indexOf(arguments[0])
							var year = $('#current_year').attr('value');
							if(index < this.length - 1){
								for(var i = index + 1;i < this.length; i++){
									lpv_real[i] -= lpv_dict[arguments[0]];
									var servive_ratio = Math.round((Math.exp(lpv_calc[year])**Math.exp(lpv_real[i]))*100);
									var benefit = servive_ratio - servive_ratio_arr[servive_ratio_arr.length - 1];
									$('tr.'+active_treatment[i]+' td.Overall_Survival').html(servive_ratio+'%');
									$('.'+active_treatment[i]+'.Overall_Survival').html(servive_ratio);
									$('tr.'+active_treatment[i]+' td.Additional_Benefit').html(benefit+'%');
									$('.'+active_treatment[i]+'.Additional_Benefit').html(benefit);
								};
								var add_choices = [];
								for(var i = 1;i < this.length; i++){
									if(i != index){
										add_choices.push(this[i]);
										var add_choices_transform = [];
										for(var j = 0;j<add_choices.length;j++){
											add_choices_transform.push($('[for="'+add_choices[j]+'"]').html())
										};
										var add_choices_str = add_choices_transform.slice(0,add_choices_transform.length-1).join('、');
										if(add_choices_transform.length >= 2)
											add_choices_str += ('以及'+add_choices_transform[add_choices_transform.length-1])
										else
											add_choices_str = add_choices_transform[0];
										$('.'+active_treatment[i]+'.choices').html(add_choices_str);
									}
								};
							};
							$('tr.'+arguments[0]+' td.Overall_Survival').html('-');
							$('tr.'+arguments[0]+' td.Additional_Benefit').html('-');
							$('tr.'+arguments[0]).css('display','none');
							$('tr.'+arguments[0]).removeClass('tr_show');
							$('a.'+arguments[0]).eq(0).parent().remove();
							lpv_real = lpv_real.remove_item_from_array(lpv_real[index]);
							servive_ratio_arr = servive_ratio_arr.remove_item_from_array(servive_ratio_arr[index]);
							if(this.length == 2){
								$('.addition').css('display','none');
								$('#result_text_content .extra-text').css('display','none');
							};
							return Array.prototype.remove_item_from_array.apply(this, arguments);
						}else{
							return Array.prototype.remove_item_from_array.apply(this, arguments);
						};
					};
					for(var i = 0;i<treatmeny_method.length;i++){
						lpv_dict[treatmeny_method[i]] = lpv[i];
						$('#'+treatmeny_method[i]+' .cancer_table_btn').eq(1).click(function(){
							if(!active_treatment.includes($(this).parent().attr('id'))){
								active_treatment.push($(this).parent().attr('id'))
								console.log(active_treatment);
								console.log(servive_ratio_arr);
							};
						});
						$('#'+treatmeny_method[i]+' .cancer_table_btn').eq(0).click(function(){
							if(active_treatment.includes($(this).parent().attr('id'))){
								active_treatment = active_treatment.remove_item_from_array($(this).parent().attr('id'));
								console.log(active_treatment);
								console.log(servive_ratio_arr);
							};
						});
					};
					$('#current_year').change(function(){
						$('.surgery_year').html($(this).attr('value'));
						$('.cancer_years').removeClass('active');
						$('#result_text_content .cancer_years').eq($(this).attr("index")).addClass('active');
						$('#result_table_content .cancer_years').eq($(this).attr("index")).addClass('active');
						var year = $(this).attr('value');
						servive_ratio_arr = [];
						for(var i = 0;i<active_treatment.length;i++){
							var servive_ratio = Math.round((Math.exp(lpv_calc[year])**Math.exp(lpv_real[i]))*100);
							var benefit = servive_ratio - servive_ratio_arr[servive_ratio_arr.length-1];
							servive_ratio_arr.push(servive_ratio);
							$('tr.'+active_treatment[i]+' td.Overall_Survival').html(servive_ratio+'%');
							$('.'+active_treatment[i]+'.Overall_Survival').html(servive_ratio);
							if(i != 0){
								$('tr.'+active_treatment[i]+' td.Additional_Benefit').html(benefit+'%');
								$('.'+active_treatment[i]+'.Additional_Benefit').html(benefit);
							}
						}
						$('.'+active_treatment[0]+'.Overall_Survival').html(servive_ratio_arr[0]);
						$('.survive_person').html(servive_ratio+'%');
					});
				});
			})
		}
	});
	for(var i = 0;i < $('.result_tab').length;i++){
		$('.result_tab').eq(i).attr('index',i)
	};
	for(var i = 0;i < $('.result_content').length;i++){
		$('.result_content').eq(i).attr('index',i)
	};
	$('.result_tab').click(function(){
		var index = $(this).attr('index');
		$('.result_tab').removeClass('active');
		$(this).addClass('active');
		$('.result_content').css('display','none');
		$('.result_content[index="'+index+'"]').css('display','block');
	})
	$('.num_only').keypress(function(event){
		
		return event.keyCode>=48&&event.keyCode<=57||(this.value.indexOf('.')<0?event.keyCode==46:false);
	});
	$('.num_only').blur(function(){
		if( Number($(this).val()) < $(this).data('range')[0]){
			$(this).css('color','#f24a69');
			$(this).addClass('cancertable_empty');
			console.log($(this).val())
		}else{
			$(this).css('color','#333');
			$(this).removeClass('cancertable_empty');
			if($('.cancertable_empty').length == 0){
				$('#danger_texts').remove();
			};
		}
	})
});