import jQ from "jquery";
import BaseComponent from "../../../base-component";
import Breadcrumb from "./breadcrumb";
import Settings from "../../../../helpers/settings";
import Labels from "../../../../helpers/labels";
import Class from "../../../../helpers/class";
import Utils from "../../../../helpers/utils";
import Globals from "../../../../helpers/globals";
/**
* Page collection info <br />
* Request to Shopify API to get the information of a Collection
* to build collection Title, collection Description, Breadcrumb and Document info
* @extends BaseComponent
*/
class PageInfoCollection extends BaseComponent {
/**
* @constructs
*/
constructor() {
super();
this.data = null;
this.defaultCollectionData = {
collection: {
description: '',
handle: Settings.getSettingValue('general.collection_handle'),
title: Labels.collectionAll
}
};
this.collectionData = {};
this.$collectionHeader = jQ('.' + Class.collectionHeader);
this.$collectionDescription = jQ('.' + Class.collectionDescription);
this.$collectionImage = jQ('.' + Class.collectionImage);
}
init() {
this.breadcrumb = new Breadcrumb();
this.addComponent(this.breadcrumb);
}
/**
* Return whether on not the Collection page info in rendered
*/
isRender() {
return !!this.data && this.parent.eventType == 'collection';
}
render() {
var pathName = window.location.pathname;
if (pathName && pathName != '/') {
// Collection "All" page
if (pathName == '/collections/all') {
this.collectionData = this.defaultCollectionData;
} else if(Utils.isVendorPage() || Utils.isTypePage()) {
this.collectionData = {
collection: {
description: '',
handle: '',
title: Utils.getSearchTerm()
}
}
} else {
// All remaining pages, except Search page
if (!Utils.isSearchPage()) {
var collectionUrl = Utils.getWindowLocation().href.split('?')[0] + '?view=desc';
jQ.ajax({
method: 'GET',
url: collectionUrl,
dataType: 'json',
success: this._onGetCollectionDataSuccess.bind(this),
error: this._onGetCollectionDataError.bind(this),
});
}
}
// Build collection info
this._buildPageInfo();
}
}
/**
* Set data for the Collection page info
* @param {Object} data - The filter result data
*/
setData(data) {
if (data) {
this.data = data;
}
}
_buildPageInfo() {
// Build breadcrumbs
if (this.breadcrumb) {
this.breadcrumb.buildBreadcrumb();
}
// Build Collection information (Title, Description,...)
this.buildCollectionDetail();
// Build Document information (window.document)
this.buildDocumentInfo();
}
/**
* Build the collection detail
*/
buildCollectionDetail() {
if (typeof this.collectionData !== 'undefined' && this.collectionData.hasOwnProperty('collection')) {
// Get collection info
var collectionInfo = this.collectionData.collection;
var title = collectionInfo.hasOwnProperty('title') && collectionInfo.title != '' ? collectionInfo.title : null;
var description = collectionInfo.hasOwnProperty('description') && collectionInfo.description != '' ? collectionInfo.description : null;
var image = collectionInfo.hasOwnProperty('image') && collectionInfo.image && collectionInfo.image.src ? collectionInfo.image.src : null;
// Build Collection Title
if (title) {
this.$collectionHeader.html(title).show();
} else {
this.$collectionHeader.hide();
}
// Build Collection Description
if (description) {
this.$collectionDescription.html(description).show();
} else {
this.$collectionDescription.hide();
}
// Build Collection Image
if (image) {
this.$collectionImage.attr('src', image).css('background-image', 'url(' + image + ')')
.removeClass(Class.collectionNoImage)
.addClass(Class.collectionHasImage);
} else {
this.$collectionImage.attr('src', '').css('background-image', 'none')
.removeClass(Class.collectionHasImage)
.addClass(Class.collectionNoImage);
}
}
}
/**
* Build Document information (window.document)
*/
buildDocumentInfo() {
if (typeof this.collectionData !== 'undefined' && this.collectionData.hasOwnProperty('collection')) {
var pageTitle = this.collectionData.collection.title + ' - ' + Globals.shopName;
document.title = pageTitle;
}
}
/**
* Bind the success event for Ajax - get collection infomation
* @param {Object} collectionData - The collection data (title, handle, description)
*/
_onGetCollectionDataSuccess(collectionData) {
this.collectionData = collectionData;
this._buildPageInfo();
}
/**
* Bind the error event for Ajax - get collection infomation
*/
_onGetCollectionDataError() {
this.collectionData = this.defaultCollectionData;
this._buildPageInfo();
}
}
export default PageInfoCollection;