Dejar sin efecto una función mediante otra

[AlZuwaga]

Hola. Me explico. Tengo un slider de noticias que se activa con:

Código Javascript:

<script type="text/javascript">
    
        function formatText(index, panel) {
          return index + "";
        }
    
        $(function () {
        
            $('.anythingSlider').anythingSlider({
                easing: "easeInOutExpo",        // Anything other than "linear" or "swing" requires the easing plugin
                autoPlay: true,                 // This turns off the entire FUNCTIONALY, not just if it starts running or not.
                delay: 3000,                    // How long between slide transitions in AutoPlay mode
                startStopped: false,            // If autoPlay is on, this can force it to start stopped
                animationTime: 600,             // How long the slide transition takes
                hashTags: true,                 // Should links change the hashtag in the URL?
                buildNavigation: true,          // If true, builds and list of anchor links to link to each slide
                pauseOnHover: true,             // If true, and autoPlay is enabled, the show will pause on hover
                startText: "Go",             // Start text
                stopText: "Stop",               // Stop text
                navigationFormatter: formatText       // Details at the top of the file on this use (advanced use)
            });
            
            $("#slide-jump").click(function(){
                $('.anythingSlider').anythingSlider(6);
            });
            
        });
    </script>
 

Ahora, resulta que quiero dejar ese slider sin efecto mediante un función llamada slider_lista(elemento)

Código Javascript:

<script type="text/javascript">
    function slider_lista(elemento){
/*      <div class="anythingSlider" id="slider">*/
        var elemento = document.getElementById(elemento.id);
        if(elemento.textContent == "Ordenar"){
            elemento.textContent = "Rotar"
            document.getElementById('slider').className = "anythingSliderOrden";
        }
        else{
            elemento.textContent = "Ordenar"
            document.getElementById('slider').className = "anythingSlider";
        }
    }
    </script>
 
 
<div id="slider_lista" onclick="slider_lista(this)">Ordenar</div>
 

Lo que hace esa función básicamente es reemplazar la clase anythingSlider por otra (anythingSliderOrden) al div #slider peeeeero... si bien el slider deja de funcionar, me siguen apareciendo "cosas" creadas por la ejecución original de $('.anythingSlider').anythingSlider(...). Cosas como por ejemplo que los enlaces de navegación siguen apareciendo y me agrega <li> de más (el primero lo duplica al final y el último al inicio). Lo que me gustaría es que esa función hiciera de cuenta que jamás se hubiera llamado a la primera (y que al volver a hacer click vuelva todo a la normalidad)

El motivo de todo esto es poder "desactivar" el slider para poder ordenar sus contenidos "visualmente" mediante "jquery.ui.sortable.js".

Me explico? Se puede?
Gracias!

[David]

De forma sencilla, no. Según he visto en la documentación el slider que estás usando no tiene un método para destruirlo.

Sin indagar más a fondo, una idea sería tener una copia de la lista sin modificar que ocultes/muestres cuando vayas a realizar el ordenamiento.

Saludos.

[AlZuwaga]

Gracias David. Había pensado en esa opción pero quería previamente ver si existía una manera más (por llamarlo) "elegante". Si no encuentro forma lo haré así

[David]

Otra cosa que he probado y al parecer funciona correctamente es guardar el contenido del div y luego restaurarlo para hacer el reset. Algo como esto:

Código Javascript:

function formatText(index, panel) {
    return index + "";
}
 
function startSlider() {
    var obj = $(".anythingSlider");
    obj.data("lastcontent", obj.html());
    obj.anythingSlider({
        easing: "easeInOutExpo",        // Anything other than "linear" or "swing" requires the easing plugin
        autoPlay: true,                 // This turns off the entire FUNCTIONALY, not just if it starts running or not.
        delay: 3000,                    // How long between slide transitions in AutoPlay mode
        startStopped: false,            // If autoPlay is on, this can force it to start stopped
        animationTime: 600,             // How long the slide transition takes
        hashTags: true,                 // Should links change the hashtag in the URL?
        buildNavigation: true,          // If true, builds and list of anchor links to link to each slide
        pauseOnHover: true,             // If true, and autoPlay is enabled, the show will pause on hover
        startText: "Go",             // Start text
        stopText: "Stop",               // Stop text
        navigationFormatter: formatText       // Details at the top of the file on this use (advanced use)
    });
}
 
function stopSlider() {
    var obj = $(".anythingSlider");
    obj.html(obj.data("lastcontent"));
}
 
$(function () {
    startSlider();
    
    $("#slide-jump").click(function(){
        $('.anythingSlider').anythingSlider(6);
    });
});
 

De modo que llames a stopSlider() para volver al contenido original y startSlider() para volver a iniciarlo.

[AlZuwaga]

Gracias David. Lo pruebo en cuanto llegue a la ofician. Igual no lo estoy entendiendo del todo :sonrojado:

[AlZuwaga]

Ok. Funciona! Gracias. Ahora tengo otro problema.
Si cargo la página por primera vez todo funciona OK. Pero cuando llamo a stopSlider() deja de funcionar este fragmento de código que es el que hace el "sort":

Código Javascript:

$(document).ready(function() { 
      $(".wrapper ul").sortable({ 
        update : function () { 
            var order = $('.wrapper ul').sortable('serialize');
            alert('noti_ordena_tapa_exe.php?'+order+'&action=updateOrder');
//          $.post('noti_ordena_tapa_exe.php?'+order+'&action=updateOrder');
        } 
      }); 
    });
 

Si vuelvo a llamar a startSlider() tampoco funciona $(".wrapper ul").sortable() (cosa que si ocurre al cargar la página por primera vez)

Tenés idea qué puede estar pasando?

[David]

Es porque el contenido del ul vuelve a su estado original.

Si, como tengo entendido, lo que quieres es que al momento de llamar a stopSlider() puedas ordenar los elementos, probablemente esto va a servir:

Código Javascript:

function startSlider() {
    $(".wrapper ul").sortable("destroy");
 
    // Resto del código de startSlider()
}
 
function stopSlider() {
    // Código de stopSlider()
 
      $(".wrapper ul").sortable({ 
        update : function () { 
            var order = $('.wrapper ul').sortable('serialize');
            alert('noti_ordena_tapa_exe.php?'+order+'&action=updateOrder');
//          $.post('noti_ordena_tapa_exe.php?'+order+'&action=updateOrder');
        } 
      });
}
 

[AlZuwaga]

Sos un "mostro"!!! :reverencias:
Cuando vengas para Argentina avisame que lo menos que puedo hacer es invitarte unas cuantas Coca Colas

[David]

De acuerdo, gracias por la invitación.

Me alegra que haya funcionado.

Saludos.