Slide Window Widget

animation

The animation to use to open and close the slide window widget.
open and close properties are type of String, and must be one of the jQuery easing types like 'swing'.
openTime: A number determining how long the opening animation will run in millisecs.
closeTime: A number determining how long the closing animation will run in millisecs.

$A.newSlideWindow({
    animation: {
        open: 'swing',
        close: 'swing',
        openTime: 200,
        closeTime: 200
    }
}).draw();
            

$A.newSlideWindow().animation({open:"swing",close:"swing",openTime:200,closeTime:200}).draw();
            

var slideWindow = $A.newSlideWindow().draw();
//Setter
slideWindow.animation({open:"swing",close:"swing",openTime:200,closeTime:200}); //returns slideWindow

//Getter
console.log(slideWindow.animation()); //returns value of animation
            

autoClose

If this option is set true the slide window widget will automatically close if you clik out of it.
If this option is set false the slide window widget won't close unless the tab is clicked.

$A.newSlideWindow({autoClose: true}}).draw();
            

$A.newSlideWindow().autoClose(true).draw();
            

var slideWindow = $A.newSlideWindow().draw();
//Setter
slideWindow.autoClose(true); //returns slideWindow

//Getter
console.log(slideWindow.autoClose()); //returns value of autoClose
            

content

The content inside the widget can be any jQuery object, AutomizyJS form or HTML code.

$A.newSlideWindow({
    content: 'This will be the content'
}).draw();                  
            

$A.newSlideWindow().content('This will be the content').draw();
            

var slideWindow = $A.newSlideWindow().draw();
//Setter
slideWindow.content('This will be the content');  //returns slideWindow

//Getter
console.log(slideWindow.content()); //returns the content element
            

position

The position of the slide window widget. Accepted values: right | left | top | bottom

$A.newSlideWindow({
    position: 'left'
}).draw();                  
            

$A.newSlideWindow().position('left').draw();
            

var slideWindow = $A.newSlideWindow().draw();
//Setter
slideWindow.position('left'); //returns slideWindow

//Getter
console.log(slideWindow.position()); //returns value of position
            

positionX

positionX determines the distance between the left edge of the slide window widget and the left edge of its containing element in pixels.
Usage only enabled if the widget is positioned to the top or on the bottom.
You can also use right | left | center keywords to set the horizontal position of the side window widget.
Disabled if position: 'right' || position: 'left'.

$A.newSlideWindow({
    position: 'bottom',
    positionX: 'right'
}).draw();                  
            

$A.newSlideWindow().position('bottom').positionX('right').draw();
            

var slideWindow = $A.newSlideWindow({position: 'bottom'}).draw();
//Setter
slideWindow.positionX('right');  //returns slideWindow

//Getter
console.log(slideWindow.positionX()); //returns value of positionX
            

positionY

positionY determines the distance between the top edge of the slide window widget and the top edge of its containing element in pixels.
Usage only enabled if the widget is positioned to the right or the left.
You can also use top | bottom | middle keywords to set the vertical position of the side window widget.
Disabled if position: 'top' || position: 'bottom'.

$A.newSlideWindow({
    position: 'right',
    positionY: 'middle'
}).draw();                  
            

$A.newSlideWindow().position('right').positionY('middle').draw();
            

var slideWindow = $A.newSlideWindow({position: 'right'}).draw();
//Setter
slideWindow.positionY('middle'); //returns slideWindow

//Getter
console.log(slideWindow.positionY()); //returns value of positionY
            

tab

The clickable tab of the slide window widget. The widget opens on one click on the tab, and closes on another click on it.

• text
  Type: String
  The text shown on the tab.
• html
  Type: jQuery
  You can insert a jQuery element in the tab by using this attribute.
• width
  Type: String
  The width of the tab in pixels.
  You can also use optional values:
  '100%': the tab width will be adjusted to the slide window widget.
  'auto': the tab width will be adjusted to the text inside it.
  
• pos
  Type: String
  The text position of the tab.
  Optional values:
  top | bottom | middle if the slide window widget is positioned to the left or the right.
  left | center | right if the slide window widget is positioned to the top or the bottom.

$A.newSlideWindow({
    positionY: 'top',
    content: $('<div style="height:100px;">some content<div>'),
    tab: {
        text: 'OPEN',
        pos: 'bottom'
    }
}).draw();                  
                

$A.newSlideWindow({position: 'top', content:$('<div style="height:100px;">some content<div>')}).tab({text:'OPEN', pos: 'bottom'}).draw();
                

var slideWindow = $A.newSlideWindow({position: 'top', content:$('<div style="height:100px;">some content<div>')}).draw();
//Setter
slideWindow.tab({text:'OPEN', pos: 'bottom'}); //returns slideWindow

//Getter
console.log(slideWindow.tab()); //returns the tab element
                

title

The displayed title in the slide window widget.

$A.newSlideWindow({
    title: 'MySlideWindow'
}).draw();                  
            

$A.newSlideWindow().title('MySlideWindow').draw();
            

var slideWindow = $A.newSlideWindow().draw();
//Setter
slideWindow.title('MySlideWindow'); //returns slideWindow

//Getter
console.log(slideWindow.title()); //returns value of title
            

width

The width of the slide window widget without the slide window in pixels.

$A.newSlideWindow({
    width: 600
}).draw();                  
            

$A.newSlideWindow().width(600).draw();
            

var slideWindow = $A.newSlideWindow().draw();
//Setter
slideWindow.width(600);  //returns slideWindow

//Getter
console.log(slideWindow.width()); //returns value of width
            

close(func)

Invokes the closing animation of the slide window widget.

• func
  Type: function
  The fuction which will be invoked after the slide window closed.

var slideWindow = $A.newSlideWindow().draw();
slideWindow.close(function () {
    console.log('Slide window closed.');
});
slideWindow.open();
setTimeout(function (){
    slideWindow.close();
},1000);
            

open(func)

Invokes the opening animation of the slide window widget.

• func
  Type: function
  The fuction which will be invoked after the slide window opened.

var slideWindow = $A.newSlideWindow().draw();
slideWindow.open(function () {
    console.log('Slide window opened.');
});
setTimeout(function (){
    slideWindow.open();
},1000);
            

removeButton(button)

Removes the button from the slide window widget.

• button
  Type: Object | String
  The Button or the ID if the button to remove.

var slideWindow = $A.newSlideWindow().draw().open();
setTimeout(function (){
    //Removing a button by object parameter
    var btn = slideWindow.addButton();
    setTimeout(function() {
        slideWindow.removeButton(btn);
    },1000);

    //Removing a button by id
    slideWindow.addButton({id: 'MyButton02'});
    setTimeout(function() {
        slideWindow.removeButton('MyButton02');
    },1000);
},1000);