// JScript File

Ext.namespace('FinnKodeWeb');

FinnKodeWeb.PanelFlowView = function(config) {
    config = config || {};
    this.bookSection = config.bookSection;
    this.currentObjectId = 0;
    this.nextObjectId = -1;
    this.loadingObjectId = 0;

    var _defaultNavigated = false;
    var panel = this;

    var _tb = new Ext.Toolbar({
//        items: [
//            new Ext.Toolbar.Button({
//                icon: 'images/printer.png',
//                text: 'Utskrift av kapittel',
//                cls: 'x-btn-text-icon',
//                handler: function() {
//                    var iframe = new Ext.ux.ManagedIFrame.Window();
//                    iframe.getFrame().update(panel.body.dom.innerHtml);
//                    iframe.getWindow.print();
//                    iframe.getWindow.close();
//                }
//            })
//        ]
    });

    var _pathNavigator = new FinnKodeWeb.PathNavigatorToolbar({
        toolbar: _tb,
        bookSection: this.bookSection,
        listeners: {
            navigate: {
                fn: function(bookSectionId, objectId) {
                    if (bookSectionId != this.bookSection.BookSectionId || objectId != this.currentObjectId) {
                        NavigateTo(this.bookSection.BookId, bookSectionId, objectId);
                    }
                },
                scope: this
            }
        }
    });

    var onClickHandler = function(event, htmlEl, options) {
        var objectId = htmlEl.parentNode.id;
        this.currentObjectId = objectId;
        this.nextObjectId = objectId;
        this.loadingObjectId = objectId;
        NavigateTo(this.bookSection.BookId, this.bookSection.BookSectionId, objectId);
    };

    Ext.apply(config, {
        autoScroll: true,
        layout: 'fit',
        tbar: _tb,
        bodyStyle: { padding: '5px 5px 5px 5px' },
        listeners: {
            'render': {
                fn: function() {
                    this.body.addListener('click',
                        onClickHandler,
                        this,
                        {
                            delegate: '.kodenr'
                        }
                    );
                    this.body.addListener('click',
                        onClickHandler,
                        this,
                        {
                            delegate: '.gruppenr'
                        }
                    );
                },
                scope: this
            }
        },
        navigate: function(hashManager) {
            if (!hashManager || !hashManager.objectId) {
                return;
            }
            this.loadObject(hashManager.objectId);
            _pathNavigator.loadObjectPath(this.bookSection.BookId, this.bookSection.BookSectionId, hashManager.objectId);
        },
        navigateDefault: function() {
            if (!_defaultNavigated) {
                _defaultNavigated = true;
                this.loadObject(this.nextObjectId);
                this.addListener('activate', function() {
                    NavigateTo(this.bookSection.BookId, this.bookSection.BookSectionId, this.nextObjectId);
                }, this);
            }
        },
        updateHash: function(hashManager) {
            hashManager.bookSectionViewId = 'flow';
            hashManager.objectId = this.currentObjectId;
        },
        afterAppLoaded: function() {
            /*this.addListener('activate', function() {
            NavigateTo(this.bookSection.BookId, this.bookSection.BookSectionId, this.nextObjectId);
            }, this);*/
        },
        loadObject: function(objectId) {
            if (objectId == null) return;
            objectId = typeof (objectId) == "number" ? objectId.toString() : objectId;
            this.nextObjectId = objectId;
            if (this.currentObjectId != objectId && this.loadingObjectId != objectId) {
                if (this.isVisible()) {
                    this.loadingObjectId = objectId;
                    var domEl = Ext.getDom(this.nextObjectId);
                    if (domEl) {
                        // loading of document not neccessary - just scroll to element
                        this.currentObjectId = objectId;
                        var top = (Ext.fly(domEl).getOffsetsTo(this.body)[1]) + this.body.dom.scrollTop;
                        this.body.scrollTo('top', top - 25, true);
                        return;
                    }
                    MsgSvc.addMsg({
                        ShowMaskInfo: true,
                        MaskElement: this.body,
                        Category: 'FlowView',
                        Action: 'BeforeLoadObject',
                        Label: 'Laster ' + objectId,
                        TrackEvent: false
                    });

                    if (this.nextObjectId <= 0) {
                        // Load front page for book section
                        var updater = this.getUpdater();
                        if (!updater) return;
                        updater.update({
                            text: 'Laster forside...',
                            url: this.bookSection.Book.FrontPageUrl
                        });
                        this.loadingObjectId = this.nextObjectId;
                        this.currentObjectId = this.nextObjectId;
                        return;
                    }

                    var succeededCallback = function(result, userContext, methodName) {
                        if (result && userContext) {
                            MsgSvc.addMsg({
                                MaskElement: userContext.body,
                                Category: 'FlowView',
                                Action: 'AfterLoadObject',
                                Label: 'Lastet ' + userContext.nextObjectId,
                                TrackEvent: false
                            });
                            userContext.body.update(result);
                            var domEl = Ext.getDom(userContext.nextObjectId);
                            if (domEl) {
                                userContext.currentObjectId = objectId;
                                var top = (Ext.fly(domEl).getOffsetsTo(userContext.body)[1]) + userContext.body.dom.scrollTop;
                                userContext.body.scrollTo('top', top - 25, true);
                            }
                            else {
                                MsgSvc.addMsg({
                                    ShowAlertInfo: true,
                                    Category: 'FlowView',
                                    Action: 'AfterLoadObject',
                                    Label: 'Finner ikke objekt - ' + userContext.nextObjectId + ' - etter lasting',
                                    TrackEvent: false
                                });
                            }
                        }
                    };
                    var failedCallback = function(error, userContext, methodName) {
                        MsgSvc.addMsg({
                            ShowAlertInfo: true,
                            Category: 'FlowView',
                            Action: 'AfterLoadObject',
                            Label: userContext.nextObjectId,
                            TrackEvent: false
                        });
                    };

                    var bookId = this.bookSection.BookId;
                    var bookSectionId = this.bookSection.BookSectionId;
                    var userContext = this;
                    var cs = new finnkode.kith.no.icontentservice();
                    cs.GetHtmlContent(bookId, bookSectionId, objectId, succeededCallback, failedCallback, userContext);
                }
            }
            else {
                // Try scroll to object
                var domEl = Ext.getDom(this.currentObjectId);
                if (domEl) {
                    var top = (Ext.fly(domEl).getOffsetsTo(this.body)[1]) + this.body.dom.scrollTop;
                    this.body.scrollTo('top', top - 25, true);
                }
            }
        }
    });
    // Call parent (required)
    FinnKodeWeb.PanelFlowView.superclass.constructor.call(this, config);


};

Ext.extend(FinnKodeWeb.PanelFlowView, Ext.Panel);

Ext.reg('panelflowview', FinnKodeWeb.PanelFlowView);