function InitViews(){
    
    //PROPERTIES VIEWS
    properties_view = new PropertiesViews();
    properties_view.init(); 
        
    
    //video views
    var getVidBTN = new GetVideoBTN_V(jQuery('#getVidBTN'));
    
    //video Width/Height - handlers
    jQuery('#vidWidth').change(function(){
        EventBus.dispatchEvent(new Event(Event.NEW_VIDEO_WIDTH, jQuery(this).val()));
    });
    jQuery('#vidHeight').change(function(){
        EventBus.dispatchEvent(new Event(Event.NEW_VIDEO_HEIGHT, jQuery(this).val()));
    });    
    jQuery('#newSizeBTN').click(function(e){
        e.preventDefault();
        EventBus.dispatchEvent(new Event(Event.NEW_VIDEO_SIZE, {w: jQuery('#vidWidth').val(), h:jQuery('#vidHeight').val()}));
    });
    //end video Width/Height - handlers    
    
    //VIDEO CONTAINER
    var vContainerModel = jQuery.extend(new VideoContainerModel(), {vidWidth: 800, vidHeight: 600});
    if(!main_json_data.isEmpty){
        vContainerModel = jQuery.extend(new VideoContainerModel(), main_json_data.getVideoContainerModel());
    }    
    var video_id = vContainerModel.getVideoID();
    (video_id==undefined||video_id==null)?jQuery('#mainControlButtons').css('visibility', 'hidden'):jQuery('#mainControlButtons').css('visibility', 'visible');
    var video_containerV = new VideoContainerV(jQuery('#videoContainer'), vContainerModel);
    
    
    //HANDLE ASSETS
    var video_assetsM = new VideoAssetsModel();
    video_assetsM.init();
    var video_assetsV = new VideoAssetsView(jQuery('#videoContainer'), video_assetsM);
    if(main_json_data.getAssets()!=undefined){
        video_assetsM.setData(jQuery.extend(new Array(), main_json_data.getAssets()));
    }
           
              
}



/* GET VIDEO BTN View
================================================== */
function GetVideoBTN_V(dom_el){
    
    this.init(dom_el);
    
    this.onClick = function(e){
        e.preventDefault();
        var vidID = jQuery('#videoID').val();
        if(!this.validate(vidID)){
            alert('Please add a valid video ID!');
        }
        EventBus.dispatchEvent(new Event(Event.NEW_VIDEO_ID, {videoID: vidID, w: jQuery('#vidWidth').val(), h: jQuery('#vidHeight').val(), iFrameID: jQuery('#shortcode').attr('data-postid') } ));           
    }
}
GetVideoBTN_V.prototype = new GenericView();






/* VIDEO CONTAINER view
================================================== */

function VideoContainerV(dom_el, model){   
    
    var _this = this;    
    //changes to model
    this.render = function(val){
        //render width/height    
        _this.el.css('width', _this.model.getVideoWidth()+'px');
        _this.el.css('height', _this.model.getVideoHeight()+'px');
        
        
        //add video
        var videoID = _this.model.getVideoID();
        if(videoID!=""&&videoID!=undefined){
            jQuery('#mainControlButtons').css('visibility', 'visible');          
            var videoTemplate = IFrameTemplates.getInstance().getVideoTemplateEditor(videoID, _this.model.getVideoWidth(), _this.model.getVideoHeight(), _this.model.getIFrameID())
            try{
                _this.el.find('#videoContent').empty();
                jQuery(videoTemplate).appendTo(_this.el.find('#videoContent'));
            }catch(e){}
        }else{
            jQuery('#mainControlButtons').css('visibility', 'hidden');
        }

         //set json data
         main_json_data.setVideoContainerModel(_this.model);
         document.getElementById('mainJSONData').value = JSON.stringify(main_json_data);
    }
            
    //init view
    this.init(dom_el, model);
    if(!main_json_data.isEmpty){        
        this.model.onChange();
    }            
}
VideoContainerV.prototype = new GenericView();





/* VIDEO ASSETS view
================================================== */
function VideoAssetsView(dom_el, model){
    
    var holdAssetsUI = new Array();
            
    //init view
    this.init(dom_el, model);
    var _this = this;    
    
    //ADD IMAGE
    var addImgBTN = jQuery('#addImageBTN');
    addImgBTN.click(function(e){
        e.preventDefault();
        tb_show('Add image', 'media-upload.php?post_id=0&type=image&TB_iframe=true', false);  
        return false;
    });    
    window.send_to_editor = function(html) {
        var originalImage = jQuery(html).attr('href');
        var thumbImage = jQuery(html).find('img').attr('src');
        var imgid = jQuery(html).find('img').attr('class');
        var imageID = imgid.slice( ( imgid.search(/wp-image-/) + 9 ), imgid.length );
        imageSelectedCallback(originalImage, thumbImage, imageID);
        tb_remove();  
    }
    
    function imageSelectedCallback(originalImage, thumbImage, imageID){
        var assetModel = Defaults.getInstance().getDefaultImageModel();
        assetModel.setImage(originalImage);
        _this.model.add(assetModel);
        assetModel.setZindex(_this.model.getData().length);
        EventBus.dispatchEvent(new Event(Event.SELECT_ASSET, assetModel));
    }
    
    //ADD TEXT
    var addTxtBTN = jQuery('#addTextBTN');
    addTxtBTN.click(function(e){        
        e.preventDefault();
        var assetModel = Defaults.getInstance().getDefaultTextModel();
        _this.model.add(assetModel);
        assetModel.setZindex(_this.model.getData().length);
        EventBus.dispatchEvent(new Event(Event.SELECT_ASSET, assetModel));
    });
    
    
    //ADD BUTTON
    var addButtonBTN = jQuery('#addButtonBTN');
    addButtonBTN.click(function(e){
        e.preventDefault();
        var assetModel = Defaults.getInstance().getDefaultButtonModel();
        _this.model.add(assetModel);
        assetModel.setZindex(_this.model.getData().length);
        EventBus.dispatchEvent(new Event(Event.SELECT_ASSET, assetModel));
    });
	
	//ADD FORM
    var addFormBTN = jQuery('#addFormBTN');
    addFormBTN.click(function(e){
        e.preventDefault();
        var assetModel = Defaults.getInstance().getDefaultFormModel();
        _this.model.add(assetModel);
        assetModel.setZindex(_this.model.getData().length);
        EventBus.dispatchEvent(new Event(Event.SELECT_ASSET, assetModel));
    });
    
    //ADD RECTANGLE
    var addRectangleBTN = jQuery('#addRectangleBTN');
    addRectangleBTN.click(function(e){
        e.preventDefault();
        var assetModel = Defaults.getInstance().getRectangleModel();
        _this.model.add(assetModel);
        assetModel.setZindex(_this.model.getData().length);
        EventBus.dispatchEvent(new Event(Event.SELECT_ASSET, assetModel));
    });            
    
    
    //ADD EMBEDED CODE
    var addCodeBTN = jQuery('#addCodeBTN');
    addCodeBTN.click(function(e){
        e.preventDefault();
        var assetModel = Defaults.getInstance().getCodeModel();
        _this.model.add(assetModel);
        assetModel.setZindex(_this.model.getData().length);
        EventBus.dispatchEvent(new Event(Event.SELECT_ASSET, assetModel));
    });
    
    
    //PREVIEW  - !important
    var previewBTN = jQuery('#previewBTN');
    previewBTN.click(function(e){
        e.preventDefault();
        var v_preview = VideoPreview.getInstance();
        var data = document.getElementById('mainJSONData').value;
        v_preview.init(data);
    });       
    
    
    
    //add assets to stage
    function addAsset(assetView){
        holdAssetsUI.push(assetView);
        assetView.el.appendTo(jQuery('#videoContainer'));              
        assetView.render();
    }
    
    //remove asset item
    this.removeAssetItem = function(event){
        holdAssetsUI[event.data.indx].getEl().remove();
        holdAssetsUI.splice(event.data.indx, 1); 
        EventBus.dispatchEvent(new Event(Event.ASSETS_COLLECTION_CHANGE, this.data));       
    }
    EventBus.addEventListener(Event.REMOVE_VIEW, this.removeAssetItem);
    
    //LISTENERS
    //assets colection change
    this.onAssetsColectionChange = function(event){
        //set json data
        document.getElementById('mainJSONData').value = JSON.stringify(main_json_data);
    }
    EventBus.addEventListener(Event.ASSETS_COLLECTION_CHANGE, this.onAssetsColectionChange);
    

    
    //asset added listener
    this.onAssetAdded = function(event){        
        var genericAsset;
        var assetModel = event.data;
        switch(assetModel.getType())
        {
            case GenericAssetModel.IMAGE:
              //image
              var img = jQuery('<img class="assetItem" src="'+assetModel.getImage()+'" alt=""/>');
              genericAsset = new ImageAssetView(img, assetModel);
              addAsset(genericAsset);
              break;
            case GenericAssetModel.TEXT:
              //text
              var txt = jQuery('<p class="assetItem"></p>');
              genericAsset = new TextAssetView(txt, assetModel);
              addAsset(genericAsset);              
              break;
            case GenericAssetModel.BUTTON:
              //button
              var btn = jQuery('<a class="assetItem genericButton orange"></a>');
              genericAsset = new ButtonAssetView(btn, assetModel);
              addAsset(genericAsset);              
              break;
            case GenericAssetModel.RECTANGLE:
              //rectangle
              var r = jQuery('<div class="assetItem"></div>');
              genericAsset = new RectangleAssetView(r, assetModel);
              addAsset(genericAsset);              
              break;   
			case GenericAssetModel.FORM:
              //rectangle
              var r = jQuery('<form id="vap_form" action="yes.php" method="post"><div class="text_enter_info">Enter your info</div><input style="background-color:  type="text" name="vap_name" id="vap_name" placeholder="Name"> <br><br> <input type="email" name="vap_email"  id="vap_email" placeholder="Email"> <br><br> <input type="submit" id="vap_submit" value="Submit"> </form>');
              genericAsset = new FormAssetView(r, assetModel);
              addAsset(genericAsset);              
              break;   
            case GenericAssetModel.CODE:
              //code
              var code = jQuery('<div class="assetItem codeAsset"></div>');
              genericAsset = new CodeAssetView(code, assetModel);
              addAsset(genericAsset);               
              break;
          }                          
    }
    EventBus.addEventListener(Event.ASSET_ADDED, this.onAssetAdded);
}
VideoAssetsView.prototype = new GenericView();