
       // Acordes
        
        let miStorage;
        var isOpen = false;
        let btnAppendNews = document.querySelector('#btonPHacerElManeje');
        const Domain = window.location.hostname;
        const categoria = document.querySelector('a').baseURI.split('/')[4];
        
        btnAppendNews.addEventListener('click', () => {
            fetchData();
            intervalo() 
        });
        
        document.addEventListener('DOMContentLoaded', () => {
            
            fetchData();
            intervalo() 

        });
        
        function intervalo() {
            
            var i = setInterval(myTimer ,1000);
                
            setTimeout(function( ) { clearInterval( i ); }, 3000);
            function myTimer() {
                $('#response').masonry({
                  // specify itemSelector so stamps do get laid out
                  itemSelector: '.grid-item'
                });
            }
        }

        let iteracionNotas = 0;
        
        function fetchData() {
            
            fetch(`https://original.radiosnet.com.ar/notas_json_10.php?c=${iteracionNotas}&cat=${categoria}`,{
                method: 'GET'
            })
                .then(ajaxPositive)
                .catch(showError);
                

            function ajaxPositive(response) {
                if (response.ok) {
                    response.json().then(showResult);
                } else {
                    showError('status code: ' + response.status);
                }
            }

            function showResult(arrayRespuesta) {

                if(Object.entries(arrayRespuesta.cancion).length === 0){
                    console.log('e finito');
                    
                    btnAppendNews.classList.remove('btn-success');
                    btnAppendNews.classList.add('disabled');
                    btnAppendNews.innerText = 'No hay más noticias cargadas';
                    return;
                }
                
                console.log('dataFetched', arrayRespuesta.cancion, );
                
                arrayRespuesta.cancion.forEach((item, i)=> {
                    
                    // crea un nuevo div
                    // y añade contenido
                    const newDiv = document.createElement("a");
                    newDiv.classList = 'mb-2 p-0 px-sm-2 grid-item col-12 col-sm-6 col-md-6';
                    newDiv.href = `https://${Domain}/nota/${arrayRespuesta.cancion[i].id}/${arrayRespuesta.cancion[i].titulo}`;
                    
                    newDiv.innerHTML  
                                += `<div class="news-images">
                                        <span class="btn" style="letter-spacing:1px;position:absolute;top:0;left:8px;color:#fff;background:${arrayRespuesta.cancion[i].color};">${arrayRespuesta.cancion[i].categoria}</span>
                                        <img src="${arrayRespuesta.cancion[i].foto}" class="img-fluid" />
                                    </div>
                                    <div class="news-summary bg-light pb-0">
                                        <h3 class="colorTitulo">${arrayRespuesta.cancion[i].titulo}</h3>
                                        <small class="bajada">${arrayRespuesta.cancion[i].fecha}</small>
                                        <p class="bajada">${arrayRespuesta.cancion[i].bajada}</p>
                                        <ul class="p-0 m-0 d-flex justify-content-center">
                                            <li class="">
                                                <a class="btn" target="_blank" href="https://www.facebook.com/sharer.php?u=https://original.radiosnet.com.ar/nota/${arrayRespuesta.cancion[i].id}/${arrayRespuesta.cancion[i].titulo}&amp;t=Tercera prueba">
                                                    <i class="fab fa-facebook bajada" aria-hidden="true"></i>
                                                </a>
                                            </li>
                                            <li class="">
                                                <a class="btn" target="_blank" href="https://twitter.com/share?original_referer=https://original.radiosnet.com.ar/nota/${arrayRespuesta.cancion[i].id}&amp;source=tweetbutton&amp;text=Tercera prueba&amp;url=https://original.radiosnet.com.ar/nota/172/tercera-prueba">
                                                    <i class="fab fa-twitter bajada" aria-hidden="true"></i>
                                                </a>
                                            </li>
                                            <li class="">
                                                <a class="btn" target="_blank" href="https://api.whatsapp.com/send?text=*Tercera prueba.*  https://original.radiosnet.com.ar/nota/${arrayRespuesta.cancion[i].id}/${arrayRespuesta.cancion[i].titulo}">
                                                    <i class="fab fa-whatsapp bajada" aria-hidden="true"></i> 
                                                </a>
                                            </li>
                                        </ul>
                                    </div>`;
                                    
                    const newPubli = document.createElement("a");
                    newPubli.classList = 'mt-2';
                    newPubli.href = `${arrayRespuesta.cancion[i].url_publi}`;
                    newPubli.innerHTML =`<img src="${arrayRespuesta.cancion[i].publicidad}" class="img-fluid" />`;      
                    
                    if(item.publicidad){
                        newDiv.append(newPubli);
                    }
                      
                 var $grid = $('#response').masonry({
                  // specify itemSelector so stamps do get laid out
                  itemSelector: '.grid-item'
                });

                  
                  // append items to grid
                $grid.append( newDiv )
                    // add and lay out newly appended items
                    .masonry( 'appended', newDiv );
                });
                

                $(".colorTitulo").fitText(1.2, {
                    minFontSize: '14px',
                    maxFontSize: '22px'
                });
                
                iteracionNotas = iteracionNotas + 10;
                return iteracionNotas;
            }

            function showError(err) {
                console.log('muestro error', err);
            }
            
            console.log('iter ', iteracionNotas);
            
        }

        $(window).on("load", function(){
            let element = document.querySelector('[data-toggle="modal"]');
            //console.log(element);
            element.click();
        });
        
        var TIMEOUT = null;
        
        $(window).on('resize', function () {
                if (TIMEOUT === null) {
                    TIMEOUT = window.setTimeout(function () {
                        TIMEOUT = null;
                        //fb_iframe_widget class is added after first FB.FXBML.parse()
                        //fb_iframe_widget_fluid is added in same situation, but only for mobile devices (tablets, phones)
                        //By removing those classes FB.XFBML.parse() will reset the plugin widths.
                        $('.fb-page').removeClass('fb_iframe_widget fb_iframe_widget_fluid');

                        FB.XFBML.parse();
                    }, 300);
                }
                var a = $(".colorTitulo").fitText(1.2, {
             minFontSize: '14px',
             maxFontSize: '18px'
            });
            console.log(' algo ', a);
                
            });

        function ventanaSecundaria56(URL) {
            window.open(URL, "ventana1", "width=960,height=630,scrollbars=NO")
        }

        $(function () {
             var a = $(".carousel-captionh1").fitText(1.2, {
             minFontSize: '14px',
             maxFontSize: '18px'
             });
             $(".colorTitulo").fitText(1.2, {
                 minFontSize: '14px',
                 maxFontSize: '24px'
             });
             $(".carousel-caption h2").fitText(1.2, {
                 minFontSize: '14px',
                 maxFontSize: '30px'
             });
             $(".tituloVideo").fitText(1.2, {
                 minFontSize: '14px',
                 maxFontSize: '30px'
             });
             $(".tarso").fitText(1.2, {
                 minFontSize: '20px',
                 maxFontSize: '50px'
             });
             $(".tarso2").fitText(1.2, {
                 minFontSize: '5px',
                 maxFontSize: '11px'
             });

            jQuery('img.svg').each(function () {
                var $img = jQuery(this);
                var imgID = $img.attr('id');
                var imgClass = $img.attr('class');
                var imgURL = $img.attr('src');
                //console.log('lalasl', imgURL);
                jQuery.get(imgURL, function (data) {

                    // Get the SVG tag, ignore the rest
                    var $svg = jQuery(data).find('svg');

                    // Add replaced image's ID to the new SVG
                    if (typeof imgID !== 'undefined') {
                        $svg = $svg.attr('id', imgID);
                    }
                    // Add replaced image's classes to the new SVG
                    if (typeof imgClass !== 'undefined') {
                        $svg = $svg.attr('class', imgClass + ' replaced-svg');
                    }

                    // Remove any invalid XML tags as per http://validator.w3.org
                    $svg = $svg.removeAttr('xmlns:a');

                    // Check if the viewport is set, else we gonna set it if we can.
                    /*if(!$svg.attr('viewBox') && $svg.attr('height') && $svg.attr('width')) {
                        $svg.attr('viewBox', '0 0 ' + $svg.attr('height') + ' ' + $svg.attr('width'))
                    }*/

                    // Replace image with new SVG
                    $img.replaceWith($svg);

                }, 'xml');

            });
        });
