Feature Request: Remove and Add Slides by selector, not just index.

[ColColonCleaner]

I am working with slides that have names/IDs, so a couple things came to mind. When removing slides and adding them back, indexes change, so using a selector would be better. Here is a proposal:

What if your remove method could be passed a selector, or a jquery element object to remove. Like $("#infoSlide"), and if that element is a slide (a simple check of structure here perhaps, like is element.parent().parent() the main slider.) remove that slide.

That way we dont really need to know the index at which the slide is, just need to know it's ID, or just some qualifier that will select it.

Now if you do go through with this, i would request you not just take a string with the ID, let us do the selecting and pass the element as an object. Mainly because my slides have outer padding divs and other stuff around them. I would want to select using their ID.parent().etc to get the actual slide. So all you would have to do is check if the object for deletion is a slide in the current slider. The formatting inside what your slider thinks are the actual slides might change from user to user, so this allows some added flexibility.

I can add my mod storage code very easily if it is implemented this way.

Now for adding slides. If i am using a selector to remove them, i probably know which slide it was next to originally, although i may not know the index. Instead of passing an object and an index, i could pass an object (the slide to add), another object (the slide to add next to), and a boolean(selection for whether to place on the right or left.
If the slide to add next to is a slide in the current slider, just drop the new one in place. If it isn't, do nothing, maybe throw a console log in there with the error, if they tried to select something that doesn't exist they probably want to know.

Let me know what you think. I will start implementing this myself but frankly i'm not sure how to properly do it without breaking your code. Will give it a shot though.

[ColColonCleaner]

I created the code for use in the remove slide method, and it works :)

Below is the edited code. Just copied from the header down through the end of my edits. This allows for removal by index, or by passing a selected element.

removeSlide:function (slide) {
            //loop through all elements in this object (should be just one)
            return this.each(function () {
                //get the data for this slider
                var $this = $(this);
                var data = $this.data('iosslider');
                //log the data get
                if ($.debugModeActive)console.log("data: " + data);
                //if undefined, return
                if (data == undefined) return false;

                //Create a var for the slider number
                var slideNumber = null;
                //check if the input is a jquery object or an index
                if (isNaN(slide)) {
                    //Loop through all slides in the slider
                    $(data.scrollerNode).children().each(function (index, element) {
                        //Check if the two containing html elements are equal
                        if ($(element)[0] === slide[0]) {
                            //Translate from base 0 selection to base 1
                            slideNumber = (index + 1);
                        }
                    });
                } else {
                    //If it is a number just use it
                    slideNumber = slide;
                }

                //The rest of the function

This is the call i make from my code:

/**
 * Testing function for removing a tile and adding back in a different position
 */
function removeTile(){
    //remove the slide and capture the code/bindings
        //parent parent just selects what slider will think is the actual slide, outside of my formatting divs
    $('#tileSlider_Bottom').iosSlider('removeSlide', $("testTile").parent().parent());
}

Will be working on the add tomorrow.

[ColColonCleaner]

Updated code :), lol.

As i continued my testing, i accidentally told slider to remove a slide from a different slider (using the selector). This obviously made the code crash as it was only intended to work with the current slider.

This is the code that will do it correctly. If it cannot find the slide in the current slider, it will find the slider that has it, and will remove it. Failing of course of no slider contains it. There will never be overlap or removal of the wrong element as long as you pass the correct selector.

the code:

removeSlide:function (slide) {
            //loop through all elements in this object (should be just one)
            return this.each(function () {
                //get the data for this slider
                var $this = $(this);
                var data = $this.data('iosslider');
                //log the data get
                if ($.debugModeActive)console.log("data: " + data);
                //if undefined, return
                if (data == undefined) return false;

                //Create a var for the slider number
                var slideNumber = null;
                //check if the input is a jquery object or an index
                if (isNaN(slide)) {
                    //Loop through all slides in the slider
                    $(data.scrollerNode).children().each(function (index, element) {
                        //Check if the two containing html elements are equal
                        if ($(element)[0] === slide) {
                            //Translate from base 0 selection to base 1
                            slideNumber = (index + 1);
                            //break out of each loop
                            return false;
                        }
                    });
                    if(slideNumber==null)
                    {
                        var sliderID = $(data.obj).attr('id');
                        if ($.debugModeActive)console.log("No slide found with that selector in the slider: '" + sliderID + "'");
                        if ($.debugModeActive)console.log("Looking for other sliders with this element.");
                        //the below line should return the whichever slider the selected slide belongs to
                        var possibleSlider = $(slide).parent().parent();
                        //check to see if its twice removed parent has slider data. It should if this element is a slide.
                        var otherSliderData = possibleSlider.data('iosslider');
                        //if undefined, return with error
                        if (otherSliderData == undefined){
                            if ($.debugModeActive)console.log("No slider found with selected slide.");
                            return false;
                        }
                        //call remove on the slider containing the remove slide
                        possibleSlider.iosSlider('removeSlide', slide);
                        return true;
                    }
                } else {
                    //If it is a number just use it
                    slideNumber = slide;
                }

                //the rest of the function

[ColColonCleaner]

Referencing #87. Added code there.

Closing. Use issue #87 for documentation going forward.