{% extends "t_article.twig" %}


{% block header_css %}

	<link rel="stylesheet" href="front_audio_player/css/bar-ui.css" />
  
{% endblock %}

{% block header_js %}
<script type="text/javascript" src="front_audio_player/script/soundmanager2.js"></script>
<script src="front_audio_player/script/bar-ui.js"></script>

<script>	
       $(document).ready(function(){

                      //$('#listeners').load('http://37.59.28.208:8362/7.html?sid=1');
			$.ajax({
        type: "GET",
        url: "http://37.59.28.208:8362/stats?sid=1&json=1",
        
              async:true,
             dataType: "jsonp",

        crossDomain:true,
        success: function(data) {
		        
         $('#listenersi').html(data['currentlisteners']);
          
        }
                 });
	
	
			
		
	
	
       });
	</script>	
   
{% endblock %}


{% block right_side %}

    {% set contenu = data.contenu %}
    
    <div class="col-sm-8">
                 
                    
                    
                    
                    
                <div class="row col-sm-12 ">
                    
                    
                    <p class="head_idhaa">
                       {% if(contenu) %}
                           {% if(contenu.ID_TYPE==1) %}
                          
                               {% set folder = 'khoutab' %}
                                {% elseif (contenu.ID_TYPE==2) %}
                                {% set folder = 'dourouss' %}
                                 {% elseif (contenu.ID_TYPE==3) %}
                                 {% set folder = 'dawrat' %}
                           {% endif %}
                       تستمعون الآن إلى : {{contenu.TITRE|raw}} 
                         {% else %}
                             البثّ المباشر غير متوفر حاليا
                         {% endif %}
                             
                    </p>
                  
                    
                    
                </div>
                    
                    
                    
                 <div style="" class="row col-sm-12">
                 <div style="margin: 0;" class="row max_head">
                     
                     <div style="font-weight: bold; padding: 10px;" class="head_title">
                        <p style="z-index: 10;">
                           الاذاعة
                        </p>
                     </div>
                    
                </div>
                     
                      
                <div style="padding: 0px; margin-right: 0px; margin-left: 0px;" class="row p_container">
                    
                    <div class="row col-sm-12 idha3a_player">
					
					
					 {% if(contenu.ID_TYPE==1) %}
                          
                               {% set folder = 'khoutab' %}
                                {% elseif (contenu.ID_TYPE==2) %}
                                {% set folder = 'dourouss' %}
                                 {% elseif (contenu.ID_TYPE==3) %}
                                 {% set folder = 'dawrat' %}
                           {% endif %}
                       
                        <div  style=" padding-top: 138px; margin-left: auto;margin-right: auto;max-width: 250px;" > 
						
						
						<audio preload="auto" controls autoplay style="width:100%;">
						 {% if(contenu.ARCHIVE==0) %}
				<source src="{{contenu.SOURCE}}">
				{% else %}
				<source src="Media/sawtiyat/{{folder}}/{{contenu.FILE}}">
				{% endif %}
			</audio>
			
						
						
						
                 
                        </div> 
                     
           
                        
                    </div>
               

                </div>
                
                    
                </div>
                 
                   
                   
                   <div style="" class="row col-sm-12 ">
                       <div class="row idha3a_footer">
                           <div class="row col-sm-12 radiostats">
                               <p>
                                     {% if(contenu) %}
                                   يُبث الآن: {{contenu.TITRE|raw}}
                                     {% else %}
                                          يُبث الآن:
                                     {% endif %}
                               </p>
                           </div>
                            <div class="row col-sm-12 radiostats">
                               <p>
                                    {% if(contenu) %}
                                   عدد المستمعين:  <span id="listenersi"></span>
                                    {% else %}
                                        عدد المستمعين:
                                     {% endif %}
                               </p>
                           </div>
                           
                           
                       </div>
                        
                    </div>  
                    
                     <div style="" class="row col-sm-12 ">
                         <div class="row " id="phone_inst">
                             
                             <div class="row col-sm-12 radioapp" style="border-bottom:1px dotted #FFF;">
                                
                               <p>
                                    <img width="25" height="25" border="0" alt="" ilo-full-="" src="./images/Android.png">
                                  	للاستماع إلى الإذاعة على أجهزة الأندرويد يرجى استعمال البرنامج التالي: 
                               </p>
                           </div>
                            <div class="row col-sm-12 radioapp">
                               <p>
                                   <img width="20" height="25" border="0" alt="" ilo-full-="" src="./images/Apple.png">
                                  للاستماع إلى الإذاعة على أجهزة الآيفون، الآيبود والآيباد  يرجى استعمال البرنامج التالي: 
                               </p>
                           </div>
                             
                         </div>
                     
                    </div>
                    
                     
                    
                    
                </div>
    
    
{% endblock %}