Display Category text before all products are listed

Questions around the TYPO3 integration and plugins
Forum rules
Always add your TYPO3, Aimeos and PHP version as well as your environment (Linux/Mac/Win)
Spam and unrelated posts will be removed immediately!
rowild

Display Category text before all products are listed

Post by rowild » 25 Aug 2020, 10:55

I would like to display a "Category description" text before all the products of that specific category are displayed.

I am currently thinking of doing this by getting the first product of a catalog and retrieving the text items from its "catalog" domain. All of that would happen in 'common/partials/product-standard.php' before the foreach loop there.

I assume there is nothing like a first() method available on the product manager? (I know of "getItem", but I do not know the $id, which, according to the documentation (https://aimeos.org/docs/Developers/Libr ... s#Get_item) is required for that)? I tried these things, but without success:

Code: Select all

$firstProduct = $this->get( 'products', [] )->first();

$firstProduct = $this->first( 'products', [] );

$firstProduct = $this->first( 'products', [] )[0];
What do I have to do to get the first product of a catalog?


EDIT:
After playing around, I ended up with this:
(Is "$this" a map like described here? https://github.com/aimeos/map)

Code: Select all

	$allProducts = $this->get( 'products', [] );
	$firstItem = $allProducts->first();

	foreach( $firstItem->getCatalogItems() as $catalogItem ) : ?>

		<h3 class="px-0 mx-0"><?= $enc->html( $catalogItem->getName() ); ?></h3>

		<?php foreach( $catalogItem->getRefItems( 'text', 'long', 'default' ) as $textItem ) : ?>
			<div class="text-item" itemprop="description">
				<?= $enc->html( $textItem->getContent(), $enc::TRUST ); ?>
			</div>
		<?php endforeach; ?>

	<?php endforeach; ?>
The "name" is recognised, but not the "catalog" domain. What am I doing wrong?
The TypoScript is this one:

Code: Select all

// Catalog
catalog {
	// Domains directly on catalog? Found so in docu...
	domains {
		0 = attribute
		1 = media
		2 = price
		3 = product
		4 = text
		5 = supplier
		6 = catalog
	}
         lists {
              basket-add = 1
              domains {
                  0 = attribute
                  1 = media
                  2 = price
                  3 = product
                  4 = text
                  5 = supplier
                  6 = catalog
              }
              stock.enable = 1
              metatags = 0
         }

User avatar
aimeos
Administrator
Posts: 7881
Joined: 01 Jan 1970, 00:00

Re: Display Category text before all products are listed

Post by aimeos » 26 Aug 2020, 07:02

If you display a specific category, the easiest way is to use the category directly in the catalog list view:

Code: Select all

<?php if( $catItem = $this->listCatPath->last() ) : ?>
	<?php foreach( $catItem->getRefItems( 'text', 'long', 'default' ) as $textItem ) : ?>
		<p class="cattext"><?= $enc->html( $textItem->getContent() ) ?></p>
	<?php endforeach ?>
<?php endif ?>
Professional support and custom implementation are available at Aimeos.com
If you like Aimeos, Image give us a star

rowild

Re: Display Category text before all products are listed

Post by rowild » 26 Aug 2020, 08:30

Thank you, this worked fine!

Does aimeos provide a "global" modal function that would enable me to display that category description text in the same manner as the basket pops up in a lightbox, once a product is added? Or do you recommend to create my own modal script for that?

User avatar
aimeos
Administrator
Posts: 7881
Joined: 01 Jan 1970, 00:00

Re: Display Category text before all products are listed

Post by aimeos » 26 Aug 2020, 08:36

There are a few JS helper functions available to create the overlay, the content container and the spinner if you have to load some data from the server: https://github.com/aimeos/ai-client-htm ... js#L18-L97
Professional support and custom implementation are available at Aimeos.com
If you like Aimeos, Image give us a star

rowild

Re: Display Category text before all products are listed

Post by rowild » 26 Aug 2020, 09:49

Thank you very much!

rowild

Re: Display Category text before all products are listed

Post by rowild » 27 Aug 2020, 17:09

I can manage to create a modal / lightbox with the content of the category text saved within a hidden/clipped div (that expands to a modal).

What would I have to do to fetch that very category text content via ajax and open it in a modal? Do I have to implement the jsonapi for that? Or is there another way?

User avatar
aimeos
Administrator
Posts: 7881
Joined: 01 Jan 1970, 00:00

Re: Display Category text before all products are listed

Post by aimeos » 28 Aug 2020, 11:16

You can use the JSON API or you can add the text to the HTML as attribute and hand that over to the JS functions.
Professional support and custom implementation are available at Aimeos.com
If you like Aimeos, Image give us a star

rowild

Re: Display Category text before all products are listed

Post by rowild » 02 Sep 2020, 10:20

I decided to go with the very exciting jsonapi that you provide with aimeos!

2 questions come up:

1. I would like to retrieve the supplier info of a specific product (id: 12) with eventually this JS:

Code: Select all

// Aimeos JSON Api
var url = 'http://typo3-9-comp.oaa.lokal/shop/jsonapi'; // Base URL from config
var promise = $.ajax(url, { method: "OPTIONS", dataType: "json" });

// This part will be put in a function, for now it is static and calls the product with id: 12
promise.done(function(options) {
    // Taken from the docu
	var params = { 'resource': 'product', 'id': '12', 'include': 'supplier' };
    // TYPO3 uses "ai" as prefix
	if( options.meta.prefix ) {
		params[options.meta.prefix] = params;
	}
	console.log('params =', params);
	var result = $.ajax({
		method: "GET",
		dataType: "json",
		url: options.meta.resources['product'],
		data: params
	});
	result.done(function(result) {
		console.log("product resource result:", result.data);
	});
});
This leads to an error:

Code: Select all

jquery.min.js?1576264258:2 Uncaught RangeError: Maximum call stack size exceeded . The console.log shows and endless nesting of the ai parameter.
However, it does work, if I rewrite the code like this (and this one also makes much more sense to me):

Code: Select all

var paramsObj = { 'resource': 'product', 'id': '12', 'include': 'supplier' };
var params = {}

if( options.meta.prefix ) {
	params[options.meta.prefix] = paramsObj
} else {
    params = paramsObj
}
Do I misunderstand the docu? Or could the docu be wrong?
https://aimeos.org/docs/2020.x/frontend/jsonapi/


2. Is there a way to immediately retrieve the text domain of the found suppliers on the first call to the API? Or is it necessary to do another API call with the found supplier ids?

Post Reply