|  | <html> | 
|  | <head> | 
|  | <div height="0" hidden="true"> | 
|  |  | 
|  | <div id="issue2808"> | 
|  | RunTestSet [issue2808] | 
|  |  | 
|  | {{509.203003,385.60199}, {509.203003,415.688385}, {487.928711,436.962708}}, | 
|  | {{487.928711,436.962708}, {466.654388,458.237}, {436.567993,458.237}}, | 
|  | {{436.567993,458.237}, {406.481598,458.237}, {385.207275,436.962708}}, | 
|  | {{385.207275,436.962708}, {363.932983,415.688385}, {363.932983,385.60199}}, | 
|  | {{363.932983,385.60199}, {363.932983,355.515594}, {385.207275,334.241272}}, | 
|  | {{385.207275,334.241272}, {406.481598,312.96698}, {436.567993,312.96698}}, | 
|  | {{436.567993,312.96698}, {466.654388,312.96698}, {487.928711,334.241272}}, | 
|  | {{487.928711,334.241272}, {509.203003,355.515594}, {509.203003,385.60199}}, | 
|  | op union | 
|  | {{449.033997,290.872986}, {449.033997,301.028259}, {441.853149,308.209106}}, | 
|  | {{441.853149,308.209106}, {434.672272,315.389984}, {424.516998,315.389984}}, | 
|  | {{424.516998,315.389984}, {414.361725,315.389984}, {407.180847,308.209106}}, | 
|  | {{407.180847,308.209106}, {400,301.028259}, {400,290.872986}}, | 
|  | {{400,290.872986}, {400,280.717712}, {407.180847,273.536865}}, | 
|  | {{407.180847,273.536865}, {414.361725,266.355988}, {424.516998,266.355988}}, | 
|  | {{424.516998,266.355988}, {434.672272,266.355988}, {441.853149,273.536865}}, | 
|  | {{441.853149,273.536865}, {449.033997,280.717712}, {449.033997,290.872986}}, | 
|  | debugShowQuadIntersection wtTs[0]=1 {{449.033997,290.872986}, {449.033997,301.028259}, {441.853149,308.209106}} {{441.853149,308.209106}} wnTs[0]=0 {{441.853149,308.209106}, {434.672272,315.389984}, {424.516998,315.389984}} | 
|  | debugShowQuadIntersection wtTs[0]=0 {{449.033997,290.872986}, {449.033997,301.028259}, {441.853149,308.209106}} {{449.033997,290.872986}} wnTs[0]=1 {{441.853149,273.536865}, {449.033997,280.717712}, {449.033997,290.872986}} | 
|  | debugShowQuadIntersection wtTs[0]=1 {{441.853149,308.209106}, {434.672272,315.389984}, {424.516998,315.389984}} {{424.516998,315.389984}} wnTs[0]=0 {{424.516998,315.389984}, {414.361725,315.389984}, {407.180847,308.209106}} | 
|  | debugShowQuadIntersection wtTs[0]=1 {{424.516998,315.389984}, {414.361725,315.389984}, {407.180847,308.209106}} {{407.180847,308.209106}} wnTs[0]=0 {{407.180847,308.209106}, {400,301.028259}, {400,290.872986}} | 
|  | debugShowQuadIntersection wtTs[0]=1 {{407.180847,308.209106}, {400,301.028259}, {400,290.872986}} {{400,290.872986}} wnTs[0]=0 {{400,290.872986}, {400,280.717712}, {407.180847,273.536865}} | 
|  | debugShowQuadIntersection wtTs[0]=1 {{400,290.872986}, {400,280.717712}, {407.180847,273.536865}} {{407.180847,273.536865}} wnTs[0]=0 {{407.180847,273.536865}, {414.361725,266.355988}, {424.516998,266.355988}} | 
|  | debugShowQuadIntersection wtTs[0]=1 {{407.180847,273.536865}, {414.361725,266.355988}, {424.516998,266.355988}} {{424.516998,266.355988}} wnTs[0]=0 {{424.516998,266.355988}, {434.672272,266.355988}, {441.853149,273.536865}} | 
|  | debugShowQuadIntersection wtTs[0]=1 {{424.516998,266.355988}, {434.672272,266.355988}, {441.853149,273.536865}} {{441.853149,273.536865}} wnTs[0]=0 {{441.853149,273.536865}, {449.033997,280.717712}, {449.033997,290.872986}} | 
|  | debugShowQuadIntersection no intersect {{441.853149,308.209106}, {434.672272,315.389984}, {424.516998,315.389984}} {{385.207275,334.241272}, {406.481598,312.96698}, {436.567993,312.96698}} | 
|  | debugShowQuadIntersection no intersect {{441.853149,308.209106}, {434.672272,315.389984}, {424.516998,315.389984}} {{436.567993,312.96698}, {466.654388,312.96698}, {487.928711,334.241272}} | 
|  | debugShowQuadIntersection wtTs[0]=0.266471573 {{424.516998,315.389984}, {414.361725,315.389984}, {407.180847,308.209106}} {{419.31601,314.880096}} wnTs[0]=0.700123 {{385.207275,334.241272}, {406.481598,312.96698}, {436.567993,312.96698}} | 
|  | debugShowQuadIntersection wtTs[0]=1 {{509.203003,385.60199}, {509.203003,415.688385}, {487.928711,436.962708}} {{487.928711,436.962708}} wnTs[0]=0 {{487.928711,436.962708}, {466.654388,458.237}, {436.567993,458.237}} | 
|  | debugShowQuadIntersection wtTs[0]=0 {{509.203003,385.60199}, {509.203003,415.688385}, {487.928711,436.962708}} {{509.203003,385.60199}} wnTs[0]=1 {{487.928711,334.241272}, {509.203003,355.515594}, {509.203003,385.60199}} | 
|  | debugShowQuadIntersection wtTs[0]=1 {{487.928711,436.962708}, {466.654388,458.237}, {436.567993,458.237}} {{436.567993,458.237}} wnTs[0]=0 {{436.567993,458.237}, {406.481598,458.237}, {385.207275,436.962708}} | 
|  | debugShowQuadIntersection wtTs[0]=1 {{436.567993,458.237}, {406.481598,458.237}, {385.207275,436.962708}} {{385.207275,436.962708}} wnTs[0]=0 {{385.207275,436.962708}, {363.932983,415.688385}, {363.932983,385.60199}} | 
|  | debugShowQuadIntersection wtTs[0]=1 {{385.207275,436.962708}, {363.932983,415.688385}, {363.932983,385.60199}} {{363.932983,385.60199}} wnTs[0]=0 {{363.932983,385.60199}, {363.932983,355.515594}, {385.207275,334.241272}} | 
|  | debugShowQuadIntersection wtTs[0]=1 {{363.932983,385.60199}, {363.932983,355.515594}, {385.207275,334.241272}} {{385.207275,334.241272}} wnTs[0]=0 {{385.207275,334.241272}, {406.481598,312.96698}, {436.567993,312.96698}} | 
|  | debugShowQuadIntersection wtTs[0]=1 {{385.207275,334.241272}, {406.481598,312.96698}, {436.567993,312.96698}} {{436.567993,312.96698}} wnTs[0]=0 {{436.567993,312.96698}, {466.654388,312.96698}, {487.928711,334.241272}} | 
|  | debugShowQuadIntersection wtTs[0]=1 {{436.567993,312.96698}, {466.654388,312.96698}, {487.928711,334.241272}} {{487.928711,334.241272}} wnTs[0]=0 {{487.928711,334.241272}, {509.203003,355.515594}, {509.203003,385.60199}} | 
|  | SkOpSegment::sortAngles [10] tStart=0.266471573 [1] | 
|  | SkOpAngle::after [10/1] 29/29 tStart=0.266471573 tEnd=0 < [5/1] 17/17 tStart=0.700123447 tEnd=0 < [10/2] 13/13 tStart=0.266471573 tEnd=1  F 4 | 
|  | SkOpAngle::after [10/1] 29/29 tStart=0.266471573 tEnd=0 < [5/2] 1/1 tStart=0.700123447 tEnd=1 < [10/2] 13/13 tStart=0.266471573 tEnd=1  T 4 | 
|  | SkOpSegment::debugShowActiveSpans id=8 (449.033997,290.872986 449.033997,301.028259 441.853149,308.209106) t=0 (449.033997,290.872986) tEnd=1 other=15 otherT=1 otherIndex=1 windSum=? windValue=1 oppValue=0 | 
|  | SkOpSegment::debugShowActiveSpans id=9 (441.853149,308.209106 434.672272,315.389984 424.516998,315.389984) t=0 (441.853149,308.209106) tEnd=1 other=8 otherT=1 otherIndex=1 windSum=? windValue=1 oppValue=0 | 
|  | SkOpSegment::debugShowActiveSpans id=10 (424.516998,315.389984 414.361725,315.389984 407.180847,308.209106) t=0 (424.516998,315.389984) tEnd=0.266471573 other=9 otherT=1 otherIndex=1 windSum=? windValue=1 oppValue=0 | 
|  | SkOpSegment::debugShowActiveSpans id=10 (424.516998,315.389984 414.361725,315.389984 407.180847,308.209106) t=0.266471573 (419.31601,314.880096) tEnd=1 other=5 otherT=0.700123447 otherIndex=1 windSum=? windValue=1 oppValue=0 | 
|  | SkOpSegment::debugShowActiveSpans id=11 (407.180847,308.209106 400,301.028259 400,290.872986) t=0 (407.180847,308.209106) tEnd=1 other=10 otherT=1 otherIndex=2 windSum=? windValue=1 oppValue=0 | 
|  | SkOpSegment::debugShowActiveSpans id=12 (400,290.872986 400,280.717712 407.180847,273.536865) t=0 (400,290.872986) tEnd=1 other=11 otherT=1 otherIndex=1 windSum=? windValue=1 oppValue=0 | 
|  | SkOpSegment::debugShowActiveSpans id=13 (407.180847,273.536865 414.361725,266.355988 424.516998,266.355988) t=0 (407.180847,273.536865) tEnd=1 other=12 otherT=1 otherIndex=1 windSum=? windValue=1 oppValue=0 | 
|  | SkOpSegment::debugShowActiveSpans id=14 (424.516998,266.355988 434.672272,266.355988 441.853149,273.536865) t=0 (424.516998,266.355988) tEnd=1 other=13 otherT=1 otherIndex=1 windSum=? windValue=1 oppValue=0 | 
|  | SkOpSegment::debugShowActiveSpans id=15 (441.853149,273.536865 449.033997,280.717712 449.033997,290.872986) t=0 (441.853149,273.536865) tEnd=1 other=14 otherT=1 otherIndex=1 windSum=? windValue=1 oppValue=0 | 
|  | SkOpSegment::debugShowActiveSpans id=0 (509.203003,385.60199 509.203003,415.688385 487.928711,436.962708) t=0 (509.203003,385.60199) tEnd=1 other=7 otherT=1 otherIndex=1 windSum=? windValue=1 oppValue=0 | 
|  | SkOpSegment::debugShowActiveSpans id=1 (487.928711,436.962708 466.654388,458.237 436.567993,458.237) t=0 (487.928711,436.962708) tEnd=1 other=0 otherT=1 otherIndex=1 windSum=? windValue=1 oppValue=0 | 
|  | SkOpSegment::debugShowActiveSpans id=2 (436.567993,458.237 406.481598,458.237 385.207275,436.962708) t=0 (436.567993,458.237) tEnd=1 other=1 otherT=1 otherIndex=1 windSum=? windValue=1 oppValue=0 | 
|  | SkOpSegment::debugShowActiveSpans id=3 (385.207275,436.962708 363.932983,415.688385 363.932983,385.60199) t=0 (385.207275,436.962708) tEnd=1 other=2 otherT=1 otherIndex=1 windSum=? windValue=1 oppValue=0 | 
|  | SkOpSegment::debugShowActiveSpans id=4 (363.932983,385.60199 363.932983,355.515594 385.207275,334.241272) t=0 (363.932983,385.60199) tEnd=1 other=3 otherT=1 otherIndex=1 windSum=? windValue=1 oppValue=0 | 
|  | SkOpSegment::debugShowActiveSpans id=5 (385.207275,334.241272 406.481598,312.96698 436.567993,312.96698) t=0 (385.207275,334.241272) tEnd=0.700123447 other=4 otherT=1 otherIndex=1 windSum=? windValue=1 oppValue=0 | 
|  | SkOpSegment::debugShowActiveSpans id=5 (385.207275,334.241272 406.481598,312.96698 436.567993,312.96698) t=0.700123447 (419.31601,314.880096) tEnd=1 other=10 otherT=0.266471573 otherIndex=1 windSum=? windValue=1 oppValue=0 | 
|  | SkOpSegment::debugShowActiveSpans id=6 (436.567993,312.96698 466.654388,312.96698 487.928711,334.241272) t=0 (436.567993,312.96698) tEnd=1 other=5 otherT=1 otherIndex=2 windSum=? windValue=1 oppValue=0 | 
|  | SkOpSegment::debugShowActiveSpans id=7 (487.928711,334.241272 509.203003,355.515594 509.203003,385.60199) t=0 (487.928711,334.241272) tEnd=1 other=6 otherT=1 otherIndex=1 windSum=? windValue=1 oppValue=0 | 
|  | SkOpSegment::findTop | 
|  | SkOpAngle::dumpOne [13/1] next=14/1 sect=16/17  s=1 [1] e=0 [0] sgn=1 windVal=1 windSum=? operand | 
|  | SkOpAngle::dumpOne [14/1] next=13/1 sect=30/29  s=0 [0] e=1 [1] sgn=-1 windVal=1 windSum=? operand stop | 
|  | SkOpSegment::markWinding id=13 (407.180847,273.536865 414.361725,266.355988 424.516998,266.355988) t=0 [0] (407.180847,273.536865) tEnd=1 newWindSum=-1 newOppSum=0 oppSum=? windSum=? windValue=1 oppValue=0 | 
|  | SkOpSegment::nextChase mismatched signs | 
|  | SkOpSegment::markWinding id=14 (424.516998,266.355988 434.672272,266.355988 441.853149,273.536865) t=0 [0] (424.516998,266.355988) tEnd=1 newWindSum=-1 newOppSum=0 oppSum=? windSum=? windValue=1 oppValue=0 | 
|  | SkOpSegment::markWinding id=15 (441.853149,273.536865 449.033997,280.717712 449.033997,290.872986) t=0 [0] (441.853149,273.536865) tEnd=1 newWindSum=-1 newOppSum=0 oppSum=? windSum=? windValue=1 oppValue=0 | 
|  | SkOpSegment::markWinding id=8 (449.033997,290.872986 449.033997,301.028259 441.853149,308.209106) t=0 [0] (449.033997,290.872986) tEnd=1 newWindSum=-1 newOppSum=0 oppSum=? windSum=? windValue=1 oppValue=0 | 
|  | SkOpSegment::markWinding id=9 (441.853149,308.209106 434.672272,315.389984 424.516998,315.389984) t=0 [0] (441.853149,308.209106) tEnd=1 newWindSum=-1 newOppSum=0 oppSum=? windSum=? windValue=1 oppValue=0 | 
|  | SkOpSegment::markWinding id=10 (424.516998,315.389984 414.361725,315.389984 407.180847,308.209106) t=0 [0] (424.516998,315.389984) tEnd=0.266471573 newWindSum=-1 newOppSum=0 oppSum=? windSum=? windValue=1 oppValue=0 | 
|  | SkOpSegment::markWinding id=13 (407.180847,273.536865 414.361725,266.355988 424.516998,266.355988) t=0 [0] (407.180847,273.536865) tEnd=1 newWindSum=-1 newOppSum=0 oppSum=0 windSum=-1 windValue=1 oppValue=0 | 
|  | SkOpSegment::markWinding id=12 (400,290.872986 400,280.717712 407.180847,273.536865) t=0 [0] (400,290.872986) tEnd=1 newWindSum=-1 newOppSum=0 oppSum=? windSum=? windValue=1 oppValue=0 | 
|  | SkOpSegment::markWinding id=11 (407.180847,308.209106 400,301.028259 400,290.872986) t=0 [0] (407.180847,308.209106) tEnd=1 newWindSum=-1 newOppSum=0 oppSum=? windSum=? windValue=1 oppValue=0 | 
|  | SkOpSegment::markWinding id=10 (424.516998,315.389984 414.361725,315.389984 407.180847,308.209106) t=0.266471573 [1] (419.31601,314.880096) tEnd=1 newWindSum=-1 newOppSum=0 oppSum=? windSum=? windValue=1 oppValue=0 | 
|  | SkOpSegment::activeOp id=13 t=0 tEnd=1 op=union miFrom=0 miTo=0 suFrom=1 suTo=0 result=1 | 
|  | SkOpSegment::nextChase mismatched signs | 
|  | SkOpSegment::findNextOp simple | 
|  | SkOpSegment::markDoneBinary id=13 (407.180847,273.536865 414.361725,266.355988 424.516998,266.355988) t=0 [0] (407.180847,273.536865) tEnd=1 newWindSum=-1 newOppSum=0 oppSum=0 windSum=-1 windValue=1 oppValue=0 | 
|  | bridgeOp current id=13 from=(407.180847,273.536865) to=(424.516998,266.355988) | 
|  | path.moveTo(407.180847,273.536865); | 
|  | path.quadTo(414.361725,266.355988, 424.516998,266.355988); | 
|  | SkOpSegment::findNextOp simple | 
|  | SkOpSegment::markDoneBinary id=14 (424.516998,266.355988 434.672272,266.355988 441.853149,273.536865) t=0 [0] (424.516998,266.355988) tEnd=1 newWindSum=-1 newOppSum=0 oppSum=0 windSum=-1 windValue=1 oppValue=0 | 
|  | bridgeOp current id=14 from=(424.516998,266.355988) to=(441.853149,273.536865) | 
|  | path.quadTo(434.672272,266.355988, 441.853149,273.536865); | 
|  | SkOpSegment::findNextOp simple | 
|  | SkOpSegment::markDoneBinary id=15 (441.853149,273.536865 449.033997,280.717712 449.033997,290.872986) t=0 [0] (441.853149,273.536865) tEnd=1 newWindSum=-1 newOppSum=0 oppSum=0 windSum=-1 windValue=1 oppValue=0 | 
|  | bridgeOp current id=15 from=(441.853149,273.536865) to=(449.033997,290.872986) | 
|  | path.quadTo(449.033997,280.717712, 449.033997,290.872986); | 
|  | SkOpSegment::findNextOp simple | 
|  | SkOpSegment::markDoneBinary id=8 (449.033997,290.872986 449.033997,301.028259 441.853149,308.209106) t=0 [0] (449.033997,290.872986) tEnd=1 newWindSum=-1 newOppSum=0 oppSum=0 windSum=-1 windValue=1 oppValue=0 | 
|  | bridgeOp current id=8 from=(449.033997,290.872986) to=(441.853149,308.209106) | 
|  | path.quadTo(449.033997,301.028259, 441.853149,308.209106); | 
|  | SkOpSegment::findNextOp simple | 
|  | SkOpSegment::markDoneBinary id=9 (441.853149,308.209106 434.672272,315.389984 424.516998,315.389984) t=0 [0] (441.853149,308.209106) tEnd=1 newWindSum=-1 newOppSum=0 oppSum=0 windSum=-1 windValue=1 oppValue=0 | 
|  | bridgeOp current id=9 from=(441.853149,308.209106) to=(424.516998,315.389984) | 
|  | path.quadTo(434.672272,315.389984, 424.516998,315.389984); | 
|  | SkOpSegment::markWinding id=5 (385.207275,334.241272 406.481598,312.96698 436.567993,312.96698) t=0.700123447 [1] (419.31601,314.880096) tEnd=1 newWindSum=1 newOppSum=-1 oppSum=? windSum=? windValue=1 oppValue=0 | 
|  | SkOpSegment::markWinding id=6 (436.567993,312.96698 466.654388,312.96698 487.928711,334.241272) t=0 [0] (436.567993,312.96698) tEnd=1 newWindSum=1 newOppSum=-1 oppSum=? windSum=? windValue=1 oppValue=0 | 
|  | SkOpSegment::markWinding id=7 (487.928711,334.241272 509.203003,355.515594 509.203003,385.60199) t=0 [0] (487.928711,334.241272) tEnd=1 newWindSum=1 newOppSum=-1 oppSum=? windSum=? windValue=1 oppValue=0 | 
|  | SkOpSegment::markWinding id=0 (509.203003,385.60199 509.203003,415.688385 487.928711,436.962708) t=0 [0] (509.203003,385.60199) tEnd=1 newWindSum=1 newOppSum=-1 oppSum=? windSum=? windValue=1 oppValue=0 | 
|  | SkOpSegment::markWinding id=1 (487.928711,436.962708 466.654388,458.237 436.567993,458.237) t=0 [0] (487.928711,436.962708) tEnd=1 newWindSum=1 newOppSum=-1 oppSum=? windSum=? windValue=1 oppValue=0 | 
|  | SkOpSegment::markWinding id=2 (436.567993,458.237 406.481598,458.237 385.207275,436.962708) t=0 [0] (436.567993,458.237) tEnd=1 newWindSum=1 newOppSum=-1 oppSum=? windSum=? windValue=1 oppValue=0 | 
|  | SkOpSegment::markWinding id=3 (385.207275,436.962708 363.932983,415.688385 363.932983,385.60199) t=0 [0] (385.207275,436.962708) tEnd=1 newWindSum=1 newOppSum=-1 oppSum=? windSum=? windValue=1 oppValue=0 | 
|  | SkOpSegment::markWinding id=4 (363.932983,385.60199 363.932983,355.515594 385.207275,334.241272) t=0 [0] (363.932983,385.60199) tEnd=1 newWindSum=1 newOppSum=-1 oppSum=? windSum=? windValue=1 oppValue=0 | 
|  | SkOpSegment::markWinding id=5 (385.207275,334.241272 406.481598,312.96698 436.567993,312.96698) t=0 [0] (385.207275,334.241272) tEnd=0.700123447 newWindSum=1 newOppSum=-1 oppSum=? windSum=? windValue=1 oppValue=0 | 
|  | SkOpSegment::markAngle last id=5 windSum=1 small=0 | 
|  | SkOpSegment::findNextOp | 
|  | SkOpAngle::dumpOne [10/1] next=5/2 sect=29/29  s=0.266471573 [1] e=0 [0] sgn=1 windVal=1 windSum=-1 oppVal=0 oppSum=0 operand | 
|  | SkOpAngle::dumpOne [5/2] next=10/2 sect=1/1  s=0.700123447 [1] e=1 [2] sgn=-1 windVal=1 windSum=1 oppVal=0 oppSum=-1 | 
|  | SkOpAngle::dumpOne [10/2] next=5/1 sect=13/13  s=0.266471573 [1] e=1 [2] sgn=-1 windVal=1 windSum=-1 oppVal=0 oppSum=0 operand | 
|  | SkOpAngle::dumpOne [5/1] next=10/1 sect=17/17  s=0.700123447 [1] e=0 [0] sgn=1 windVal=1 windSum=1 oppVal=0 oppSum=-1 | 
|  | SkOpSegment::activeOp id=5 t=0.700123447 tEnd=1 op=union miFrom=0 miTo=1 suFrom=1 suTo=1 result=0 | 
|  | SkOpSegment::markDoneBinary id=5 (385.207275,334.241272 406.481598,312.96698 436.567993,312.96698) t=0.700123447 [1] (419.31601,314.880096) tEnd=1 newWindSum=1 newOppSum=-1 oppSum=-1 windSum=1 windValue=1 oppValue=0 | 
|  | SkOpSegment::markDoneBinary id=6 (436.567993,312.96698 466.654388,312.96698 487.928711,334.241272) t=0 [0] (436.567993,312.96698) tEnd=1 newWindSum=1 newOppSum=-1 oppSum=-1 windSum=1 windValue=1 oppValue=0 | 
|  | SkOpSegment::markDoneBinary id=7 (487.928711,334.241272 509.203003,355.515594 509.203003,385.60199) t=0 [0] (487.928711,334.241272) tEnd=1 newWindSum=1 newOppSum=-1 oppSum=-1 windSum=1 windValue=1 oppValue=0 | 
|  | SkOpSegment::markDoneBinary id=0 (509.203003,385.60199 509.203003,415.688385 487.928711,436.962708) t=0 [0] (509.203003,385.60199) tEnd=1 newWindSum=1 newOppSum=-1 oppSum=-1 windSum=1 windValue=1 oppValue=0 | 
|  | SkOpSegment::markDoneBinary id=1 (487.928711,436.962708 466.654388,458.237 436.567993,458.237) t=0 [0] (487.928711,436.962708) tEnd=1 newWindSum=1 newOppSum=-1 oppSum=-1 windSum=1 windValue=1 oppValue=0 | 
|  | SkOpSegment::markDoneBinary id=2 (436.567993,458.237 406.481598,458.237 385.207275,436.962708) t=0 [0] (436.567993,458.237) tEnd=1 newWindSum=1 newOppSum=-1 oppSum=-1 windSum=1 windValue=1 oppValue=0 | 
|  | SkOpSegment::markDoneBinary id=3 (385.207275,436.962708 363.932983,415.688385 363.932983,385.60199) t=0 [0] (385.207275,436.962708) tEnd=1 newWindSum=1 newOppSum=-1 oppSum=-1 windSum=1 windValue=1 oppValue=0 | 
|  | SkOpSegment::markDoneBinary id=4 (363.932983,385.60199 363.932983,355.515594 385.207275,334.241272) t=0 [0] (363.932983,385.60199) tEnd=1 newWindSum=1 newOppSum=-1 oppSum=-1 windSum=1 windValue=1 oppValue=0 | 
|  | SkOpSegment::markDoneBinary id=5 (385.207275,334.241272 406.481598,312.96698 436.567993,312.96698) t=0 [0] (385.207275,334.241272) tEnd=0.700123447 newWindSum=1 newOppSum=-1 oppSum=-1 windSum=1 windValue=1 oppValue=0 | 
|  | SkOpSegment::findNextOp chase.append id=5 windSum=1 small=0 | 
|  | SkOpSegment::activeOp id=10 t=0.266471573 tEnd=1 op=union miFrom=1 miTo=1 suFrom=1 suTo=0 result=0 | 
|  | SkOpSegment::markDoneBinary id=10 (424.516998,315.389984 414.361725,315.389984 407.180847,308.209106) t=0.266471573 [1] (419.31601,314.880096) tEnd=1 newWindSum=-1 newOppSum=0 oppSum=0 windSum=-1 windValue=1 oppValue=0 | 
|  | SkOpSegment::markDoneBinary id=11 (407.180847,308.209106 400,301.028259 400,290.872986) t=0 [0] (407.180847,308.209106) tEnd=1 newWindSum=-1 newOppSum=0 oppSum=0 windSum=-1 windValue=1 oppValue=0 | 
|  | SkOpSegment::markDoneBinary id=12 (400,290.872986 400,280.717712 407.180847,273.536865) t=0 [0] (400,290.872986) tEnd=1 newWindSum=-1 newOppSum=0 oppSum=0 windSum=-1 windValue=1 oppValue=0 | 
|  | SkOpSegment::activeOp id=5 t=0.700123447 tEnd=0 op=union miFrom=1 miTo=0 suFrom=0 suTo=0 result=1 | 
|  | SkOpSegment::markDoneBinary id=10 (424.516998,315.389984 414.361725,315.389984 407.180847,308.209106) t=0 [0] (424.516998,315.389984) tEnd=0.266471573 newWindSum=-1 newOppSum=0 oppSum=0 windSum=-1 windValue=1 oppValue=0 | 
|  | SkOpSegment::findNextOp from:[10] to:[5] start=1 end=0 | 
|  | bridgeOp current id=10 from=(424.516998,315.389984) to=(419.31601,314.880096) | 
|  | path.quadTo(421.810883,315.389984, 419.31601,314.880096); | 
|  | </div> | 
|  |  | 
|  | </div> | 
|  |  | 
|  | <script type="text/javascript"> | 
|  |  | 
|  | var testDivs = [ | 
|  | issue2808, | 
|  | ]; | 
|  |  | 
|  | var decimal_places = 3; // make this 3 to show more precision | 
|  |  | 
|  | var tests = []; | 
|  | var testLines = []; | 
|  | var testTitles = []; | 
|  | var testIndex = 0; | 
|  | var ctx; | 
|  |  | 
|  | var xmin, xmax, focusXmin, focusXmax; | 
|  | var ymin, ymax, focusYmin, focusYmax; | 
|  | var scale; | 
|  | var mouseX, mouseY; | 
|  | var srcLeft, srcTop; | 
|  | var screenWidth, screenHeight; | 
|  | var drawnPts, drawnLines, drawnQuads, drawnCubics; | 
|  | var curveT = 0; | 
|  |  | 
|  | var pt_labels = 2; | 
|  | var collect_bounds = false; | 
|  | var control_lines = 0; | 
|  | var curve_t = false; | 
|  | var debug_xy = 1; | 
|  | var focus_enabled = false; | 
|  | var focus_on_selection = false; | 
|  | var step_limit = 0; | 
|  | var draw_active = false; | 
|  | var draw_add = false; | 
|  | var draw_angle = 0; | 
|  | var draw_deriviatives = 0; | 
|  | var draw_hints = false; | 
|  | var draw_hodo = 0; | 
|  | var draw_id = false; | 
|  | var draw_intersection = 0; | 
|  | var draw_intersectT = false; | 
|  | var draw_legend = true; | 
|  | var draw_log = false; | 
|  | var draw_mark = false; | 
|  | var draw_midpoint = false; | 
|  | var draw_op = 0; | 
|  | var draw_sequence = false; | 
|  | var draw_sort = 0; | 
|  | var draw_path = 3; | 
|  | var draw_computed = 0; | 
|  | var retina_scale = !!window.devicePixelRatio; | 
|  |  | 
|  | var activeCount = 0; | 
|  | var addCount = 0; | 
|  | var angleCount = 0; | 
|  | var opCount = 0; | 
|  | var sectCount = 0; | 
|  | var sortCount = 0; | 
|  | var markCount = 0; | 
|  | var activeMax = 0; | 
|  | var addMax = 0; | 
|  | var angleMax = 0; | 
|  | var sectMax = 0; | 
|  | var sectMax2 = 0; | 
|  | var sortMax = 0; | 
|  | var markMax = 0; | 
|  | var opMax = 0; | 
|  | var stepMax = 0; | 
|  | var lastIndex = 0; | 
|  | var hasPath = false; | 
|  | var hasComputedPath = false; | 
|  |  | 
|  | var firstActiveSpan = -1; | 
|  | var logStart = -1; | 
|  | var logRange = 0; | 
|  |  | 
|  | var SPAN_ID = 0; | 
|  | var SPAN_X1 = SPAN_ID + 1; | 
|  | var SPAN_Y1 = SPAN_X1 + 1; | 
|  | var SPAN_X2 = SPAN_Y1 + 1; | 
|  | var SPAN_Y2 = SPAN_X2 + 1; | 
|  | var SPAN_L_T = SPAN_Y2 + 1; | 
|  | var SPAN_L_TX = SPAN_L_T + 1; | 
|  | var SPAN_L_TY = SPAN_L_TX + 1; | 
|  | var SPAN_L_TEND = SPAN_L_TY + 1; | 
|  | var SPAN_L_OTHER = SPAN_L_TEND + 1; | 
|  | var SPAN_L_OTHERT = SPAN_L_OTHER + 1; | 
|  | var SPAN_L_OTHERI = SPAN_L_OTHERT + 1; | 
|  | var SPAN_L_SUM = SPAN_L_OTHERI + 1; | 
|  | var SPAN_L_VAL = SPAN_L_SUM + 1; | 
|  | var SPAN_L_OPP = SPAN_L_VAL + 1; | 
|  |  | 
|  | var SPAN_X3 = SPAN_Y2 + 1; | 
|  | var SPAN_Y3 = SPAN_X3 + 1; | 
|  | var SPAN_Q_T = SPAN_Y3 + 1; | 
|  | var SPAN_Q_TX = SPAN_Q_T + 1; | 
|  | var SPAN_Q_TY = SPAN_Q_TX + 1; | 
|  | var SPAN_Q_TEND = SPAN_Q_TY + 1; | 
|  | var SPAN_Q_OTHER = SPAN_Q_TEND + 1; | 
|  | var SPAN_Q_OTHERT = SPAN_Q_OTHER + 1; | 
|  | var SPAN_Q_OTHERI = SPAN_Q_OTHERT + 1; | 
|  | var SPAN_Q_SUM = SPAN_Q_OTHERI + 1; | 
|  | var SPAN_Q_VAL = SPAN_Q_SUM + 1; | 
|  | var SPAN_Q_OPP = SPAN_Q_VAL + 1; | 
|  |  | 
|  | var SPAN_X4 = SPAN_Y3 + 1; | 
|  | var SPAN_Y4 = SPAN_X4 + 1; | 
|  | var SPAN_C_T = SPAN_Y4 + 1; | 
|  | var SPAN_C_TX = SPAN_C_T + 1; | 
|  | var SPAN_C_TY = SPAN_C_TX + 1; | 
|  | var SPAN_C_TEND = SPAN_C_TY + 1; | 
|  | var SPAN_C_OTHER = SPAN_C_TEND + 1; | 
|  | var SPAN_C_OTHERT = SPAN_C_OTHER + 1; | 
|  | var SPAN_C_OTHERI = SPAN_C_OTHERT + 1; | 
|  | var SPAN_C_SUM = SPAN_C_OTHERI + 1; | 
|  | var SPAN_C_VAL = SPAN_C_SUM + 1; | 
|  | var SPAN_C_OPP = SPAN_C_VAL + 1; | 
|  |  | 
|  | var ACTIVE_LINE_SPAN =        1; | 
|  | var ACTIVE_QUAD_SPAN =        ACTIVE_LINE_SPAN + 1; | 
|  | var ACTIVE_CUBIC_SPAN =       ACTIVE_QUAD_SPAN + 1; | 
|  |  | 
|  | var ADD_MOVETO =              ACTIVE_CUBIC_SPAN + 1; | 
|  | var ADD_LINETO =              ADD_MOVETO + 1; | 
|  | var ADD_QUADTO =              ADD_LINETO + 1; | 
|  | var ADD_CUBICTO =             ADD_QUADTO + 1; | 
|  | var ADD_CLOSE =               ADD_CUBICTO + 1; | 
|  | var ADD_FILL =                ADD_CLOSE + 1; | 
|  |  | 
|  | var PATH_LINE =               ADD_FILL + 1; | 
|  | var PATH_QUAD =               PATH_LINE + 1; | 
|  | var PATH_CUBIC =              PATH_QUAD + 1; | 
|  |  | 
|  | var INTERSECT_LINE =          PATH_CUBIC + 1; | 
|  | var INTERSECT_LINE_2 =        INTERSECT_LINE + 1; | 
|  | var INTERSECT_LINE_NO =       INTERSECT_LINE_2 + 1; | 
|  | var INTERSECT_QUAD_LINE =     INTERSECT_LINE_NO + 1; | 
|  | var INTERSECT_QUAD_LINE_2 =   INTERSECT_QUAD_LINE + 1; | 
|  | var INTERSECT_QUAD_LINE_NO =  INTERSECT_QUAD_LINE_2 + 1; | 
|  | var INTERSECT_QUAD =          INTERSECT_QUAD_LINE_NO + 1; | 
|  | var INTERSECT_QUAD_2 =        INTERSECT_QUAD + 1; | 
|  | var INTERSECT_QUAD_NO =       INTERSECT_QUAD_2 + 1; | 
|  | var INTERSECT_SELF_CUBIC =    INTERSECT_QUAD_NO + 1; | 
|  | var INTERSECT_SELF_CUBIC_NO = INTERSECT_SELF_CUBIC + 1; | 
|  | var INTERSECT_CUBIC_LINE =    INTERSECT_SELF_CUBIC_NO + 1; | 
|  | var INTERSECT_CUBIC_LINE_2 =  INTERSECT_CUBIC_LINE + 1; | 
|  | var INTERSECT_CUBIC_LINE_3 =  INTERSECT_CUBIC_LINE_2 + 1; | 
|  | var INTERSECT_CUBIC_LINE_NO = INTERSECT_CUBIC_LINE_3 + 1; | 
|  | var INTERSECT_CUBIC_QUAD =    INTERSECT_CUBIC_LINE_NO + 1; | 
|  | var INTERSECT_CUBIC_QUAD_2 =  INTERSECT_CUBIC_QUAD + 1; | 
|  | var INTERSECT_CUBIC_QUAD_3 =  INTERSECT_CUBIC_QUAD_2 + 1; | 
|  | var INTERSECT_CUBIC_QUAD_4 =  INTERSECT_CUBIC_QUAD_3 + 1; | 
|  | var INTERSECT_CUBIC_QUAD_NO = INTERSECT_CUBIC_QUAD_4 + 1; | 
|  | var INTERSECT_CUBIC =         INTERSECT_CUBIC_QUAD_NO + 1; | 
|  | var INTERSECT_CUBIC_2 =       INTERSECT_CUBIC + 1; | 
|  | var INTERSECT_CUBIC_3 =       INTERSECT_CUBIC_2 + 1; | 
|  | var INTERSECT_CUBIC_4 =       INTERSECT_CUBIC_3 + 1; | 
|  | // FIXME: add cubic 5- 9 | 
|  | var INTERSECT_CUBIC_NO =      INTERSECT_CUBIC_4 + 1; | 
|  |  | 
|  | var SORT_UNARY =              INTERSECT_CUBIC_NO + 1; | 
|  | var SORT_BINARY =             SORT_UNARY + 1; | 
|  |  | 
|  | var OP_DIFFERENCE =           SORT_BINARY + 1; | 
|  | var OP_INTERSECT =            OP_DIFFERENCE + 1; | 
|  | var OP_UNION =                OP_INTERSECT + 1; | 
|  | var OP_XOR =                  OP_UNION + 1; | 
|  |  | 
|  | var MARK_LINE =               OP_XOR + 1; | 
|  | var MARK_QUAD =               MARK_LINE + 1; | 
|  | var MARK_CUBIC =              MARK_QUAD + 1; | 
|  | var MARK_DONE_LINE =          MARK_CUBIC + 1; | 
|  | var MARK_DONE_QUAD =          MARK_DONE_LINE + 1; | 
|  | var MARK_DONE_CUBIC =         MARK_DONE_QUAD + 1; | 
|  | var MARK_UNSORTABLE_LINE =    MARK_DONE_CUBIC + 1; | 
|  | var MARK_UNSORTABLE_QUAD =    MARK_UNSORTABLE_LINE + 1; | 
|  | var MARK_UNSORTABLE_CUBIC =   MARK_UNSORTABLE_QUAD + 1; | 
|  | var MARK_SIMPLE_LINE =        MARK_UNSORTABLE_CUBIC + 1; | 
|  | var MARK_SIMPLE_QUAD =        MARK_SIMPLE_LINE + 1; | 
|  | var MARK_SIMPLE_CUBIC =       MARK_SIMPLE_QUAD + 1; | 
|  | var MARK_SIMPLE_DONE_LINE =   MARK_SIMPLE_CUBIC + 1; | 
|  | var MARK_SIMPLE_DONE_QUAD =   MARK_SIMPLE_DONE_LINE + 1; | 
|  | var MARK_SIMPLE_DONE_CUBIC =  MARK_SIMPLE_DONE_QUAD + 1; | 
|  | var MARK_DONE_UNARY_LINE =    MARK_SIMPLE_DONE_CUBIC + 1; | 
|  | var MARK_DONE_UNARY_QUAD =    MARK_DONE_UNARY_LINE + 1; | 
|  | var MARK_DONE_UNARY_CUBIC =   MARK_DONE_UNARY_QUAD + 1; | 
|  | var MARK_ANGLE_LAST =         MARK_DONE_UNARY_CUBIC + 1; | 
|  |  | 
|  | var COMPUTED_SET_1 =          MARK_ANGLE_LAST + 1; | 
|  | var COMPUTED_SET_2 =          COMPUTED_SET_1 + 1; | 
|  |  | 
|  | var ANGLE_AFTER =             COMPUTED_SET_2; | 
|  | var ANGLE_AFTER2 =            ANGLE_AFTER + 1; | 
|  |  | 
|  | var ACTIVE_OP =               ANGLE_AFTER2 + 1; | 
|  |  | 
|  | var FRAG_TYPE_LAST =          ACTIVE_OP; | 
|  |  | 
|  | var REC_TYPE_UNKNOWN = -1; | 
|  | var REC_TYPE_PATH = 0; | 
|  | var REC_TYPE_SECT = 1; | 
|  | var REC_TYPE_ACTIVE = 2; | 
|  | var REC_TYPE_ADD = 3; | 
|  | var REC_TYPE_SORT = 4; | 
|  | var REC_TYPE_OP = 5; | 
|  | var REC_TYPE_MARK = 6; | 
|  | var REC_TYPE_COMPUTED = 7; | 
|  | var REC_TYPE_COIN = 8; | 
|  | var REC_TYPE_ANGLE = 9; | 
|  | var REC_TYPE_ACTIVE_OP = 10; | 
|  | var REC_TYPE_LAST = REC_TYPE_ACTIVE_OP; | 
|  |  | 
|  | function strs_to_nums(strs) { | 
|  | var result = []; | 
|  | for (var idx = 1; idx < strs.length; ++idx) { | 
|  | var str = strs[idx]; | 
|  | var num = parseFloat(str); | 
|  | if (isNaN(num)) { | 
|  | result.push(str); | 
|  | } else { | 
|  | result.push(num); | 
|  | } | 
|  | } | 
|  | return result; | 
|  | } | 
|  |  | 
|  | function filter_str_by(id, str, regex, array) { | 
|  | if (regex.test(str)) { | 
|  | var strs = regex.exec(str); | 
|  | var result = strs_to_nums(strs); | 
|  | array.push(id); | 
|  | array.push(result); | 
|  | return true; | 
|  | } | 
|  | return false; | 
|  | } | 
|  |  | 
|  | function construct_regexp2(pattern) { | 
|  | var escape = pattern.replace(/[-/\\^$*+?.()|[\]{}]/g, '\\$&'); | 
|  | escape = escape.replace(/UNSORTABLE/g, "\\*\\*\\* UNSORTABLE \\*\\*\\*"); | 
|  | escape = escape.replace(/CUBIC_VAL/g, "\\(P_VAL P_VAL P_VAL P_VAL\\)"); | 
|  | escape = escape.replace(/QUAD_VAL/g, "\\(P_VAL P_VAL P_VAL\\)"); | 
|  | escape = escape.replace(/LINE_VAL/g, "\\(P_VAL P_VAL\\)"); | 
|  | escape = escape.replace(/FILL_TYPE/g, "SkPath::k[a-zA-Z]+_FillType"); | 
|  | escape = escape.replace(/PT_VAL/g, "\\(P_VAL\\)"); | 
|  | escape = escape.replace(/P_VAL/g, "(-?\\d+\\.?\\d*(?:e-?\\d+)?)[Ff]?, ?(-?\\d+\\.?\\d*(?:e-?\\d+)?)[Ff]?"); | 
|  | escape = escape.replace(/T_VAL/g, "(-?\\d+\\.?\\d*(?:e-?\\d+)?)"); | 
|  | escape = escape.replace(/PATH/g, "pathB?"); | 
|  | escape = escape.replace(/IDX/g, "(\\d+)"); | 
|  | escape = escape.replace(/NUM/g, "(-?\\d+)"); | 
|  | escape = escape.replace(/OPT/g, "(\\?|-?\\d+)"); | 
|  | return new RegExp(escape, 'i'); | 
|  | } | 
|  |  | 
|  | function construct_regexp2c(pattern) { | 
|  | var escape = pattern.replace(/[-/\\^$*+?.()|[\]{}]/g, '\\$&'); | 
|  | escape = escape.replace(/UNSORTABLE/g, "\\*\\*\\* UNSORTABLE \\*\\*\\*"); | 
|  | escape = escape.replace(/CUBIC_VAL/g, "(?:\\$\\d = )?\\{\\{P_VAL\\}, \\{P_VAL\\}, \\{P_VAL\\}, \\{P_VAL\\}\\}"); | 
|  | escape = escape.replace(/QUAD_VAL/g, "(?:\\$\\d = )?\\{\\{P_VAL\\}, \\{P_VAL\\}, \\{P_VAL\\}\\}"); | 
|  | escape = escape.replace(/LINE_VAL/g, "(?:\\$\\d = )?\\{\\{P_VAL\\}, \\{P_VAL\\}\\}"); | 
|  | escape = escape.replace(/FILL_TYPE/g, "SkPath::k[a-zA-Z]+_FillType"); | 
|  | escape = escape.replace(/PT_VAL/g, "\\{\\{P_VAL\\}\\}"); | 
|  | escape = escape.replace(/P_VAL/g, "(?:f?[xX] = )?(-?\\d+\\.?\\d*(?:e-?\\d+)?)[Ff]?,(?: f?[yY] = )?(-?\\d+\\.?\\d*(?:e-?\\d+)?)[Ff]?"); | 
|  | escape = escape.replace(/T_VAL/g, "(-?\\d+\\.?\\d*(?:e-?\\d+)?)"); | 
|  | escape = escape.replace(/OPER/g, "[a-z]+"); | 
|  | escape = escape.replace(/PATH/g, "pathB?"); | 
|  | escape = escape.replace(/T_F/g, "([TF])"); | 
|  | escape = escape.replace(/IDX/g, "(\\d+)"); | 
|  | escape = escape.replace(/NUM/g, "(-?\\d+)"); | 
|  | escape = escape.replace(/OPT/g, "(\\?|-?\\d+)"); | 
|  | return new RegExp(escape, 'i'); | 
|  | } | 
|  |  | 
|  | function match_regexp(str, lineNo, array, id, pattern) { | 
|  | var regex = construct_regexp2(pattern); | 
|  | if (filter_str_by(id, str, regex, array)) { | 
|  | return true; | 
|  | } | 
|  | regex = construct_regexp2c(pattern); | 
|  | return filter_str_by(id, str, regex, array); | 
|  | } | 
|  |  | 
|  | function endsWith(str, suffix) { | 
|  | return str.indexOf(suffix, str.length - suffix.length) !== -1; | 
|  | } | 
|  |  | 
|  | function parse_all(test) { | 
|  | var lines = test.match(/[^\r\n]+/g); | 
|  | var records = []; // a rec can be the original paths, a set of intersections, a set of active spans, a sort, or a path add | 
|  | var record = []; | 
|  | var recType = REC_TYPE_UNKNOWN; | 
|  | var lastLineNo; | 
|  | var moveX, moveY; | 
|  | for (var lineNo = 0; lineNo < lines.length; ++lineNo) { | 
|  | var line = lines[lineNo]; | 
|  | if (line.length == 0) { | 
|  | continue; | 
|  | } | 
|  | var opStart = "SkOpSegment::"; | 
|  | if (line.lastIndexOf(opStart, 0) === 0) { | 
|  | line = line.substr(opStart.length); | 
|  | } | 
|  | var angleStart = "SkOpAngle::"; | 
|  | if (line.lastIndexOf(angleStart, 0) === 0) { | 
|  | line = line.substr(angleStart.length); | 
|  | } | 
|  | var type = line.lastIndexOf("debugShowActiveSpans", 0) === 0 ? REC_TYPE_ACTIVE | 
|  | : line.lastIndexOf("debugShowTs", 0) === 0 ? REC_TYPE_COIN | 
|  | : line.lastIndexOf("debugShow", 0) === 0 ? REC_TYPE_SECT | 
|  | : line.lastIndexOf("activeOp", 0) === 0 ? REC_TYPE_ACTIVE_OP | 
|  | : line.lastIndexOf("computed", 0) === 0 ? REC_TYPE_COMPUTED | 
|  | : line.lastIndexOf("debugOne", 0) === 0 ? REC_TYPE_SORT | 
|  | : line.lastIndexOf("dumpOne", 0) === 0 ? REC_TYPE_SORT | 
|  | : line.lastIndexOf("pathB.", 0) === 0 ? REC_TYPE_ADD | 
|  | : line.lastIndexOf("path.", 0) === 0 ? REC_TYPE_ADD | 
|  | : line.lastIndexOf("after", 0) === 0 ? REC_TYPE_ANGLE | 
|  | : line.lastIndexOf("mark", 0) === 0 ? REC_TYPE_MARK | 
|  | : line.lastIndexOf("  {{", 0) === 0 ? REC_TYPE_COMPUTED | 
|  | : line.lastIndexOf("{{", 0) === 0 ? REC_TYPE_PATH | 
|  | : line.lastIndexOf("op", 0) === 0 ? REC_TYPE_OP | 
|  | : line.lastIndexOf("$", 0) === 0 ? REC_TYPE_PATH | 
|  | : REC_TYPE_UNKNOWN; | 
|  | if (recType != type || recType == REC_TYPE_ADD || recType == REC_TYPE_SECT | 
|  | || recType == REC_TYPE_ACTIVE_OP || recType == REC_TYPE_ANGLE) { | 
|  | if (recType != REC_TYPE_UNKNOWN) { | 
|  | records.push(recType); | 
|  | records.push(lastLineNo); | 
|  | records.push(record); | 
|  | } | 
|  | record = []; | 
|  | recType = type; | 
|  | lastLineNo = lineNo; | 
|  | } | 
|  | var found = false; | 
|  | switch (recType) { | 
|  | case REC_TYPE_ACTIVE: | 
|  | found = match_regexp(line, lineNo, record, ACTIVE_LINE_SPAN, "debugShowActiveSpans" + | 
|  | " id=IDX LINE_VAL t=T_VAL PT_VAL tEnd=T_VAL other=IDX otherT=T_VAL otherIndex=IDX windSum=OPT windValue=IDX oppValue=NUM" | 
|  | ) || match_regexp(line, lineNo, record, ACTIVE_QUAD_SPAN, "debugShowActiveSpans" + | 
|  | " id=IDX QUAD_VAL t=T_VAL PT_VAL tEnd=T_VAL other=IDX otherT=T_VAL otherIndex=IDX windSum=OPT windValue=IDX oppValue=NUM" | 
|  | ) || match_regexp(line, lineNo, record, ACTIVE_CUBIC_SPAN, "debugShowActiveSpans" + | 
|  | " id=IDX CUBIC_VAL t=T_VAL PT_VAL tEnd=T_VAL other=IDX otherT=T_VAL otherIndex=IDX windSum=OPT windValue=IDX oppValue=NUM" | 
|  | ); | 
|  | break; | 
|  | case REC_TYPE_ACTIVE_OP: | 
|  | found = match_regexp(line, lineNo, record, ACTIVE_OP, "activeOp" + | 
|  | " id=IDX t=T_VAL tEnd=T_VAL op=OPER miFrom=NUM miTo=NUM suFrom=NUM suTo=NUM result=IDX" | 
|  | ); | 
|  | break; | 
|  | case REC_TYPE_ADD: | 
|  | if (match_regexp(line, lineNo, record, ADD_MOVETO, "PATH.moveTo(P_VAL);")) { | 
|  | moveX = record[1][0]; | 
|  | moveY = record[1][1]; | 
|  | found = true; | 
|  | } else if (match_regexp(line, lineNo, record, ADD_LINETO, "PATH.lineTo(P_VAL);")) { | 
|  | record[1].unshift(moveY); | 
|  | record[1].unshift(moveX); | 
|  | moveX = record[1][2]; | 
|  | moveY = record[1][3]; | 
|  | found = true; | 
|  | } else if (match_regexp(line, lineNo, record, ADD_QUADTO, "PATH.quadTo(P_VAL, P_VAL);")) { | 
|  | record[1].unshift(moveY); | 
|  | record[1].unshift(moveX); | 
|  | moveX = record[1][4]; | 
|  | moveY = record[1][5]; | 
|  | found = true; | 
|  | } else if (match_regexp(line, lineNo, record, ADD_CUBICTO, "PATH.cubicTo(P_VAL, P_VAL, P_VAL);")) { | 
|  | record[1].unshift(moveY); | 
|  | record[1].unshift(moveX); | 
|  | moveX = record[1][6]; | 
|  | moveY = record[1][7]; | 
|  | found = true; | 
|  | } else if (match_regexp(line, lineNo, record, ADD_FILL, "PATH.setFillType(FILL_TYPE);")) { | 
|  | found = true; | 
|  | } else { | 
|  | found = match_regexp(line, lineNo, record, ADD_CLOSE, "PATH.close();"); | 
|  | } | 
|  | break; | 
|  | case REC_TYPE_ANGLE: | 
|  | found = match_regexp(line, lineNo, record, ANGLE_AFTER, "after " + | 
|  | "id=IDX IDX/IDX tStart=T_VAL tEnd=T_VAL < id=IDX IDX/IDX tStart=T_VAL tEnd=T_VAL < id=IDX IDX/IDX tStart=T_VAL tEnd=T_VAL  T_F IDX"); | 
|  | if (found) { | 
|  | break; | 
|  | } | 
|  | found = match_regexp(line, lineNo, record, ANGLE_AFTER2, "after " + | 
|  | "[IDX/IDX] NUM/NUM tStart=T_VAL tEnd=T_VAL < [IDX/IDX] NUM/NUM tStart=T_VAL tEnd=T_VAL < [IDX/IDX] NUM/NUM tStart=T_VAL tEnd=T_VAL  T_F IDX"); | 
|  | break; | 
|  | case REC_TYPE_COIN: | 
|  | found = true; | 
|  | break; | 
|  | case REC_TYPE_COMPUTED: | 
|  | found = line ==  "computed quadratics given" | 
|  | || match_regexp(line, lineNo, record, COMPUTED_SET_1, "computed quadratics set 1" | 
|  | ) || match_regexp(line, lineNo, record, COMPUTED_SET_2, "computed quadratics set 2" | 
|  | ) || match_regexp(line, lineNo, record, PATH_QUAD, "  QUAD_VAL," | 
|  | ) || match_regexp(line, lineNo, record, PATH_CUBIC, "  CUBIC_VAL," | 
|  | ); | 
|  | break; | 
|  | case REC_TYPE_PATH: | 
|  | found = match_regexp(line, lineNo, record, PATH_LINE, "LINE_VAL" | 
|  | ) || match_regexp(line, lineNo, record, PATH_QUAD, "QUAD_VAL" | 
|  | ) || match_regexp(line, lineNo, record, PATH_CUBIC, "CUBIC_VAL" | 
|  | ); | 
|  | break; | 
|  | case REC_TYPE_SECT: | 
|  | found = match_regexp(line, lineNo, record, INTERSECT_LINE, "debugShowLineIntersection" + | 
|  | " wtTs[0]=T_VAL LINE_VAL PT_VAL wnTs[0]=T_VAL LINE_VAL" | 
|  | ) || match_regexp(line, lineNo, record, INTERSECT_LINE_2, "debugShowLineIntersection" + | 
|  | " wtTs[0]=T_VAL LINE_VAL PT_VAL wtTs[1]=T_VAL PT_VAL wnTs[0]=T_VAL LINE_VAL wnTs[1]=T_VAL" | 
|  | ) || match_regexp(line, lineNo, record, INTERSECT_LINE_NO, "debugShowLineIntersection" + | 
|  | " no intersect LINE_VAL LINE_VAL" | 
|  | ) || match_regexp(line, lineNo, record, INTERSECT_QUAD_LINE, "debugShowQuadLineIntersection" + | 
|  | " wtTs[0]=T_VAL QUAD_VAL PT_VAL wnTs[0]=T_VAL LINE_VAL" | 
|  | ) || match_regexp(line, lineNo, record, INTERSECT_QUAD_LINE_2, "debugShowQuadLineIntersection" + | 
|  | " wtTs[0]=T_VAL QUAD_VAL PT_VAL wtTs[1]=T_VAL PT_VAL wnTs[0]=T_VAL LINE_VAL wnTs[1]=T_VAL" | 
|  | ) || match_regexp(line, lineNo, record, INTERSECT_QUAD_LINE_NO, "debugShowQuadLineIntersection" + | 
|  | " no intersect QUAD_VAL LINE_VAL" | 
|  | ) || match_regexp(line, lineNo, record, INTERSECT_QUAD, "debugShowQuadIntersection" + | 
|  | " wtTs[0]=T_VAL QUAD_VAL PT_VAL wnTs[0]=T_VAL QUAD_VAL" | 
|  | ) || match_regexp(line, lineNo, record, INTERSECT_QUAD_2, "debugShowQuadIntersection" + | 
|  | " wtTs[0]=T_VAL QUAD_VAL PT_VAL wtTs[1]=T_VAL PT_VAL wnTs[0]=T_VAL QUAD_VAL wnTs[1]=T_VAL" | 
|  | ) || match_regexp(line, lineNo, record, INTERSECT_QUAD_NO, "debugShowQuadIntersection" + | 
|  | " no intersect QUAD_VAL QUAD_VAL" | 
|  | ) || match_regexp(line, lineNo, record, INTERSECT_CUBIC_LINE, "debugShowCubicLineIntersection" + | 
|  | " wtTs[0]=T_VAL CUBIC_VAL PT_VAL wnTs[0]=T_VAL LINE_VAL" | 
|  | ) || match_regexp(line, lineNo, record, INTERSECT_CUBIC_LINE_2, "debugShowCubicLineIntersection" + | 
|  | " wtTs[0]=T_VAL CUBIC_VAL PT_VAL wtTs[1]=T_VAL PT_VAL wnTs[0]=T_VAL LINE_VAL wnTs[1]=T_VAL" | 
|  | ) || match_regexp(line, lineNo, record, INTERSECT_CUBIC_LINE_3, "debugShowCubicLineIntersection" + | 
|  | " wtTs[0]=T_VAL CUBIC_VAL PT_VAL wtTs[1]=T_VAL PT_VAL wtTs[2]=T_VAL PT_VAL wnTs[0]=T_VAL LINE_VAL wnTs[1]=T_VAL wnTs[2]=T_VAL" | 
|  | ) || match_regexp(line, lineNo, record, INTERSECT_CUBIC_LINE_NO, "debugShowCubicLineIntersection" + | 
|  | " no intersect CUBIC_VAL LINE_VAL" | 
|  | ) || match_regexp(line, lineNo, record, INTERSECT_CUBIC_QUAD, "debugShowCubicQuadIntersection" + | 
|  | " wtTs[0]=T_VAL CUBIC_VAL PT_VAL wnTs[0]=T_VAL QUAD_VAL" | 
|  | ) || match_regexp(line, lineNo, record, INTERSECT_CUBIC_QUAD_2, "debugShowCubicQuadIntersection" + | 
|  | " wtTs[0]=T_VAL CUBIC_VAL PT_VAL wtTs[1]=T_VAL PT_VAL wnTs[0]=T_VAL QUAD_VAL wnTs[1]=T_VAL" | 
|  | ) || match_regexp(line, lineNo, record, INTERSECT_CUBIC_QUAD_3, "debugShowCubicQuadIntersection" + | 
|  | " wtTs[0]=T_VAL CUBIC_VAL PT_VAL wtTs[1]=T_VAL PT_VAL wtTs[2]=T_VAL PT_VAL wnTs[0]=T_VAL QUAD_VAL wnTs[1]=T_VAL wnTs[2]=T_VAL" | 
|  | ) || match_regexp(line, lineNo, record, INTERSECT_CUBIC_QUAD_4, "debugShowCubicQuadIntersection" + | 
|  | " wtTs[0]=T_VAL CUBIC_VAL PT_VAL wtTs[1]=T_VAL PT_VAL wtTs[2]=T_VAL wtTs[3]=T_VAL PT_VAL wnTs[0]=T_VAL QUAD_VAL wnTs[1]=T_VAL wnTs[2]=T_VAL wnTs[3]=T_VAL" | 
|  | ) || match_regexp(line, lineNo, record, INTERSECT_CUBIC_QUAD_NO, "debugShowCubicQuadIntersection" + | 
|  | " no intersect CUBIC_VAL QUAD_VAL" | 
|  | ) || match_regexp(line, lineNo, record, INTERSECT_CUBIC, "debugShowCubicIntersection" + | 
|  | " wtTs[0]=T_VAL CUBIC_VAL PT_VAL wnTs[0]=T_VAL CUBIC_VAL" | 
|  | ) || match_regexp(line, lineNo, record, INTERSECT_CUBIC_2, "debugShowCubicIntersection" + | 
|  | " wtTs[0]=T_VAL CUBIC_VAL PT_VAL wtTs[1]=T_VAL PT_VAL wnTs[0]=T_VAL CUBIC_VAL wnTs[1]=T_VAL" | 
|  | ) || match_regexp(line, lineNo, record, INTERSECT_CUBIC_3, "debugShowCubicIntersection" + | 
|  | " wtTs[0]=T_VAL CUBIC_VAL PT_VAL wtTs[1]=T_VAL PT_VAL wtTs[2]=T_VAL PT_VAL wnTs[0]=T_VAL CUBIC_VAL wnTs[1]=T_VAL wnTs[2]=T_VAL" | 
|  | ) || match_regexp(line, lineNo, record, INTERSECT_CUBIC_4, "debugShowCubicIntersection" + | 
|  | " wtTs[0]=T_VAL CUBIC_VAL PT_VAL wtTs[1]=T_VAL PT_VAL wtTs[2]=T_VAL PT_VAL wtTs[3]=T_VAL PT_VAL wnTs[0]=T_VAL CUBIC_VAL wnTs[1]=T_VAL wnTs[2]=T_VAL wnTs[3]=T_VAL" | 
|  | ) || match_regexp(line, lineNo, record, INTERSECT_CUBIC_NO, "debugShowCubicIntersection" + | 
|  | " no intersect CUBIC_VAL CUBIC_VAL" | 
|  | ) || match_regexp(line, lineNo, record, INTERSECT_SELF_CUBIC, "debugShowCubicIntersection" + | 
|  | " wtTs[0]=T_VAL CUBIC_VAL PT_VAL wtTs[1]=T_VAL" | 
|  | ) || match_regexp(line, lineNo, record, INTERSECT_SELF_CUBIC_NO, "debugShowCubicIntersection" + | 
|  | " no self intersect CUBIC_VAL" | 
|  | ); | 
|  | break; | 
|  | case REC_TYPE_SORT: | 
|  | var hasDone = / done/.test(line); | 
|  | var hasUnorderable = / unorderable/.test(line); | 
|  | var hasSmall = / small/.test(line); | 
|  | var hasTiny = / tiny/.test(line); | 
|  | var hasOperand = / operand/.test(line); | 
|  | var hasStop = / stop/.test(line); | 
|  | line.replace(/[ a-z]+$/, ""); | 
|  | found = match_regexp(line, lineNo, record, SORT_UNARY, "debugOne" + | 
|  | " [IDX/IDX] next=IDX/IDX sect=IDX/IDX  s=T_VAL [IDX] e=T_VAL [IDX] sgn=NUM windVal=IDX windSum=OPT" | 
|  | ) || match_regexp(line, lineNo, record, SORT_BINARY, "debugOne" + | 
|  | " [IDX/IDX] next=IDX/IDX sect=IDX/IDX  s=T_VAL [IDX] e=T_VAL [IDX] sgn=NUM windVal=IDX windSum=OPT oppVal=IDX oppSum=OPT" | 
|  | ) || match_regexp(line, lineNo, record, SORT_UNARY, "dumpOne" + | 
|  | " [IDX/IDX] next=IDX/IDX sect=NUM/NUM  s=T_VAL [IDX] e=T_VAL [IDX] sgn=NUM windVal=IDX windSum=OPT" | 
|  | ) || match_regexp(line, lineNo, record, SORT_BINARY, "dumpOne" + | 
|  | " [IDX/IDX] next=IDX/IDX sect=NUM/NUM  s=T_VAL [IDX] e=T_VAL [IDX] sgn=NUM windVal=IDX windSum=OPT oppVal=IDX oppSum=OPT" | 
|  | ); | 
|  | if (found) { | 
|  | record[1].push(hasDone); | 
|  | record[1].push(hasUnorderable); | 
|  | record[1].push(hasSmall); | 
|  | record[1].push(hasTiny); | 
|  | record[1].push(hasOperand); | 
|  | record[1].push(hasStop); | 
|  | } | 
|  | break; | 
|  | case REC_TYPE_MARK: | 
|  | found = match_regexp(line, lineNo, record, MARK_LINE, "markWinding" + | 
|  | " id=IDX LINE_VAL t=T_VAL [IDX] PT_VAL tEnd=T_VAL newWindSum=NUM newOppSum=NUM oppSum=OPT windSum=OPT windValue=IDX" | 
|  | ) || match_regexp(line, lineNo, record, MARK_QUAD, "markWinding" + | 
|  | " id=IDX QUAD_VAL t=T_VAL [IDX] PT_VAL tEnd=T_VAL newWindSum=NUM newOppSum=NUM oppSum=OPT windSum=OPT windValue=IDX" | 
|  | ) || match_regexp(line, lineNo, record, MARK_CUBIC, "markWinding" + | 
|  | " id=IDX CUBIC_VAL t=T_VAL [IDX] PT_VAL tEnd=T_VAL newWindSum=NUM newOppSum=NUM oppSum=OPT windSum=OPT windValue=IDX" | 
|  | ) || match_regexp(line, lineNo, record, MARK_DONE_LINE, "markDoneBinary" + | 
|  | " id=IDX LINE_VAL t=T_VAL [IDX] PT_VAL tEnd=T_VAL newWindSum=NUM newOppSum=NUM oppSum=OPT windSum=OPT windValue=IDX" | 
|  | ) || match_regexp(line, lineNo, record, MARK_DONE_QUAD, "markDoneBinary" + | 
|  | " id=IDX QUAD_VAL t=T_VAL [IDX] PT_VAL tEnd=T_VAL newWindSum=NUM newOppSum=NUM oppSum=OPT windSum=OPT windValue=IDX" | 
|  | ) || match_regexp(line, lineNo, record, MARK_DONE_CUBIC, "markDoneBinary" + | 
|  | " id=IDX CUBIC_VAL t=T_VAL [IDX] PT_VAL tEnd=T_VAL newWindSum=NUM newOppSum=NUM oppSum=OPT windSum=OPT windValue=IDX" | 
|  | ) || match_regexp(line, lineNo, record, MARK_UNSORTABLE_LINE, "markUnsortable" + | 
|  | " id=IDX LINE_VAL t=T_VAL [IDX] PT_VAL tEnd=T_VAL newWindSum=NUM windSum=OPT windValue=IDX" | 
|  | ) || match_regexp(line, lineNo, record, MARK_UNSORTABLE_QUAD, "markUnsortable" + | 
|  | " id=IDX QUAD_VAL t=T_VAL [IDX] PT_VAL tEnd=T_VAL newWindSum=NUM windSum=OPT windValue=IDX" | 
|  | ) || match_regexp(line, lineNo, record, MARK_UNSORTABLE_CUBIC, "markUnsortable" + | 
|  | " id=IDX CUBIC_VAL t=T_VAL [IDX] PT_VAL tEnd=T_VAL newWindSum=NUM windSum=OPT windValue=IDX" | 
|  | ) || match_regexp(line, lineNo, record, MARK_SIMPLE_LINE, "markWinding" + | 
|  | " id=IDX LINE_VAL t=T_VAL [IDX] PT_VAL tEnd=T_VAL newWindSum=NUM windSum=OPT windValue=IDX" | 
|  | ) || match_regexp(line, lineNo, record, MARK_SIMPLE_QUAD, "markWinding" + | 
|  | " id=IDX QUAD_VAL t=T_VAL [IDX] PT_VAL tEnd=T_VAL newWindSum=NUM windSum=OPT windValue=IDX" | 
|  | ) || match_regexp(line, lineNo, record, MARK_SIMPLE_CUBIC, "markWinding" + | 
|  | " id=IDX CUBIC_VAL t=T_VAL [IDX] PT_VAL tEnd=T_VAL newWindSum=NUM windSum=OPT windValue=IDX" | 
|  | ) || match_regexp(line, lineNo, record, MARK_SIMPLE_DONE_LINE, "markDone" + | 
|  | " id=IDX LINE_VAL t=T_VAL [IDX] PT_VAL tEnd=T_VAL newWindSum=NUM windSum=OPT windValue=IDX" | 
|  | ) || match_regexp(line, lineNo, record, MARK_SIMPLE_DONE_QUAD, "markDone" + | 
|  | " id=IDX QUAD_VAL t=T_VAL [IDX] PT_VAL tEnd=T_VAL newWindSum=NUM windSum=OPT windValue=IDX" | 
|  | ) || match_regexp(line, lineNo, record, MARK_SIMPLE_DONE_CUBIC, "markDone" + | 
|  | " id=IDX CUBIC_VAL t=T_VAL [IDX] PT_VAL tEnd=T_VAL newWindSum=NUM windSum=OPT windValue=IDX" | 
|  | ) || match_regexp(line, lineNo, record, MARK_DONE_UNARY_LINE, "markDoneUnary" + | 
|  | " id=IDX LINE_VAL t=T_VAL [IDX] PT_VAL tEnd=T_VAL newWindSum=NUM windSum=OPT windValue=IDX" | 
|  | ) || match_regexp(line, lineNo, record, MARK_DONE_UNARY_QUAD, "markDoneUnary" + | 
|  | " id=IDX QUAD_VAL t=T_VAL [IDX] PT_VAL tEnd=T_VAL newWindSum=NUM windSum=OPT windValue=IDX" | 
|  | ) || match_regexp(line, lineNo, record, MARK_DONE_UNARY_CUBIC, "markDoneUnary" + | 
|  | " id=IDX CUBIC_VAL t=T_VAL [IDX] PT_VAL tEnd=T_VAL newWindSum=NUM windSum=OPT windValue=IDX" | 
|  | ) || match_regexp(line, lineNo, record, MARK_ANGLE_LAST, "markAngle" + | 
|  | " last id=IDX windSum=OPT small=IDX"); | 
|  | break; | 
|  | case REC_TYPE_OP: | 
|  | if (line.lastIndexOf("oppSign oppSign=", 0) === 0 | 
|  | || line.lastIndexOf("operator<", 0) === 0) { | 
|  | found = true; | 
|  | break; | 
|  | } | 
|  | found = match_regexp(line, lineNo, record, OP_DIFFERENCE, "op difference" | 
|  | ) || match_regexp(line, lineNo, record, OP_INTERSECT, "op intersect" | 
|  | ) || match_regexp(line, lineNo, record, OP_UNION, "op union" | 
|  | ) || match_regexp(line, lineNo, record, OP_XOR, "op xor" | 
|  | ); | 
|  | break; | 
|  | case REC_TYPE_UNKNOWN: | 
|  | found = true; | 
|  | break; | 
|  | } | 
|  | if (!found) { | 
|  | console.log(line + " [" + lineNo + "] of type " + type + " not found"); | 
|  | } | 
|  | } | 
|  | if (recType != REC_TYPE_UNKNOWN) { | 
|  | records.push(recType); | 
|  | records.push(lastLineNo); | 
|  | records.push(record); | 
|  | } | 
|  | if (records.length >= 1) { | 
|  | tests[testIndex] = records; | 
|  | testLines[testIndex] = lines; | 
|  | } | 
|  | } | 
|  |  | 
|  | function init(test) { | 
|  | var canvas = document.getElementById('canvas'); | 
|  | if (!canvas.getContext) return; | 
|  | ctx = canvas.getContext('2d'); | 
|  | var resScale = retina_scale && window.devicePixelRatio ? window.devicePixelRatio : 1; | 
|  | var unscaledWidth = window.innerWidth - 20; | 
|  | var unscaledHeight = window.innerHeight - 20; | 
|  | screenWidth = unscaledWidth; | 
|  | screenHeight = unscaledHeight; | 
|  | canvas.width = unscaledWidth * resScale; | 
|  | canvas.height = unscaledHeight * resScale; | 
|  | canvas.style.width = unscaledWidth + 'px'; | 
|  | canvas.style.height = unscaledHeight + 'px'; | 
|  | if (resScale != 1) { | 
|  | ctx.scale(resScale, resScale); | 
|  | } | 
|  | xmin = Infinity; | 
|  | xmax = -Infinity; | 
|  | ymin = Infinity; | 
|  | ymax = -Infinity; | 
|  | hasPath = hasComputedPath = false; | 
|  | firstActiveSpan = -1; | 
|  | for (var tIndex = 0; tIndex < test.length; tIndex += 3) { | 
|  | var recType = test[tIndex]; | 
|  | if (!typeof recType == 'number' || recType < REC_TYPE_UNKNOWN || recType > REC_TYPE_LAST) { | 
|  | console.log("unknown rec type: " + recType); | 
|  | throw "stop execution"; | 
|  | } | 
|  | var records = test[tIndex + 2]; | 
|  | for (var recordIndex = 0; recordIndex < records.length; recordIndex += 2) { | 
|  | var fragType = records[recordIndex]; | 
|  | if (!typeof fragType == 'number' || fragType < 1 || fragType > FRAG_TYPE_LAST) { | 
|  | console.log("unknown in range frag type: " + fragType); | 
|  | throw "stop execution"; | 
|  | } | 
|  | var frags = records[recordIndex + 1]; | 
|  | var first = 0; | 
|  | var last = -1; | 
|  | var first2 = 0; | 
|  | var last2 = 0; | 
|  | switch (recType) { | 
|  | case REC_TYPE_COMPUTED: | 
|  | if (fragType == COMPUTED_SET_1 || fragType == COMPUTED_SET_2) { | 
|  | break; | 
|  | } | 
|  | hasComputedPath = true; | 
|  | case REC_TYPE_PATH: | 
|  | switch (fragType) { | 
|  | case PATH_LINE: | 
|  | last = 4; | 
|  | break; | 
|  | case PATH_QUAD: | 
|  | last = 6; | 
|  | break; | 
|  | case PATH_CUBIC: | 
|  | last = 8; | 
|  | break; | 
|  | default: | 
|  | console.log("unknown " + (recType == REC_TYPE_PATH ? "REC_TYPE_PATH" | 
|  | : "REC_TYPE_COMPUTED") + " frag type:" + fragType); | 
|  | throw "stop execution"; | 
|  | } | 
|  | if (recType == REC_TYPE_PATH) { | 
|  | hasPath = true; | 
|  | } | 
|  | break; | 
|  | case REC_TYPE_ACTIVE: | 
|  | if (firstActiveSpan < 0) { | 
|  | firstActiveSpan = tIndex; | 
|  | } | 
|  | first = 1; | 
|  | switch (fragType) { | 
|  | case ACTIVE_LINE_SPAN: | 
|  | last = 5; | 
|  | break; | 
|  | case ACTIVE_QUAD_SPAN: | 
|  | last = 7; | 
|  | break; | 
|  | case ACTIVE_CUBIC_SPAN: | 
|  | last = 9; | 
|  | break; | 
|  | default: | 
|  | console.log("unknown REC_TYPE_ACTIVE frag type: " + fragType); | 
|  | throw "stop execution"; | 
|  | } | 
|  | break; | 
|  | case REC_TYPE_ADD: | 
|  | switch (fragType) { | 
|  | case ADD_MOVETO: | 
|  | break; | 
|  | case ADD_LINETO: | 
|  | last = 4; | 
|  | break; | 
|  | case ADD_QUADTO: | 
|  | last = 6; | 
|  | break; | 
|  | case ADD_CUBICTO: | 
|  | last = 8; | 
|  | break; | 
|  | case ADD_CLOSE: | 
|  | case ADD_FILL: | 
|  | break; | 
|  | default: | 
|  | console.log("unknown REC_TYPE_ADD frag type: " + fragType); | 
|  | throw "stop execution"; | 
|  | } | 
|  | break; | 
|  | case REC_TYPE_SECT: | 
|  | switch (fragType) { | 
|  | case INTERSECT_LINE: | 
|  | first = 1; last = 5; first2 = 8; last2 = 12; | 
|  | break; | 
|  | case INTERSECT_LINE_2: | 
|  | first = 1; last = 5; first2 = 11; last2 = 15; | 
|  | break; | 
|  | case INTERSECT_LINE_NO: | 
|  | first = 0; last = 4; first2 = 4; last2 = 8; | 
|  | break; | 
|  | case INTERSECT_QUAD_LINE: | 
|  | first = 1; last = 7; first2 = 10; last2 = 14; | 
|  | break; | 
|  | case INTERSECT_QUAD_LINE_2: | 
|  | first = 1; last = 7; first2 = 13; last2 = 17; | 
|  | break; | 
|  | case INTERSECT_QUAD_LINE_NO: | 
|  | first = 0; last = 6; first2 = 6; last2 = 10; | 
|  | break; | 
|  | case INTERSECT_QUAD: | 
|  | first = 1; last = 7; first2 = 10; last2 = 16; | 
|  | break; | 
|  | case INTERSECT_QUAD_2: | 
|  | first = 1; last = 7; first2 = 13; last2 = 19; | 
|  | break; | 
|  | case INTERSECT_QUAD_NO: | 
|  | first = 0; last = 6; first2 = 6; last2 = 12; | 
|  | break; | 
|  | case INTERSECT_SELF_CUBIC: | 
|  | first = 1; last = 9; | 
|  | break; | 
|  | case INTERSECT_SELF_CUBIC_NO: | 
|  | first = 0; last = 8; | 
|  | break; | 
|  | case INTERSECT_CUBIC_LINE: | 
|  | first = 1; last = 9; first2 = 12; last2 = 16; | 
|  | break; | 
|  | case INTERSECT_CUBIC_LINE_2: | 
|  | first = 1; last = 9; first2 = 15; last2 = 19; | 
|  | break; | 
|  | case INTERSECT_CUBIC_LINE_3: | 
|  | first = 1; last = 9; first2 = 18; last2 = 22; | 
|  | break; | 
|  | case INTERSECT_CUBIC_LINE_NO: | 
|  | first = 0; last = 8; first2 = 8; last2 = 12; | 
|  | break; | 
|  | case INTERSECT_CUBIC_QUAD: | 
|  | first = 1; last = 9; first2 = 12; last2 = 18; | 
|  | break; | 
|  | case INTERSECT_CUBIC_QUAD_2: | 
|  | first = 1; last = 9; first2 = 15; last2 = 21; | 
|  | break; | 
|  | case INTERSECT_CUBIC_QUAD_3: | 
|  | first = 1; last = 9; first2 = 18; last2 = 24; | 
|  | break; | 
|  | case INTERSECT_CUBIC_QUAD_4: | 
|  | first = 1; last = 9; first2 = 21; last2 = 27; | 
|  | break; | 
|  | case INTERSECT_CUBIC_QUAD_NO: | 
|  | first = 0; last = 8; first2 = 8; last2 = 14; | 
|  | break; | 
|  | case INTERSECT_CUBIC: | 
|  | first = 1; last = 9; first2 = 12; last2 = 20; | 
|  | break; | 
|  | case INTERSECT_CUBIC_2: | 
|  | first = 1; last = 9; first2 = 15; last2 = 23; | 
|  | break; | 
|  | case INTERSECT_CUBIC_3: | 
|  | first = 1; last = 9; first2 = 18; last2 = 26; | 
|  | break; | 
|  | case INTERSECT_CUBIC_4: | 
|  | first = 1; last = 9; first2 = 21; last2 = 29; | 
|  | break; | 
|  | case INTERSECT_CUBIC_NO: | 
|  | first = 0; last = 8; first2 = 8; last2 = 16; | 
|  | break; | 
|  | default: | 
|  | console.log("unknown REC_TYPE_SECT frag type: " + fragType); | 
|  | throw "stop execution"; | 
|  | } | 
|  | break; | 
|  | default: | 
|  | continue; | 
|  | } | 
|  | for (var idx = first; idx < last; idx += 2) { | 
|  | xmin = Math.min(xmin, frags[idx]); | 
|  | xmax = Math.max(xmax, frags[idx]); | 
|  | ymin = Math.min(ymin, frags[idx + 1]); | 
|  | ymax = Math.max(ymax, frags[idx + 1]); | 
|  | } | 
|  | for (var idx = first2; idx < last2; idx += 2) { | 
|  | xmin = Math.min(xmin, frags[idx]); | 
|  | xmax = Math.max(xmax, frags[idx]); | 
|  | ymin = Math.min(ymin, frags[idx + 1]); | 
|  | ymax = Math.max(ymax, frags[idx + 1]); | 
|  | } | 
|  | } | 
|  | } | 
|  | var angleBounds = [Infinity, Infinity, -Infinity, -Infinity]; | 
|  | for (var tIndex = 0; tIndex < test.length; tIndex += 3) { | 
|  | var recType = test[tIndex]; | 
|  | var records = test[tIndex + 2]; | 
|  | for (var recordIndex = 0; recordIndex < records.length; recordIndex += 2) { | 
|  | var fragType = records[recordIndex]; | 
|  | var frags = records[recordIndex + 1]; | 
|  | switch (recType) { | 
|  | case REC_TYPE_ACTIVE_OP: | 
|  | if (!draw_op) { | 
|  | break; | 
|  | } | 
|  | { | 
|  | var curve = curvePartialByID(test, frags[0], frags[1], frags[2]); | 
|  | curve_extremes(curve, angleBounds); | 
|  | } | 
|  | break; | 
|  | case REC_TYPE_ANGLE: | 
|  | if (!draw_angle) { | 
|  | break; | 
|  | } | 
|  | if (fragType == ANGLE_AFTER) { | 
|  | var curve = curvePartialByID(test, frags[0], frags[3], frags[4]); | 
|  | curve_extremes(curve, angleBounds); | 
|  | curve = curvePartialByID(test, frags[5], frags[8], frags[9]); | 
|  | curve_extremes(curve, angleBounds); | 
|  | curve = curvePartialByID(test, frags[10], frags[13], frags[14]); | 
|  | } else if (fragType == ANGLE_AFTER2) { | 
|  | var curve = curvePartialByID(test, frags[0], frags[4], frags[5]); | 
|  | curve_extremes(curve, angleBounds); | 
|  | curve = curvePartialByID(test, frags[6], frags[10], frags[11]); | 
|  | curve_extremes(curve, angleBounds); | 
|  | curve = curvePartialByID(test, frags[12], frags[16], frags[17]); | 
|  | } | 
|  | break; | 
|  | case REC_TYPE_SORT: | 
|  | if (!draw_sort) { | 
|  | break; | 
|  | } | 
|  | if (fragType == SORT_UNARY || fragType == SORT_BINARY) { | 
|  | var curve = curvePartialByID(test, frags[0], frags[6], frags[8]); | 
|  | curve_extremes(curve, angleBounds); | 
|  | } | 
|  | break; | 
|  | } | 
|  | } | 
|  | } | 
|  | xmin = Math.min(xmin, angleBounds[0]); | 
|  | ymin = Math.min(ymin, angleBounds[1]); | 
|  | xmax = Math.max(xmax, angleBounds[2]); | 
|  | ymax = Math.max(ymax, angleBounds[3]); | 
|  | setScale(xmin, xmax, ymin, ymax); | 
|  | if (hasPath == false && hasComputedPath == true && !draw_computed) { | 
|  | draw_computed = 3; // show both quadratics and cubics | 
|  | } | 
|  | if (hasPath == true && hasComputedPath == false && draw_computed) { | 
|  | draw_computed = 0; | 
|  | } | 
|  | } | 
|  |  | 
|  | function curveByID(test, id) { | 
|  | var tIndex = firstActiveSpan; | 
|  | if (tIndex < 0) { | 
|  | return []; | 
|  | } | 
|  | while (tIndex < test.length) { | 
|  | var recType = test[tIndex]; | 
|  | if (recType != REC_TYPE_ACTIVE) { | 
|  | return []; | 
|  | } | 
|  | var records = test[tIndex + 2]; | 
|  | for (var recordIndex = 0; recordIndex < records.length; recordIndex += 2) { | 
|  | var fragType = records[recordIndex]; | 
|  | var frags = records[recordIndex + 1]; | 
|  | if (frags[0] == id) { | 
|  | switch (fragType) { | 
|  | case ACTIVE_LINE_SPAN: | 
|  | return [frags[1], frags[2], frags[3], frags[4]]; | 
|  | case ACTIVE_QUAD_SPAN: | 
|  | return [frags[1], frags[2], frags[3], frags[4], | 
|  | frags[5], frags[6]]; | 
|  | case ACTIVE_CUBIC_SPAN: | 
|  | return [frags[1], frags[2], frags[3], frags[4], | 
|  | frags[5], frags[6], frags[7], frags[8]]; | 
|  | } | 
|  | } | 
|  | } | 
|  | tIndex += 3; | 
|  | } | 
|  | return []; | 
|  | } | 
|  |  | 
|  | function curvePartialByID(test, id, t0, t1) { | 
|  | var tIndex = firstActiveSpan; | 
|  | if (tIndex < 0) { | 
|  | return []; | 
|  | } | 
|  | while (tIndex < test.length) { | 
|  | var recType = test[tIndex]; | 
|  | if (recType != REC_TYPE_ACTIVE) { | 
|  | return []; | 
|  | } | 
|  | var records = test[tIndex + 2]; | 
|  | for (var recordIndex = 0; recordIndex < records.length; recordIndex += 2) { | 
|  | var fragType = records[recordIndex]; | 
|  | var frags = records[recordIndex + 1]; | 
|  | if (frags[0] == id) { | 
|  | switch (fragType) { | 
|  | case ACTIVE_LINE_SPAN: | 
|  | return linePartial(frags[1], frags[2], frags[3], frags[4], t0, t1); | 
|  | case ACTIVE_QUAD_SPAN: | 
|  | return quadPartial(frags[1], frags[2], frags[3], frags[4], | 
|  | frags[5], frags[6], t0, t1); | 
|  | case ACTIVE_CUBIC_SPAN: | 
|  | return cubicPartial(frags[1], frags[2], frags[3], frags[4], | 
|  | frags[5], frags[6], frags[7], frags[8], t0, t1); | 
|  | } | 
|  | } | 
|  | } | 
|  | tIndex += 3; | 
|  | } | 
|  | return []; | 
|  | } | 
|  |  | 
|  | function idByCurve(test, frag, type) { | 
|  | var tIndex = firstActiveSpan; | 
|  | if (tIndex < 0) { | 
|  | return -1; | 
|  | } | 
|  | while (tIndex < test.length) { | 
|  | var recType = test[tIndex]; | 
|  | if (recType != REC_TYPE_ACTIVE) { | 
|  | return -1; | 
|  | } | 
|  | var records = test[tIndex + 2]; | 
|  | for (var recordIndex = 0; recordIndex < records.length; recordIndex += 2) { | 
|  | var fragType = records[recordIndex]; | 
|  | var frags = records[recordIndex + 1]; | 
|  | switch (fragType) { | 
|  | case ACTIVE_LINE_SPAN: | 
|  | if (type != PATH_LINE) { | 
|  | continue; | 
|  | } | 
|  | if (frag[0] != frags[1] || frag[1] != frags[2] | 
|  | || frag[2] != frags[3] || frag[3] != frags[4]) { | 
|  | continue; | 
|  | } | 
|  | return frags[0]; | 
|  | case ACTIVE_QUAD_SPAN: | 
|  | if (type != PATH_QUAD) { | 
|  | continue; | 
|  | } | 
|  | if (frag[0] != frags[1] || frag[1] != frags[2] | 
|  | || frag[2] != frags[3] || frag[3] != frags[4] | 
|  | || frag[4] != frags[5] || frag[5] != frags[6]) { | 
|  | continue; | 
|  | } | 
|  | return frags[0]; | 
|  | case ACTIVE_CUBIC_SPAN: | 
|  | if (type != PATH_CUBIC) { | 
|  | continue; | 
|  | } | 
|  | if (frag[0] != frags[1] || frag[1] != frags[2] | 
|  | || frag[2] != frags[3] || frag[3] != frags[4] | 
|  | || frag[4] != frags[5] || frag[5] != frags[6] | 
|  | || frag[6] != frags[7] || frag[7] != frags[8]) { | 
|  | continue; | 
|  | } | 
|  | return frags[0]; | 
|  | } | 
|  | } | 
|  | ++tIndex; | 
|  | } | 
|  | return -1; | 
|  | } | 
|  |  | 
|  | function curve_extremes(curve, bounds) { | 
|  | for (var index = 0; index < curve.length; index += 2) { | 
|  | var x = curve[index]; | 
|  | var y = curve[index + 1]; | 
|  | bounds[0] = Math.min(bounds[0], x); | 
|  | bounds[1] = Math.min(bounds[1], y); | 
|  | bounds[2] = Math.max(bounds[2], x); | 
|  | bounds[3] = Math.max(bounds[3], y); | 
|  | } | 
|  | } | 
|  |  | 
|  | function setScale(x0, x1, y0, y1) { | 
|  | var srcWidth = x1 - x0; | 
|  | var srcHeight = y1 - y0; | 
|  | var usableWidth = screenWidth; | 
|  | var xDigits = Math.ceil(Math.log(Math.abs(xmax)) / Math.log(10)); | 
|  | var yDigits = Math.ceil(Math.log(Math.abs(ymax)) / Math.log(10)); | 
|  | usableWidth -= (xDigits + yDigits) * 10; | 
|  | usableWidth -= decimal_places * 10; | 
|  | if (draw_legend) { | 
|  | usableWidth -= 40; | 
|  | } | 
|  | var hscale = usableWidth / srcWidth; | 
|  | var vscale = screenHeight / srcHeight; | 
|  | scale = Math.min(hscale, vscale); | 
|  | var invScale = 1 / scale; | 
|  | var sxmin = x0 - invScale * 5; | 
|  | var symin = y0 - invScale * 10; | 
|  | var sxmax = x1 + invScale * (6 * decimal_places + 10); | 
|  | var symax = y1 + invScale * 10; | 
|  | srcWidth = sxmax - sxmin; | 
|  | srcHeight = symax - symin; | 
|  | hscale = usableWidth / srcWidth; | 
|  | vscale = screenHeight / srcHeight; | 
|  | scale = Math.min(hscale, vscale); | 
|  | srcLeft = sxmin; | 
|  | srcTop = symin; | 
|  | } | 
|  |  | 
|  | function drawArc(curve, op, from, to) { | 
|  | var type = PATH_LINE + (curve.length / 2 - 2); | 
|  | var pt = pointAtT(curve, type, op ? 0.4 : 0.6); | 
|  | var dy = pt.y - curve[1]; | 
|  | var dx = pt.x - curve[0]; | 
|  | var dist = Math.sqrt(dy * dy + dx * dx); | 
|  | var _dist = dist * scale; | 
|  | var angle = Math.atan2(dy, dx); | 
|  | var _px = (curve[0] - srcLeft) * scale; | 
|  | var _py = (curve[1] - srcTop) * scale; | 
|  | var divisor = 4; | 
|  | var endDist; | 
|  | do { | 
|  | var ends = []; | 
|  | for (var index = -1; index <= 1; index += 2) { | 
|  | var px = Math.cos(index * Math.PI / divisor); | 
|  | var py = Math.sin(index * Math.PI / divisor); | 
|  | ends.push(px); | 
|  | ends.push(py); | 
|  | } | 
|  | var endDx = (ends[2] - ends[0]) * scale * dist; | 
|  | var endDy = (ends[3] - ends[1]) * scale * dist; | 
|  | endDist = Math.sqrt(endDx * endDx + endDy * endDy); | 
|  | if (endDist < 100) { | 
|  | break; | 
|  | } | 
|  | divisor *= 2; | 
|  | } while (true); | 
|  | if (endDist < 30) { | 
|  | return; | 
|  | } | 
|  | if (op) { | 
|  | divisor *= 2; | 
|  | } | 
|  | ctx.strokeStyle = op ? "rgba(210,0,45, 0.4)" : "rgba(90,90,90, 0.5)"; | 
|  | ctx.beginPath(); | 
|  | ctx.arc(_px, _py, _dist, angle - Math.PI / divisor, angle + Math.PI / divisor, false); | 
|  | ctx.stroke(); | 
|  | var saveAlign = ctx.textAlign; | 
|  | var saveStyle = ctx.fillStyle; | 
|  | var saveFont = ctx.font; | 
|  | ctx.textAlign = "center"; | 
|  | ctx.fillStyle = "black"; | 
|  | ctx.font = "normal 24px Arial"; | 
|  | divisor *= 0.8; | 
|  | for (var index = -1; index <= 1; index += 2) { | 
|  | var px = curve[0] + Math.cos(angle + index * Math.PI / divisor) * dist; | 
|  | var py = curve[1] + Math.sin(angle + index * Math.PI / divisor) * dist; | 
|  | var _px = (px - srcLeft) * scale; | 
|  | var _py = (py - srcTop) * scale; | 
|  | ctx.fillText(index < 0 ? to.toString() : from.toString(), _px, _py + 8); | 
|  | } | 
|  | ctx.textAlign = saveAlign; | 
|  | ctx.fillStyle = saveStyle; | 
|  | ctx.font = saveFont; | 
|  | } | 
|  |  | 
|  | function drawPoint(px, py, end) { | 
|  | for (var pts = 0; pts < drawnPts.length; pts += 2) { | 
|  | var x = drawnPts[pts]; | 
|  | var y = drawnPts[pts + 1]; | 
|  | if (px == x && py == y) { | 
|  | return; | 
|  | } | 
|  | } | 
|  | drawnPts.push(px); | 
|  | drawnPts.push(py); | 
|  | var label = px.toFixed(decimal_places) + ", " + py.toFixed(decimal_places); | 
|  | var _px = (px - srcLeft) * scale; | 
|  | var _py = (py - srcTop) * scale; | 
|  | ctx.beginPath(); | 
|  | ctx.arc(_px, _py, 3, 0, Math.PI*2, true); | 
|  | ctx.closePath(); | 
|  | if (end) { | 
|  | ctx.fill(); | 
|  | } else { | 
|  | ctx.stroke(); | 
|  | } | 
|  | if (debug_xy) { | 
|  | ctx.textAlign = "left"; | 
|  | ctx.fillText(label, _px + 5, _py); | 
|  | } | 
|  | } | 
|  |  | 
|  | function drawPoints(ptArray, curveType, drawControls) { | 
|  | var count = (curveType - PATH_LINE + 2) * 2; | 
|  | for (var idx = 0; idx < count; idx += 2) { | 
|  | if (!drawControls && idx != 0 && idx != count - 2) { | 
|  | continue; | 
|  | } | 
|  | drawPoint(ptArray[idx], ptArray[idx + 1], idx == 0 || idx == count - 2); | 
|  | } | 
|  | } | 
|  |  | 
|  | function drawControlLines(curve, curveType, drawEnd) { | 
|  | if (curveType == PATH_LINE) { | 
|  | return; | 
|  | } | 
|  | ctx.strokeStyle = "rgba(0,0,0, 0.3)"; | 
|  | drawLine(curve[0], curve[1], curve[2], curve[3]); | 
|  | drawLine(curve[2], curve[3], curve[4], curve[5]); | 
|  | if (curveType == PATH_CUBIC) { | 
|  | drawLine(curve[4], curve[5], curve[6], curve[7]); | 
|  | if (drawEnd > 1) { | 
|  | drawLine(curve[6], curve[7], curve[0], curve[1]); | 
|  | if (drawEnd > 2) { | 
|  | drawLine(curve[0], curve[1], curve[4], curve[5]); | 
|  | drawLine(curve[6], curve[7], curve[2], curve[3]); | 
|  | } | 
|  | } | 
|  | } else if (drawEnd > 1) { | 
|  | drawLine(curve[4], curve[5], curve[0], curve[1]); | 
|  | } | 
|  | } | 
|  |  | 
|  | function pointAtT(curve, curveType, t) { | 
|  | var xy = {}; | 
|  | switch (curveType) { | 
|  | case PATH_LINE: | 
|  | var a = 1 - t; | 
|  | var b = t; | 
|  | xy.x = a * curve[0] + b * curve[2]; | 
|  | xy.y = a * curve[1] + b * curve[3]; | 
|  | break; | 
|  | case PATH_QUAD: | 
|  | var one_t = 1 - t; | 
|  | var a = one_t * one_t; | 
|  | var b = 2 * one_t * t; | 
|  | var c = t * t; | 
|  | xy.x = a * curve[0] + b * curve[2] + c * curve[4]; | 
|  | xy.y = a * curve[1] + b * curve[3] + c * curve[5]; | 
|  | break; | 
|  | case PATH_CUBIC: | 
|  | var one_t = 1 - t; | 
|  | var one_t2 = one_t * one_t; | 
|  | var a = one_t2 * one_t; | 
|  | var b = 3 * one_t2 * t; | 
|  | var t2 = t * t; | 
|  | var c = 3 * one_t * t2; | 
|  | var d = t2 * t; | 
|  | xy.x = a * curve[0] + b * curve[2] + c * curve[4] + d * curve[6]; | 
|  | xy.y = a * curve[1] + b * curve[3] + c * curve[5] + d * curve[7]; | 
|  | break; | 
|  | } | 
|  | return xy; | 
|  | } | 
|  |  | 
|  | function drawPointAtT(curve, curveType) { | 
|  | var x, y; | 
|  | var xy = pointAtT(curve, curveType, curveT); | 
|  | drawPoint(xy.x, xy.y, true); | 
|  | if (!draw_intersectT) { | 
|  | return; | 
|  | } | 
|  | ctx.fillStyle = "red"; | 
|  | drawTAtPointUp(xy.x, xy.y, curveT); | 
|  | } | 
|  |  | 
|  | function drawTAtPointUp(px, py, t) { | 
|  | var label = t.toFixed(decimal_places); | 
|  | var _px = (px - srcLeft)* scale; | 
|  | var _py = (py - srcTop) * scale; | 
|  | ctx.fillText(label, _px + 5, _py - 10); | 
|  | } | 
|  |  | 
|  | function drawTAtPointDown(px, py, t) { | 
|  | var label = t.toFixed(decimal_places); | 
|  | var _px = (px - srcLeft)* scale; | 
|  | var _py = (py - srcTop) * scale; | 
|  | ctx.fillText(label, _px + 5, _py + 10); | 
|  | } | 
|  |  | 
|  | function alreadyDrawnLine(x1, y1, x2, y2) { | 
|  | if (collect_bounds) { | 
|  | if (focus_enabled) { | 
|  | focusXmin = Math.min(focusXmin, x1, x2); | 
|  | focusYmin = Math.min(focusYmin, y1, y2); | 
|  | focusXmax = Math.max(focusXmax, x1, x2); | 
|  | focusYmax = Math.max(focusYmax, y1, y2); | 
|  | } | 
|  | return true; | 
|  | } | 
|  | for (var pts = 0; pts < drawnLines.length; pts += 4) { | 
|  | if (x1 == drawnLines[pts] && y1 == drawnLines[pts + 1] | 
|  | && x2 == drawnLines[pts + 2] && y2 == drawnLines[pts + 3]) { | 
|  | return true; | 
|  | } | 
|  | } | 
|  | drawnLines.push(x1); | 
|  | drawnLines.push(y1); | 
|  | drawnLines.push(x2); | 
|  | drawnLines.push(y2); | 
|  | return false; | 
|  | } | 
|  |  | 
|  | function drawLine(x1, y1, x2, y2) { | 
|  | if (alreadyDrawnLine(x1, y1, x2, y2)) { | 
|  | return; | 
|  | } | 
|  | ctx.beginPath(); | 
|  | ctx.moveTo((x1 - srcLeft) * scale, | 
|  | (y1 - srcTop) * scale); | 
|  | ctx.lineTo((x2 - srcLeft) * scale, | 
|  | (y2 - srcTop) * scale); | 
|  | ctx.stroke(); | 
|  | } | 
|  |  | 
|  | function linePartial(x1, y1, x2, y2, t1, t2) { | 
|  | var dx = x1 - x2; | 
|  | var dy = y1 - y2; | 
|  | var array = [ | 
|  | x1 - t1 * dx, | 
|  | y1 - t1 * dy, | 
|  | x1 - t2 * dx, | 
|  | y1 - t2 * dy | 
|  | ]; | 
|  | return array; | 
|  | } | 
|  |  | 
|  | function drawLinePartial(x1, y1, x2, y2, t1, t2) { | 
|  | var a = linePartial(x1, y1, x2, y2, t1, t2); | 
|  | var ax = a[0]; | 
|  | var ay = a[1]; | 
|  | var bx = a[2]; | 
|  | var by = a[3]; | 
|  | if (alreadyDrawnLine(ax, ay, bx, by)) { | 
|  | return; | 
|  | } | 
|  | ctx.beginPath(); | 
|  | ctx.moveTo((ax - srcLeft) * scale, | 
|  | (ay - srcTop) * scale); | 
|  | ctx.lineTo((bx - srcLeft) * scale, | 
|  | (by - srcTop) * scale); | 
|  | ctx.stroke(); | 
|  | } | 
|  |  | 
|  | function alreadyDrawnQuad(x1, y1, x2, y2, x3, y3) { | 
|  | if (collect_bounds) { | 
|  | if (focus_enabled) { | 
|  | focusXmin = Math.min(focusXmin, x1, x2, x3); | 
|  | focusYmin = Math.min(focusYmin, y1, y2, y3); | 
|  | focusXmax = Math.max(focusXmax, x1, x2, x3); | 
|  | focusYmax = Math.max(focusYmax, y1, y2, y3); | 
|  | } | 
|  | return true; | 
|  | } | 
|  | for (var pts = 0; pts < drawnQuads.length; pts += 6) { | 
|  | if (x1 == drawnQuads[pts] && y1 == drawnQuads[pts + 1] | 
|  | && x2 == drawnQuads[pts + 2] && y2 == drawnQuads[pts + 3] | 
|  | && x3 == drawnQuads[pts + 4] && y3 == drawnQuads[pts + 5]) { | 
|  | return true; | 
|  | } | 
|  | } | 
|  | drawnQuads.push(x1); | 
|  | drawnQuads.push(y1); | 
|  | drawnQuads.push(x2); | 
|  | drawnQuads.push(y2); | 
|  | drawnQuads.push(x3); | 
|  | drawnQuads.push(y3); | 
|  | return false; | 
|  | } | 
|  |  | 
|  | function drawQuad(x1, y1, x2, y2, x3, y3) { | 
|  | if (alreadyDrawnQuad(x1, y1, x2, y2, x3, y3)) { | 
|  | return; | 
|  | } | 
|  | ctx.beginPath(); | 
|  | ctx.moveTo((x1 - srcLeft) * scale, | 
|  | (y1 - srcTop) * scale); | 
|  | ctx.quadraticCurveTo((x2 - srcLeft) * scale, | 
|  | (y2 - srcTop) * scale, | 
|  | (x3 - srcLeft) * scale, | 
|  | (y3 - srcTop) * scale); | 
|  | ctx.stroke(); | 
|  | } | 
|  |  | 
|  | function interp(A, B, t) { | 
|  | return A + (B - A) * t; | 
|  | } | 
|  |  | 
|  | function interp_quad_coords(x1, x2, x3, t) | 
|  | { | 
|  | var ab = interp(x1, x2, t); | 
|  | var bc = interp(x2, x3, t); | 
|  | var abc = interp(ab, bc, t); | 
|  | return abc; | 
|  | } | 
|  |  | 
|  | function quadPartial(x1, y1, x2, y2, x3, y3, t1, t2) { | 
|  | var ax = interp_quad_coords(x1, x2, x3, t1); | 
|  | var ay = interp_quad_coords(y1, y2, y3, t1); | 
|  | var dx = interp_quad_coords(x1, x2, x3, (t1 + t2) / 2); | 
|  | var dy = interp_quad_coords(y1, y2, y3, (t1 + t2) / 2); | 
|  | var cx = interp_quad_coords(x1, x2, x3, t2); | 
|  | var cy = interp_quad_coords(y1, y2, y3, t2); | 
|  | var bx = 2*dx - (ax + cx)/2; | 
|  | var by = 2*dy - (ay + cy)/2; | 
|  | var array = [ | 
|  | ax, ay, bx, by, cx, cy | 
|  | ]; | 
|  | return array; | 
|  | } | 
|  |  | 
|  | function drawQuadPartial(x1, y1, x2, y2, x3, y3, t1, t2) { | 
|  | var a = quadPartial(x1, y1, x2, y2, x3, y3, t1, t2); | 
|  | var ax = a[0]; | 
|  | var ay = a[1]; | 
|  | var bx = a[2]; | 
|  | var by = a[3]; | 
|  | var cx = a[4]; | 
|  | var cy = a[5]; | 
|  | if (alreadyDrawnQuad(ax, ay, bx, by, cx, cy)) { | 
|  | return; | 
|  | } | 
|  | ctx.beginPath(); | 
|  | ctx.moveTo((ax - srcLeft) * scale, | 
|  | (ay - srcTop) * scale); | 
|  | ctx.quadraticCurveTo((bx - srcLeft) * scale, | 
|  | (by - srcTop) * scale, | 
|  | (cx - srcLeft) * scale, | 
|  | (cy - srcTop) * scale); | 
|  | ctx.stroke(); | 
|  | } | 
|  |  | 
|  | function alreadyDrawnCubic(x1, y1, x2, y2, x3, y3, x4, y4) { | 
|  | if (collect_bounds) { | 
|  | if (focus_enabled) { | 
|  | focusXmin = Math.min(focusXmin, x1, x2, x3, x4); | 
|  | focusYmin = Math.min(focusYmin, y1, y2, y3, y4); | 
|  | focusXmax = Math.max(focusXmax, x1, x2, x3, x4); | 
|  | focusYmax = Math.max(focusYmax, y1, y2, y3, y4); | 
|  | } | 
|  | return true; | 
|  | } | 
|  | for (var pts = 0; pts < drawnCubics.length; pts += 8) { | 
|  | if (x1 == drawnCubics[pts] && y1 == drawnCubics[pts + 1] | 
|  | && x2 == drawnCubics[pts + 2] && y2 == drawnCubics[pts + 3] | 
|  | && x3 == drawnCubics[pts + 4] && y3 == drawnCubics[pts + 5] | 
|  | && x4 == drawnCubics[pts + 6] && y4 == drawnCubics[pts + 7]) { | 
|  | return true; | 
|  | } | 
|  | } | 
|  | drawnCubics.push(x1); | 
|  | drawnCubics.push(y1); | 
|  | drawnCubics.push(x2); | 
|  | drawnCubics.push(y2); | 
|  | drawnCubics.push(x3); | 
|  | drawnCubics.push(y3); | 
|  | drawnCubics.push(x4); | 
|  | drawnCubics.push(y4); | 
|  | return false; | 
|  | } | 
|  |  | 
|  | function drawCubic(x1, y1, x2, y2, x3, y3, x4, y4) { | 
|  | if (alreadyDrawnCubic(x1, y1, x2, y2, x3, y3, x4, y4)) { | 
|  | return; | 
|  | } | 
|  | ctx.beginPath(); | 
|  | ctx.moveTo((x1 - srcLeft) * scale, | 
|  | (y1 - srcTop) * scale); | 
|  | ctx.bezierCurveTo((x2 - srcLeft) * scale, | 
|  | (y2 - srcTop) * scale, | 
|  | (x3 - srcLeft) * scale, | 
|  | (y3 - srcTop) * scale, | 
|  | (x4 - srcLeft) * scale, | 
|  | (y4 - srcTop) * scale); | 
|  | ctx.stroke(); | 
|  | } | 
|  |  | 
|  | function interp_cubic_coords(x1, x2, x3, x4, t) | 
|  | { | 
|  | var ab = interp(x1, x2, t); | 
|  | var bc = interp(x2, x3, t); | 
|  | var cd = interp(x3, x4, t); | 
|  | var abc = interp(ab, bc, t); | 
|  | var bcd = interp(bc, cd, t); | 
|  | var abcd = interp(abc, bcd, t); | 
|  | return abcd; | 
|  | } | 
|  |  | 
|  | function cubicPartial(x1, y1, x2, y2, x3, y3, x4, y4, t1, t2) { | 
|  | var ax = interp_cubic_coords(x1, x2, x3, x4, t1); | 
|  | var ay = interp_cubic_coords(y1, y2, y3, y4, t1); | 
|  | var ex = interp_cubic_coords(x1, x2, x3, x4, (t1*2+t2)/3); | 
|  | var ey = interp_cubic_coords(y1, y2, y3, y4, (t1*2+t2)/3); | 
|  | var fx = interp_cubic_coords(x1, x2, x3, x4, (t1+t2*2)/3); | 
|  | var fy = interp_cubic_coords(y1, y2, y3, y4, (t1+t2*2)/3); | 
|  | var dx = interp_cubic_coords(x1, x2, x3, x4, t2); | 
|  | var dy = interp_cubic_coords(y1, y2, y3, y4, t2); | 
|  | var mx = ex * 27 - ax * 8 - dx; | 
|  | var my = ey * 27 - ay * 8 - dy; | 
|  | var nx = fx * 27 - ax - dx * 8; | 
|  | var ny = fy * 27 - ay - dy * 8; | 
|  | var bx = (mx * 2 - nx) / 18; | 
|  | var by = (my * 2 - ny) / 18; | 
|  | var cx = (nx * 2 - mx) / 18; | 
|  | var cy = (ny * 2 - my) / 18; | 
|  | var array = [ | 
|  | ax, ay, bx, by, cx, cy, dx, dy | 
|  | ]; | 
|  | return array; | 
|  | } | 
|  |  | 
|  | function drawCubicPartial(x1, y1, x2, y2, x3, y3, x4, y4, t1, t2) { | 
|  | var a = cubicPartial(x1, y1, x2, y2, x3, y3, x4, y4, t1, t2); | 
|  | var ax = a[0]; | 
|  | var ay = a[1]; | 
|  | var bx = a[2]; | 
|  | var by = a[3]; | 
|  | var cx = a[4]; | 
|  | var cy = a[5]; | 
|  | var dx = a[6]; | 
|  | var dy = a[7]; | 
|  | if (alreadyDrawnCubic(ax, ay, bx, by, cx, cy, dx, dy)) { | 
|  | return; | 
|  | } | 
|  | ctx.beginPath(); | 
|  | ctx.moveTo((ax - srcLeft) * scale, | 
|  | (ay - srcTop) * scale); | 
|  | ctx.bezierCurveTo((bx - srcLeft) * scale, | 
|  | (by - srcTop) * scale, | 
|  | (cx - srcLeft) * scale, | 
|  | (cy - srcTop) * scale, | 
|  | (dx - srcLeft) * scale, | 
|  | (dy - srcTop) * scale); | 
|  | ctx.stroke(); | 
|  | } | 
|  |  | 
|  | function drawCurve(c) { | 
|  | switch (c.length) { | 
|  | case 4: | 
|  | drawLine(c[0], c[1], c[2], c[3]); | 
|  | break; | 
|  | case 6: | 
|  | drawQuad(c[0], c[1], c[2], c[3], c[4], c[5]); | 
|  | break; | 
|  | case 8: | 
|  | drawCubic(c[0], c[1], c[2], c[3], c[4], c[5], c[6], c[7]); | 
|  | break; | 
|  | } | 
|  | } | 
|  |  | 
|  | function boundsWidth(pts) { | 
|  | var min = pts[0]; | 
|  | var max = pts[0]; | 
|  | for (var idx = 2; idx < pts.length; idx += 2) { | 
|  | min = Math.min(min, pts[idx]); | 
|  | max = Math.max(max, pts[idx]); | 
|  | } | 
|  | return max - min; | 
|  | } | 
|  |  | 
|  | function boundsHeight(pts) { | 
|  | var min = pts[1]; | 
|  | var max = pts[1]; | 
|  | for (var idx = 3; idx < pts.length; idx += 2) { | 
|  | min = Math.min(min, pts[idx]); | 
|  | max = Math.max(max, pts[idx]); | 
|  | } | 
|  | return max - min; | 
|  | } | 
|  |  | 
|  | function tangent(pts) { | 
|  | var dx = pts[2] - pts[0]; | 
|  | var dy = pts[3] - pts[1]; | 
|  | if (dx == 0 && dy == 0 && pts.length > 4) { | 
|  | dx = pts[4] - pts[0]; | 
|  | dy = pts[5] - pts[1]; | 
|  | if (dx == 0 && dy == 0 && pts.length > 6) { | 
|  | dx = pts[6] - pts[0]; | 
|  | dy = pts[7] - pts[1]; | 
|  | } | 
|  | } | 
|  | return Math.atan2(-dy, dx); | 
|  | } | 
|  |  | 
|  | function hodograph(cubic) { | 
|  | var hodo = []; | 
|  | hodo[0] = 3 * (cubic[2] - cubic[0]); | 
|  | hodo[1] = 3 * (cubic[3] - cubic[1]); | 
|  | hodo[2] = 3 * (cubic[4] - cubic[2]); | 
|  | hodo[3] = 3 * (cubic[5] - cubic[3]); | 
|  | hodo[4] = 3 * (cubic[6] - cubic[4]); | 
|  | hodo[5] = 3 * (cubic[7] - cubic[5]); | 
|  | return hodo; | 
|  | } | 
|  |  | 
|  | function hodograph2(cubic) { | 
|  | var quad = hodograph(cubic); | 
|  | var hodo = []; | 
|  | hodo[0] = 2 * (quad[2] - quad[0]); | 
|  | hodo[1] = 2 * (quad[3] - quad[1]); | 
|  | hodo[2] = 2 * (quad[4] - quad[2]); | 
|  | hodo[3] = 2 * (quad[5] - quad[3]); | 
|  | return hodo; | 
|  | } | 
|  |  | 
|  | function quadraticRootsReal(A, B, C, s) { | 
|  | if (A == 0) { | 
|  | if (B == 0) { | 
|  | s[0] = 0; | 
|  | return C == 0; | 
|  | } | 
|  | s[0] = -C / B; | 
|  | return 1; | 
|  | } | 
|  | /* normal form: x^2 + px + q = 0 */ | 
|  | var p = B / (2 * A); | 
|  | var q = C / A; | 
|  | var p2 = p * p; | 
|  | if (p2 < q) { | 
|  | return 0; | 
|  | } | 
|  | var sqrt_D = 0; | 
|  | if (p2 > q) { | 
|  | sqrt_D = sqrt(p2 - q); | 
|  | } | 
|  | s[0] = sqrt_D - p; | 
|  | s[1] = -sqrt_D - p; | 
|  | return 1 + s[0] != s[1]; | 
|  | } | 
|  |  | 
|  | function add_valid_ts(s, realRoots, t) { | 
|  | var foundRoots = 0; | 
|  | for (var index = 0; index < realRoots; ++index) { | 
|  | var tValue = s[index]; | 
|  | if (tValue >= 0 && tValue <= 1) { | 
|  | for (var idx2 = 0; idx2 < foundRoots; ++idx2) { | 
|  | if (t[idx2] != tValue) { | 
|  | t[foundRoots++] = tValue; | 
|  | } | 
|  | } | 
|  | } | 
|  | } | 
|  | return foundRoots; | 
|  | } | 
|  |  | 
|  | function quadraticRootsValidT(a, b, c, t) { | 
|  | var s = []; | 
|  | var realRoots = quadraticRootsReal(A, B, C, s); | 
|  | var foundRoots = add_valid_ts(s, realRoots, t); | 
|  | return foundRoots != 0; | 
|  | } | 
|  |  | 
|  | function find_cubic_inflections(cubic, tValues) { | 
|  | var Ax = src[2] - src[0]; | 
|  | var Ay = src[3] - src[1]; | 
|  | var Bx = src[4] - 2 * src[2] + src[0]; | 
|  | var By = src[5] - 2 * src[3] + src[1]; | 
|  | var Cx = src[6] + 3 * (src[2] - src[4]) - src[0]; | 
|  | var Cy = src[7] + 3 * (src[3] - src[5]) - src[1]; | 
|  | return quadraticRootsValidT(Bx * Cy - By * Cx, (Ax * Cy - Ay * Cx), | 
|  | Ax * By - Ay * Bx, tValues); | 
|  | } | 
|  |  | 
|  | function dxy_at_t(curve, type, t) { | 
|  | var dxy = {}; | 
|  | if (type == PATH_QUAD) { | 
|  | var a = t - 1; | 
|  | var b = 1 - 2 * t; | 
|  | var c = t; | 
|  | dxy.x = a * curve[0] + b * curve[2] + c * curve[4]; | 
|  | dxy.y = a * curve[1] + b * curve[3] + c * curve[5]; | 
|  | } else if (type == PATH_CUBIC) { | 
|  | var one_t = 1 - t; | 
|  | var a = curve[0]; | 
|  | var b = curve[2]; | 
|  | var c = curve[4]; | 
|  | var d = curve[6]; | 
|  | dxy.x = 3 * ((b - a) * one_t * one_t + 2 * (c - b) * t * one_t + (d - c) * t * t); | 
|  | a = curve[1]; | 
|  | b = curve[3]; | 
|  | c = curve[5]; | 
|  | d = curve[7]; | 
|  | dxy.y = 3 * ((b - a) * one_t * one_t + 2 * (c - b) * t * one_t + (d - c) * t * t); | 
|  | } | 
|  | return dxy; | 
|  | } | 
|  |  | 
|  | function drawLabel(num, px, py) { | 
|  | ctx.beginPath(); | 
|  | ctx.arc(px, py, 8, 0, Math.PI*2, true); | 
|  | ctx.closePath(); | 
|  | ctx.strokeStyle = "rgba(0,0,0, 0.4)"; | 
|  | ctx.lineWidth = num == 0 || num == 3 ? 2 : 1; | 
|  | ctx.stroke(); | 
|  | ctx.fillStyle = "black"; | 
|  | ctx.font = "normal 10px Arial"; | 
|  | //  ctx.rotate(0.001); | 
|  | ctx.fillText(num, px - 2, py + 3); | 
|  | //  ctx.rotate(-0.001); | 
|  | } | 
|  |  | 
|  | function drawLabelX(ymin, num, loc) { | 
|  | var px = (loc - srcLeft) * scale; | 
|  | var py = (ymin - srcTop) * scale - 20; | 
|  | drawLabel(num, px, py); | 
|  | } | 
|  |  | 
|  | function drawLabelY(xmin, num, loc) { | 
|  | var px = (xmin - srcLeft) * scale - 20; | 
|  | var py = (loc - srcTop) * scale; | 
|  | drawLabel(num, px, py); | 
|  | } | 
|  |  | 
|  | function drawHodoOrigin(hx, hy, hMinX, hMinY, hMaxX, hMaxY) { | 
|  | ctx.beginPath(); | 
|  | ctx.moveTo(hx, hy - 100); | 
|  | ctx.lineTo(hx, hy); | 
|  | ctx.strokeStyle = hMinY < 0 ? "green" : "blue"; | 
|  | ctx.stroke(); | 
|  | ctx.beginPath(); | 
|  | ctx.moveTo(hx, hy); | 
|  | ctx.lineTo(hx, hy + 100); | 
|  | ctx.strokeStyle = hMaxY > 0 ? "green" : "blue"; | 
|  | ctx.stroke(); | 
|  | ctx.beginPath(); | 
|  | ctx.moveTo(hx - 100, hy); | 
|  | ctx.lineTo(hx, hy); | 
|  | ctx.strokeStyle = hMinX < 0 ? "green" : "blue"; | 
|  | ctx.stroke(); | 
|  | ctx.beginPath(); | 
|  | ctx.moveTo(hx, hy); | 
|  | ctx.lineTo(hx + 100, hy); | 
|  | ctx.strokeStyle = hMaxX > 0 ? "green" : "blue"; | 
|  | ctx.stroke(); | 
|  | } | 
|  |  | 
|  | function scalexy(x, y, mag) { | 
|  | var length = Math.sqrt(x * x + y * y); | 
|  | return mag / length; | 
|  | } | 
|  |  | 
|  | function drawArrow(x, y, dx, dy) { | 
|  | var dscale = scalexy(dx, dy, 1 / scale * 100); | 
|  | dx *= dscale; | 
|  | dy *= dscale; | 
|  | ctx.beginPath(); | 
|  | ctx.moveTo((x - srcLeft) * scale, (y - srcTop) * scale); | 
|  | x += dx; | 
|  | y += dy; | 
|  | ctx.lineTo((x - srcLeft) * scale, (y - srcTop) * scale); | 
|  | dx /= 10; | 
|  | dy /= 10; | 
|  | ctx.lineTo((x - dy - srcLeft) * scale, (y + dx - srcTop) * scale); | 
|  | ctx.lineTo((x + dx * 2 - srcLeft) * scale, (y + dy * 2 - srcTop) * scale); | 
|  | ctx.lineTo((x + dy - srcLeft) * scale, (y - dx - srcTop) * scale); | 
|  | ctx.lineTo((x - srcLeft) * scale, (y - srcTop) * scale); | 
|  | ctx.strokeStyle = "rgba(0,75,0, 0.4)"; | 
|  | ctx.stroke(); | 
|  | } | 
|  |  | 
|  | function x_at_t(curve, t) { | 
|  | var one_t = 1 - t; | 
|  | if (curve.length == 4) { | 
|  | return one_t * curve[0] + t * curve[2]; | 
|  | } | 
|  | var one_t2 = one_t * one_t; | 
|  | var t2 = t * t; | 
|  | if (curve.length == 6) { | 
|  | return one_t2 * curve[0] + 2 * one_t * t * curve[2] + t2 * curve[4]; | 
|  | } | 
|  | var a = one_t2 * one_t; | 
|  | var b = 3 * one_t2 * t; | 
|  | var c = 3 * one_t * t2; | 
|  | var d = t2 * t; | 
|  | return a * curve[0] + b * curve[2] + c * curve[4] + d * curve[6]; | 
|  | } | 
|  |  | 
|  | function y_at_t(curve, t) { | 
|  | var one_t = 1 - t; | 
|  | if (curve.length == 4) { | 
|  | return one_t * curve[1] + t * curve[3]; | 
|  | } | 
|  | var one_t2 = one_t * one_t; | 
|  | var t2 = t * t; | 
|  | if (curve.length == 6) { | 
|  | return one_t2 * curve[1] + 2 * one_t * t * curve[3] + t2 * curve[5]; | 
|  | } | 
|  | var a = one_t2 * one_t; | 
|  | var b = 3 * one_t2 * t; | 
|  | var c = 3 * one_t * t2; | 
|  | var d = t2 * t; | 
|  | return a * curve[1] + b * curve[3] + c * curve[5] + d * curve[7]; | 
|  | } | 
|  |  | 
|  | function drawOrder(curve, label) { | 
|  | var px = x_at_t(curve, 0.75); | 
|  | var py = y_at_t(curve, 0.75); | 
|  | var _px = (px - srcLeft) * scale; | 
|  | var _py = (py - srcTop) * scale; | 
|  | ctx.beginPath(); | 
|  | ctx.arc(_px, _py, 15, 0, Math.PI * 2, true); | 
|  | ctx.closePath(); | 
|  | ctx.fillStyle = "white"; | 
|  | ctx.fill(); | 
|  | if (label == 'L') { | 
|  | ctx.strokeStyle = "rgba(255,0,0, 1)"; | 
|  | ctx.fillStyle = "rgba(255,0,0, 1)"; | 
|  | } else { | 
|  | ctx.strokeStyle = "rgba(0,0,255, 1)"; | 
|  | ctx.fillStyle = "rgba(0,0,255, 1)"; | 
|  | } | 
|  | ctx.stroke(); | 
|  | ctx.font = "normal 16px Arial"; | 
|  | ctx.textAlign = "center"; | 
|  | ctx.fillText(label, _px, _py + 5); | 
|  | ctx.font = "normal 10px Arial"; | 
|  | } | 
|  |  | 
|  | function drawID(curve, id) { | 
|  | var px = x_at_t(curve, 0.5); | 
|  | var py = y_at_t(curve, 0.5); | 
|  | var _px = (px - srcLeft) * scale; | 
|  | var _py = (py - srcTop) * scale; | 
|  | draw_id_at(id, _px, _py); | 
|  | } | 
|  |  | 
|  | function draw_id_at(id, _px, _py) { | 
|  | ctx.beginPath(); | 
|  | ctx.arc(_px, _py, 15, 0, Math.PI * 2, true); | 
|  | ctx.closePath(); | 
|  | ctx.fillStyle = "white"; | 
|  | ctx.fill(); | 
|  | ctx.strokeStyle = "rgba(127,127,0, 1)"; | 
|  | ctx.fillStyle = "rgba(127,127,0, 1)"; | 
|  | ctx.stroke(); | 
|  | ctx.font = "normal 16px Arial"; | 
|  | ctx.textAlign = "center"; | 
|  | ctx.fillText(id, _px, _py + 5); | 
|  | ctx.font = "normal 10px Arial"; | 
|  | } | 
|  |  | 
|  | function drawLinePartialID(id, x1, y1, x2, y2, t1, t2) { | 
|  | var curve = [x1, y1, x2, y2]; | 
|  | drawCurvePartialID(id, curve, t1, t2); | 
|  | } | 
|  |  | 
|  | function drawQuadPartialID(id, x1, y1, x2, y2, x3, y3, t1, t2) { | 
|  | var curve = [x1, y1, x2, y2, x3, y3]; | 
|  | drawCurvePartialID(id, curve, t1, t2); | 
|  | } | 
|  |  | 
|  | function drawCubicPartialID(id, x1, y1, x2, y2, x3, y3, x4, y4, t1, t2) { | 
|  | var curve = [x1, y1, x2, y2, x3, y3, x4, y4]; | 
|  | drawCurvePartialID(id, curve, t1, t2); | 
|  | } | 
|  |  | 
|  | function  drawCurvePartialID(id, curve, t1, t2) { | 
|  | var px = x_at_t(curve, (t1 + t2) / 2); | 
|  | var py = y_at_t(curve, (t1 + t2) / 2); | 
|  | var _px = (px - srcLeft) * scale; | 
|  | var _py = (py - srcTop) * scale; | 
|  | draw_id_at(id, _px, _py); | 
|  | } | 
|  |  | 
|  | function drawCurveSpecials(test, curve, type) { | 
|  | if (pt_labels) { | 
|  | drawPoints(curve, type, pt_labels == 2); | 
|  | } | 
|  | if (control_lines != 0) { | 
|  | drawControlLines(curve, type, control_lines); | 
|  | } | 
|  | if (curve_t) { | 
|  | drawPointAtT(curve, type); | 
|  | } | 
|  | if (draw_midpoint) { | 
|  | var mid = pointAtT(curve, type, 0.5); | 
|  | drawPoint(mid.x, mid.y, true); | 
|  | } | 
|  | if (draw_id) { | 
|  | var id = idByCurve(test, curve, type); | 
|  | if (id >= 0) { | 
|  | drawID(curve, id); | 
|  | } | 
|  | } | 
|  | if (type == PATH_LINE) { | 
|  | return; | 
|  | } | 
|  | if (draw_deriviatives > 0) { | 
|  | var d = dxy_at_t(curve, type, 0); | 
|  | drawArrow(curve[0], curve[1], d.x, d.y); | 
|  | if (draw_deriviatives == 2) { | 
|  | d = dxy_at_t(curve, type, 1); | 
|  | if (type == PATH_CUBIC) { | 
|  | drawArrow(curve[6], curve[7], d.x, d.y); | 
|  | } else { | 
|  | drawArrow(curve[4], curve[5], d.x, d.y); | 
|  | } | 
|  | } | 
|  | if (draw_midpoint) { | 
|  | var mid = pointAtT(curve, type, 0.5); | 
|  | d = dxy_at_t(curve, type, 0.5); | 
|  | drawArrow(mid.x, mid.y, d.x, d.y); | 
|  | } | 
|  | } | 
|  | if (type != PATH_CUBIC) { | 
|  | return; | 
|  | } | 
|  | if (draw_hodo == 1 || draw_hodo == 2) { | 
|  | var hodo = hodograph(curve); | 
|  | var hMinX = Math.min(0, hodo[0], hodo[2], hodo[4]); | 
|  | var hMinY = Math.min(0, hodo[1], hodo[3], hodo[5]); | 
|  | var hMaxX = Math.max(0, hodo[0], hodo[2], hodo[4]); | 
|  | var hMaxY = Math.max(0, hodo[1], hodo[3], hodo[5]); | 
|  | var hScaleX = hMaxX - hMinX > 0 ? screenWidth / (hMaxX - hMinX) : 1; | 
|  | var hScaleY = hMaxY - hMinY > 0 ? screenHeight / (hMaxY - hMinY) : 1; | 
|  | var hUnit = Math.min(hScaleX, hScaleY); | 
|  | hUnit /= 2; | 
|  | var hx = xoffset - hMinX * hUnit; | 
|  | var hy = yoffset - hMinY * hUnit; | 
|  | ctx.moveTo(hx + hodo[0] * hUnit, hy + hodo[1] * hUnit); | 
|  | ctx.quadraticCurveTo( | 
|  | hx + hodo[2] * hUnit, hy + hodo[3] * hUnit, | 
|  | hx + hodo[4] * hUnit, hy + hodo[5] * hUnit); | 
|  | ctx.strokeStyle = "red"; | 
|  | ctx.stroke(); | 
|  | if (draw_hodo == 1) { | 
|  | drawHodoOrigin(hx, hy, hMinX, hMinY, hMaxX, hMaxY); | 
|  | } | 
|  | } | 
|  | if (draw_hodo == 3) { | 
|  | var hodo = hodograph2(curve); | 
|  | var hMinX = Math.min(0, hodo[0], hodo[2]); | 
|  | var hMinY = Math.min(0, hodo[1], hodo[3]); | 
|  | var hMaxX = Math.max(0, hodo[0], hodo[2]); | 
|  | var hMaxY = Math.max(0, hodo[1], hodo[3]); | 
|  | var hScaleX = hMaxX - hMinX > 0 ? screenWidth / (hMaxX - hMinX) : 1; | 
|  | var hScaleY = hMaxY - hMinY > 0 ? screenHeight / (hMaxY - hMinY) : 1; | 
|  | var hUnit = Math.min(hScaleX, hScaleY); | 
|  | hUnit /= 2; | 
|  | var hx = xoffset - hMinX * hUnit; | 
|  | var hy = yoffset - hMinY * hUnit; | 
|  | ctx.moveTo(hx + hodo[0] * hUnit, hy + hodo[1] * hUnit); | 
|  | ctx.lineTo(hx + hodo[2] * hUnit, hy + hodo[3] * hUnit); | 
|  | ctx.strokeStyle = "red"; | 
|  | ctx.stroke(); | 
|  | drawHodoOrigin(hx, hy, hMinX, hMinY, hMaxX, hMaxY); | 
|  | } | 
|  | if (draw_sequence) { | 
|  | var ymin = Math.min(curve[1], curve[3], curve[5], curve[7]); | 
|  | for (var i = 0; i < 8; i+= 2) { | 
|  | drawLabelX(ymin, i >> 1, curve[i]); | 
|  | } | 
|  | var xmin = Math.min(curve[0], curve[2], curve[4], curve[6]); | 
|  | for (var i = 1; i < 8; i+= 2) { | 
|  | drawLabelY(xmin, i >> 1, curve[i]); | 
|  | } | 
|  | } | 
|  | } | 
|  |  | 
|  | function logCurves(test) { | 
|  | for (curves in test) { | 
|  | var curve = test[curves]; | 
|  | dumpCurve(curve); | 
|  | } | 
|  | } | 
|  |  | 
|  | function curveToString(curve) { | 
|  | var str = "{{"; | 
|  | for (i = 0; i < curve.length; i += 2) { | 
|  | str += curve[i].toFixed(decimal_places) + "," + curve[i + 1].toFixed(decimal_places); | 
|  | if (i < curve.length - 2) { | 
|  | str += "}, {"; | 
|  | } | 
|  | } | 
|  | str += "}}"; | 
|  | return str; | 
|  | } | 
|  |  | 
|  | function dumpCurve(curve) { | 
|  | console.log(curveToString(curve)); | 
|  | } | 
|  |  | 
|  | function draw(test, lines, title) { | 
|  | ctx.fillStyle = "rgba(0,0,0, 0.1)"; | 
|  | ctx.font = "normal 50px Arial"; | 
|  | ctx.textAlign = "left"; | 
|  | ctx.fillText(title, 50, 50); | 
|  | ctx.font = "normal 10px Arial"; | 
|  | ctx.lineWidth = "1.001"; "0.999"; | 
|  | var secondPath = test.length; | 
|  | var closeCount = 0; | 
|  | logStart = -1; | 
|  | logRange = 0; | 
|  | // find last active rec type at this step | 
|  | var curType = test[0]; | 
|  | var curStep = 0; | 
|  | var hasOp = false; | 
|  | var lastActive = 0; | 
|  | var lastAdd = 0; | 
|  | var lastSect = 0; | 
|  | var lastSort = 0; | 
|  | var lastMark = 0; | 
|  | activeCount = 0; | 
|  | addCount = 0; | 
|  | angleCount = 0; | 
|  | opCount = 0; | 
|  | sectCount = 0; | 
|  | sortCount = 0; | 
|  | markCount = 0; | 
|  | activeMax = 0; | 
|  | addMax = 0; | 
|  | angleMax = 0; | 
|  | opMax = 0; | 
|  | sectMax = 0; | 
|  | sectMax2 = 0; | 
|  | sortMax = 0; | 
|  | markMax = 0; | 
|  | lastIndex = test.length - 3; | 
|  | for (var tIndex = 0; tIndex < test.length; tIndex += 3) { | 
|  | var recType = test[tIndex]; | 
|  | if (!typeof recType == 'number' || recType < REC_TYPE_UNKNOWN || recType > REC_TYPE_LAST) { | 
|  | console.log("unknown rec type: " + recType); | 
|  | throw "stop execution"; | 
|  | } | 
|  | //     if (curType == recType && curType != REC_TYPE_ADD) { | 
|  | //         continue; | 
|  | //     } | 
|  | var inStepRange = step_limit == 0 || curStep < step_limit; | 
|  | curType = recType; | 
|  | if (recType == REC_TYPE_OP) { | 
|  | hasOp = true; | 
|  | continue; | 
|  | } | 
|  | if (recType == REC_TYPE_UNKNOWN) { | 
|  | // these types do not advance step | 
|  | continue; | 
|  | } | 
|  | var bumpStep = false; | 
|  | var records = test[tIndex + 2]; | 
|  | var fragType = records[0]; | 
|  | if (recType == REC_TYPE_ADD) { | 
|  | if (records.length != 2) { | 
|  | console.log("expect only two elements: " + records.length); | 
|  | throw "stop execution"; | 
|  | } | 
|  | if (fragType == ADD_MOVETO || fragType == ADD_CLOSE) { | 
|  | continue; | 
|  | } | 
|  | ++addMax; | 
|  | if (!draw_add || !inStepRange) { | 
|  | continue; | 
|  | } | 
|  | lastAdd = tIndex; | 
|  | ++addCount; | 
|  | bumpStep = true; | 
|  | } | 
|  | if (recType == REC_TYPE_PATH && hasOp) { | 
|  | secondPath = tIndex; | 
|  | } | 
|  | if (recType == REC_TYPE_ACTIVE) { | 
|  | ++activeMax; | 
|  | if (!draw_active || !inStepRange) { | 
|  | continue; | 
|  | } | 
|  | lastActive = tIndex; | 
|  | ++activeCount; | 
|  | bumpStep = true; | 
|  | } | 
|  | if (recType == REC_TYPE_ACTIVE_OP) { | 
|  | ++opMax; | 
|  | if (!draw_op || !inStepRange) { | 
|  | continue; | 
|  | } | 
|  | lastOp = tIndex; | 
|  | ++opCount; | 
|  | bumpStep = true; | 
|  | } | 
|  | if (recType == REC_TYPE_ANGLE) { | 
|  | ++angleMax; | 
|  | if (!draw_angle || !inStepRange) { | 
|  | continue; | 
|  | } | 
|  | lastAngle = tIndex; | 
|  | ++angleCount; | 
|  | bumpStep = true; | 
|  | } | 
|  | if (recType == REC_TYPE_SECT) { | 
|  | if (records.length != 2) { | 
|  | console.log("expect only two elements: " + records.length); | 
|  | throw "stop execution"; | 
|  | } | 
|  | ++sectMax; | 
|  | var sectBump = 1; | 
|  | switch (fragType) { | 
|  | case INTERSECT_LINE: | 
|  | case INTERSECT_QUAD_LINE: | 
|  | case INTERSECT_QUAD: | 
|  | case INTERSECT_SELF_CUBIC: | 
|  | case INTERSECT_CUBIC_LINE: | 
|  | case INTERSECT_CUBIC_QUAD: | 
|  | case INTERSECT_CUBIC: | 
|  | sectBump = 1; | 
|  | break; | 
|  | case INTERSECT_LINE_2: | 
|  | case INTERSECT_QUAD_LINE_2: | 
|  | case INTERSECT_QUAD_2: | 
|  | case INTERSECT_CUBIC_LINE_2: | 
|  | case INTERSECT_CUBIC_QUAD_2: | 
|  | case INTERSECT_CUBIC_2: | 
|  | sectBump = 2; | 
|  | break; | 
|  | case INTERSECT_LINE_NO: | 
|  | case INTERSECT_QUAD_LINE_NO: | 
|  | case INTERSECT_QUAD_NO: | 
|  | case INTERSECT_SELF_CUBIC_NO: | 
|  | case INTERSECT_CUBIC_LINE_NO: | 
|  | case INTERSECT_CUBIC_QUAD_NO: | 
|  | case INTERSECT_CUBIC_NO: | 
|  | sectBump = 0; | 
|  | break; | 
|  | case INTERSECT_CUBIC_LINE_3: | 
|  | case INTERSECT_CUBIC_QUAD_3: | 
|  | case INTERSECT_CUBIC_3: | 
|  | sectBump = 3; | 
|  | break; | 
|  | case INTERSECT_CUBIC_QUAD_4: | 
|  | case INTERSECT_CUBIC_4: | 
|  | sectBump = 4; | 
|  | break; | 
|  | default: | 
|  | console.log("missing case " + records.length); | 
|  | throw "stop execution"; | 
|  | } | 
|  | sectMax2 += sectBump; | 
|  | if (draw_intersection <= 1 || !inStepRange) { | 
|  | continue; | 
|  | } | 
|  | lastSect = tIndex; | 
|  | sectCount += sectBump; | 
|  | bumpStep = true; | 
|  | } | 
|  | if (recType == REC_TYPE_SORT) { | 
|  | ++sortMax; | 
|  | if (!draw_sort || !inStepRange) { | 
|  | continue; | 
|  | } | 
|  | lastSort = tIndex; | 
|  | ++sortCount; | 
|  | bumpStep = true; | 
|  | } | 
|  | if (recType == REC_TYPE_MARK) { | 
|  | ++markMax; | 
|  | if (!draw_mark || !inStepRange) { | 
|  | continue; | 
|  | } | 
|  | lastMark = tIndex; | 
|  | ++markCount; | 
|  | bumpStep = true; | 
|  | } | 
|  | if (bumpStep) { | 
|  | lastIndex = tIndex; | 
|  | logStart = test[tIndex + 1]; | 
|  | logRange = records.length / 2; | 
|  | ++curStep; | 
|  | } | 
|  | } | 
|  | stepMax = (draw_add ? addMax : 0) | 
|  | + (draw_active ? activeMax : 0) | 
|  | + (draw_op ? opMax : 0) | 
|  | + (draw_angle ? angleMax : 0) | 
|  | + (draw_sort ? sortMax : 0) | 
|  | + (draw_mark ? markMax : 0) | 
|  | + (draw_intersection == 2 ? sectMax : draw_intersection == 3 ? sectMax2 : 0); | 
|  | if (stepMax == 0) { | 
|  | stepMax = addMax + activeMax + angleMax + opMax + sortMax + markMax; | 
|  | } | 
|  | drawnPts = []; | 
|  | drawnLines = []; | 
|  | drawnQuads = []; | 
|  | drawnCubics = []; | 
|  | focusXmin = focusYmin = Infinity; | 
|  | focusXmax = focusYmax = -Infinity; | 
|  | var pathIndex = 0; | 
|  | var opLetter = 'S'; | 
|  | for (var tIndex = lastIndex; tIndex >= 0; tIndex -= 3) { | 
|  | var recType = test[tIndex]; | 
|  | var records = test[tIndex + 2]; | 
|  | for (var recordIndex = 0; recordIndex < records.length; recordIndex += 2) { | 
|  | var fragType = records[recordIndex]; | 
|  | if (!typeof fragType == 'number' || fragType < 1 || fragType > FRAG_TYPE_LAST) { | 
|  | console.log("unknown in range frag type: " + fragType); | 
|  | throw "stop execution"; | 
|  | } | 
|  | var frags = records[recordIndex + 1]; | 
|  | focus_enabled = false; | 
|  | switch (recType) { | 
|  | case REC_TYPE_COMPUTED: | 
|  | if (draw_computed == 0) { | 
|  | continue; | 
|  | } | 
|  | ctx.lineWidth = 1; | 
|  | ctx.strokeStyle = pathIndex == 0 ? "black" : "red"; | 
|  | ctx.fillStyle = "blue"; | 
|  | var drawThis = false; | 
|  | switch (fragType) { | 
|  | case PATH_QUAD: | 
|  | if ((draw_computed & 5) == 1 || ((draw_computed & 4) != 0 | 
|  | && (draw_computed & 1) == pathIndex)) { | 
|  | drawQuad(frags[0], frags[1], frags[2], frags[3], | 
|  | frags[4], frags[5]); | 
|  | drawThis = true; | 
|  | } | 
|  | break; | 
|  | case PATH_CUBIC: | 
|  | if ((draw_computed & 6) == 2 || ((draw_computed & 4) != 0 | 
|  | && (draw_computed & 1) != pathIndex)) { | 
|  | drawCubic(frags[0], frags[1], frags[2], frags[3], | 
|  | frags[4], frags[5], frags[6], frags[7]); | 
|  | drawThis = true; | 
|  | } | 
|  | ++pathIndex; | 
|  | break; | 
|  | case COMPUTED_SET_1: | 
|  | pathIndex = 0; | 
|  | break; | 
|  | case COMPUTED_SET_2: | 
|  | pathIndex = 1; | 
|  | break; | 
|  | default: | 
|  | console.log("unknown REC_TYPE_COMPUTED frag type: " + fragType); | 
|  | throw "stop execution"; | 
|  | } | 
|  | if (!drawThis || collect_bounds) { | 
|  | break; | 
|  | } | 
|  | drawCurveSpecials(test, frags, fragType); | 
|  | break; | 
|  | case REC_TYPE_PATH: | 
|  | if (!draw_path) { | 
|  | continue; | 
|  | } | 
|  | var firstPath = tIndex < secondPath; | 
|  | if ((draw_path & (firstPath ? 1 : 2)) == 0) { | 
|  | continue; | 
|  | } | 
|  | ctx.lineWidth = 1; | 
|  | ctx.strokeStyle = firstPath ? "black" : "red"; | 
|  | ctx.fillStyle = "blue"; | 
|  | switch (fragType) { | 
|  | case PATH_LINE: | 
|  | drawLine(frags[0], frags[1], frags[2], frags[3]); | 
|  | break; | 
|  | case PATH_QUAD: | 
|  | drawQuad(frags[0], frags[1], frags[2], frags[3], | 
|  | frags[4], frags[5]); | 
|  | break; | 
|  | case PATH_CUBIC: | 
|  | drawCubic(frags[0], frags[1], frags[2], frags[3], | 
|  | frags[4], frags[5], frags[6], frags[7]); | 
|  | break; | 
|  | default: | 
|  | console.log("unknown REC_TYPE_PATH frag type: " + fragType); | 
|  | throw "stop execution"; | 
|  | } | 
|  | if (collect_bounds) { | 
|  | break; | 
|  | } | 
|  | drawCurveSpecials(test, frags, fragType); | 
|  | break; | 
|  | case REC_TYPE_OP: | 
|  | switch (fragType) { | 
|  | case OP_INTERSECT: opLetter = 'I'; break; | 
|  | case OP_DIFFERENCE: opLetter = 'D'; break; | 
|  | case OP_UNION: opLetter = 'U'; break; | 
|  | case OP_XOR: opLetter = 'X'; break; | 
|  | default: | 
|  | console.log("unknown REC_TYPE_OP frag type: " + fragType); | 
|  | throw "stop execution"; | 
|  | } | 
|  | break; | 
|  | case REC_TYPE_ACTIVE: | 
|  | if (!draw_active || (step_limit > 0 && tIndex < lastActive)) { | 
|  | continue; | 
|  | } | 
|  | var x1 = frags[SPAN_X1]; | 
|  | var y1 = frags[SPAN_Y1]; | 
|  | var x2 = frags[SPAN_X2]; | 
|  | var y2 = frags[SPAN_Y2]; | 
|  | var x3, y3, x3, y4, t1, t2; | 
|  | ctx.lineWidth = 3; | 
|  | ctx.strokeStyle = "rgba(0,0,255, 0.3)"; | 
|  | focus_enabled = true; | 
|  | switch (fragType) { | 
|  | case ACTIVE_LINE_SPAN: | 
|  | t1 = frags[SPAN_L_T]; | 
|  | t2 = frags[SPAN_L_TEND]; | 
|  | drawLinePartial(x1, y1, x2, y2, t1, t2); | 
|  | if (draw_id) { | 
|  | drawLinePartialID(frags[0], x1, y1, x2, y2, t1, t2); | 
|  | } | 
|  | break; | 
|  | case ACTIVE_QUAD_SPAN: | 
|  | x3 = frags[SPAN_X3]; | 
|  | y3 = frags[SPAN_Y3]; | 
|  | t1 = frags[SPAN_Q_T]; | 
|  | t2 = frags[SPAN_Q_TEND]; | 
|  | drawQuadPartial(x1, y1, x2, y2, x3, y3, t1, t2); | 
|  | if (draw_id) { | 
|  | drawQuadPartialID(frags[0], x1, y1, x2, y2, x3, y3, t1, t2); | 
|  | } | 
|  | break; | 
|  | case ACTIVE_CUBIC_SPAN: | 
|  | x3 = frags[SPAN_X3]; | 
|  | y3 = frags[SPAN_Y3]; | 
|  | x4 = frags[SPAN_X4]; | 
|  | y4 = frags[SPAN_Y4]; | 
|  | t1 = frags[SPAN_C_T]; | 
|  | t2 = frags[SPAN_C_TEND]; | 
|  | drawCubicPartial(x1, y1, x2, y2, x3, y3, x4, y4, t1, t2); | 
|  | if (draw_id) { | 
|  | drawCubicPartialID(frags[0], x1, y1, x2, y2, x3, y3, x4, y4, t1, t2); | 
|  | } | 
|  | break; | 
|  | default: | 
|  | console.log("unknown REC_TYPE_ACTIVE frag type: " + fragType); | 
|  | throw "stop execution"; | 
|  | } | 
|  | break; | 
|  | case REC_TYPE_ACTIVE_OP: | 
|  | if (!draw_op || (step_limit > 0 && tIndex < lastOp)) { | 
|  | continue; | 
|  | } | 
|  | focus_enabled = true; | 
|  | ctx.lineWidth = 3; | 
|  | var activeSpan = frags[7] == "1"; | 
|  | ctx.strokeStyle = activeSpan ? "rgba(45,160,0, 0.3)" : "rgba(255,45,0, 0.5)"; | 
|  | var curve = curvePartialByID(test, frags[0], frags[1], frags[2]); | 
|  | drawCurve(curve); | 
|  | if (draw_op > 1) { | 
|  | drawArc(curve, false, frags[3], frags[4]); | 
|  | drawArc(curve, true, frags[5], frags[6]); | 
|  | } | 
|  | break; | 
|  | case REC_TYPE_ADD: | 
|  | if (!draw_add) { | 
|  | continue; | 
|  | } | 
|  | ctx.lineWidth = 3; | 
|  | ctx.strokeStyle = closeCount == 0 ? "rgba(0,0,255, 0.3)" | 
|  | : closeCount == 1 ? "rgba(0,127,0, 0.3)" | 
|  | : closeCount == 2 ? "rgba(0,127,127, 0.3)" | 
|  | : closeCount == 3 ? "rgba(127,127,0, 0.3)" | 
|  | : "rgba(127,0,127, 0.3)"; | 
|  | focus_enabled = true; | 
|  | switch (fragType) { | 
|  | case ADD_MOVETO: | 
|  | break; | 
|  | case ADD_LINETO: | 
|  | if (step_limit == 0 || tIndex >= lastAdd) { | 
|  | drawLine(frags[0], frags[1], frags[2], frags[3]); | 
|  | } | 
|  | break; | 
|  | case ADD_QUADTO: | 
|  | if (step_limit == 0 || tIndex >= lastAdd) { | 
|  | drawQuad(frags[0], frags[1], frags[2], frags[3], frags[4], frags[5]); | 
|  | } | 
|  | break; | 
|  | case ADD_CUBICTO: | 
|  | if (step_limit == 0 || tIndex >= lastAdd) { | 
|  | drawCubic(frags[0], frags[1], frags[2], frags[3], | 
|  | frags[4], frags[5], frags[6], frags[7]); | 
|  | } | 
|  | break; | 
|  | case ADD_CLOSE: | 
|  | ++closeCount; | 
|  | break; | 
|  | case ADD_FILL: | 
|  | break; | 
|  | default: | 
|  | console.log("unknown REC_TYPE_ADD frag type: " + fragType); | 
|  | throw "stop execution"; | 
|  | } | 
|  | break; | 
|  | case REC_TYPE_ANGLE: | 
|  | if (!draw_angle || (step_limit > 0 && tIndex < lastAngle)) { | 
|  | continue; | 
|  | } | 
|  | if (fragType != ANGLE_AFTER && fragType != ANGLE_AFTER2) { | 
|  | continue; | 
|  | } | 
|  | focus_enabled = true; | 
|  | ctx.lineWidth = 3; | 
|  | ctx.strokeStyle = "rgba(127,45,127, 0.3)"; | 
|  | var leftCurve, midCurve, rightCurve; | 
|  | if (fragType == ANGLE_AFTER) { | 
|  | leftCurve = curvePartialByID(test, frags[0], frags[3], frags[4]); | 
|  | midCurve = curvePartialByID(test, frags[5], frags[8], frags[9]); | 
|  | rightCurve = curvePartialByID(test, frags[10], frags[13], frags[14]); | 
|  | } else { | 
|  | leftCurve = curvePartialByID(test, frags[0], frags[4], frags[5]); | 
|  | midCurve = curvePartialByID(test, frags[6], frags[10], frags[11]); | 
|  | rightCurve = curvePartialByID(test, frags[12], frags[16], frags[17]); | 
|  | } | 
|  | drawCurve(leftCurve); | 
|  | drawCurve(rightCurve); | 
|  | var inBetween = frags[fragType == ANGLE_AFTER ? 15 : 18] == "T"; | 
|  | ctx.strokeStyle = inBetween ? "rgba(0,160,45, 0.3)" : "rgba(255,0,45, 0.5)"; | 
|  | drawCurve(midCurve); | 
|  | if (draw_angle > 1) { | 
|  | drawOrder(leftCurve, 'L'); | 
|  | drawOrder(rightCurve, 'R'); | 
|  | } | 
|  | break; | 
|  | case REC_TYPE_SECT: | 
|  | if (!draw_intersection) { | 
|  | continue; | 
|  | } | 
|  | if (draw_intersection != 1 && (step_limit > 0 && tIndex < lastSect)) { | 
|  | continue; | 
|  | } | 
|  | // draw_intersection == 1 : show all | 
|  | // draw_intersection == 2 : step == 0 ? show all : show intersection line #step | 
|  | // draw_intersection == 3 : step == 0 ? show all : show intersection #step | 
|  | ctx.lineWidth = 1; | 
|  | ctx.strokeStyle = "rgba(0,0,255, 0.3)"; | 
|  | ctx.fillStyle = "blue"; | 
|  | focus_enabled = true; | 
|  | var f = []; | 
|  | var c1s; | 
|  | var c1l; | 
|  | var c2s; | 
|  | var c2l; | 
|  | switch (fragType) { | 
|  | case INTERSECT_LINE: | 
|  | f.push(5, 6, 0, 7); | 
|  | c1s = 1; c1l = 4; c2s = 8; c2l = 4; | 
|  | break; | 
|  | case INTERSECT_LINE_2: | 
|  | f.push(5, 6, 0, 10); | 
|  | f.push(8, 9, 7, 15); | 
|  | c1s = 1; c1l = 4; c2s = 11; c2l = 4; | 
|  | break; | 
|  | case INTERSECT_LINE_NO: | 
|  | c1s = 0; c1l = 4; c2s = 4; c2l = 4; | 
|  | break; | 
|  | case INTERSECT_QUAD_LINE: | 
|  | f.push(7, 8, 0, 9); | 
|  | c1s = 1; c1l = 6; c2s = 10; c2l = 4; | 
|  | break; | 
|  | case INTERSECT_QUAD_LINE_2: | 
|  | f.push(7, 8, 0, 12); | 
|  | f.push(10, 11, 9, 17); | 
|  | c1s = 1; c1l = 6; c2s = 13; c2l = 4; | 
|  | break; | 
|  | case INTERSECT_QUAD_LINE_NO: | 
|  | c1s = 0; c1l = 6; c2s = 6; c2l = 4; | 
|  | break; | 
|  | case INTERSECT_QUAD: | 
|  | f.push(7, 8, 0, 9); | 
|  | c1s = 1; c1l = 6; c2s = 10; c2l = 6; | 
|  | break; | 
|  | case INTERSECT_QUAD_2: | 
|  | f.push(7, 8, 0, 12); | 
|  | f.push(10, 11, 9, 19); | 
|  | c1s = 1; c1l = 6; c2s = 13; c2l = 6; | 
|  | break; | 
|  | case INTERSECT_QUAD_NO: | 
|  | c1s = 0; c1l = 6; c2s = 6; c2l = 6; | 
|  | break; | 
|  | case INTERSECT_SELF_CUBIC: | 
|  | f.push(9, 10, 0, 11); | 
|  | c1s = 1; c1l = 8; c2s = 0; c2l = 0; | 
|  | break; | 
|  | case INTERSECT_SELF_CUBIC_NO: | 
|  | c1s = 0; c1l = 8; c2s = 0; c2l = 0; | 
|  | break; | 
|  | case INTERSECT_CUBIC_LINE: | 
|  | f.push(9, 10, 0, 11); | 
|  | c1s = 1; c1l = 8; c2s = 12; c2l = 4; | 
|  | break; | 
|  | case INTERSECT_CUBIC_LINE_2: | 
|  | f.push(9, 10, 0, 14); | 
|  | f.push(12, 13, 11, 19); | 
|  | c1s = 1; c1l = 8; c2s = 15; c2l = 4; | 
|  | break; | 
|  | case INTERSECT_CUBIC_LINE_3: | 
|  | f.push(9, 10, 0, 17); | 
|  | f.push(12, 13, 11, 22); | 
|  | f.push(15, 16, 14, 23); | 
|  | c1s = 1; c1l = 8; c2s = 18; c2l = 4; | 
|  | break; | 
|  | case INTERSECT_CUBIC_QUAD_NO: | 
|  | c1s = 0; c1l = 8; c2s = 8; c2l = 6; | 
|  | break; | 
|  | case INTERSECT_CUBIC_QUAD: | 
|  | f.push(9, 10, 0, 11); | 
|  | c1s = 1; c1l = 8; c2s = 12; c2l = 6; | 
|  | break; | 
|  | case INTERSECT_CUBIC_QUAD_2: | 
|  | f.push(9, 10, 0, 14); | 
|  | f.push(12, 13, 11, 21); | 
|  | c1s = 1; c1l = 8; c2s = 15; c2l = 6; | 
|  | break; | 
|  | case INTERSECT_CUBIC_QUAD_3: | 
|  | f.push(9, 10, 0, 17); | 
|  | f.push(12, 13, 11, 24); | 
|  | f.push(15, 16, 14, 25); | 
|  | c1s = 1; c1l = 8; c2s = 18; c2l = 6; | 
|  | break; | 
|  | case INTERSECT_CUBIC_QUAD_4: | 
|  | f.push(9, 10, 0, 20); | 
|  | f.push(12, 13, 11, 27); | 
|  | f.push(15, 16, 14, 28); | 
|  | f.push(18, 19, 17, 29); | 
|  | c1s = 1; c1l = 8; c2s = 21; c2l = 6; | 
|  | break; | 
|  | case INTERSECT_CUBIC_LINE_NO: | 
|  | c1s = 0; c1l = 8; c2s = 8; c2l = 4; | 
|  | break; | 
|  | case INTERSECT_CUBIC: | 
|  | f.push(9, 10, 0, 11); | 
|  | c1s = 1; c1l = 8; c2s = 12; c2l = 8; | 
|  | break; | 
|  | case INTERSECT_CUBIC_2: | 
|  | f.push(9, 10, 0, 14); | 
|  | f.push(12, 13, 11, 23); | 
|  | c1s = 1; c1l = 8; c2s = 15; c2l = 8; | 
|  | break; | 
|  | case INTERSECT_CUBIC_3: | 
|  | f.push(9, 10, 0, 17); | 
|  | f.push(12, 13, 11, 26); | 
|  | f.push(15, 16, 14, 27); | 
|  | c1s = 1; c1l = 8; c2s = 18; c2l = 8; | 
|  | break; | 
|  | case INTERSECT_CUBIC_4: | 
|  | f.push(9, 10, 0, 20); | 
|  | f.push(12, 13, 11, 29); | 
|  | f.push(15, 16, 14, 30); | 
|  | f.push(18, 19, 17, 31); | 
|  | c1s = 1; c1l = 8; c2s = 21; c2l = 8; | 
|  | break; | 
|  | case INTERSECT_CUBIC_NO: | 
|  | c1s = 0; c1l = 8; c2s = 8; c2l = 8; | 
|  | break; | 
|  | default: | 
|  | console.log("unknown REC_TYPE_SECT frag type: " + fragType); | 
|  | throw "stop execution"; | 
|  | } | 
|  | if (draw_intersection != 1) { | 
|  | var id = -1; | 
|  | var curve; | 
|  | switch (c1l) { | 
|  | case 4: | 
|  | drawLine(frags[c1s], frags[c1s + 1], frags[c1s + 2], frags[c1s + 3]); | 
|  | if (draw_id) { | 
|  | curve = [frags[c1s], frags[c1s + 1], frags[c1s + 2], frags[c1s + 3]]; | 
|  | id = idByCurve(test, curve, PATH_LINE); | 
|  | } | 
|  | break; | 
|  | case 6: | 
|  | drawQuad(frags[c1s], frags[c1s + 1], frags[c1s + 2], frags[c1s + 3], | 
|  | frags[c1s + 4], frags[c1s + 5]); | 
|  | if (draw_id) { | 
|  | curve = [frags[c1s], frags[c1s + 1], frags[c1s + 2], frags[c1s + 3], | 
|  | frags[c1s + 4], frags[c1s + 5]]; | 
|  | id = idByCurve(test, curve, PATH_QUAD); | 
|  | } | 
|  | break; | 
|  | case 8: | 
|  | drawCubic(frags[c1s], frags[c1s + 1], frags[c1s + 2], frags[c1s + 3], | 
|  | frags[c1s + 4], frags[c1s + 5], frags[c1s + 6], frags[c1s + 7]); | 
|  | if (draw_id) { | 
|  | curve = [frags[c1s], frags[c1s + 1], frags[c1s + 2], frags[c1s + 3], | 
|  | frags[c1s + 4], frags[c1s + 5], frags[c1s + 6], frags[c1s + 7]]; | 
|  | id = idByCurve(test, curve, PATH_CUBIC); | 
|  | } | 
|  | break; | 
|  | } | 
|  | if (id >= 0) { | 
|  | drawID(curve, id); | 
|  | } | 
|  | id = -1; | 
|  | switch (c2l) { | 
|  | case 0: | 
|  | break; | 
|  | case 4: | 
|  | drawLine(frags[c2s], frags[c2s + 1], frags[c2s + 2], frags[c2s + 3]); | 
|  | if (draw_id) { | 
|  | curve = [frags[c2s], frags[c2s + 1], frags[c2s + 2], frags[c2s + 3]]; | 
|  | id = idByCurve(test, curve, PATH_LINE); | 
|  | } | 
|  | break; | 
|  | case 6: | 
|  | drawQuad(frags[c2s], frags[c2s + 1], frags[c2s + 2], frags[c2s + 3], | 
|  | frags[c2s + 4], frags[c2s + 5]); | 
|  | if (draw_id) { | 
|  | curve = [frags[c2s], frags[c2s + 1], frags[c2s + 2], frags[c2s + 3], | 
|  | frags[c2s + 4], frags[c2s + 5]]; | 
|  | id = idByCurve(test, curve, PATH_QUAD); | 
|  | } | 
|  | break; | 
|  | case 8: | 
|  | drawCubic(frags[c2s], frags[c2s + 1], frags[c2s + 2], frags[c2s + 3], | 
|  | frags[c2s + 4], frags[c2s + 5], frags[c2s + 6], frags[c2s + 7]); | 
|  | if (draw_id) { | 
|  | curve = [frags[c2s], frags[c2s + 1], frags[c2s + 2], frags[c2s + 3], | 
|  | frags[c2s + 4], frags[c2s + 5], frags[c2s + 6], frags[c2s + 7]]; | 
|  | id = idByCurve(test, curve, PATH_CUBIC); | 
|  | } | 
|  | break; | 
|  | } | 
|  | if (id >= 0) { | 
|  | drawID(curve, id); | 
|  | } | 
|  | } | 
|  | if (collect_bounds) { | 
|  | break; | 
|  | } | 
|  | for (var idx = 0; idx < f.length; idx += 4) { | 
|  | if (draw_intersection != 3 || idx == lastSect - tIndex) { | 
|  | drawPoint(frags[f[idx]], frags[f[idx + 1]], true); | 
|  | } | 
|  | } | 
|  | if (!draw_intersectT) { | 
|  | break; | 
|  | } | 
|  | ctx.fillStyle = "red"; | 
|  | for (var idx = 0; idx < f.length; idx += 4) { | 
|  | if (draw_intersection != 3 || idx == lastSect - tIndex) { | 
|  | drawTAtPointUp(frags[f[idx]], frags[f[idx + 1]], frags[f[idx + 2]]); | 
|  | drawTAtPointDown(frags[f[idx]], frags[f[idx + 1]], frags[f[idx + 3]]); | 
|  | } | 
|  | } | 
|  | break; | 
|  | case REC_TYPE_SORT: | 
|  | if (!draw_sort || (step_limit > 0 && tIndex < lastSort)) { | 
|  | continue; | 
|  | } | 
|  | ctx.lineWidth = 3; | 
|  | ctx.strokeStyle = "rgba(127,127,0, 0.5)"; | 
|  | focus_enabled = true; | 
|  | switch (fragType) { | 
|  | case SORT_UNARY: | 
|  | case SORT_BINARY: | 
|  | var curve = curvePartialByID(test, frags[0], frags[6], frags[8]); | 
|  | drawCurve(curve); | 
|  | break; | 
|  | default: | 
|  | console.log("unknown REC_TYPE_SORT frag type: " + fragType); | 
|  | throw "stop execution"; | 
|  | } | 
|  | break; | 
|  | case REC_TYPE_MARK: | 
|  | if (!draw_mark || (step_limit > 0 && tIndex < lastMark)) { | 
|  | continue; | 
|  | } | 
|  | ctx.lineWidth = 3; | 
|  | ctx.strokeStyle = fragType >= MARK_DONE_LINE ? | 
|  | "rgba(127,0,127, 0.5)" : "rgba(127,127,0, 0.5)"; | 
|  | focus_enabled = true; | 
|  | switch (fragType) { | 
|  | case MARK_LINE: | 
|  | case MARK_DONE_LINE: | 
|  | case MARK_UNSORTABLE_LINE: | 
|  | case MARK_SIMPLE_LINE: | 
|  | case MARK_SIMPLE_DONE_LINE: | 
|  | case MARK_DONE_UNARY_LINE: | 
|  | drawLinePartial(frags[1], frags[2], frags[3], frags[4], | 
|  | frags[5], frags[9]); | 
|  | if (draw_id) { | 
|  | drawLinePartialID(frags[0], frags[1], frags[2], frags[3], frags[4], | 
|  | frags[5], frags[9]); | 
|  | } | 
|  | break; | 
|  | case MARK_QUAD: | 
|  | case MARK_DONE_QUAD: | 
|  | case MARK_UNSORTABLE_QUAD: | 
|  | case MARK_SIMPLE_QUAD: | 
|  | case MARK_SIMPLE_DONE_QUAD: | 
|  | case MARK_DONE_UNARY_QUAD: | 
|  | drawQuadPartial(frags[1], frags[2], frags[3], frags[4], | 
|  | frags[5], frags[6], frags[7], frags[11]); | 
|  | if (draw_id) { | 
|  | drawQuadPartialID(frags[0], frags[1], frags[2], frags[3], frags[4], | 
|  | frags[5], frags[6], frags[7], frags[11]); | 
|  | } | 
|  | break; | 
|  | case MARK_CUBIC: | 
|  | case MARK_DONE_CUBIC: | 
|  | case MARK_UNSORTABLE_CUBIC: | 
|  | case MARK_SIMPLE_CUBIC: | 
|  | case MARK_SIMPLE_DONE_CUBIC: | 
|  | case MARK_DONE_UNARY_CUBIC: | 
|  | drawCubicPartial(frags[1], frags[2], frags[3], frags[4], | 
|  | frags[5], frags[6], frags[7], frags[8], frags[9], frags[13]); | 
|  | if (draw_id) { | 
|  | drawCubicPartialID(frags[0], frags[1], frags[2], frags[3], frags[4], | 
|  | frags[5], frags[6], frags[7], frags[8], frags[9], frags[13]); | 
|  | } | 
|  | break; | 
|  | case MARK_ANGLE_LAST: | 
|  | // FIXME: ignored for now | 
|  | break; | 
|  | default: | 
|  | console.log("unknown REC_TYPE_MARK frag type: " + fragType); | 
|  | throw "stop execution"; | 
|  | } | 
|  | break; | 
|  | default: | 
|  | continue; | 
|  | } | 
|  | } | 
|  | switch (recType) { | 
|  | case REC_TYPE_SORT: | 
|  | if (!draw_sort || (step_limit > 0 && tIndex < lastSort)) { | 
|  | break; | 
|  | } | 
|  | var angles = []; // use tangent lines to describe arcs | 
|  | var windFrom = []; | 
|  | var windTo = []; | 
|  | var opp = []; | 
|  | var minXY = Number.MAX_VALUE; | 
|  | var partial; | 
|  | focus_enabled = true; | 
|  | var someUnsortable = false; | 
|  | for (var recordIndex = 0; recordIndex < records.length; recordIndex += 2) { | 
|  | var fragType = records[recordIndex]; | 
|  | var frags = records[recordIndex + 1]; | 
|  | var unsortable = (fragType == SORT_UNARY && frags[14]) || | 
|  | (fragType == SORT_BINARY && frags[16]); | 
|  | someUnsortable |= unsortable; | 
|  | switch (fragType) { | 
|  | case SORT_UNARY: | 
|  | case SORT_BINARY: | 
|  | partial = curvePartialByID(test, frags[0], frags[6], frags[8]); | 
|  | break; | 
|  | default: | 
|  | console.log("unknown REC_TYPE_SORT frag type: " + fragType); | 
|  | throw "stop execution"; | 
|  | } | 
|  | var dx = boundsWidth(partial); | 
|  | var dy = boundsHeight(partial); | 
|  | minXY = Math.min(minXY, dx * dx + dy * dy); | 
|  | if (collect_bounds) { | 
|  | continue; | 
|  | } | 
|  | angles.push(tangent(partial)); | 
|  | var from = frags[12]; | 
|  | var to = frags[12]; | 
|  | var sgn = frags[10]; | 
|  | if (sgn < 0) { | 
|  | from -= frags[11]; | 
|  | } else if (sgn > 0) { | 
|  | to -= frags[11]; | 
|  | } | 
|  | windFrom.push(from + (unsortable ? "!" : "")); | 
|  | windTo.push(to + (unsortable ? "!" : "")); | 
|  | opp.push(fragType == SORT_BINARY); | 
|  | if (draw_sort == 1) { | 
|  | drawOrder(partial, frags[12]); | 
|  | } else { | 
|  | drawOrder(partial, (recordIndex / 2) + 1); | 
|  | } | 
|  | } | 
|  | var radius = Math.sqrt(minXY) / 2 * scale; | 
|  | radius = Math.min(50, radius); | 
|  | var scaledRadius = radius / scale; | 
|  | var centerX = partial[0]; | 
|  | var centerY = partial[1]; | 
|  | if (collect_bounds) { | 
|  | if (focus_enabled) { | 
|  | focusXmin = Math.min(focusXmin, centerX - scaledRadius); | 
|  | focusYmin = Math.min(focusYmin, centerY - scaledRadius); | 
|  | focusXmax = Math.max(focusXmax, centerX + scaledRadius); | 
|  | focusYmax = Math.max(focusYmax, centerY + scaledRadius); | 
|  | } | 
|  | break; | 
|  | } | 
|  | break; | 
|  | default: | 
|  | break; | 
|  | } | 
|  | } | 
|  | if (collect_bounds) { | 
|  | return; | 
|  | } | 
|  | if (draw_log && logStart >= 0) { | 
|  | ctx.font = "normal 10px Arial"; | 
|  | ctx.textAlign = "left"; | 
|  | ctx.beginPath(); | 
|  | var top = screenHeight - 20 - (logRange + 2) * 10; | 
|  | ctx.rect(50, top, screenWidth - 100, (logRange + 2) * 10); | 
|  | ctx.fillStyle = "white"; | 
|  | ctx.fill(); | 
|  | ctx.fillStyle = "rgba(0,0,0, 0.5)"; | 
|  | if (logStart > 0) { | 
|  | ctx.fillText(lines[logStart - 1], 50, top + 8); | 
|  | } | 
|  | ctx.fillStyle = "black"; | 
|  | for (var idx = 0; idx < logRange; ++idx) { | 
|  | ctx.fillText(lines[logStart + idx], 50, top + 18 + 10 * idx); | 
|  | } | 
|  | ctx.fillStyle = "rgba(0,0,0, 0.5)"; | 
|  | if (logStart + logRange < lines.length) { | 
|  | ctx.fillText(lines[logStart + logRange], 50, top + 18 + 10 * logRange); | 
|  | } | 
|  | } | 
|  | if (draw_legend) { | 
|  | var pos = 0; | 
|  | var drawSomething = draw_add | draw_active | draw_sort | draw_mark; | 
|  | //     drawBox(pos++, "yellow", "black", opLetter, true, ''); | 
|  | drawBox(pos++, "rgba(0,0,255, 0.3)", "black", draw_intersection > 1 ? sectCount : sectMax2, draw_intersection, intersectionKey); | 
|  | drawBox(pos++, "rgba(0,0,255, 0.3)", "black", draw_add ? addCount : addMax, draw_add, addKey); | 
|  | drawBox(pos++, "rgba(0,0,255, 0.3)", "black", draw_active ? activeCount : activeMax, draw_active, activeKey); | 
|  | drawBox(pos++, "rgba(127,127,0, 0.3)", "black", draw_angle ? angleCount : angleMax, draw_angle, angleKey); | 
|  | drawBox(pos++, "rgba(127,127,0, 0.3)", "black", draw_op ? opCount : opMax, draw_op, opKey); | 
|  | drawBox(pos++, "rgba(127,127,0, 0.3)", "black", draw_sort ? sortCount : sortMax, draw_sort, sortKey); | 
|  | drawBox(pos++, "rgba(127,0,127, 0.3)", "black", draw_mark ? markCount : markMax, draw_mark, markKey); | 
|  | drawBox(pos++, "black", "white", | 
|  | (new Array('P', 'P1', 'P2', 'P'))[draw_path], draw_path != 0, pathKey); | 
|  | drawBox(pos++, "rgba(0,63,0, 0.7)", "white", | 
|  | (new Array('Q', 'Q', 'C', 'QC', 'Qc', 'Cq'))[draw_computed], | 
|  | draw_computed != 0, computedKey); | 
|  | drawBox(pos++, "green", "black", step_limit, drawSomething, ''); | 
|  | drawBox(pos++, "green", "black", stepMax, drawSomething, ''); | 
|  | drawBox(pos++, "rgba(255,0,0, 0.6)", "black", lastIndex, drawSomething & draw_log, ''); | 
|  | drawBox(pos++, "rgba(255,0,0, 0.6)", "black", test.length - 1, drawSomething & draw_log, ''); | 
|  | if (curve_t) { | 
|  | drawCurveTControl(); | 
|  | } | 
|  | ctx.font = "normal 20px Arial"; | 
|  | ctx.fillStyle = "rgba(0,0,0, 0.3)"; | 
|  | ctx.textAlign = "right"; | 
|  | ctx.fillText(scale.toFixed(decimal_places) + 'x' , screenWidth - 10, screenHeight - 5); | 
|  | } | 
|  | if (draw_hints) { | 
|  | ctx.font = "normal 10px Arial"; | 
|  | ctx.fillStyle = "rgba(0,0,0, 0.5)"; | 
|  | ctx.textAlign = "right"; | 
|  | var y = 4; | 
|  | ctx.fillText("control lines : " +  controlLinesKey, ctx.screenWidthwidth - 10, pos * 50 + y++ * 10); | 
|  | ctx.fillText("curve t : " +  curveTKey, screenWidth - 10, pos * 50 + y++ * 10); | 
|  | ctx.fillText("deriviatives : " +  deriviativesKey, screenWidth - 10, pos * 50 + y++ * 10); | 
|  | ctx.fillText("intersect t : " +  intersectTKey, screenWidth - 10, pos * 50 + y++ * 10); | 
|  | ctx.fillText("hodo : " +  hodoKey, screenWidth - 10, pos * 50 + y++ * 10); | 
|  | ctx.fillText("log : " +  logKey, screenWidth - 10, pos * 50 + y++ * 10); | 
|  | ctx.fillText("log curve : " +  logCurvesKey, screenWidth - 10, pos * 50 + y++ * 10); | 
|  | ctx.fillText("mid point : " +  midpointKey, screenWidth - 10, pos * 50 + y++ * 10); | 
|  | ctx.fillText("points : " +  ptsKey, screenWidth - 10, pos * 50 + y++ * 10); | 
|  | ctx.fillText("sequence : " +  sequenceKey, screenWidth - 10, pos * 50 + y++ * 10); | 
|  | ctx.fillText("xy : " +  xyKey, screenWidth - 10, pos * 50 + y++ * 10); | 
|  | } | 
|  | } | 
|  |  | 
|  | function drawBox(y, backC, foreC, str, enable, label) { | 
|  | ctx.beginPath(); | 
|  | ctx.fillStyle = backC; | 
|  | ctx.rect(screenWidth - 40, y * 50 + 10, 40, 30); | 
|  | ctx.fill(); | 
|  | ctx.font = "normal 16px Arial"; | 
|  | ctx.fillStyle = foreC; | 
|  | ctx.textAlign = "center"; | 
|  | ctx.fillText(str, screenWidth - 20, y * 50 + 32); | 
|  | if (!enable) { | 
|  | ctx.fillStyle = "rgba(255,255,255, 0.5)"; | 
|  | ctx.fill(); | 
|  | } | 
|  | if (label != '') { | 
|  | ctx.font = "normal 9px Arial"; | 
|  | ctx.fillStyle = "black"; | 
|  | ctx.fillText(label, screenWidth - 47, y * 50 + 40); | 
|  | } | 
|  | } | 
|  |  | 
|  | function drawCurveTControl() { | 
|  | ctx.lineWidth = 2; | 
|  | ctx.strokeStyle = "rgba(0,0,0, 0.3)"; | 
|  | ctx.beginPath(); | 
|  | ctx.rect(screenWidth - 80, 40, 28, screenHeight - 80); | 
|  | ctx.stroke(); | 
|  | var ty = 40 + curveT * (screenHeight - 80); | 
|  | ctx.beginPath(); | 
|  | ctx.moveTo(screenWidth - 80, ty); | 
|  | ctx.lineTo(screenWidth - 85, ty - 5); | 
|  | ctx.lineTo(screenWidth - 85, ty + 5); | 
|  | ctx.lineTo(screenWidth - 80, ty); | 
|  | ctx.fillStyle = "rgba(0,0,0, 0.6)"; | 
|  | ctx.fill(); | 
|  | var num = curveT.toFixed(decimal_places); | 
|  | ctx.font = "normal 10px Arial"; | 
|  | ctx.textAlign = "left"; | 
|  | ctx.fillText(num, screenWidth - 78, ty); | 
|  | } | 
|  |  | 
|  | function ptInTControl() { | 
|  | var e = window.event; | 
|  | var tgt = e.target || e.srcElement; | 
|  | var left = tgt.offsetLeft; | 
|  | var top = tgt.offsetTop; | 
|  | var x = (e.clientX - left); | 
|  | var y = (e.clientY - top); | 
|  | if (x < screenWidth - 80 || x > screenWidth - 50) { | 
|  | return false; | 
|  | } | 
|  | if (y < 40 || y > screenHeight - 80) { | 
|  | return false; | 
|  | } | 
|  | curveT = (y - 40) / (screenHeight - 120); | 
|  | if (curveT < 0 || curveT > 1) { | 
|  | throw "stop execution"; | 
|  | } | 
|  | return true; | 
|  | } | 
|  |  | 
|  | function drawTop() { | 
|  | if (tests[testIndex] == null) { | 
|  | var str = testDivs[testIndex].textContent; | 
|  | parse_all(str); | 
|  | var title = testDivs[testIndex].id.toString(); | 
|  | testTitles[testIndex] = title; | 
|  | } | 
|  | init(tests[testIndex]); | 
|  | redraw(); | 
|  | } | 
|  |  | 
|  | function redraw() { | 
|  | if (focus_on_selection) { | 
|  | collect_bounds = true; | 
|  | draw(tests[testIndex], testLines[testIndex], testTitles[testIndex]); | 
|  | collect_bounds = false; | 
|  | if (focusXmin < focusXmax && focusYmin < focusYmax) { | 
|  | setScale(focusXmin, focusXmax, focusYmin, focusYmax); | 
|  | } | 
|  | } | 
|  | ctx.beginPath(); | 
|  | ctx.fillStyle = "white"; | 
|  | ctx.rect(0, 0, screenWidth, screenHeight); | 
|  | ctx.fill(); | 
|  | draw(tests[testIndex], testLines[testIndex], testTitles[testIndex]); | 
|  | } | 
|  |  | 
|  | function dumpCurvePartial(test, id, t0, t1) { | 
|  | var curve = curveByID(test, id); | 
|  | var name = ["line", "quad", "cubic"][curve.length / 2 - 2]; | 
|  | console.log("id=" + id + " " + name + "=" +  curveToString(curve) | 
|  | + " t0=" + t0 + " t1=" + t1 | 
|  | + " partial=" + curveToString(curvePartialByID(test, id, t0, t1))); | 
|  | } | 
|  |  | 
|  | function dumpAngleTest(test, id, t0, t1) { | 
|  | var curve = curveByID(test, id); | 
|  | console.log("    { {" + curveToString(curve) + "}, " | 
|  | + curve.length / 2 + ", " + t0 + ", " + t1 + ", {} }, //"); | 
|  | } | 
|  |  | 
|  | function dumpLogToConsole() { | 
|  | if (logStart < 0) { | 
|  | return; | 
|  | } | 
|  | var test = tests[testIndex]; | 
|  | var recType = REC_TYPE_UNKNOWN; | 
|  | var records; | 
|  | for (var index = 0; index < test.length; index += 3) { | 
|  | var lastLineNo = test[index + 1]; | 
|  | if (lastLineNo >= logStart && lastLineNo < logStart + logRange) { | 
|  | recType = test[index]; | 
|  | records = test[index + 2]; | 
|  | break; | 
|  | } | 
|  | } | 
|  | if (recType == REC_TYPE_UNKNOWN) { | 
|  | return; | 
|  | } | 
|  | var lines = testLines[testIndex]; | 
|  | for (var idx = 0; idx < logRange; ++idx) { | 
|  | var line = lines[logStart + idx]; | 
|  | console.log(line); | 
|  | for (var recordIndex = 0; recordIndex < records.length; recordIndex += 2) { | 
|  | var fragType = records[recordIndex]; | 
|  | var frags = records[recordIndex + 1]; | 
|  | if (recType == REC_TYPE_ANGLE && fragType == ANGLE_AFTER) { | 
|  | dumpCurvePartial(test, frags[0], frags[3], frags[4]); | 
|  | dumpCurvePartial(test, frags[5], frags[8], frags[9]); | 
|  | dumpCurvePartial(test, frags[10], frags[13], frags[14]); | 
|  | console.log("\nstatic IntersectData intersectDataSet[] = {"); | 
|  | dumpAngleTest(test, frags[0], frags[3], frags[4]); | 
|  | dumpAngleTest(test, frags[5], frags[8], frags[9]); | 
|  | dumpAngleTest(test, frags[10], frags[13], frags[14]); | 
|  | console.log("};"); | 
|  | } else if (recType == REC_TYPE_ANGLE && fragType == ANGLE_AFTER2) { | 
|  | dumpCurvePartial(test, frags[0], frags[4], frags[5]); | 
|  | dumpCurvePartial(test, frags[6], frags[10], frags[11]); | 
|  | dumpCurvePartial(test, frags[12], frags[16], frags[17]); | 
|  | console.log("\nstatic IntersectData intersectDataSet[] = { //"); | 
|  | dumpAngleTest(test, frags[0], frags[4], frags[5]); | 
|  | dumpAngleTest(test, frags[6], frags[10], frags[11]); | 
|  | dumpAngleTest(test, frags[12], frags[16], frags[17]); | 
|  | console.log("}; //"); | 
|  | } | 
|  | } | 
|  | } | 
|  | } | 
|  |  | 
|  | var activeKey = 'a'; | 
|  | var pathKey = 'b'; | 
|  | var pathBackKey = 'B'; | 
|  | var centerKey = 'c'; | 
|  | var addKey = 'd'; | 
|  | var deriviativesKey = 'f'; | 
|  | var angleKey = 'g'; | 
|  | var angleBackKey = 'G'; | 
|  | var hodoKey = 'h'; | 
|  | var intersectionKey = 'i'; | 
|  | var intersectionBackKey = 'I'; | 
|  | var sequenceKey = 'j'; | 
|  | var midpointKey = 'k'; | 
|  | var logKey = 'l'; | 
|  | var logToConsoleKey = 'L'; | 
|  | var markKey = 'm'; | 
|  | var sortKey = 'o'; | 
|  | var opKey = 'p'; | 
|  | var opBackKey = 'P'; | 
|  | var computedKey = 'q'; | 
|  | var computedBackKey = 'Q'; | 
|  | var stepKey = 's'; | 
|  | var stepBackKey = 'S'; | 
|  | var intersectTKey = 't'; | 
|  | var curveTKey = 'u'; | 
|  | var controlLinesBackKey = 'V'; | 
|  | var controlLinesKey = 'v'; | 
|  | var ptsKey = 'x'; | 
|  | var xyKey = 'y'; | 
|  | var logCurvesKey = 'z'; | 
|  | var focusKey = '`'; | 
|  | var idKey = '.'; | 
|  | var retinaKey = '\\'; | 
|  |  | 
|  | function doKeyPress(evt) { | 
|  | var char = String.fromCharCode(evt.charCode); | 
|  | var focusWasOn = false; | 
|  | switch (char) { | 
|  | case '0': | 
|  | case '1': | 
|  | case '2': | 
|  | case '3': | 
|  | case '4': | 
|  | case '5': | 
|  | case '6': | 
|  | case '7': | 
|  | case '8': | 
|  | case '9': | 
|  | decimal_places = char - '0'; | 
|  | redraw(); | 
|  | break; | 
|  | case activeKey: | 
|  | draw_active ^= true; | 
|  | redraw(); | 
|  | break; | 
|  | case addKey: | 
|  | draw_add ^= true; | 
|  | redraw(); | 
|  | break; | 
|  | case angleKey: | 
|  | draw_angle = (draw_angle + 1) % 3; | 
|  | redraw(); | 
|  | break; | 
|  | case angleBackKey: | 
|  | draw_angle = (draw_angle + 2) % 3; | 
|  | redraw(); | 
|  | break; | 
|  | case centerKey: | 
|  | setScale(xmin, xmax, ymin, ymax); | 
|  | redraw(); | 
|  | break; | 
|  | case controlLinesBackKey: | 
|  | control_lines = (control_lines + 3) % 4; | 
|  | redraw(); | 
|  | break; | 
|  | case controlLinesKey: | 
|  | control_lines = (control_lines + 1) % 4; | 
|  | redraw(); | 
|  | break; | 
|  | case computedBackKey: | 
|  | draw_computed = (draw_computed + 5) % 6; | 
|  | redraw(); | 
|  | break; | 
|  | case computedKey: | 
|  | draw_computed = (draw_computed + 1) % 6; | 
|  | redraw(); | 
|  | break; | 
|  | case curveTKey: | 
|  | curve_t ^= true; | 
|  | if (curve_t) { | 
|  | draw_legend = true; | 
|  | } | 
|  | redraw(); | 
|  | break; | 
|  | case deriviativesKey: | 
|  | draw_deriviatives = (draw_deriviatives + 1) % 3; | 
|  | redraw(); | 
|  | break; | 
|  | case focusKey: | 
|  | focus_on_selection ^= true; | 
|  | setScale(xmin, xmax, ymin, ymax); | 
|  | redraw(); | 
|  | break; | 
|  | case hodoKey: | 
|  | draw_hodo = (draw_hodo + 1) % 4; | 
|  | redraw(); | 
|  | break; | 
|  | case idKey: | 
|  | draw_id ^= true; | 
|  | redraw(); | 
|  | break; | 
|  | case intersectionBackKey: | 
|  | draw_intersection = (draw_intersection + 3) % 4; | 
|  | redraw(); | 
|  | break; | 
|  | case intersectionKey: | 
|  | draw_intersection = (draw_intersection + 1) % 4; | 
|  | redraw(); | 
|  | break; | 
|  | case intersectTKey: | 
|  | draw_intersectT ^= true; | 
|  | redraw(); | 
|  | break; | 
|  | case logCurvesKey: | 
|  | logCurves(tests[testIndex]); | 
|  | break; | 
|  | case logKey: | 
|  | draw_log ^= true; | 
|  | redraw(); | 
|  | break; | 
|  | case logToConsoleKey: | 
|  | if (draw_log) { | 
|  | dumpLogToConsole(); | 
|  | } | 
|  | break; | 
|  | case markKey: | 
|  | draw_mark ^= true; | 
|  | redraw(); | 
|  | break; | 
|  | case midpointKey: | 
|  | draw_midpoint ^= true; | 
|  | redraw(); | 
|  | break; | 
|  | case opKey: | 
|  | draw_op = (draw_op + 1) % 3; | 
|  | redraw(); | 
|  | break; | 
|  | case opBackKey: | 
|  | draw_op = (draw_op + 2) % 3; | 
|  | redraw(); | 
|  | break; | 
|  | case pathKey: | 
|  | draw_path = (draw_path + 1) % 4; | 
|  | redraw(); | 
|  | break; | 
|  | case pathBackKey: | 
|  | draw_path = (draw_path + 3) % 4; | 
|  | redraw(); | 
|  | break; | 
|  | case ptsKey: | 
|  | pt_labels = (pt_labels + 1) % 3; | 
|  | redraw(); | 
|  | break; | 
|  | case retinaKey: | 
|  | retina_scale ^= true; | 
|  | drawTop(); | 
|  | break; | 
|  | case sequenceKey: | 
|  | draw_sequence ^= true; | 
|  | redraw(); | 
|  | break; | 
|  | case sortKey: | 
|  | draw_sort = (draw_sort + 1) % 3; | 
|  | drawTop(); | 
|  | break; | 
|  | case stepKey: | 
|  | step_limit++; | 
|  | if (step_limit > stepMax) { | 
|  | step_limit = stepMax; | 
|  | } | 
|  | redraw(); | 
|  | break; | 
|  | case stepBackKey: | 
|  | step_limit--; | 
|  | if (step_limit < 0) { | 
|  | step_limit = 0; | 
|  | } | 
|  | redraw(); | 
|  | break; | 
|  | case xyKey: | 
|  | debug_xy = (debug_xy + 1) % 3; | 
|  | redraw(); | 
|  | break; | 
|  | case '-': | 
|  | focusWasOn = focus_on_selection; | 
|  | if (focusWasOn) { | 
|  | focus_on_selection = false; | 
|  | scale /= 1.2; | 
|  | } else { | 
|  | scale /= 2; | 
|  | calcLeftTop(); | 
|  | } | 
|  | redraw(); | 
|  | focus_on_selection = focusWasOn; | 
|  | break; | 
|  | case '=': | 
|  | case '+': | 
|  | focusWasOn = focus_on_selection; | 
|  | if (focusWasOn) { | 
|  | focus_on_selection = false; | 
|  | scale *= 1.2; | 
|  | } else { | 
|  | scale *= 2; | 
|  | calcLeftTop(); | 
|  | } | 
|  | redraw(); | 
|  | focus_on_selection = focusWasOn; | 
|  | break; | 
|  | case '?': | 
|  | draw_hints ^= true; | 
|  | if (draw_hints && !draw_legend) { | 
|  | draw_legend = true; | 
|  | } | 
|  | redraw(); | 
|  | break; | 
|  | case '/': | 
|  | draw_legend ^= true; | 
|  | redraw(); | 
|  | break; | 
|  | } | 
|  | } | 
|  |  | 
|  | function doKeyDown(evt) { | 
|  | var char = evt.keyCode; | 
|  | var preventDefault = false; | 
|  | switch (char) { | 
|  | case 37: // left arrow | 
|  | if (evt.shiftKey) { | 
|  | testIndex -= 9; | 
|  | } | 
|  | if (--testIndex < 0) | 
|  | testIndex = tests.length - 1; | 
|  | drawTop(); | 
|  | preventDefault = true; | 
|  | break; | 
|  | case 39: // right arrow | 
|  | if (evt.shiftKey) { | 
|  | testIndex += 9; | 
|  | } | 
|  | if (++testIndex >= tests.length) | 
|  | testIndex = 0; | 
|  | drawTop(); | 
|  | preventDefault = true; | 
|  | break; | 
|  | } | 
|  | if (preventDefault) { | 
|  | evt.preventDefault(); | 
|  | return false; | 
|  | } | 
|  | return true; | 
|  | } | 
|  |  | 
|  | (function() { | 
|  | var hidden = "hidden"; | 
|  |  | 
|  | // Standards: | 
|  | if (hidden in document) | 
|  | document.addEventListener("visibilitychange", onchange); | 
|  | else if ((hidden = "mozHidden") in document) | 
|  | document.addEventListener("mozvisibilitychange", onchange); | 
|  | else if ((hidden = "webkitHidden") in document) | 
|  | document.addEventListener("webkitvisibilitychange", onchange); | 
|  | else if ((hidden = "msHidden") in document) | 
|  | document.addEventListener("msvisibilitychange", onchange); | 
|  | // IE 9 and lower: | 
|  | else if ('onfocusin' in document) | 
|  | document.onfocusin = document.onfocusout = onchange; | 
|  | // All others: | 
|  | else | 
|  | window.onpageshow = window.onpagehide | 
|  | = window.onfocus = window.onblur = onchange; | 
|  |  | 
|  | function onchange (evt) { | 
|  | var v = 'visible', h = 'hidden', | 
|  | evtMap = { | 
|  | focus:v, focusin:v, pageshow:v, blur:h, focusout:h, pagehide:h | 
|  | }; | 
|  |  | 
|  | evt = evt || window.event; | 
|  | if (evt.type in evtMap) | 
|  | document.body.className = evtMap[evt.type]; | 
|  | else | 
|  | document.body.className = this[hidden] ? "hidden" : "visible"; | 
|  | } | 
|  | })(); | 
|  |  | 
|  | function calcXY() { | 
|  | var e = window.event; | 
|  | var tgt = e.target || e.srcElement; | 
|  | var left = tgt.offsetLeft; | 
|  | var top = tgt.offsetTop; | 
|  | mouseX = (e.clientX - left) / scale + srcLeft; | 
|  | mouseY = (e.clientY - top) / scale + srcTop; | 
|  | } | 
|  |  | 
|  | function calcLeftTop() { | 
|  | srcLeft = mouseX - screenWidth / 2 / scale; | 
|  | srcTop = mouseY - screenHeight / 2 / scale; | 
|  | } | 
|  |  | 
|  | var disableClick = false; | 
|  |  | 
|  | function handleMouseClick() { | 
|  | if (disableClick) { | 
|  | return; | 
|  | } | 
|  | if (!curve_t || !ptInTControl()) { | 
|  | calcXY(); | 
|  | calcLeftTop(); | 
|  | } | 
|  | redraw(); | 
|  | //    if (!curve_t || !ptInTControl()) { | 
|  | //        mouseX = screenWidth / 2 / scale + srcLeft; | 
|  | //        mouseY = screenHeight / 2 / scale + srcTop; | 
|  | //    } | 
|  | } | 
|  |  | 
|  | function handleMouseOver() { | 
|  | calcXY(); | 
|  | if (debug_xy != 2) { | 
|  | return; | 
|  | } | 
|  | var num = mouseX.toFixed(decimal_places) + ", " + mouseY.toFixed(decimal_places); | 
|  | ctx.beginPath(); | 
|  | ctx.rect(300,100,num.length * 6,10); | 
|  | ctx.fillStyle="white"; | 
|  | ctx.fill(); | 
|  | ctx.font = "normal 10px Arial"; | 
|  | ctx.fillStyle="black"; | 
|  | ctx.textAlign = "left"; | 
|  | ctx.fillText(num, 300, 108); | 
|  | } | 
|  |  | 
|  | function start() { | 
|  | for (var i = 0; i < testDivs.length; ++i) { | 
|  | tests[i] = null; | 
|  | } | 
|  | testIndex = 0; | 
|  | drawTop(); | 
|  | window.addEventListener('keypress', doKeyPress, true); | 
|  | window.addEventListener('keydown', doKeyDown, true); | 
|  | window.onresize = function() { | 
|  | drawTop(); | 
|  | } | 
|  | /* | 
|  | window.onpagehide = function() { | 
|  | disableClick = true; | 
|  | } | 
|  | */ | 
|  | window.onpageshow = function () { | 
|  | disableClick = false; | 
|  | } | 
|  | } | 
|  |  | 
|  | </script> | 
|  | </head> | 
|  |  | 
|  | <body onLoad="start();"> | 
|  | <canvas id="canvas" width="750" height="500" | 
|  | onmousemove="handleMouseOver()" | 
|  | onclick="handleMouseClick()" | 
|  | ></canvas > | 
|  | </body> | 
|  | </html> |