====== Transitphasen ======

<PRELOAD>
########################################################################################################## 
 /lib/scripts/jqplot/jquery.jqplot.js
 /lib/scripts/jqplot/jquery.jqplot.css    # css
 /lib/scripts/jqplot/jquery.min.js        #(not required since DokuWiki 2012-01-25 Angua uses jQuery) 
 /lib/scripts/jqplot/jquery.jqplot.min.js # js
#
# jsxgraph
#
https://cdn.jsdelivr.net/npm/jsxgraph/distrib/jsxgraphcore.js
https://cdn.jsdelivr.net/npm/jsxgraph/distrib/jsxgraph.css
#
# personal 
#
/lib/scripts/src/header.js 
/lib/scripts/src/pointCharge.js
############################################################################################################
</PRELOAD>

<JS>

var a = -7.0;
var planet;
var brd;
///////ctrl
var onoff;
var bText = true;
var bPhase = true;
var bImage = true;

var pointer;
var time=0.0; // 0-1 normalized time
//////////

function onInit() { 
writeMainHeader();

/////////////// BOARD 
brd = JXG.JSXGraph.initBoard('jbox', {boundingbox: [-10, 10, 10, -10],           
           axis:false,
           grid:false,          
           showNavigation:false,
           showCopyright:false,
           needsRegularUpdate:true
            });

// example intersect circles
//var f = brd.create('circle', [[0,0], 2]);	 
//var circ = brd.create('circle', [[0,3], 4],{visible: false});	 
//var clip = brd.create('curveintersection', [f, circ], {	fillColor: 'black', fillOpacity: 0.6  });

function move(pos){ return pos + a + 7; } 
var A = brd.create('point',[function(){ return move(-8.9+0.2);},4.84] ,{visible: false, needsRegularUpdate:true, name:''  });
var B = brd.create('point',[function(){ return move(-3.01+0.2);},5.18],{visible: false, needsRegularUpdate:true ,name:'' });
var C = brd.create('point',[function(){ return move(-4.8+0.2);},4.6],{visible: false, needsRegularUpdate:true ,name:'' });

var ell = brd.create('ellipse',[A,B,C]);

//////////// STAR 
brd.create('point',[function(){ return move(-6);},5],
           {face:'o',
            strokeColor: '#000',
            size:24,
            fixed: true,
            layer:8,
            fillColor: 'yellow',          
            fillOpacity:0.5,          
            needsRegularUpdate:true,
            name:''
            }
           );
////////////
function ex(t){  return 1.5+ a +2.9*Math.cos(0.5*t);}
function ey(t){  return 5+0.5*Math.sin(0.5*t);}
// 2.3 -  0.7
var posR = 2.3;
var posL = 0.7;
var scale = 2.3-0.7;

function scalePos(t){
          t=1-t;
          if(t<0.73){
          off = -0.2*posR;
          return off + posL*t + (1-t)*posR;
          }
          if(t>=0.73){
          off = 1.2;
          return off + posL*t + (1-t)*posR;
          }      
}

function eex(t,tt){  return (scalePos(tt) + a +2.9*Math.cos(0.5*t));}

var exoplanet = brd.create('circle', [[function(){return ex(a);},function(){return ey(a);}], .4],{
               fillColor:'black',
               fillOpacity: 0.2,
               layer: 9           
               });	

var ghost = brd.create('circle', [[function(){return eex(a,time);},function(){return ey(a);}], .4],{
          visible: false  });	 

var clip = brd.create('curveintersection', [ghost,exoplanet], {
               fillColor: 'yellow',  fillOpacity: 0.9   });

function zeit(t){ x = 16.5*t - 8.2; return x; };

//
// pointer
//
brd.create('arrow', [ [ function(){return ex(a);},5],[function(){ return zeit(time) + 0.2;}, function(){ return pointer + 0.2;}]] ,{ dash:2, strokeColor:'#D3D3D3', fillOpacity: 0.2, visible: function(){ if(time == 0) return false; return true;}});  

///////// Koordinatensystem
   brd.create('arrow', [ [-8.7,-9],[-8.7,-1]] ,{strokeColor:'#000'});  
   brd.create('arrow', [ [-8.7,-9],[9,-9]] ,{strokeColor:'#000'});  
   brd.create('text',[-9.2,-5,"Helligkeit"],
     {  display: 'internal',      rotate:90  });
   brd.create('text',[8.5,-8.3,"Zeit"]);

////////////////// image
breite1 = 6;
hoehe1 = 5; 
box_x1 = -8.2;
box_y1 = 2.3;

function showImage() {  if (time == 1.0 && bText && bImage) return true; return false;}

brd.create('image', ['http://wiki.linux-astronomie.de/lib/exe/fetch.php?media=exoplanet_phase.png', 
                     [box_x1+0.2, box_y1+0.2], [breite1,hoehe1]] ,
                      {visible: function(){ return showImage();}} );
// unten
brd.create('line',[[box_x1,box_y1],[box_x1+breite1+0.4,box_y1]],{straightFirst:false,
                                   straightLast:false, strokeColor:'#000',
                                   strokeWidth:1, needsRegularUpdate:true,visible: function(){ return showImage();}});
 // links
brd.create('line',[[box_x1,box_y1],[box_x1,box_y1+hoehe1+0.4]],{straightFirst:false,
                                   straightLast:false, strokeColor:'#000',
                                   strokeWidth:1, needsRegularUpdate:true,visible: function(){ return showImage();}}); 
// rechts
brd.create('line',[[box_x1+breite1+0.4,box_y1],[box_x1+breite1+0.4,box_y1+hoehe1+0.4]],{straightFirst:false,
                                   straightLast:false, strokeColor:'#000',
                                   strokeWidth:1, needsRegularUpdate:true,visible: function(){ return showImage();}}); 
// oben
brd.create('line',[[box_x1,box_y1+0.4+hoehe1],[box_x1+breite1+0.4,box_y1+0.4+hoehe1]],{straightFirst:false,
                                   straightLast:false, strokeColor:'#000',
                                   strokeWidth:1, needsRegularUpdate:true,visible: function(){ return showImage();}});

/////// box 2
breite = 5.9;
hoehe = 2; 
box_x = 3.65;
box_y = 3.8;

// unten
brd.create('line',[[box_x,box_y],[box_x+breite+0.4,box_y]],{straightFirst:false,
                                   straightLast:false, strokeColor:'#000',
                                   strokeWidth:1, needsRegularUpdate:true,visible: function(){ return showImage();}});
 // links
brd.create('line',[[box_x,box_y],[box_x,box_y+hoehe+0.4]],{straightFirst:false,
                                   straightLast:false, strokeColor:'#000',
                                   strokeWidth:1, needsRegularUpdate:true,visible: function(){ return showImage();}}); 
// rechts
brd.create('line',[[box_x+breite+0.4,box_y],[box_x+breite+0.4,box_y+hoehe+0.4]],{straightFirst:false,
                                   straightLast:false, strokeColor:'#000',
                                   strokeWidth:1, needsRegularUpdate:true,visible: function(){ return showImage();}}); 
// oben
brd.create('line',[[box_x,box_y+0.4+hoehe],[box_x+breite+0.4,box_y+0.4+hoehe]],{straightFirst:false,
                                   straightLast:false, strokeColor:'#000',
                                   strokeWidth:1, needsRegularUpdate:true,visible: function(){ return showImage();}});

brd.create('line',[[box_x1+breite1+0.4,box_y1+hoehe1+0.4],[box_x,box_y+hoehe+0.4]],{straightFirst:false,
                                   straightLast:false, strokeColor:'#000',
                                   strokeWidth:1, needsRegularUpdate:true,visible: function(){ return showImage();}});
brd.create('line',[[box_x1+breite1+0.4,box_y1],[box_x,box_y]],{straightFirst:false,
                                   straightLast:false, strokeColor:'#000',
                                   strokeWidth:1, needsRegularUpdate:true,visible: function(){ return showImage();}});

brd.create('text',[box_x1+1,box_y1+hoehe1+0.9,"Beobachtung (Foto)"],{ needsRegularUpdate:true,visible: function(){ return showImage();}});

brd.create('text',[box_x+2.5,box_y+hoehe+0.9,"Theorie"],{needsRegularUpdate:true,visible: function(){ return showImage();}});

/////////////////////////////////////////////////////////////////////////////////////
//  transit  
////////////////////////////////////////////////////////////////////////////////////  
// 0----q1----p1----p2----q2--------q3---p3----p4-----q4-------1
var p1=0.26; 
var p2=0.3;
var p3= 0.81;
var p4= 0.86;

var q1=  0.2;
var q2 = 0.36;
var q3 = 0.76;
var q4=  0.91;   

var xmin = -8.2;
var xman = 8.3;

// ingress time  
function funcShow0(x){
       if ( bText && bPhase && time >  x) return true;       
       return false;
}
/////////////////////
brd.create('text',[-5.5,-6.5,"primäre Phase"],{ visible: function() { return funcShow0(q2);},needsRegularUpdate:true});
brd.create('text',[-4.2,-7.2,"Δ F_p"],{ visible: function() { return funcShow0(q2);},needsRegularUpdate:true});

brd.create('text',[4,-5,"sekundäre Phase"],{ visible: function() { return funcShow0(q4);},needsRegularUpdate:true});
brd.create('text',[5.5,-5.7,"Δ F_s"],{ visible: function() { return funcShow0(q4);},needsRegularUpdate:true});

brd.create('text',[2,-7,"Δ F_p > Δ F_s"],{ visible: function() { return funcShow0(q4);},needsRegularUpdate:true});

var textIncrease = brd.create('text',[-1.3,-3.9,"steigende Helligkeit"],{ 
                   visible: function() { return funcShow0(q3);},
                   needsRegularUpdate:true,
                   display: 'internal',
                   rotate:8                 
                   });

brd.create('text',[-8.3,-3.5,"fallende Helligkeit"],{ 
                   visible: function() { return funcShow0(q1);},
                   needsRegularUpdate:true,
                   display: 'internal',
                   rotate:-8                 
                   });

//
// x parameter
// p Start/Endpunkte
//
function line2Points(x,p1X,p1Y,p2X,p2Y){
    m = (p2Y-p1Y) / (p2X-p1X);
    y = m* (x-p1X) + p1Y;  
    return y;
}
///////////// start line
brd.create('line',[[xmin,-4],[ function(){
           if ( time == 0.0 ) return;         
           if( time < q1) { return zeit(time); }
           else{ return zeit(q1);}       
         } ,function(){ 

           x1 =    0;
           y1 =   -4;
           x2 =   q1; 
           y2 = -4.5;
                  
           if(time > x2 ) return y2;
           else {
                  pointer = line2Points(time,x1,y1,x2,y2);
                  return pointer;
            }
         } ]], 
         {straightFirst:false, straightLast:false, strokeWidth:4, needsRegularUpdate:true}); 
///////////// start down 1
brd.create('line',[[ zeit(q1),-4.5],[ function(){          
           if( time > q1 && time < p1) { return zeit(time); }
           else { if (time  > p1) {return zeit(p1); }}   
              
         } ,function(){ 

           x1 =    q1;
           y1 =   -4.5;
           x2 =   p1; 
           y2 =   -6;
         
           if(time > x1 && time < x2 ) {
                   pointer = line2Points(time,x1,y1,x2,y2);
                   return  pointer;           
            }else   { if ( time >= zeit(x2) ) { return y2;}  }

         } ]], 
         {straightFirst:false, straightLast:false, strokeWidth:4, needsRegularUpdate:true}); 
///////////// start dip 1
brd.create('line',[[ zeit(p1),-6],[ function(){             
           if( time > p1 && time < p2) { return zeit(time); }
           else { if (time  >= p2) {return zeit(p2); }}   
              
         } ,function(){ 

           x1 =    p1;
           y1 =   -6;
           x2 =   p2; 
           y2 =   -6;
           
           if(time > x1 && time < x2 ) {
              pointer = line2Points(time,x1,y1,x2,y2);
              return pointer;
           } else   { if ( time >= zeit(x2) ) {return y2;}  }

         } ]], 
         {straightFirst:false, straightLast:false, strokeWidth:4, needsRegularUpdate:true}); 

///////////// start up 1
brd.create('line',[[ zeit(p2),-6],[ function(){              
           if( time > p2 && time < q2) { return zeit(time); }
           else { if (time  >= q2)     { return zeit(q2); }}   
              
         } ,function(){ 

           x1 =    p2;
           y1 =   -6;
           x2 =   q2; 
           y2 =   -4.5;
           
           if(time > x1 && time < x2 ) {
            pointer =  line2Points(time,x1,y1,x2,y2);
            return pointer;
           }
           else   { if ( time >= zeit(x2) ) {return y2;}  }

         } ]], 
         {straightFirst:false, straightLast:false, strokeWidth:4, needsRegularUpdate:true}); 


///////////// start line
brd.create('line',[[ zeit(q2),-4.5],[ function(){             
           if( time > q2 && time < q3) { return zeit(time); }
           else { if (time  >= q3)     { return zeit(q3); } }   
              
         } ,function(){ 

           x1 =   q2;
           y1 =   -4.5;
           x2 =   q3; 
           y2 =   -3.5;
           
           if(time > x1 && time < x2 ) {                   
                   pointer = line2Points(time,x1,y1,x2,y2);
                   return pointer;

           } else   { if ( time >= x2 ) {return y2;}  }

         } ]], 
         {straightFirst:false, straightLast:false, strokeWidth:4, needsRegularUpdate:true}); 

///////////// start down 2
brd.create('line',[[ zeit(q3),-3.5],[ function(){             
           if( time > q3 && time < p3) { return zeit(time); }
           else { if (time  >= p3)     { return zeit(p3); } }   
              
         } ,function(){ 

           x1 =   q3;
           y1 =   -3.5;
           x2 =   p3; 
           y2 =   -4.5;
           
           if(time > x1 && time < x2 ) {
               pointer = line2Points(time,x1,y1,x2,y2);
               return pointer;
           }else   { if ( time >= x2 ) {return y2;}  }

         } ]], 
         {straightFirst:false, straightLast:false, strokeWidth:4, needsRegularUpdate:true}); 

///////////// start line
brd.create('line',[[ zeit(p3),-4.5],[ function(){              
           if( time > p3 && time < p4) { return zeit(time); }
           else { if (time  >= p4)     { return zeit(p4); } }   
              
         } ,function(){ 

           x1 =   p3;
           y1 =   -4.5;
           x2 =   p4; 
           y2 =   -4.5;
           
           if(time > x1 && time < x2 ) {
             pointer = line2Points(time,x1,y1,x2,y2);
             return pointer;
             }  else   { if ( time >= x2 ) {return y2;}  }

         } ]], 
         {straightFirst:false, straightLast:false, strokeWidth:4, needsRegularUpdate:true}); 

///////////// start up
brd.create('line',[[ zeit(p4),-4.5],[ function(){              
           if( time > p4 && time < q4) { return zeit(time); }
           else { if (time  >= q4)     { return zeit(q4); } }   
              
         } ,function(){ 

           x1 =   p4;
           y1 =   -4.5;
           x2 =   q4; 
           y2 =   -3.5;
           
           if(time > x1 && time < x2 ) {
             pointer =  line2Points(time,x1,y1,x2,y2);
             return pointer;
             } else   { if ( time >= x2 ) {return y2;}  }

         } ]], 
         {straightFirst:false, straightLast:false, strokeWidth:4, needsRegularUpdate:true}); 

///////////// start line
brd.create('line',[[ zeit(q4),-3.5],[ function(){            
           if( time > q4 && time < 1.0) { return zeit(time); }
           else { if (time  >= 1.0)     { return zeit(1.0); } }   
              
         } ,function(){ 

           x1 =   q4;
           y1 =   -3.5;
           x2 =   1.0; 
           y2 =   -3.8;
           
           if(time > x1 && time < x2 ){
              pointer =  line2Points(time,x1,y1,x2,y2);
              return pointer;
            } else   { if ( time >= x2 ) {return y2;}  }

         } ]], 
         {straightFirst:false, straightLast:false, strokeWidth:4, needsRegularUpdate:true}); 

   
//////////////////////////////////////////////////////
} // END OF BLOCK

function beschriftungChanged(value) {
            if (value.checked ){
              bText = true;             
            }else { bText = false ;}              
            brd.fullUpdate();            
}  

function onoffChanged(source) {
     checkboxes = document.getElementsByName('foo');
     for(var i=0, n=checkboxes.length;i<n;i++) {
             checkboxes[i].checked = source.checked;
           
             if( i == 0 ) onImageChanged(source);           
             if( i == 1 ) onPhaseChanged(source);         
            
          }  
      brd.fullUpdate();         
}  

function onPhaseChanged(value) {
            if (value.checked ){
              bPhase = true;             
            }else { bPhase = false ;}           
            brd.fullUpdate();    
} 
 
function onTimeChanged() {
            a = parseFloat($("#timeSlider").val());
            time  = a/0.9; // 0.9 slider max!
            a = a*14 -7;      
            $("#timeOut").text(time.toFixed(2));
            brd.fullUpdate();            
}

function onImageChanged(value)  { 
            if (value.checked ){
              bImage = true;             
            }else { bImage = false ;}              
            brd.fullUpdate();    
} 

</JS>


<HTML>

<body onload="onInit()">
<center>
<section>   <div id="jbox" class="jxgbox" style="width:500px; height:500px;"></div>
</center>  Idealisierte Lichtkurve zur Demostration der Transitphasen. Bei der primären Phase läuft der Exoplanet vor dem Zentralgestirn und dem Beobachter vorbei, bei der sekundären Phase wird der Exoplanet vom Zentralgestirn verdeckt. Obwohl beide Phasen einen Lichtabfall erzeugen, stellt bereits die primäre Phase die Grenze des derzeit machbaren in der Amateurastronomie dar.

<br>Einstellungen<br><br>
                      Zeit:   <span id="timeOut" style="display:none"></span>&nbsp;&nbsp;&nbsp;&nbsp;
            <input id="timeSlider" type="range" min="0.0" max="0.9" value="0.0"
                step="0.01" style="width:250px" oninput="onTimeChanged()">  
    
<div>
  <input type="checkbox" id="beschriftung" name="beschriftung"
         checked onchange="beschriftungChanged(this)">
  <label for="beschriftung">Beschriftung</label>

</div>

</section>   

</body>
</HTML>
++++ Details |

 <HTML>

<body onload="onInit()">  
<div>
  <input type="checkbox" id="onoff" name="onoff" onchange="onoffChanged(this)"
         checked>
  <label for="onoff">alle markieren</label>
</div>
<br> 

<div>
  <input type="checkbox"  name="foo" onchange="onImageChanged(this)"
         checked>
  <label for="scales">Bild</label>
<div>Reales Foto (Exoplanet TOI 4059.01 vom Autor) eines Exoplaneten in der primären Transitphase.
Unabhängig von den Phasen (oder Flanken) reicht die Auflösung nicht aus, um irgendwelche Details zu erkennen.  
</div>

<div>
  <input type="checkbox"  name="foo"
         checked onchange="onPhaseChanged(this)">
  <label for="phase">Phasen/Flanken</label>
<div>
<b>primäre Phase</b><br> Die Transitphase, bei der der Exoplanet vor dem Zentralgestirn (engl. Hoststar)  im Bezug auf dem Beobachter vorbeizieht.
</div>
<div><b>sekundäre Phase</b><br>Die Transitphase, bei der der Exoplanet hinter dem Zentralgestirn (engl. Hoststar) im Bezug auf dem Beobachter vorbeizieht.</div><div>
<b>Flanken</b><br>Zwischen den Phasen verläuft die Helligkeit nicht gleichmäßig, beispielsweise steigt die Helligkeit von der primären zur sekundären Phase leicht an, da zunehmend auch der vom Zentralgestirn angestrahlte Exoplanet einen Beitrag zur gesamt Helligkeit liefert. <br>Grundsätzlich sind Transittiefen (ΔF) sehr klein, die typische Größenordnung ist hier  milli-magnitudes (mmag) bzw. ppt (parts-per-thousend), und können daher nur fotographisch nachgewiesen werden. </div>
</body>
</HTML>


++++