import { __decorate, __extends, __values } from "tslib";
import { Component, Input, ChangeDetectionStrategy } from '@angular/core';
import { SharedService } from '../../../../shared/service/shared.service';
import { DomSanitizer } from '@angular/platform-browser';
import { QuizService } from '../../../../shared/service/quiz.service';
import { SummaryBase } from '../summary-base';
var GraphicOptionSummaryComponent = /** @class */ (function (_super) {
    __extends(GraphicOptionSummaryComponent, _super);
    function GraphicOptionSummaryComponent(quizService, sharedService, _DomSanitizationService) {
        var _this = _super.call(this, sharedService) || this;
        _this.quizService = quizService;
        _this.sharedService = sharedService;
        _this._DomSanitizationService = _DomSanitizationService;
        return _this;
    }
    GraphicOptionSummaryComponent.prototype.ngOnChanges = function (changes) {
        if (this.question) {
            this.getAnswers();
        }
    };
    GraphicOptionSummaryComponent.prototype.ngOnInit = function () {
        this.isOnlineEngine = this.quizService.isOnline;
        this.convertedTime = this.convertTime2(this.question.questionTimeSpent, 'time');
    };
    GraphicOptionSummaryComponent.prototype.getAnswers = function () {
        var e_1, _a;
        this.correctAnswer = '';
        this.selectedAnswer = '';
        this.question.selectedAnswer = [];
        this.question.rationale = '';
        this.question.correct = false;
        var correctIds = [];
        var selectedIds = [];
        if (this.question) {
            try {
                for (var _b = __values(this.question.choiceInteraction.simpleChoices), _c = _b.next(); !_c.done; _c = _b.next()) {
                    var choice = _c.value;
                    if (choice.correct === true) {
                        correctIds.push(choice.choiceId);
                        this.correctAnswer = choice.value;
                    }
                    if (this.question.userResponse.indexOf(choice.choiceId) !== -1) {
                        selectedIds.push(choice.choiceId);
                        this.selectedAnswer = choice.value;
                    }
                }
            }
            catch (e_1_1) { e_1 = { error: e_1_1 }; }
            finally {
                try {
                    if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
                }
                finally { if (e_1) throw e_1.error; }
            }
            if (correctIds === selectedIds) {
                this.question.correct = true;
            }
        }
        return true;
    };
    GraphicOptionSummaryComponent.prototype.loadImagePath = function (assetType, slide) {
        if (this.quizService.isOnline) {
            return slide.assetPath;
        }
        return this._DomSanitizationService.bypassSecurityTrustUrl(this.splitStringForType(assetType, slide.assetName) + slide.assetsContent);
    };
    GraphicOptionSummaryComponent.ctorParameters = function () { return [
        { type: QuizService },
        { type: SharedService },
        { type: DomSanitizer }
    ]; };
    __decorate([
        Input('summaryData')
    ], GraphicOptionSummaryComponent.prototype, "question", void 0);
    GraphicOptionSummaryComponent = __decorate([
        Component({
            selector: 'lib-graphic-option-summary',
            template: "<ng-container *ngIf=\"question.itemType == 23\">\n  <div class=\"wk-row\">\n    <media-carousel\n      [imagePath]=\"question.assets[0].assetPath\"\n      [assetData]=\"question.assets\"\n      [assetsPosition]=\"question.assetsPosition\"\n      *ngIf=\"\n        question &&\n        question.assets &&\n        question.assets.length != 0 &&\n        question.assets != undefined &&\n        question.assetsPosition != AssetPositionValuesEnum.withInText &&\n        question.assetsPosition != AssetPositionValuesEnum.bottom\n      \"\n    ></media-carousel>\n\n    <div\n      [ngClass]=\"{\n        'wk-col-8 asset-left-width66':\n          question &&\n          question.assets != undefined &&\n          question.assets.length != 0 &&\n          question.assetsPosition != AssetPositionValuesEnum.withInText,\n        'wk-col-12':\n          (question && question.assets == undefined) ||\n          (question && question.assets.length == 0) ||\n          (question &&\n            question.assetsPosition == AssetPositionValuesEnum.withInText),\n        'right-assets-position-question':\n          question &&\n          question.assets != undefined &&\n          question.assets.length != 0 &&\n          question.assetsPosition == AssetPositionValuesEnum.right,\n        'left-assets-position-question':\n          question &&\n          question.assets != undefined &&\n          question.assets.length != 0 &&\n          question.assetsPosition == AssetPositionValuesEnum.left,\n        'top-assets-position-question':\n          question &&\n          question.assets != undefined &&\n          question.assets.length != 0 &&\n          question.assetsPosition == AssetPositionValuesEnum.top,\n        'bottom-assets-position-question':\n          question &&\n          question.assets != undefined &&\n          question.assets.length != 0 &&\n          question.assetsPosition == AssetPositionValuesEnum.bottom\n      }\"\n    >\n      <div class=\"wkqp-layout-item summary4-mb0 common-full-width \">\n        <div class=\"wkqp-field-item summary5-mb0\">\n          <div class=\"wk-row gray-bg-result mb20\">\n            <div class=\"wk-col-8 responsive-pl15\">\n              <!--Question number-->\n              <span class=\"wkqb-question-number\">\n                <strong>{{ question.sequence }}</strong>\n              </span>\n\n              <!--Question prompt text-->\n              <span\n                class=\"qp-ts-number-right\"\n                *ngIf=\"\n                  question.assetsPosition != AssetPositionValuesEnum.withInText\n                \"\n              >\n                <strong class=\"wkqp-prewrap\">{{\n                  question.promptText\n                }}</strong></span\n              >\n              <span\n                *ngIf=\"\n                  question.assetsPosition == AssetPositionValuesEnum.withInText\n                \"\n              >\n                <item-text-assets\n                  [promptText]=\"question.promptText\"\n                  [assetData]=\"question.assets\"\n                  [assetsPosition]=\"AssetPositionValuesEnum.withInText\"\n                ></item-text-assets>\n              </span>\n            </div>\n            <media-carousel\n              [imagePath]=\"question.assets[0].assetPath\"\n              [assetData]=\"question.assets\"\n              [assetsPosition]=\"question.assetsPosition\"\n              *ngIf=\"\n                question &&\n                question.assets &&\n                question.assets.length != 0 &&\n                question.assets != undefined &&\n                question.assetsPosition != AssetPositionValuesEnum.withInText &&\n                question.assetsPosition == AssetPositionValuesEnum.bottom\n              \"\n            ></media-carousel>\n            <!--Question Time spent-->\n            <div class=\"wk-col-4 responsive-timespent time-qu-pt-remove\">\n              <span\n                class=\"que-mob-left mr10\"\n                [ngClass]=\"getQuestionProgressClass(question)\"\n              ></span>\n              <span\n                class=\"wkqp-badge time-mob-right\"\n                [ngClass]=\"getOvertimelimitClass(question)\"\n              >\n                Time spent -\n                {{ convertedTime }}\n              </span>\n            </div>\n          </div>\n        </div>\n\n        <div class=\"common-full-width mb20\">\n          <div class=\"wkqp-col-12\">\n            <div class=\"mb20  \">\n              <div class=\"wkqp-field-item summary5-mb0\">\n                <div\n                  *ngIf=\"\n                    question.userResponse[0] && question.userResponse.length > 0\n                  \"\n                >\n                  <!--Your Response-->\n                  <p\n                    [ngClass]=\"getSelectedResponseClass(question)\"\n                    class=\"response-mb20\"\n                  >\n                    <strong>Your Response: </strong>\n                  </p>\n                  <div class=\"go-summary-answer media-width400\">\n                    <img\n                      [src]=\"loadImagePath('image', selectedAnswer)\"\n                      *ngIf=\"selectedAnswer.assetTypeId == 1\"\n                      class=\"item-prev-img55\"\n                      width=\"300px\"\n                    />\n\n                    <video\n                      title=\"{{ selectedAnswer.altTitle }}\"\n                      name=\"previewVideo\"\n                      id=\"previewVideo\"\n                      width=\"400px\"\n                      *ngIf=\"selectedAnswer.assetTypeId == 3\"\n                    >\n                      <source [src]=\"loadImagePath('video', selectedAnswer)\" />\n                      <source\n                        [src]=\"loadImagePath('video', selectedAnswer)\"\n                        type='video/mp4; codecs=\"avc1.42E01E, mp4a.40.2\"'\n                      />\n                      <source\n                        [src]=\"loadImagePath('video', selectedAnswer)\"\n                        type='video/ogg; codecs=\"theora, vorbis\"'\n                      />\n                    </video>\n                    <app-media-controls\n                      *ngIf=\"selectedAnswer.assetTypeId == 3\"\n                      [assetId]=\"selectedAnswer.assetId\"\n                      [assetType]=\"'video'\"\n                    ></app-media-controls>\n                    <audio\n                      title=\"{{ selectedAnswer.altTitle }}\"\n                      *ngIf=\"selectedAnswer.assetTypeId == 2\"\n                      name=\"previewAudio\"\n                      id=\"previewAudio\"\n                      [src]=\"loadImagePath('image', selectedAnswer)\"\n                    ></audio>\n                    <app-media-controls\n                      *ngIf=\"selectedAnswer.assetTypeId == 2\"\n                      [assetId]=\"selectedAnswer.assetId\"\n                      [assetType]=\"'audio'\"\n                    ></app-media-controls>\n                    <wkqp-download-transcript\n                      *ngIf=\"isOnlineEngine && selectedAnswer.transcript\"\n                      [slideData]=\"selectedAnswer\"\n                    >\n                    </wkqp-download-transcript>\n                    <div\n                      class=\"img-go-enlarge-text\"\n                      *ngIf=\"selectedAnswer.assetTypeId == 1\"\n                    >\n                      <span class=\"graphic-img-text\"\n                        >Click on image to enlarge.</span\n                      >\n                    </div>\n                  </div>\n\n                  <!--Correct Response-->\n                  <div\n                    class=\"correct-response-width\"\n                    *ngIf=\"question.isCorrect != 1\"\n                  >\n                    <p\n                      *ngIf=\"!question.correct\"\n                      class=\"wkqp-alert-success wkqp-success mb20\"\n                    >\n                      <strong>Correct Response: </strong>\n                    </p>\n                    <div\n                      ng-show=\"question.correct == false\"\n                      class=\"go-summary-answer wk-row\"\n                    >\n                      <img\n                        [src]=\"loadImagePath('image', correctAnswer)\"\n                        *ngIf=\"correctAnswer.assetTypeId == 1\"\n                        class=\"item-prev-img55\"\n                        width=\"300px\"\n                      />\n\n                      <video\n                        title=\"{{ correctAnswer.altTitle }}\"\n                        name=\"previewVideo\"\n                        id=\"previewVideo\"\n                        width=\"400px\"\n                        *ngIf=\"correctAnswer.assetTypeId == 3\"\n                      >\n                        <source [src]=\"loadImagePath('video', correctAnswer)\" />\n                        <source\n                          [src]=\"loadImagePath('video', correctAnswer)\"\n                          type='video/mp4; codecs=\"avc1.42E01E, mp4a.40.2\"'\n                        />\n                        <source\n                          [src]=\"loadImagePath('video', correctAnswer)\"\n                          type='video/ogg; codecs=\"theora, vorbis\"'\n                        />\n                      </video>\n                      <app-media-controls\n                        *ngIf=\"correctAnswer.assetTypeId == 3\"\n                        [assetId]=\"correctAnswer.assetId\"\n                        [assetType]=\"'video'\"\n                      ></app-media-controls>\n                      <audio\n                        title=\"{{ correctAnswer.altTitle }}\"\n                        *ngIf=\"correctAnswer.assetTypeId == 2\"\n                        name=\"previewAudio\"\n                        id=\"previewAudio\"\n                        [src]=\"loadImagePath('image', correctAnswer)\"\n                      ></audio>\n                      <app-media-controls\n                        *ngIf=\"correctAnswer.assetTypeId == 2\"\n                        [assetId]=\"correctAnswer.assetId\"\n                        [assetType]=\"'audio'\"\n                      ></app-media-controls>\n                      <wkqp-download-transcript\n                        *ngIf=\"isOnlineEngine && correctAnswer.transcript\"\n                        [slideData]=\"correctAnswer\"\n                      >\n                      </wkqp-download-transcript>\n                      <div\n                        class=\"img-go-enlarge-text\"\n                        *ngIf=\"correctAnswer.assetTypeId == 1\"\n                      >\n                        <span class=\"graphic-img-text\"\n                          >Click on image to enlarge.</span\n                        >\n                      </div>\n                    </div>\n                  </div>\n                </div>\n\n                <!--Unattempted response-->\n                <div *ngIf=\"!question.userResponse[0]\">\n                  <p class=\"wkqp-alert-danger\">\n                    <strong>You did not answer this question</strong>\n                  </p>\n                </div>\n              </div>\n            </div>\n          </div>\n        </div>\n      </div>\n    </div>\n    <div class=\"common-full-width mb20\">\n      <!--Rationale-->\n      <lib-rationale [itemData]=\"question.modelFeedback\"></lib-rationale>\n      <!-- remediation -->\n      <lib-remediation [itemData]=\"question.remediationLinks\"></lib-remediation>\n    </div>\n  </div>\n</ng-container>\n",
            changeDetection: ChangeDetectionStrategy.OnPush,
            styles: [".go-summary-answer .media-controls{float:left;width:500px;background-color:var(--primary-color);padding:10px;clear:both}.go-summary-answer video#previewVideo,audio#previewAudio{float:left;clear:both;width:500px}.go-summary-answer .download-transcript{font-size:13px;padding-left:0}.item-prev-img55{border:1px solid #ccc}.media-width400{width:400px;margin-left:0;margin-right:0}.correct-response-width{float:left;width:100%}"]
        })
    ], GraphicOptionSummaryComponent);
    return GraphicOptionSummaryComponent;
}(SummaryBase));
export { GraphicOptionSummaryComponent };
//# sourceMappingURL=data:application/json;base64, 