jsTurn Slider Bar

Question

i'm using this flipbook everything working fine but i need the slider to have certain specific pages 12 exactly, something like (1,10-11,20-21,30-11) im not sure what value i need to change.

( "#slider" ).slider({
    min: 1,
    max: 12, //had this value before 

    start: function(event, ui) {

        if (!window._thumbPreview) {
            _thumbPreview = $('<div />', {'class': 'thumbnail'}).html('<div></div>');
            setPreview(ui.value);
            _thumbPreview.appendTo($(ui.handle));
        } else
            setPreview(ui.value);

        moveBar(false);

    },

    slide: function(event, ui) {

        setPreview(ui.value);

    },

    stop: function() {

        if (window._thumbPreview)
            _thumbPreview.removeClass('show');

        $('.magazine').turn('page', Math.max(1, $(this).slider('value')*2-2));

    }
});

//////////////////////////////// this is magazine.js function setPreview(view) {

var previewWidth = 112,
    previewHeight = 73,
    previewSrc = 'pages/preview.jpg',
    preview = $(_thumbPreview.children(':first')),
    numPages = (view==1 || view==$('#slider').slider('option', 'max')) ? 1 : 2,
    width = (numPages==1) ? previewWidth/2 : previewWidth;

_thumbPreview.
    addClass('no-transition').
    css({width: width + 15,
        height: previewHeight + 15,
        top: -previewHeight - 30,
        left: ($($('#slider').children(':first')).width() - width - 15)/2
    });

preview.css({
    width: width,
    height: previewHeight
});

if (preview.css('background-image')==='' ||
    preview.css('background-image')=='none') {

    preview.css({backgroundImage: 'url(' + previewSrc + ')'});

    setTimeout(function(){
        _thumbPreview.removeClass('no-transition');
    }, 0);

}

preview.css({backgroundPosition:
    '0px -'+((view-1)*previewHeight)+'px'
});

}