WIP PWA for Grain
feat: pass current photo focus to comment sheet in gallery detail
+16
-1
+16
-1
src/components/pages/grain-gallery-detail.js
+16
-1
src/components/pages/grain-gallery-detail.js
···
52
52
_error: { state: true },
53
53
_menuOpen: { state: true },
54
54
_deleting: { state: true },
55
-
_commentSheetOpen: { state: true }
55
+
_commentSheetOpen: { state: true },
56
+
_focusPhotoUri: { state: true },
57
+
_focusPhotoUrl: { state: true }
56
58
};
57
59
58
60
static styles = css`
···
139
141
this._menuOpen = false;
140
142
this._deleting = false;
141
143
this._commentSheetOpen = false;
144
+
this._focusPhotoUri = null;
145
+
this._focusPhotoUrl = null;
142
146
}
143
147
144
148
connectedCallback() {
···
262
266
}));
263
267
return;
264
268
}
269
+
270
+
// Get current photo from carousel
271
+
const carousel = this.shadowRoot.querySelector('grain-image-carousel');
272
+
const currentPhoto = carousel?.getCurrentPhoto();
273
+
274
+
this._focusPhotoUri = currentPhoto?.uri || null;
275
+
this._focusPhotoUrl = currentPhoto?.url || null;
265
276
this._commentSheetOpen = true;
266
277
}
267
278
268
279
#handleCommentSheetClose() {
269
280
this._commentSheetOpen = false;
281
+
this._focusPhotoUri = null;
282
+
this._focusPhotoUrl = null;
270
283
}
271
284
272
285
#formatDate(iso) {
···
402
415
<grain-comment-sheet
403
416
?open=${this._commentSheetOpen}
404
417
galleryUri=${this._gallery?.uri || ''}
418
+
focusPhotoUri=${this._focusPhotoUri || ''}
419
+
focusPhotoUrl=${this._focusPhotoUrl || ''}
405
420
@close=${this.#handleCommentSheetClose}
406
421
></grain-comment-sheet>
407
422
</grain-feed-layout>