"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var tslib_1 = require("tslib");
var React = require("react");
var DocumentCard_1 = require("office-ui-fabric-react/lib/DocumentCard");
var Image_1 = require("office-ui-fabric-react/lib/Image");
var Persona_1 = require("office-ui-fabric-react/lib/Persona");
var Checkbox_1 = require("office-ui-fabric-react/lib/Checkbox");
var Pickers_1 = require("office-ui-fabric-react/lib/Pickers");
require("./Picker.CustomResult.Example.scss");
var TestImages_1 = require("../../../common/TestImages");
var data = [
    {
        documentPreviewProps: {
            previewImages: [
                {
                    previewImageSrc: TestImages_1.TestImages.documentPreview,
                    iconSrc: TestImages_1.TestImages.iconPpt,
                    imageFit: Image_1.ImageFit.cover,
                    width: 318,
                    height: 196,
                    accentColor: '#ce4b1f'
                }
            ]
        },
        documentCardProps: {},
        documentActionsProps: {
            actions: [
                {
                    icon: 'Share', onClick: function (ev) {
                        console.log('You clicked the share action.');
                        ev.preventDefault();
                        ev.stopPropagation();
                    }
                },
                {
                    icon: 'Pin', onClick: function (ev) {
                        console.log('You clicked the pin action.');
                        ev.preventDefault();
                        ev.stopPropagation();
                    }
                },
                {
                    icon: 'Ringer', onClick: function (ev) {
                        console.log('You clicked the Ringer action.');
                        ev.preventDefault();
                        ev.stopPropagation();
                    }
                },
            ]
        },
        documentActivityProps: {
            activity: 'Created Feb 23, 2016',
            people: [
                { name: 'Kat Larrson', profileImageSrc: TestImages_1.TestImages.personaFemale },
                { name: 'Josh Hancock', profileImageSrc: '', initials: 'JH' },
                { name: 'Tina Dasani', profileImageSrc: TestImages_1.TestImages.personaFemale }
            ]
        },
        documentTitleProps: {
            title: 'Document1',
            shouldTruncate: true
        }
    },
    {
        documentPreviewProps: {
            previewImages: [
                {
                    previewImageSrc: TestImages_1.TestImages.documentPreview,
                    iconSrc: TestImages_1.TestImages.iconPpt,
                    imageFit: Image_1.ImageFit.cover,
                    width: 318,
                    height: 196,
                    accentColor: '#ce4b1f'
                }
            ]
        },
        documentCardProps: {},
        documentActionsProps: {
            actions: [
                {
                    icon: 'Share', onClick: function (ev) {
                        console.log('You clicked the share action.');
                        ev.preventDefault();
                        ev.stopPropagation();
                    }
                },
                {
                    icon: 'Pin', onClick: function (ev) {
                        console.log('You clicked the pin action.');
                        ev.preventDefault();
                        ev.stopPropagation();
                    }
                },
                {
                    icon: 'Ringer', onClick: function (ev) {
                        console.log('You clicked the Ringer action.');
                        ev.preventDefault();
                        ev.stopPropagation();
                    }
                },
            ]
        },
        documentActivityProps: {
            activity: 'Created Feb 23, 2016',
            people: [
                { name: 'Kat Larrson', profileImageSrc: TestImages_1.TestImages.personaFemale },
                { name: 'Josh Hancock', profileImageSrc: '', initials: 'JH' },
                { name: 'Tina Dasani', profileImageSrc: TestImages_1.TestImages.personaFemale }
            ]
        },
        documentTitleProps: {
            title: 'Document2',
            shouldTruncate: true
        }
    },
    {
        documentPreviewProps: {
            previewImages: [
                {
                    previewImageSrc: TestImages_1.TestImages.documentPreviewTwo,
                    iconSrc: TestImages_1.TestImages.iconPpt,
                    imageFit: Image_1.ImageFit.cover,
                    width: 318,
                    height: 196,
                    accentColor: '#ce4b1f'
                }
            ]
        },
        documentCardProps: {},
        documentActionsProps: {
            actions: [
                {
                    icon: 'Share', onClick: function (ev) {
                        console.log('You clicked the share action.');
                        ev.preventDefault();
                        ev.stopPropagation();
                    }
                },
                {
                    icon: 'Pin', onClick: function (ev) {
                        console.log('You clicked the pin action.');
                        ev.preventDefault();
                        ev.stopPropagation();
                    }
                },
                {
                    icon: 'Ringer', onClick: function (ev) {
                        console.log('You clicked the Ringer action.');
                        ev.preventDefault();
                        ev.stopPropagation();
                    }
                },
            ]
        },
        documentActivityProps: {
            activity: 'Created Feb 23, 2016',
            people: [
                { name: 'Kat Larrson', profileImageSrc: TestImages_1.TestImages.personaFemale },
                { name: 'Josh Hancock', profileImageSrc: '', initials: 'JH' },
                { name: 'Tina Dasani', profileImageSrc: TestImages_1.TestImages.personaFemale }
            ]
        },
        documentTitleProps: {
            title: 'Document3',
            shouldTruncate: true
        }
    },
    {
        documentPreviewProps: {
            previewImages: [
                {
                    previewImageSrc: TestImages_1.TestImages.documentPreviewThree,
                    iconSrc: TestImages_1.TestImages.iconPpt,
                    imageFit: Image_1.ImageFit.cover,
                    width: 318,
                    height: 196,
                    accentColor: '#ce4b1f'
                }
            ]
        },
        documentCardProps: {},
        documentActionsProps: {
            actions: [
                {
                    icon: 'Share', onClick: function (ev) {
                        console.log('You clicked the share action.');
                        ev.preventDefault();
                        ev.stopPropagation();
                    }
                },
                {
                    icon: 'Pin', onClick: function (ev) {
                        console.log('You clicked the pin action.');
                        ev.preventDefault();
                        ev.stopPropagation();
                    }
                },
                {
                    icon: 'Ringer', onClick: function (ev) {
                        console.log('You clicked the Ringer action.');
                        ev.preventDefault();
                        ev.stopPropagation();
                    }
                },
            ]
        },
        documentActivityProps: {
            activity: 'Created Feb 23, 2016',
            people: [
                { name: 'Kat Larrson', profileImageSrc: TestImages_1.TestImages.personaFemale },
                { name: 'Josh Hancock', profileImageSrc: '', initials: 'JH' },
                { name: 'Tina Dasani', profileImageSrc: TestImages_1.TestImages.personaFemale }
            ]
        },
        documentTitleProps: {
            title: 'Document4',
            shouldTruncate: true
        }
    }
];
exports.SuggestedDocumentItem = function (documentProps) {
    return (React.createElement("div", null,
        " ",
        documentProps.documentTitleProps && documentProps.documentTitleProps.title,
        " "));
};
exports.SuggestedBigItem = function (documentProps, itemProps) {
    var documentPreviewProps = documentProps.documentPreviewProps, documentTitleProps = documentProps.documentTitleProps;
    var onClick = itemProps.onClick;
    return (React.createElement(Persona_1.Persona, { imageUrl: documentPreviewProps && documentPreviewProps.previewImages[0].previewImageSrc, primaryText: documentTitleProps && documentTitleProps.title, size: Persona_1.PersonaSize.small }));
};
exports.SelectedDocumentItem = function (documentProps) {
    var _a = documentProps.item, documentActionsProps = _a.documentActionsProps, documentPreviewProps = _a.documentPreviewProps, documentActivityProps = _a.documentActivityProps, documentTitleProps = _a.documentTitleProps;
    var actions = [];
    if (documentActionsProps) {
        documentActionsProps.actions.forEach(function (action) { return actions.push(action); });
        actions.push({
            icon: 'Cancel', onClick: function (ev) {
                if (documentProps.onRemoveItem) {
                    documentProps.onRemoveItem();
                }
            }
        });
    }
    return (React.createElement(DocumentCard_1.DocumentCard, { onClick: function () { console.log('You clicked the card.'); } },
        React.createElement(DocumentCard_1.DocumentCardPreview, tslib_1.__assign({}, documentPreviewProps)),
        React.createElement(DocumentCard_1.DocumentCardLocation, { location: 'Marketing Documents', locationHref: 'http://microsoft.com', ariaLabel: 'Location, Marketing Documents' }),
        React.createElement(DocumentCard_1.DocumentCardTitle, tslib_1.__assign({}, documentTitleProps)),
        React.createElement(DocumentCard_1.DocumentCardActivity, tslib_1.__assign({}, documentActivityProps)),
        React.createElement(DocumentCard_1.DocumentCardActions, { actions: actions })));
};
var PickerCustomResultExample = (function (_super) {
    tslib_1.__extends(PickerCustomResultExample, _super);
    function PickerCustomResultExample() {
        var _this = _super.call(this) || this;
        _this._onFilterChanged = _this._onFilterChanged.bind(_this);
        _this.state = {
            isPickerDisabled: false
        };
        return _this;
    }
    PickerCustomResultExample.prototype.render = function () {
        return (React.createElement("div", null,
            React.createElement(Checkbox_1.Checkbox, { label: 'Disable Document Picker', checked: this.state.isPickerDisabled, onChange: this._onDisabledButtonClick.bind(this) }),
            React.createElement(DocumentPicker, { onRenderSuggestionsItem: exports.SuggestedBigItem, onResolveSuggestions: this._onFilterChanged, onRenderItem: exports.SelectedDocumentItem, getTextFromItem: function (props) { return props.documentTitleProps.title; }, pickerSuggestionsProps: {
                    suggestionsHeaderText: 'Suggested Documents',
                    noResultsFoundText: 'No Documents Found',
                    suggestionsItemClassName: 'ms-DocumentPicker-bigSuggestion'
                }, disabled: this.state.isPickerDisabled })));
    };
    PickerCustomResultExample.prototype._onDisabledButtonClick = function () {
        this.setState({
            isPickerDisabled: !this.state.isPickerDisabled
        });
    };
    PickerCustomResultExample.prototype._onFilterChanged = function (filterText, items) {
        var _this = this;
        return filterText ? data.filter(function (item) { return item.documentTitleProps && item.documentTitleProps.title.toLowerCase().indexOf(filterText.toLowerCase()) === 0; }).filter(function (item) { return !_this._listContainsDocument(item, items); }) : [];
    };
    PickerCustomResultExample.prototype._listContainsDocument = function (document, items) {
        if (!items || !items.length || items.length === 0) {
            return false;
        }
        var documentTitle = document.documentTitleProps && document.documentTitleProps.title;
        return items.filter(function (item) { return (item.documentTitleProps && item.documentTitleProps.title) === documentTitle; }).length > 0;
    };
    return PickerCustomResultExample;
}(React.Component));
exports.PickerCustomResultExample = PickerCustomResultExample;
var DocumentPicker = (function (_super) {
    tslib_1.__extends(DocumentPicker, _super);
    function DocumentPicker() {
        return _super !== null && _super.apply(this, arguments) || this;
    }
    return DocumentPicker;
}(Pickers_1.BasePickerListBelow));
exports.DocumentPicker = DocumentPicker;

//# sourceMappingURL=Picker.CustomResult.Example.js.map
