Ext.define("App.view.WorkshopPhotoPanel", {
    extend: "Ext.form.Panel",
    xtype: "workshopPhotoPanel",
    params: {},
    scrollable: true,
    layout: 'vbox',

    refType: '',
    refId: -1,
    url: '',

    loadPanel: function(refId) {
        var me = this;
        me.refId = refId;
        Ext.Ajax.request({
            url: me.url,
            params: {
                refType: me.refType,
                refId: me.refId,
            },
            success: function(response, opts) {
                var result = Ext.decode(response.responseText);
                me.down('#imageContainer').removeAll(true);
                result.records.forEach(function(item, index, array) {
                   me.down('#imageContainer').add({
                       xtype: 'imagefield',
                       name: item.filename,
                       thumbnailPath: App.url("/file/thumbnail/"+item.id+"/"+item.skey+"/"+item.filename),
                       path: App.url("/file/dl/"+item.id+"/"+item.skey+"/"+item.filename),
                       imageWidth: item.imageWidth,
                       imageHeight: item.imageHeight,
                       fileId: item.id,
                       skey: item.skey,
                   });
                });
            },
            failure: function(response, opts) {
                App.showError('Message : ' + response.status);
            },
            scope: this
        });
    },
    printImage: function () {
        var me = this;
        var source = [];
        me.down('#imageContainer').items.items
            .forEach(function(item, index, array) {
                if (item.selected) {
                    source.push(item.path);
                }
            });
        App.printImage(source);
    },
    initComponent: function () {
        var me = this;

        Ext.apply(me, {
            items: [
                {
                    xtype: 'container',
                    layout: 'hbox',
                    width: '100%',
                    defaults: { margin: 4 },
                    items: [
                        {
                            xtype: 'label',
                            html: "<b>"+App.localeRes('Photo')+"</b>",
                            height: '100%',
                        },
                        {
                            xtype: 'container',
                            flex: 1,
                        },
                        {
                            xtype: 'button',
                            text: App.localeRes('Print'),
                            ui: 'soft-purple',
                            itemId: 'printBtn',
                            handler: function(button, event){
                               me.printImage();
                            }
                        },
                    ],
                },
                {
                    xtype: 'container',
                    itemId: 'imageContainer',
                    width: '100%',
                    flex: 1,
                    scrollable: true,
                    layout: {
                        type: 'column'
                    },
                }
            ]
        });
        me.callParent(arguments);
    }
})