Javascript-форум (https://javascript.ru/forum/)
-   ExtJS (https://javascript.ru/forum/extjs/)
-   -   Загрузка сайта в PANEL (https://javascript.ru/forum/extjs/9818-zagruzka-sajjta-v-panel.html)

Golizart 07.06.2010 12:04

Загрузка сайта в PANEL
 
Помогите, я начал работать недавно c EXT v2.2 . Встал вопрос о загрузке сайта в PANEL .Сайт должен быть рабочим, с выполнением скриптов, естественно с отображением HTML элементов! ЕЩЕ в панели должна работать функция DragSelector для выделения HTML элементов и выводить в грид выделенные элементы(теги, координаты). Я посмотрел пример dataview в API , немного его переделал! выводит но не так как хочется, там ведь загрузка данных, а не рабочего сайта.А как загрузить сайт с рабочими ссылками в панель?
или этого сделать нельзя? Подскажите как вообще это можно реализовать??
вот мои наработки без выведения результатов в грид :
Ext.onReady(function(){
     Ext.DataView.DragSelector = function(cfg){   //Функци для выделения элементов
   
 cfg = cfg || {};
    var view, regions, proxy, tracker;
    var rs, bodyRegion, dragRegion = new Ext.lib.Region(0,0,0,0);
    var dragSafe = cfg.dragSafe === true;
  
    this.init = function(dataView){
        view = dataView;
        view.on('render', onRender);
    };

    function fillRegions(){
        rs = [];
        view.all.each(function(el){
            rs[rs.length] = el.getRegion();
            
        });
        bodyRegion = view.el.getRegion();
        
    }

    function cancelClick(){
        
        
        return false;
    }

    function onBeforeStart(e){
        return !dragSafe || e.target == view.el.dom;
    }

    function onStart(e){
        view.on('containerclick', cancelClick, view, {single:true});
        if(!proxy){
            proxy = view.el.createChild({cls:'x-view-selector'});
        }else{
            proxy.setDisplayed('block');
        }
        fillRegions();
        view.clearSelections();
    }

    function onDrag(e){
        var startXY = tracker.startXY;
        var xy = tracker.getXY();

        var x = Math.min(startXY[0], xy[0]);
        var y = Math.min(startXY[1], xy[1]);
        var w = Math.abs(startXY[0] - xy[0]);
        var h = Math.abs(startXY[1] - xy[1]);

        dragRegion.left = x;
        dragRegion.top = y;
        dragRegion.right = x+w;
        dragRegion.bottom = y+h;

        dragRegion.constrainTo(bodyRegion);
        proxy.setRegion(dragRegion);

        for(var i = 0, len = rs.length; i < len; i++){
            var r = rs[i], sel = dragRegion.intersect(r);
            if(sel && !r.selected){
                r.selected = true;
                view.select(i, true);
            }else if(!sel && r.selected){
                r.selected = false;
                view.deselect(i);
            }
        }
    }

    function onEnd(e){
        if(proxy){
            var isd = Ext.get('ds').select('*').getCount();             // хрень для нахождения элементов
            //var X=Ext.get('ds').select('*').item(t).getX();
            //var Y = Ext.get('ds').select('*').item(t).getY();
            var kx=0;
            var m = {color:'#f01717'}
            var kxy = 0;
             var earth = new Array(isd);
            for(var t=1;t<isd;t++){earth[t]=false}; 
            for(var t=1;t<isd;t++){
                var Xs=Ext.get('ds').select('*').item(t).getX();
                 var Ys = Ext.get('ds').select('*').item(t).getY();
                 
                    if(Xs>=dragRegion.left&&Xs<=dragRegion.right){
                        if(Ys>=dragRegion.top&&Ys<=dragRegion.bottom){kxy++;earth[t]=true}
                        }}
                    
    
            alert('you selected ===>   '+kxy+"elements");
            
            proxy.setDisplayed(false);
        }
    }
           
    function onRender(view){
       tracker = new Ext.dd.DragTracker({
         onBeforeStart: onBeforeStart,
           onStart: onStart,
         onDrag: onDrag,
    onEnd :onEnd
        
                
             
             
        });
        
        //tre= new Ext.dd.DragTracker({onEnd:onEnd});
        //tre.initEl(view.el);
        tracker.initEl(view.el);
    }
};

    var store = new Ext.data.JsonStore({
        url: 'get-images.php', // тут идет откр. файла с помощю php и передает сайт как строку
        root: 'images',
        fields: ['HTML']
    });
    store.load();

    var tpl = new Ext.XTemplate(              загрузка  строки
        '<tpl for=".">',
          
            '<div id="ds" class="thumb-wrap">',
            '{HTML}',   //загрузка  строки
            '</div>',
            
        '</tpl>'
       
    );
 var view =  new Ext.DataView({ // тут собирается  плагин  и сам сайт,его HTML версия,
            store: store,
            tpl: tpl,
            autoHeight:true,
   
         multiSelect: true,
            overClass:'x-view-over',
          itemSelector:'div.thumb-wrap',
            emptyText: 'No images to display',
            plugins: 
                new Ext.DataView.DragSelector(),
           listeners: {
             selectionchange: {
                 fn: function(dv,nodes){
                     var l = nodes.length;
                     var s = l != 1 ? 's' : '';
                     panel.setTitle('Simple DataView ('+l+' item'+s+' selected)');
                 }
             }
            }
        })
   
  Ext.QuickTips.init();
            var form1 = new Ext.ux.GoodForm({  // тут я попробывал создать новую чуть расширенную панель с кнопками
        id:'images-view',
        renderTo:'form1',
        frame:true,
        width:535,
        title:'Simple DataView (0 items selected)',
        items:view
                                            });
            
            

            
    


 

});

sand123 08.06.2010 14:25

Ну, все что приходит в голову по поводу сайт в панель - это использование плагина http://www.extjs.com/forum/showthrea...agedIFrame-2.x
Из названия, в принципе, следует его суть. Есть необходимые события состояния загрузки, методы для работы с документом во фрейме. Ну, и почему версия 2.2? Есть ограничения?

Golizart 11.06.2010 03:50

аспирант дала 2.2 версию ,сказала, юзай и принеси вот такой результат!!
я голову себе вынес! мало того что я не знаю, точнее раньше не знал ,скрипты! так еще и библиотека EXT

Golizart 11.06.2010 03:51

Я понял этот Frame работает только с 3.1 и выше версиями!??

Kolyaj 11.06.2010 10:10

Цитата:

Сообщение от Golizart
Я понял этот Frame работает только с 3.1 и выше версиями!??

Возьми третью версию, аспирант и не поймёт. Хотя для второй версии этот плагин тоже был.

Golizart 12.06.2010 15:26

акей !!! пасиба

Golizart 15.06.2010 17:55

frame с XML документами работает????

Kolyaj 15.06.2010 19:37

Если браузер работает, то и фрейм работает.

Golizart 16.06.2010 00:42

Спасибо за помощь!!!! С селктором поможете, как он работает??, с английским проблема, читал на форуме не понял!!

Golizart 16.06.2010 00:44

я структуру понял!! вот только не пойму,что передается ему и как он начинает работать?


Часовой пояс GMT +3, время: 16:44.