「C-assign-2009-01-09-with-javascript」の編集履歴（バックアップ）一覧はこちら

「C-assign-2009-01-09-with-javascript」(2009/02/12 (木) 16:34:05) の最新版変更点

追加された行は緑色になります。

削除された行は赤色になります。

*2009年1月9日の宿題(Javascriptに因るアプローチ)
**序
Javascript (ECMA準拠だが)によるアプローチの場合、とりあえずブラウザ上での動作が基本であるが故、その土台となるHTMLを作成する必要が有る。そのHTMLソースはのちに示す。次にソース全文を掲載する。
#codehighlight(JavaScript){{
//const variable
str_id_form = "form_root";
str_id_input_textarea = "input_array_elements";
str_id_input_textbox  = "input_a_element";
str_id_output_results = "output_results";
str_style_results =
   "height : 40%; border: 1px solid #ccc; font-family: 'Courier New', monospace;";

//Point Constructer
function Point(x, y)
{
   this.x = x;
   this.y = y;
}
/*Point.prototype = {
   x : 0,
   y : 0
}*/
function Line(poly_array)
{
   this.from = new Point(poly_array[0], poly_array[1]);
   this.to = new Point(poly_array[2], poly_array[3]);
   this.setLength();
}
Line.prototype = {
   setLength : function()
   {
      this.length = Math.sqrt( Math.pow(this.from.x - this.to.x,2)
         + Math.pow(this.from.y - this.to.y,2) );
/*
      alert(typeof(this.from.x) +":"+ this.from.x + "\n"
         + typeof(this.from.y) +":"+ this.from.y + "\n"
         + typeof(this.to.x) +":"+ this.to.x + "\n"
         + typeof(this.to.y) +":"+ this.to.y + "\n"
         + typeof(this.length) +":"+ this.length);
*/
      return this.length;
   },
   toString : function()
   {
      return "(" + this.from.x + "," + this.from.y + ")," + 
             "(" + this.to.x   + "," + this.to.y   + ")";
   },
   print : function(idx)
   {
      document.getElementById(str_id_output_results).innerHTML
         += ++idx + ":" + this.toString() + ":" + this.length + "\n";
   }
}

// this must be friend function in C++? OR, use this obj/pointer?
function CompareLineLength(LineA, LineB)
{
   return (LineA.length - LineB.length);
}

function inputData()
{
   var str = document.getElementById(str_id_input_textarea).value;
   var Lines = new Array();
   var data_array = str.split('\n');
   for(i=0; i<data_array.length; ++i)
   {
      if(temp_poly = data_array[i].match(/\d+/g))
         Lines.push(new Line(temp_poly));
   }
   Lines.sort(CompareLineLength);
   for(i=0; i<Lines.length; ++i)
   {
      Lines[i].print(i);
   }
}

function setRandomData()
{
   var str = "";
   for(i=0; i<100; ++i)
   {
      for(j=0; j<4; ++j)
      {
         str += Math.floor( Math.random() * 1000);
         if(j==3)
            break;
         str += ",";
      }
      str += "\n";
   }
   document.getElementById(str_id_input_textarea).innerHTML = str;
}

function test()
{
   var A = new Array(new Line([0, 0, 6, 8]));
   A.push(new Line([0, 0, 3, 4]));
   A.sort(CompareLineLength);
   alert(A[0].length +","+A[1].length);
}

function init()
{
   var body = document.getElementsByTagName("body")[0];
   var form = document.createElement("form");
   form.setAttribute("id", str_id_form);
   form.setAttribute("style", "height : 40%");
/*
   var head_of_control = document.createElement("h2");
   var head_of_results = head_of_control.cloneNode(false);
   head_of_control.innerHTML = "Control";
   head_of_results.innerHTML = "Results";
*/
   var content_of_results = document.createElement("pre");
   content_of_results.setAttribute("id", str_id_output_results);
   content_of_results.setAttribute("style",
      str_style_results);
   content_of_results.innerHTML = "";

   var tbox = document.createElement("input");
   tbox.setAttribute("id", str_id_input_textbox);

   var tarea = document.createElement("textarea");
   tarea.setAttribute("id", str_id_input_textarea);

   var button_start = document.createElement("input");
   button_start.setAttribute("type", "button");
   button_start.setAttribute("value", "Start");
   button_start.addEventListener("click", inputData, false);

   var button_set_random = document.createElement("input");
   button_set_random.setAttribute("type", "button");
   button_set_random.setAttribute("value", "Randomize");
   button_set_random.addEventListener("click", setRandomData, false);

   var field_one = document.createElement("fieldset");
   field_one.appendChild(document.createElement("legend"));
   var field_any = field_one.cloneNode(true);
   var field_ope = field_one.cloneNode(true);
   field_one.getElementsByTagName("legend").item(0).innerHTML = "One Element";
   field_any.getElementsByTagName("legend").item(0).innerHTML = "Some Elements";
   field_ope.getElementsByTagName("legend").item(0).innerHTML = "Operations";
   field_one.appendChild(tbox);
   field_any.appendChild(tarea);
   field_ope.appendChild(button_start);
   field_ope.appendChild(button_set_random);
   form.appendChild(field_one);
   form.appendChild(field_any);
   form.appendChild(field_ope);
   body.appendChild(form);
   body.appendChild(content_of_results);
}
window.addEventListener("load", init, false);
}}
#codehighlight(HTML){{
<!DOCTYPE html
   PUBLIC "-//W3C//DTD XHTML 1.1//EN"
   "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja">
<head>
<title>オブジェクト指向</title>
<script type="text/javascript" src="softwareEx_200901.js">
</script>
</head>
<body>
<h1>オブジェクト指向</h1>
</body>
</html>
}}

*2009年1月9日の宿題(Javascriptに因るアプローチ)
**序
Javascript (ECMA準拠だが)によるアプローチの場合、とりあえずブラウザ上での動作が基本であるが故、その土台となるHTMLを作成する必要が有る。そのHTMLソースはのちに示す。次にソース全文を掲載する。
#codehighlight(JavaScript){{
//const variable
str_id_form = "form_root";
str_id_input_textarea = "input_array_elements";
str_id_input_textbox  = "input_a_element";
str_id_output_results = "output_results";
str_style_results =
   "height : 40%; border: 1px solid #ccc; font-family: 'Courier New', monospace;";

//Point Constructer
function Point(x, y)
{
   this.x = x;
   this.y = y;
}
/*Point.prototype = {
   x : 0,
   y : 0
}*/
function Line(poly_array)
{
   this.from = new Point(poly_array[0], poly_array[1]);
   this.to = new Point(poly_array[2], poly_array[3]);
   this.setLength();
}
Line.prototype = {
   setLength : function()
   {
      this.length = Math.sqrt( Math.pow(this.from.x - this.to.x,2)
         + Math.pow(this.from.y - this.to.y,2) );
      return this.length;
   },
   toString : function()
   {
      return "(" + this.from.x + "," + this.from.y + ")," + 
             "(" + this.to.x   + "," + this.to.y   + ")";
   },
   print : function(idx)
   {
      document.getElementById(str_id_output_results).innerHTML
         += ++idx + ":" + this.toString() + ":" + this.length + "\n";
   }
}

// this must be friend function in C++? OR, use this obj/pointer?
function CompareLineLength(LineA, LineB)
{
   return (LineA.length - LineB.length);
}

function inputData()
{
   var str = document.getElementById(str_id_input_textarea).value;
   var Lines = new Array();
   var data_array = str.split('\n');

   for(i=0; i<data_array.length; ++i)
      if(temp_poly = data_array[i].match(/\d+/g))
         Lines.push(new Line(temp_poly));

   Lines.sort(CompareLineLength);
   for(i=0; i<Lines.length; ++i)
      Lines[i].print(i);
}

function setRandomData()
{
   var str = "";
   for(i=0; i<100; ++i)
   {
      for(j=0; j<4; ++j)
      {
         str += Math.floor( Math.random() * 1000);
         if(j==3)
            break;
         str += ",";
      }
      str += "\n";
   }
   document.getElementById(str_id_input_textarea).innerHTML = str;
}

function test()
{
   var A = new Array(new Line([0, 0, 6, 8]));
   A.push(new Line([0, 0, 3, 4]));
   A.sort(CompareLineLength);
   alert(A[0].length +","+A[1].length);
}

function init()
{
   var body = document.getElementsByTagName("body")[0];
   var form = document.createElement("form");
   form.setAttribute("id", str_id_form);
   form.setAttribute("style", "height : 40%");
/*
   var head_of_control = document.createElement("h2");
   var head_of_results = head_of_control.cloneNode(false);
   head_of_control.innerHTML = "Control";
   head_of_results.innerHTML = "Results";
*/
   var content_of_results = document.createElement("pre");
   content_of_results.setAttribute("id", str_id_output_results);
   content_of_results.setAttribute("style",
      str_style_results);
   content_of_results.innerHTML = "";

   var tbox = document.createElement("input");
   tbox.setAttribute("id", str_id_input_textbox);

   var tarea = document.createElement("textarea");
   tarea.setAttribute("id", str_id_input_textarea);

   var button_start = document.createElement("input");
   button_start.setAttribute("type", "button");
   button_start.setAttribute("value", "Start");
   button_start.addEventListener("click", inputData, false);

   var button_set_random = document.createElement("input");
   button_set_random.setAttribute("type", "button");
   button_set_random.setAttribute("value", "Randomize");
   button_set_random.addEventListener("click", setRandomData, false);

   var field_one = document.createElement("fieldset");
   field_one.appendChild(document.createElement("legend"));
   var field_any = field_one.cloneNode(true);
   var field_ope = field_one.cloneNode(true);
   field_one.getElementsByTagName("legend").item(0).innerHTML = "One Element";
   field_any.getElementsByTagName("legend").item(0).innerHTML = "Some Elements";
   field_ope.getElementsByTagName("legend").item(0).innerHTML = "Operations";
   field_one.appendChild(tbox);
   field_any.appendChild(tarea);
   field_ope.appendChild(button_start);
   field_ope.appendChild(button_set_random);
   form.appendChild(field_one);
   form.appendChild(field_any);
   form.appendChild(field_ope);
   body.appendChild(form);
   body.appendChild(content_of_results);
}
window.addEventListener("load", init, false);
}}
#codehighlight(HTML){{
<!DOCTYPE html
   PUBLIC "-//W3C//DTD XHTML 1.1//EN"
   "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja">
<head>
<title>オブジェクト指向</title>
<script type="text/javascript" src="softwareEx_200901.js">
</script>
</head>
<body>
<h1>オブジェクト指向</h1>
</body>
</html>
}}