Groups | Search | Server Info | Keyboard shortcuts | Login | Register [http] [https] [nntp] [nntps]

Groups > comp.lang.javascript > #23359 > unrolled thread

Modular implementation of paintout canvas introduce a myriad bugs

Back to article view | Back to comp.lang.javascript

Contents

  Modular implementation of paintout canvas introduce a myriad bugs jonas.thornvall@gmail.com - 2014-02-28 00:27 -0800
    Re: Modular implementation of paintout canvas introduce a myriad bugs "Michael Haufe (TNO)" <tno@thenewobjective.com> - 2014-03-03 16:27 -0800
      Re: Modular implementation of paintout canvas introduce a myriad bugs ompalompasales2@gmail.com - 2014-03-04 13:00 -0800
      Re: Modular implementation of paintout canvas introduce a myriad bugs jonas.thornvall@gmail.com - 2014-03-05 08:31 -0800
        Re: Modular implementation of paintout canvas introduce a myriad bugs "Michael Haufe (TNO)" <tno@thenewobjective.com> - 2014-03-05 16:08 -0800
      Re: Modular implementation of paintout canvas introduce a myriad bugs jonas.thornvall@gmail.com - 2014-03-05 08:47 -0800
        Re: Modular implementation of paintout canvas introduce a myriad bugs jonas.thornvall@gmail.com - 2014-03-05 11:39 -0800
        Re: Modular implementation of paintout canvas introduce a myriad bugs "Michael Haufe (TNO)" <tno@thenewobjective.com> - 2014-03-05 12:48 -0800
          Re: Modular implementation of paintout canvas introduce a myriad bugs jonas.thornvall@gmail.com - 2014-03-05 13:30 -0800
            Re: Modular implementation of paintout canvas introduce a myriad bugs "Michael Haufe (TNO)" <tno@thenewobjective.com> - 2014-03-05 16:04 -0800

#23359 — Modular implementation of paintout canvas introduce a myriad bugs

Implementing a more modular approach to printout values on canvas seem to caused the program logic go haywire. Animation and paintout layers now working but the actual stepwise move within square and zoom in/out broke down.

http://web.comhem.se/jonasth/prime0.77/main.html

[toc] | [next] | [standalone]

#23375

On Friday, February 28, 2014 2:27:53 AM UTC-6, jonas.t...@gmail.com wrote:
> Implementing a more modular approach to printout values on canvas seem to caused the program logic go haywire. Animation and paintout layers now working but the actual stepwise move within square and zoom in/out broke down.
> 
> http://web.comhem.se/jonasth/prime0.77/main.html


use jshint.com and fix your errors

[toc] | [prev] | [next] | [standalone]

#23401

Order  Online Overnight, Ketamine Online Pharmacy, Order Ketamine Cod Overnight Delivery. 
Buy Ketamine Online Cod Only, Buy Ketamine Cod, Buy Ketamine Online With Mastercard. 
Buy Ketamine Online Cod, Order Ketamine Online, Legal Buy Ketamine Online 
©2012-2013. Top Pharmacy List! Best Prices Online! 
Buy Ketamine® Online! ENTER HERE! 
********************************************** 
. 
> http://ed.bestonlinefinn.net/?q=Ketamine < - BUY Ketamine® ONLINE, CLICK HERE! 
. 
. 
********************************************** 
. 
> http://us.bestonlinefinn.net/?q=Ketamine < - BUY Ketamine® ONLINE, CLICK HERE! 
. 
. 
********************************************** 
Buy Ketamine® Online Without A Prescription 

On Tuesday, March 4, 2014 1:27:01 AM UTC+1, Michael Haufe (TNO) wrote:
> On Friday, February 28, 2014 2:27:53 AM UTC-6, jonas.t...@gmail.com wrote:
> 
> > Implementing a more modular approach to printout values on canvas seem to caused the program logic go haywire. Animation and paintout layers now working but the actual stepwise move within square and zoom in/out broke down.
> 
> > 
> 
> > http://web.comhem.se/jonasth/prime0.77/main.html
> 
> 
> 
> 
> 
> use jshint.com and fix your errors

[toc] | [prev] | [next] | [standalone]

#23419

Den tisdagen den 4:e mars 2014 kl. 01:27:01 UTC+1 skrev Michael Haufe (TNO):
> On Friday, February 28, 2014 2:27:53 AM UTC-6, jonas.t...@gmail.com wrote:
> 
> > Implementing a more modular approach to printout values on canvas seem to caused the program logic go haywire. Animation and paintout layers now working but the actual stepwise move within square and zoom in/out broke down.
> 
> > 
> 
> > http://web.comhem.se/jonasth/prime0.77/main.html
> 
> 
> 
> 
> 
> use jshint.com and fix your errors

I've tried to run it by copy paste my source directly into browser did not work.
What free Environment for windows should i use to run JShint i see i can download it for a variety of editors?

[toc] | [prev] | [next] | [standalone]

#23432

On Wednesday, March 5, 2014 10:31:03 AM UTC-6, jonas.t...@gmail.com wrote:

> What free Environment for windows should i use to run JShint i see i can download it for a variety of editors?

There are a number of basic editors available that come with it already available. I don't particularly have a favorite, but Aptana, WebStorm and Sublime Text are acceptable editors imo as are a number of others I won't enumerate.

[toc] | [prev] | [next] | [standalone]

#23420

Den tisdagen den 4:e mars 2014 kl. 01:27:01 UTC+1 skrev Michael Haufe (TNO):
> On Friday, February 28, 2014 2:27:53 AM UTC-6, jonas.t...@gmail.com wrote:
> 
> > Implementing a more modular approach to printout values on canvas seem to caused the program logic go haywire. Animation and paintout layers now working but the actual stepwise move within square and zoom in/out broke down.
> 
> > 
> 
> > http://web.comhem.se/jonasth/prime0.77/main.html
> 
> 
> 
> 
> 
> use jshint.com and fix your errors

Thanks it worked when i removed the script tag and HTML, but the bug/bugs are hard to spot.

Now i've changed the script to use div instead of frames but it is still heavily dependent upon form for setting values both by user and echoing values from script. Which make it hard to analyse, i will try to break down the problem tomorrow because i really do not understand what it is. Probably as you say some initiation of values. I find it weird that the animation work stepping up the adder while a simple button press to add 1 to the counter adder doesnt.

http://web.comhem.se/jonasth/prime0.82/div.html 

  

[toc] | [prev] | [next] | [standalone]

#23423

Den onsdagen den 5:e mars 2014 kl. 17:47:10 UTC+1 skrev jonas.t...@gmail.com:
> Den tisdagen den 4:e mars 2014 kl. 01:27:01 UTC+1 skrev Michael Haufe (TNO):
> 
> > On Friday, February 28, 2014 2:27:53 AM UTC-6, jonas.t...@gmail.com wrote:
> 
> > 
> 
> > > Implementing a more modular approach to printout values on canvas seem to caused the program logic go haywire. Animation and paintout layers now working but the actual stepwise move within square and zoom in/out broke down.
> 
> > 
> 
> > > 
> 
> > 
> 
> > > http://web.comhem.se/jonasth/prime0.77/main.html
> 
> > 
> 
> > 
> 
> > 
> 
> > 
> 
> > 
> 
> > use jshint.com and fix your errors
> 
> 
> 
> Thanks it worked when i removed the script tag and HTML, but the bug/bugs are hard to spot.
> 
> 
> 
> Now i've changed the script to use div instead of frames but it is still heavily dependent upon form for setting values both by user and echoing values from script. Which make it hard to analyse, i will try to break down the problem tomorrow because i really do not understand what it is. Probably as you say some initiation of values. I find it weird that the animation work stepping up the adder while a simple button press to add 1 to the counter adder doesnt.
> 
> 
> 
> http://web.comhem.se/jonasth/prime0.82/div.html

I've been looking at this code for a couple of Days, and i just can't get why initanime() yields Another result then next() function they basicly the same?


(just four lines of code)

I mean afterall  refresh = setInterval(redraw,1); is just adding one in a loop, while next is just adding one a single time using  redraw()?

I wrote the script but i just do not get what is going on here.

Any help appreciated!!!

http://web.comhem.se/jonasth/prime0.82/div.html

<!DOCTYPE html>
<html>
<head>
    <meta http-Equiv="Cache-Control" Content="no-cache">
    <meta http-Equiv="Pragma" Content="no-cache">
    <meta http-Equiv="Expires" Content="0">
</head>

<body onload=first_call();>

<div id="container" style="width:2100px">

<div id="header" style="background-color:#FFA500;">
<table width=2100 border="2" bgcolor="White" ><tr><td>
<B>PRIME EXPLORER v0.82 Bugs stills here but replaced FRAMES with DIV<font size=1></B>jonas.thornvall@hotmail.com</font></td>
</tr></table> 

</div>

<div id="menu" style="background-color:lightgray;height:2000px;width:140px;float:left;">

<FONT=BOLD>

<table border="2" bgcolor="grey" width=140>

<tr>
<td align=middle bgcolor="yellow">+<BR><input type="checkbox" id="pos" name="pos" onchange=recheck(); checked="yes"></td>
<td align=middle bgcolor="lightgrey">-<BR><input type="checkbox" id="neg" name="neg" onchange=recheck(); checked="no"></td>
<td align=middle bgcolor="blue">P<input id="p" type="checkbox" name="p" onchange=recheck(); checked="yes"></td>
<td align=middle bgcolor="red">Sq<input type="checkbox" name="sq" id="sq" onchange=recheck(); checked="yes"></td>
</tr>
<tr>
<td align=middle bgcolor="pink">O <BR><input type="checkbox" name="o" id="o"  onchange=recheck(); checked="yes"></td>
<td align=middle bgcolor="lightblue">E <input type="checkbox" name="e" id="e" onchange=recheck(); checked="yes"></td>
</tr>

</table>

<table border="2" bgcolor="grey" width=140><tr><td>
<FORM NAME=Jdoit onSubmit="setmax(); return false;"> 
<input type=submit value="N max">
<input type="text" name="rangeN" value="4900" size="6">
</FORM> 
</td></tr></table>

<table border="2" bgcolor="white" width=140><tr><td bgcolor="green">
<FORM NAME=Edoit onSubmit="initanime(); return false;"> 
<input type=submit name="init_anime" value="Anim"></FORM></td>
<td bgcolor="red">
<FORM NAME=Fdoit onSubmit="stopanime(); return false;"> 
<input type=submit name="stop_anime" value="haltA">
</FORM> 
</td></tr></table>

<table border="2" bgcolor="Yellow" width=140><tr><td>
<FORM NAME=Xdoit onSubmit="startPos(); return false;"> 
<input type=submit value="setPos">
<input type="text" name="start_At" value="1" size="4">
</FORM> 
</td></tr></table>

<table border="2" bgcolor="yellow" width=140><tr><td>
<FORM NAME=Adoit onSubmit="next(); return false;"> 
<input type=submit value="Forw">
</FORM> </td><td>

<FORM NAME=Bdoit onSubmit="prev(); return false;"> 
<input type=submit value="Backw"> 
</FORM> 
</td></tr></table>

<table border="1" bgcolor="grey" width=140><tr><td>
<FORM NAME=Cdoit onSubmit="zoomin(); return false;"> 
<input type=submit name="zoom_in" value="Zoom+"><P> 
</FORM>
</td><td>
<FORM NAME=Ddoit onSubmit="zoomout(); return false;"> 
<input type=submit name="zoom_out" value="Zoom-"><P> 
</FORM> 
</td></tr></table>

<table border="2" bgcolor="grey" width=140><tr><td>
<FORM NAME=Gdoit onSubmit="stopzoom(); return false;"> 
<input type=submit name="stop_zoom" value="stopZoom Anim">
</FORM>
</td></tr><tr><td>
<FORM NAME=Zdoit onSubmit="square_size(); return false;"> 
<input type=submit value="SQ size">
<input type="text" name="sqsize" value="2" size="3"><br>
</FORM>
</td></tr></table>

<table border="2" bgcolor="yellow" width=140><tr><td colspan="2">
<FORM NAME=Ldoit onSubmit="offset(); return false;"> 
<input type=submit value="N offset Col/Row">
</td></tr><tr><td>
X-<input type="text" name="xledf" value="1" size="2"></td><td>
Y-<input type="text" name="yledf" value="0" size="2">
</FORM> 
</td></tr></table>
<table border="2" bgcolor="yellow" width=140><tr><td>
<FORM NAME=xplus onSubmit="plusX(); return false;"> 
<input type=submit name="x_plus" value="X+">  
</FORM> 

</td><td>
<FORM NAME=xminus onSubmit="minusX(); return false;"> 
<input type=submit name="x_minus" value="X-">  
</FORM> 
</td></tr><tr><td>

<FORM NAME=yplus onSubmit="plusY(); return false;"> 
<input type=submit name="y_plus" value="Y+">  
</FORM> 
</td><td>

<FORM NAME=yminus onSubmit="minusY(); return false;"> 
<input type=submit name="y_minus" value="Y-">  
</FORM> 
</td></tr></table>
</div>





<div id="content" style="background-color:lightpurple;height:1900px;width:1900;float:left;">
<canvas id="myCanvas" width="1900" height="1900">Your browser does not support the HTML5 canvas tag.</canvas>
<script type="text/javascript">
var divisorGlobal = 2;
var MAX = 4900;
var array = [];
var size = 0;
var run = 0;
var back = 0;
var down = 0;
var adder = 0;
//var refresh = 5;
var arr = [];
var len = MAX;
var width=0;
var height=0;
var divisorGlobal=0;

for (var i = 0; i < len; i ++ )
{
   var obj =
   {
      count : i,
      fcolor : 'black',
      rheight : 100,
      rwidth : 100,
      rcolor : 'white'
   }
   ;
   arr.push(obj);
}


// Calculate size of square to printout
function calc_square(){
   MAX = Math.sqrt(numbRange);
   MAX = MAX * MAX;
}

// Calculate primes in range
function isPrime()
{
   n = MAX;
   // Eratosthenes algorithm to find all primes under n
   upperLimit = Math.sqrt(n);

   // Make an array from 2 to (n - 1)
   array[0] = false;
   array[1] = false;
   for (var i = 0; i < n; i ++ )
   {
      array.push(true);
   }

   // Remove multiples of primes starting from 2, 3, 5, ...
   i = 2;
   while (i <= upperLimit)
   {
      if (array[i])
      {
         for (var j = i * i; j < n; j += i)
         {
            array[j] = false;

         }
      }
      i ++ ;
   }
   return array;
}






// HERE IS THE DRAW FUNCTIONS

function clear()
{
   ctx.clearRect(0, 0, 2150, 2150);
}


function init()
{

   down = yyled;
   back = xxled;
   v_inner = 0;
   h_inner = 0;
   h_outer = 0;
   v_outer = 0;
   vcoffset = 0;
   hcoffset = 0;
  
   if(run = 1)numberGlobal = numberGlobal + adder;
   number = numberGlobal;
   h_outer = asize * (back);
   if (xxled < 0)
   {
      vcoffset = (xxled * - asize);
   }
   if (yyled < - 0)
   {
      hcoffset = (yyled * - asize);
   }
  
  
}

function redraw()
{  
   clear();
   init();
   paint_logic();
}

function paint_out()
{
   ctx.fillStyle = arr[number].rcolor;
   ctx.fillRect(h_inner + vcoffset, v_inner + hcoffset, width, height);
   // Write out numbers
   ctx.fillStyle = 'black';
   if (divisor < 4)ctx.fillText(number, h_inner + 3 + vcoffset, v_inner + 15 + hcoffset);
}


function paint_logic()
{
   while(number < MAX)
   {
      document.Xdoit.start_At.value = numberGlobal;
      vertical = 0;
      v_outer = 0;
      v_inner = v_outer;
      h_inner = h_outer;
      square = 0;
      negsquare = 0;

      while(vertical < down)
      {
         if (number == 0) number ++ ;

         paint_out();
         v_inner = v_inner + asize;
         vertical ++ ;
         number ++ ;
      }
      down ++ ;
      horisontal = 0;
      h_inner = h_outer;

      while(horisontal < back)
      {
         if (number == 0) number ++ ;
         paint_out();
         h_inner = h_inner - asize;
         horisontal ++ ;
         number ++ ;
      }
      back ++ ;
      h_outer = h_outer + asize;
   }
   number ++ ;
}


//HERE IS ANIMATION FUNCTIONS

function initanime()
{
   // CALLED FROM FORM
   size = 0;
   adder = 1;
   run = 1;
   refresh = setInterval(redraw,1);
}

function stopanime()
{  
   // CALLED FROM FORM
   adder=0;
   size=0;
   clearInterval(refresh);
}


//MANIPULATE OUTPUT FUNCTIONS

function startPos()
{
   
   numberGlobal = document.Xdoit.start_At.value*1;
   redraw();
}

function next()
{  
   
   size=0;
   adder = 1;
   redraw();
}

function prev()
{
   size=0;
   adder = -1;
   redraw();
}


function setmax()
{

 numbRange = document.Jdoit.rangeN.value*1;
 //document.write(numbRange); 
 //p.stop();
 calc_square();
 isPrime(); 
 
 redraw();
}


function stopzoom()
{
   size=0;
   redraw();
}

function zoomin()
{  
   adder=0;
   size = size - 1;
   size_font_square();
   redraw();
}

function zoomout()
{  
   adder=0;
   size = size + 1;
   size_font_square()
   redraw();
}

function square_size()
{
   size = 0;
   divisorGlobal = document.Zdoit.sqsize.value * 1;
   size_font_square()
   redraw();
}

function offset()
{
   size = 0;
   adder = 0;
   xxled = document.Ldoit.xledf.value
   yyled = document.Ldoit.yledf.value
   redraw();
}

function plusX()
{
  
   xxled ++ ;
   document.Ldoit.xledf.value = xxled;
   redraw();
}

function minusX()
{
  
   xxled -- ;
   document.Ldoit.xledf.value = xxled;
   redraw();
}

function plusY()
{
   
   yyled ++ ;
   document.Ldoit.yledf.value = yyled;
   redraw();
}

function minusY()
{
  
   yyled -- ;
   document.Ldoit.yledf.value = yyled;
   redraw();
}

//Set paintout size
function size_font_square()
{  
   
   divisorGlobal = divisorGlobal + size;
    
   // Set size range 1 -> 100
   if (divisorGlobal == 0)
   {
      divisorGlobal = 1;
   }
   else if (divisorGlobal > 100)
   {
      divisorGlobal = divisorGlobal - 1;
   }
   // Write out Zoom factor to form
   document.Zdoit.sqsize.value = divisorGlobal;
   // Global magnitude objects
   divisor = divisorGlobal;
   // Set fontsize
   fstor = 17 / divisor;
   ctx.font = "" + fstor + "px Arial";
   // Set distance squares
   asize = 67 / divisor;
   // Set square size
   storlek = 54;
   height = storlek / divisor;
   width = storlek / divisor;
}

//THIS IS MAIN FORM CALL AT LOAD

function first_call(){  
   
   // Startvalues
   numberGlobal = document.Xdoit.start_At.value*1;
   //Numberrange
   numbRange = document.Jdoit.rangeN.value*1;
   //Square_size
   divisorGlobal=document.Zdoit.sqsize.value*1;

   //Offset X and Y
   xxled = document.Ldoit.xledf.value*1;
   yyled = document.Ldoit.yledf.value*1;
   isPrime(); 
   calc_square();
   canvas = document.getElementById("myCanvas");
   ctx = canvas.getContext("2d");
   size_font_square();
   recheck();
}

// HERE IS FUNCTIONS REACTING AT CHANGE OF CHECKBOXES

function recheck()
{  
     notchecked();
     if (document.getElementById('pos').checked == true) { pos_checked(); } 
     if (document.getElementById('neg').checked == true) { neg_checked(); } 
     if (document.getElementById('o').checked == true)   { odd_checked(); } 
     if (document.getElementById('e').checked == true)   { even_checked(); } 
     if (document.getElementById('p').checked == true)   { prime_checked(); } 
     if (document.getElementById('sq').checked == true)  { square_checked(); } 
     redraw();
}

function notchecked()
{
    //document.write(numberGlobal); p.stop();
    for (var k = numberGlobal; k < numbRange; k ++ ) arr[k].rcolor = 'green';
}


function square_checked()
{  

    for (var k = numberGlobal; k < numbRange; k ++ ) {
            square=Math.sqrt(k,2);
            negsquare=Math.sqrt(-k,2);
            if(square-Math.floor(square)== 0)  arr[k].rcolor = 'red';
            if(k<0 && negsquare-Math.floor(negsquare)== 0) arr[k].rcolor = 'orange';;
        
     }

}

function prime_checked()
{
    for (var k = numberGlobal; k < numbRange; k ++ ) {
         if((array[k]) == true ) arr[k].rcolor = 'blue';
    }
}

function pos_checked()
{
    for (var k = numberGlobal; k < numbRange; k ++ ){if(k>0) arr[k].rcolor = 'yellow';}
}

function neg_checked()
{
    for (var k = numberGlobal; k < numbRange; k ++ ){if(k<0) arr[k].rcolor = 'gray';}
}

function odd_checked() {
    for (var k = numberGlobal; k < numbRange; k ++ ){ if((k / 2) % 1 != 0) arr[k].rcolor= 'pink';}
}

function even_checked() {
    for (var k = numberGlobal; k < numbRange; k ++ ) { if((k / 2) % 1 == 0) arr[k].rcolor = 'lightblue';}
}

</script>

</div>

<div id="footer" style="background-color:lightblue;clear:both;text-align:center;">
Copyright © Jonas Thörnvall</div>

</div>
 
</body>
</html>

[toc] | [prev] | [next] | [standalone]

#23424

On Wednesday, March 5, 2014 10:47:10 AM UTC-6, jonas.t...@gmail.com wrote:

> Thanks it worked when i removed the script tag and HTML, but the bug/bugs are hard to spot.

copy and paste the script only.

From jshint on your current code:

20 warnings
-----------------------

94	Expected a conditional expression and instead saw an assignment.
140	Use '===' to compare with '0'.
153	Use '===' to compare with '0'.
242	Missing semicolon.
250	Missing semicolon.
258	Missing semicolon.
259	Missing semicolon.
302	Use '===' to compare with '0'.
352	Use '===' to compare with 'true'.
353	Use '===' to compare with 'true'.
354	Use '===' to compare with 'true'.
355	Use '===' to compare with 'true'.
356	Use '===' to compare with 'true'.
357	Use '===' to compare with 'true'.
374	Use '===' to compare with '0'.
375	Use '===' to compare with '0'.
375	Unnecessary semicolon.
384	Use '===' to compare with 'true'.
399	Use '!==' to compare with '0'.
403	Use '===' to compare with '0'.

25 undefined variables
------------------------
8	adder
94	adder
172	adder
180	adder
199	adder
206	adder
232	adder
240	adder
257	adder
9	refresh
174	refresh
182	refresh
33	numbRange
214	numbRange
332	numbRange
364	numbRange
371	numbRange
383	numbRange
390	numbRange
395	numbRange
399	numbRange
403	numbRange
40	n
42	n
47	n
58	n
42	upperLimit
54	upperLimit
78	ctx
118	ctx
119	ctx
121	ctx
122	ctx
316	ctx
342	ctx
85	yyled
101	yyled
103	yyled
259	yyled
282	yyled
283	yyled
290	yyled
291	yyled
338	yyled
86	xxled
97	xxled
99	xxled
258	xxled
266	xxled
267	xxled
274	xxled
275	xxled
337	xxled
87	v_inner
119	v_inner
122	v_inner
133	v_inner
143	v_inner
143	v_inner
88	h_inner
119	h_inner
122	h_inner
134	h_inner
149	h_inner
155	h_inner
155	h_inner
89	h_outer
96	h_outer
134	h_outer
149	h_outer
160	h_outer
160	h_outer
90	v_outer
132	v_outer
133	v_outer
91	vcoffset
99	vcoffset
119	vcoffset
122	vcoffset
92	hcoffset
103	hcoffset
119	hcoffset
122	hcoffset
94	numberGlobal
94	numberGlobal
95	numberGlobal
130	numberGlobal
191	numberGlobal
330	numberGlobal
364	numberGlobal
371	numberGlobal
383	numberGlobal
390	numberGlobal
395	numberGlobal
399	numberGlobal
403	numberGlobal
95	number
118	number
122	number
128	number
140	number
140	number
145	number
153	number
153	number
157	number
162	number
96	asize
99	asize
103	asize
143	asize
155	asize
160	asize
318	asize
122	divisor
313	divisor
315	divisor
318	divisor
321	divisor
322	divisor
131	vertical
138	vertical
144	vertical
135	square
372	square
374	square
374	square
136	negsquare
373	negsquare
375	negsquare
375	negsquare
148	horisontal
151	horisontal
156	horisontal
315	fstor
316	fstor
320	storlek
321	storlek
322	storlek
341	canvas
342	canvas

16 unused variables
--------------------
168	initanime
177	stopanime
188	startPos
195	next
203	prev
211	setmax
224	stopzoom
230	zoomin
238	zoomout
246	square_size
254	offset
263	plusX
271	minusX
279	plusY
287	minusY
327	first_call


If you view source in FireFox (26+?) you'll notice a number of broken html tags broken in your source code as well. 

According to <http://validator.w3.org/#validate_by_input> there are 56 Errors, 6 warnings

From the FireFox console there are a couple more issues shown as well:

"Expected color but found 'lightpurple'.  Error in parsing value for 'background-color'.  Declaration dropped."

"Error in parsing value for 'width'.  Declaration dropped."

"The character encoding of the HTML document was not declared. The document will render with garbled text in some browser configurations if the document contains characters from outside the US-ASCII range. The character encoding of the page must be declared in the document or in the transfer protocol."

"TypeError: arr[number] is undefined div.html:248"

[toc] | [prev] | [next] | [standalone]

#23425

Den onsdagen den 5:e mars 2014 kl. 21:48:16 UTC+1 skrev Michael Haufe (TNO):
> On Wednesday, March 5, 2014 10:47:10 AM UTC-6, jonas.t...@gmail.com wrote:
> 
> 
> 
> > Thanks it worked when i removed the script tag and HTML, but the bug/bugs are hard to spot.
> 
> 
> 
> copy and paste the script only.
> 
> 
> 
> From jshint on your current code:
> 
> 
> 
> 20 warnings
> 
> -----------------------
> 
> 
> 
> 94	Expected a conditional expression and instead saw an assignment.
> 
> 140	Use '===' to compare with '0'.
> 
> 153	Use '===' to compare with '0'.
> 
> 242	Missing semicolon.
> 
> 250	Missing semicolon.
> 
> 258	Missing semicolon.
> 
> 259	Missing semicolon.
> 
> 302	Use '===' to compare with '0'.
> 
> 352	Use '===' to compare with 'true'.
> 
> 353	Use '===' to compare with 'true'.
> 
> 354	Use '===' to compare with 'true'.
> 
> 355	Use '===' to compare with 'true'.
> 
> 356	Use '===' to compare with 'true'.
> 
> 357	Use '===' to compare with 'true'.
> 
> 374	Use '===' to compare with '0'.
> 
> 375	Use '===' to compare with '0'.
> 
> 375	Unnecessary semicolon.
> 
> 384	Use '===' to compare with 'true'.
> 
> 399	Use '!==' to compare with '0'.
> 
> 403	Use '===' to compare with '0'.
> 
> 
> 
> 25 undefined variables
> 
> ------------------------
> 
> 8	adder
> 
> 94	adder
> 
> 172	adder
> 
> 180	adder
> 
> 199	adder
> 
> 206	adder
> 
> 232	adder
> 
> 240	adder
> 
> 257	adder
> 
> 9	refresh
> 
> 174	refresh
> 
> 182	refresh
> 
> 33	numbRange
> 
> 214	numbRange
> 
> 332	numbRange
> 
> 364	numbRange
> 
> 371	numbRange
> 
> 383	numbRange
> 
> 390	numbRange
> 
> 395	numbRange
> 
> 399	numbRange
> 
> 403	numbRange
> 
> 40	n
> 
> 42	n
> 
> 47	n
> 
> 58	n
> 
> 42	upperLimit
> 
> 54	upperLimit
> 
> 78	ctx
> 
> 118	ctx
> 
> 119	ctx
> 
> 121	ctx
> 
> 122	ctx
> 
> 316	ctx
> 
> 342	ctx
> 
> 85	yyled
> 
> 101	yyled
> 
> 103	yyled
> 
> 259	yyled
> 
> 282	yyled
> 
> 283	yyled
> 
> 290	yyled
> 
> 291	yyled
> 
> 338	yyled
> 
> 86	xxled
> 
> 97	xxled
> 
> 99	xxled
> 
> 258	xxled
> 
> 266	xxled
> 
> 267	xxled
> 
> 274	xxled
> 
> 275	xxled
> 
> 337	xxled
> 
> 87	v_inner
> 
> 119	v_inner
> 
> 122	v_inner
> 
> 133	v_inner
> 
> 143	v_inner
> 
> 143	v_inner
> 
> 88	h_inner
> 
> 119	h_inner
> 
> 122	h_inner
> 
> 134	h_inner
> 
> 149	h_inner
> 
> 155	h_inner
> 
> 155	h_inner
> 
> 89	h_outer
> 
> 96	h_outer
> 
> 134	h_outer
> 
> 149	h_outer
> 
> 160	h_outer
> 
> 160	h_outer
> 
> 90	v_outer
> 
> 132	v_outer
> 
> 133	v_outer
> 
> 91	vcoffset
> 
> 99	vcoffset
> 
> 119	vcoffset
> 
> 122	vcoffset
> 
> 92	hcoffset
> 
> 103	hcoffset
> 
> 119	hcoffset
> 
> 122	hcoffset
> 
> 94	numberGlobal
> 
> 94	numberGlobal
> 
> 95	numberGlobal
> 
> 130	numberGlobal
> 
> 191	numberGlobal
> 
> 330	numberGlobal
> 
> 364	numberGlobal
> 
> 371	numberGlobal
> 
> 383	numberGlobal
> 
> 390	numberGlobal
> 
> 395	numberGlobal
> 
> 399	numberGlobal
> 
> 403	numberGlobal
> 
> 95	number
> 
> 118	number
> 
> 122	number
> 
> 128	number
> 
> 140	number
> 
> 140	number
> 
> 145	number
> 
> 153	number
> 
> 153	number
> 
> 157	number
> 
> 162	number
> 
> 96	asize
> 
> 99	asize
> 
> 103	asize
> 
> 143	asize
> 
> 155	asize
> 
> 160	asize
> 
> 318	asize
> 
> 122	divisor
> 
> 313	divisor
> 
> 315	divisor
> 
> 318	divisor
> 
> 321	divisor
> 
> 322	divisor
> 
> 131	vertical
> 
> 138	vertical
> 
> 144	vertical
> 
> 135	square
> 
> 372	square
> 
> 374	square
> 
> 374	square
> 
> 136	negsquare
> 
> 373	negsquare
> 
> 375	negsquare
> 
> 375	negsquare
> 
> 148	horisontal
> 
> 151	horisontal
> 
> 156	horisontal
> 
> 315	fstor
> 
> 316	fstor
> 
> 320	storlek
> 
> 321	storlek
> 
> 322	storlek
> 
> 341	canvas
> 
> 342	canvas
> 
> 
> 
> 16 unused variables
> 
> --------------------
> 
> 168	initanime
> 
> 177	stopanime
> 
> 188	startPos
> 
> 195	next
> 
> 203	prev
> 
> 211	setmax
> 
> 224	stopzoom
> 
> 230	zoomin
> 
> 238	zoomout
> 
> 246	square_size
> 
> 254	offset
> 
> 263	plusX
> 
> 271	minusX
> 
> 279	plusY
> 
> 287	minusY
> 
> 327	first_call
> 
> 
> 
> 
> 
> If you view source in FireFox (26+?) you'll notice a number of broken html tags broken in your source code as well. 
> 
> 
> 
> According to <http://validator.w3.org/#validate_by_input> there are 56 Errors, 6 warnings
> 
> 
> 
> From the FireFox console there are a couple more issues shown as well:
> 
> 
> 
> "Expected color but found 'lightpurple'.  Error in parsing value for 'background-color'.  Declaration dropped."
> 
> 
> 
> "Error in parsing value for 'width'.  Declaration dropped."
> 
> 
> 
> "The character encoding of the HTML document was not declared. The document will render with garbled text in some browser configurations if the document contains characters from outside the US-ASCII range. The character encoding of the page must be declared in the document or in the transfer protocol."
> 
> 
> 
> "TypeError: arr[number] is undefined div.html:248"

Well the unused variables are all functions, called from the form.

Regarding the varnings about my operators, i guess i am using the old standard.
When did zero get a separate operator?
==
!=

Regarding the undefined  variables i am pretty sure most of them if not all is set from the form when needed and most of them also set global.

And it really do not explain why two basicly identical functions can render different results.

1. The way i see it i can not resolve the issues with unused variables ... Functions without changing to Another paradigm then form, so what should i use instead?

2. The changed operator status for compare with zero i can and will change.

3. I can not see how the variables can be undefined, the ones who rules over the lesser is instansiated in the init function. 

And the init funciont is called from the body onLoad, so i really can't figure out how they can be undefined, especially since the initanimate() function work just fine. While the equivalent next() do not.

I know it is up to me to resolve this, but since i have no idea what cause the logical failure i was thinking maybe someone spotted the error.
I Think i have separated the logic from the paint and steering layer in a rather good way. And that is why i find it so strange i can not find the error.

[toc] | [prev] | [next] | [standalone]

#23431

On Wednesday, March 5, 2014 3:30:48 PM UTC-6, jonas.t...@gmail.com wrote:

[...]

> Well the unused variables are all functions, called from the form.

I would suggest moving the code out of the form elements and into your main script (including the event declarations). It will make maintainability simpler as well as give visibility to tools such as the one mentioned (which can make it easier to catch issues that may arise).

> Regarding the varnings about my operators, i guess i am using the old standard.

The standard didn't change in this regard, the warnings are about avoiding unexpected side-effects. 
 
> When did zero get a separate operator?
> 
> ==
> 
> !=

the issue here is about avoiding accidental type coercion.

> Regarding the undefined  variables i am pretty sure most of them if not all is set from the form when needed and most of them also set global.

From the script, it looks like you didn't put 'var' in front of a few of the declarations. 

> And it really do not explain why two basicly identical functions can render different results.

It checks syntax, not semantics. Why do you believe they are "basicly identical functions"?


> I know it is up to me to resolve this, but since i have no idea what cause the logical failure i was thinking maybe someone spotted the error.

It will be easier to spot once you have things syntactically correct.

> I Think i have separated the logic from the paint and steering layer in a rather good way. And that is why i find it so strange i can not find the error.

It's a start, and it's in the right direction but there is still a relatively short way to go.

[toc] | [prev] | [standalone]

Back to top | Article view | comp.lang.javascript

csiph-web