[{"__symbolic":"module","version":4,"metadata":{"PhotoGalleryFileInfoComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":5,"character":1},"arguments":[{"selector":"app-photo-gallery-file-info","template":"\n    <div class=\"slider\" *ngIf=\"slides.length > 0\">\n      <div class=\"card\">\n        <div class=\"image-container\">\n          <div class=\"previous\">\n            <i class=\"fa fa-angle-left\" (click)=\"previous()\"></i>\n          </div>\n          <div class=\"next\">\n            <i class=\"fa fa-angle-right\" (click)=\"next()\"></i>\n          </div>\n          <img [src]=\"slides[currentIndex].path\" class=\"fade image-selected\" />\n          <button type=\"button\" class=\"delete-button\" (click)=\"deleteFile(slides[currentIndex], currentIndex)\">\n            <i class=\"fa fa-trash\"></i>\n          </button>\n        </div>\n\n        <!-- Información -->\n        <div class=\"slide-info\">\n          <h3>{{ slides[currentIndex].name }}</h3>\n          <p>{{ slides[currentIndex].description }}</p>\n        </div>\n      </div>\n    </div>\n\n    <div class=\"dotsContainer\">\n      <div *ngFor=\"let slide of slides; let i = index\" class=\"dot\" (click)=\"goTo(i)\">\n        <i class=\"fa fa-square\" [ngClass]=\"{ 'selected': currentIndex === i }\"></i>\n      </div>\n    </div>\n  ","styles":["\n    .slider {\n      display: flex;\n      justify-content: center;\n      position: relative;\n      margin: auto;\n    }\n\n    .card {\n      width: fit-content;\n      max-width: 45vw;\n      border-radius: 15px;\n      box-shadow: 0 6px 12px #757575;\n      overflow: hidden;\n      display: flex;\n      flex-direction: column;\n    }\n\n    .image-container {\n      position: relative;\n      width: 100%;\n      height: 60vh;\n      overflow: hidden;\n\n      img {\n        width: 100%;\n        height: 100%;\n        object-fit: cover;\n        border-radius: 0;\n      }\n\n      .previous,\n      .next {\n        position: absolute;\n        top: 50%;\n        transform: translate(0, -50%);\n        z-index: 1;\n        cursor: pointer;\n        font-size: 45px;\n        color: #757575;\n        transition: color 0.3s linear !important;\n      }\n\n      .previous {\n        left: 16px;\n      }\n\n      .next {\n        right: 16px;\n      }\n\n      .previous:hover,\n      .next:hover {\n        color: #ffff00;\n      }\n\n      .delete-button {\n        position: absolute;\n        top: 8px;\n        right: 8px;\n        background: rgba(255, 0, 0, 0.75);\n        border: none;\n        color: white;\n        border-radius: 50%;\n        width: 30px;\n        height: 30px;\n        cursor: pointer;\n        z-index: 2;\n        display: flex;\n        justify-content: center;\n        align-items: center;\n        padding: 0;\n\n        i {\n          font-size: 16px;\n        }\n      }\n    }\n\n    .slide-info {\n      padding: 10px 15px;\n      background-color: #f9f9f9;\n      text-align: left;\n\n      h3 {\n        font-size: 1.2rem;\n        font-weight: bold;\n        margin: 0.5rem 0;\n      }\n\n      p {\n        font-size: 1rem;\n        color: #666;\n        margin: 0;\n      }\n    }\n\n    .dotsContainer {\n      position: absolute;\n      right: 0;\n      left: 0;\n      margin-top: 0.5rem;\n      display: flex;\n      justify-content: center;\n      padding: 0;\n      margin-bottom: 1rem;\n    }\n\n    .dot {\n      margin: 0 3px;\n      cursor: pointer;\n    }\n\n    .fa-square {\n      font-size: 15px;\n      color: #757575;\n      transition: color 0.3s linear !important;\n    }\n\n    .selected,\n    .fa-square:hover {\n      color: #ffff00;\n    }\n\n    .fade {\n      opacity: 1;\n      animation-name: fade;\n      animation-duration: 1s;\n    }\n\n    @keyframes fade {\n      from {\n        opacity: 0.4;\n      }\n\n      to {\n        opacity: 1;\n      }\n    }\n  "]}]}],"members":{"slides":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":12,"character":3}}]}],"slideRemoved":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":13,"character":3}}]}],"deleteServiceUrl":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":14,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef","line":18,"character":25},{"__symbolic":"reference","module":"../file-select/file-select/file-select.service","name":"FileSelectService","line":18,"character":65},{"__symbolic":"reference","module":"@ngx-translate/core","name":"TranslateService","line":18,"character":103}]}],"previous":[{"__symbolic":"method"}],"next":[{"__symbolic":"method"}],"getCurrentSlideUrl":[{"__symbolic":"method"}],"goTo":[{"__symbolic":"method"}],"removeSlide":[{"__symbolic":"method"}],"deleteFile":[{"__symbolic":"method"}]}}}}]