Skip to content
Merged
Show file tree
Hide file tree
Changes from 1 commit
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Next Next commit
Append drawer child
  • Loading branch information
processprocess committed Nov 18, 2021
commit 6c092af06439d4fc220d0d0e34d983587ac42e3f
4 changes: 2 additions & 2 deletions examples/amp-story/amp-story-shopping.html
Original file line number Diff line number Diff line change
Expand Up @@ -45,7 +45,7 @@
<amp-story-shopping-tag data-tag-id="sunglasses" ></amp-story-shopping-tag>
<amp-story-shopping-tag data-tag-id="backpack" ></amp-story-shopping-tag>
</amp-story-grid-layer>
<amp-story-shopping-attachment layout="nodisplay"></amp-story-shopping-attachment>
<amp-story-shopping-attachment layout="fill"></amp-story-shopping-attachment>
</amp-story-page>
<amp-story-page id="remote-dark-theme">
<!--
Expand Down Expand Up @@ -77,7 +77,7 @@
<amp-story-shopping-tag data-tag-id="k-pop" ></amp-story-shopping-tag>
<amp-story-shopping-tag data-tag-id="eurodance" ></amp-story-shopping-tag>
</amp-story-grid-layer>
<amp-story-shopping-attachment layout="nodisplay" theme="dark"></amp-story-shopping-attachment>
<amp-story-shopping-attachment layout="fill" theme="dark"></amp-story-shopping-attachment>
</amp-story-page>
</amp-story>
</body>
Expand Down
43 changes: 27 additions & 16 deletions extensions/amp-story-shopping/0.1/amp-story-shopping-attachment.js
Original file line number Diff line number Diff line change
@@ -1,32 +1,43 @@
import {Layout_Enum, applyFillContent} from '#core/dom/layout';
import * as Preact from '#core/dom/jsx';
import {Layout_Enum} from '#core/dom/layout';
import {once} from '#core/types/function';

import {AmpStoryPageAttachment} from 'extensions/amp-story/1.0/amp-story-page-attachment';

const TAG = 'amp-story-shopping-attachment';

export class AmpStoryShoppingAttachment extends AmpStoryPageAttachment {
export class AmpStoryShoppingAttachment extends AMP.BaseElement {
/** @param {!AmpElement} element */
constructor(element) {
super(element);

/** @private {string} */
this.myText_ = TAG;
/** @private @return {extensions/amp-story/1.0/amp-story-page-attachment.js.AmpStoryPageAttachment} */
this.attachmentEl_ = null;

/** @private {?Element} */
this.container_ = null;
/**
* Caches a reference to the attachmnet's impl.
* @private @return {extensions/amp-story/1.0/amp-story-page-attachment.js.AmpStoryPageAttachment}
* */
this.getAttachmentImpl_ = once(() =>
customElements
.whenDefined('amp-story-page-attachment')
.then(() => this.attachmentEl_.getImpl())
);
}

/** @override */
buildCallback() {
super.buildCallback();
this.container_ = this.element.ownerDocument.createElement('div');
this.container_.textContent = this.myText_;
this.element.appendChild(this.container_);
applyFillContent(this.container_, /* replacedContent */ true);
this.attachmentEl_ = (
<amp-story-page-attachment layout="nodisplay"></amp-story-page-attachment>
);
this.element.appendChild(this.attachmentEl_);
}

/**
* @param {boolean=} shouldAnimate
*/
open(shouldAnimate = true) {
this.getAttachmentImpl_().then((impl) => impl.open(shouldAnimate));
}

/** @override */
isLayoutSupported(layout) {
return layout == Layout_Enum.NODISPLAY;
return layout == Layout_Enum.FILL;
}
}
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
import {createElementWithAttributes} from '#core/dom';
import {Layout_Enum} from '#core/dom/layout';
import {AmpStoryPageAttachment} from '../../../amp-story/1.0/amp-story-page-attachment';

import '../amp-story-shopping';

describes.realWin(
Expand All @@ -26,7 +27,7 @@ describes.realWin(
element = createElementWithAttributes(
win.document,
'amp-story-shopping-attachment',
{'layout': 'nodisplay'}
{'layout': 'fill'}
);
pageEl.appendChild(element);
win.document.body.appendChild(pageEl);
Expand All @@ -35,9 +36,7 @@ describes.realWin(
}

it('should build shopping attachment component', () => {
expect(() => shoppingAttachment.layoutCallback()).to.not.throw();
expect(shoppingAttachment.isLayoutSupported(Layout_Enum.NODISPLAY)).to.be
.true;
expect(() => shoppingAttachment.buildCallback()).to.not.throw();
});
}
);