Commit 6c548ed3 authored by Oleg Dzhimiev's avatar Oleg Dzhimiev
Browse files

formatting

parent 7b531c9a

index.css

+14 −4
Original line number Diff line number Diff line
@@ -37,6 +37,7 @@ button { 
table {

  border: 1px solid rgba(200,200,200,1);

  border-collapse:collapse;

  /*background: rgba(200,200,200,0.6);*/

}



#elements_table_header, #controls_table, #ray_draw_table{
@@ -82,13 +83,13 @@ input{ 


#links{

  position: absolute;

  left:1014;

  left:1010;

  top:74px;

}



#info{

  position: absolute;

  left:1014;

  left:1010;

  top:225px;

}
@@ -122,7 +123,16 @@ input{ 
}



#elements_table{

  padding: 0px 0px 0px 0px;

  /*padding: 5px 5px 5px 5px;*/

  background: rgba(200,200,200,0.6);

}



#links table, #info table{

  border:0px;

  background: white;

}



#info td, #links td{

  width: 120px;

  text-align:left;

}

index.html

+14 −14
Original line number Diff line number Diff line
@@ -40,19 +40,18 @@ Copyright (C) 2014 Elphel, Inc. 
    <div id="elements_table_header_div">

      <table id="elements_table_header">

      <tr id="header">

	<td><div style="width:16px;">#</div></td>

	<td width=16><div style="width:16px;">#</div></td>

	<td width=100 >Distance, <span style="font-size:0.8em">mm</span></td>

	<td width=100 >Thickness, <span style="font-size:0.8em">mm</span></td>

	<td width=100 >Material</td>

	<td width=100 >Comment</td>

	<td width=24></td>

	<td>Aperture<span style="font-size:0.8em"> (Dia)</span>, <span style="font-size:0.8em">mm</span></td>

	<td colspan=2 width=137>Aperture<span style="font-size:0.8em"> (Dia)</span>, <span style="font-size:0.8em">mm</span></td>

	<td width=100 >R<span style="font-size:0.8em">(curve)</span>, <span style="font-size:0.8em">mm</span></td>

	<td width=100 >&kappa;</td>

	<td width=100 >&alpha;<span style="font-size:0.8em"><sub>1</sub>&nbsp;(r<sup>2</sup>)</span></td>

	<td width=100 >&alpha;<span style="font-size:0.8em"><sub>2</sub>&nbsp;(r<sup>4</sup>)</span></td>

	<td width=100 >&alpha;<span style="font-size:0.8em"><sub>3</sub>&nbsp;(r<sup>6</sup>)</span></td>

	<td width=95 >&alpha; <span style="font-size:0.8em"><sub>4</sub>&nbsp;(r<sup>8</sup>)</span></td>

	<td width=100 >&alpha; <span style="font-size:0.8em"><sub>4</sub>&nbsp;(r<sup>8</sup>)</span></td>

	<td><button class='plus_button' onclick="element_add_button()"><b>+</b></button></td>

      </tr>

      </table>
@@ -75,30 +74,31 @@ Copyright (C) 2014 Elphel, Inc. 
      </tr>      

      <tr>

	<td><button onclick="rays_draw()">Draw rays</button></td>

	<td></td>

      </tr>

      </table>

    </div>

    <div id="links">

      <table style="border:0px">

      <table>

      <tr>

	<td width=120 style="text-align:left"><div id="link_local"></div></td>

	<td width=120 style="text-align:left"><div id="link_remote"></div></td>

	<td><div id="link_local"></div></td>

	<td><div id="link_remote"></div></td>

      </tr>

      <tr>

	<td width=120 style="text-align:left"><div id="link"></div></td>

	<td width=120 style="text-align:left"><div id="link_dl"></div></td>

	<td><div id="link"></div></td>

	<td><div id="link_dl"></div></td>

      </tr>

      </table>

    </div>

    <div id="info">

      <table style="border:0px">

      <table>

	<tr>

	  <td style="text-align:left">Rays width, <span style="font-size:0.8em">mm</span></td>

	  <td style="text-align:left"><div id="crw"></div></td>

	  <td>Rays width, <span style="font-size:0.8em">mm</span></td>

	  <td><div id="crw"></div></td>

	</tr>

	<tr>

	  <td style="text-align:left">Field ray angle, <span style="font-size:0.8em">&deg;</span></td>

	  <td style="text-align:left"><div id="mra"></div></td>

	  <td>Field ray angle, <span style="font-size:0.8em">&deg;</span></td>

	  <td><div id="mra"></div></td>

	</tr>

      </table>

    </div>

lens_design.js

+10 −22
Original line number Diff line number Diff line
@@ -149,7 +149,7 @@ function table_update_all(){ 
    html += "\t\t<td><input type='text' id='name' value='"+e[i].name+"'\></td>\n";

    //aperture stop if <0

    if (e[i].front.h>=0) {

	html += "\t<td><span style='font-size:0.8em;'>front</span></td>\n";

	html += "\t<td width=26><span style='font-size:0.8em;'>front</span></td>\n";

	html += "\t\t<td><input type='text' id='front_height' value='"+e[i].front.h+"'\></td>\n";

	html += "\t\t<td><input type='text' id='front_curve' value='"+e[i].front.c+"'\></td>\n";

	html += "\t\t<td><input type='text' id='front_k' value='"+e[i].front.k+"'\></td>\n";
@@ -166,13 +166,14 @@ function table_update_all(){ 
	}

	html += "\t\t<td><button class='remove_button'><b>&ndash;</b></button></td>\n";

	html += "\t</tr>\n";

	

	html += "\t<tr>\n";

	html += "\t<td></td>\n";

	html += "\t<td></td>\n";

	html += "\t<td></td>\n";

	html += "\t<td></td>\n";

	html += "\t<td></td>\n";

	html += "\t<td><span style='font-size:0.8em;'>back</span></td>\n";

	html += "\t<td width=26><span style='font-size:0.8em;'>back</span></td>\n";

	html += "\t<td><input type='text' id='back_height' value='"+e[i].back.h+"'\></td>\n";

	html += "\t<td><input type='text' id='back_curve' value='"+e[i].back.c+"'\></td>\n";

	html += "\t<td><input type='text' id='back_k' value='"+e[i].back.k+"'\></td>\n";
@@ -187,15 +188,16 @@ function table_update_all(){ 
	  html += "\t\t<td width=100 ></td>\n";

	  html += "\t\t<td width=100 ></td>\n";

	}

	html += "\t<td></td>\n";

    }else{//aperture case

 	html += "\t\t<td width=24 ></td>\n";

 	html += "\t\t<td width=26></td>\n";

	html += "\t\t<td><input type='text' id='front_height' value='"+e[i].front.h+"'\></td>\n";

	html += "\t\t<td width=100 ></td>\n";

	html += "\t\t<td width=100 ></td>\n";

	html += "\t\t<td width=100 ></td>\n";

	html += "\t\t<td width=100 ></td>\n";

	html += "\t\t<td width=100 ></td>\n";

	html += "\t\t<td width=102 ></td>\n";

	html += "\t\t<td width=100 ></td>\n";

	html += "\t\t<td><button class='remove_button'><b>&ndash;</b></button></td>\n";       

    }

    html += "\t</tr>\n";
@@ -210,24 +212,10 @@ function table_update_all(){ 
  });

  //bind onchange

  for(var i=0;i<e.length;i++){  

    $("#element_"+e[i].id).find("#distance").change(function(){element_onchange_redraw($(this).parent().parent().parent().parent().attr("value"));});

    $("#element_"+e[i].id).find("#thickness").change(function(){element_onchange_redraw($(this).parent().parent().parent().parent().attr("value"));});

    $("#element_"+e[i].id).find("#material").change(function(){element_onchange_redraw($(this).parent().parent().parent().parent().attr("value"));});

    $("#element_"+e[i].id).find("#name").change(function(){element_onchange_redraw($(this).parent().parent().parent().parent().attr("value"));});

    $("#element_"+e[i].id).find("#front_height").change(function(){element_onchange_redraw($(this).parent().parent().parent().parent().attr("value"));});

    $("#element_"+e[i].id).find("#front_curve").change(function(){element_onchange_redraw($(this).parent().parent().parent().parent().attr("value"));});

    $("#element_"+e[i].id).find("#front_k").change(function(){element_onchange_redraw($(this).parent().parent().parent().parent().attr("value"));});

    $("#element_"+e[i].id).find("#front_a1").change(function(){element_onchange_redraw($(this).parent().parent().parent().parent().attr("value"));});

    $("#element_"+e[i].id).find("#front_a2").change(function(){element_onchange_redraw($(this).parent().parent().parent().parent().attr("value"));});

    $("#element_"+e[i].id).find("#front_a3").change(function(){element_onchange_redraw($(this).parent().parent().parent().parent().attr("value"));});

    $("#element_"+e[i].id).find("#front_a4").change(function(){element_onchange_redraw($(this).parent().parent().parent().parent().attr("value"));});

    $("#element_"+e[i].id).find("#back_height").change(function(){element_onchange_redraw($(this).parent().parent().parent().parent().attr("value"));});

    $("#element_"+e[i].id).find("#back_curve").change(function(){element_onchange_redraw($(this).parent().parent().parent().parent().attr("value"));});

    $("#element_"+e[i].id).find("#back_k").change(function(){element_onchange_redraw($(this).parent().parent().parent().parent().attr("value"));});

    $("#element_"+e[i].id).find("#back_a1").change(function(){element_onchange_redraw($(this).parent().parent().parent().parent().attr("value"));});

    $("#element_"+e[i].id).find("#back_a2").change(function(){element_onchange_redraw($(this).parent().parent().parent().parent().attr("value"));});

    $("#element_"+e[i].id).find("#back_a3").change(function(){element_onchange_redraw($(this).parent().parent().parent().parent().attr("value"));});

    $("#element_"+e[i].id).find("#back_a4").change(function(){element_onchange_redraw($(this).parent().parent().parent().parent().attr("value"));});

    

    $("#element_"+e[i].id).find("input").each(function(){

      $(this).change(function(){element_onchange_redraw($(this).parent().parent().parent().parent().attr("value"))});

    });

    

    $("#element_"+e[i].id).find("#number").click(function(event){

	//enable_deselect=false;