Add ability to google recipe per-ingredient nutrient data

This commit is contained in:
Christopher C. Wells 2021-02-16 06:04:14 -08:00
parent 8ce5b82825
commit e356c56bf6
3 changed files with 46 additions and 18 deletions

View File

@ -36,6 +36,7 @@ class IngredientAmountSchema extends SchemaProvider
'protein' => $resource->protein(),
'sodium' => $resource->sodium(),
'detail' => $resource->detail,
'nutrientsSummary' => $resource->nutrients_summary,
'weight' => $resource->weight,
'createdAt' => $resource->created_at,
'updatedAt' => $resource->updated_at,

View File

@ -85,7 +85,11 @@ final class IngredientAmount extends Model
/**
* @inheritdoc
*/
protected $appends = ['amount_formatted', 'unit_formatted'];
protected $appends = [
'amount_formatted',
'nutrients_summary',
'unit_formatted'
];
/**
* Get the amount as a formatted string (e.g. 0.5 = 1/2).
@ -94,6 +98,20 @@ final class IngredientAmount extends Model
return Number::fractionStringFromFloat($this->amount);
}
/**
* Get a simple string summary of nutrients for the ingredient amount.
*
* TODO: Move to HasIngredients trait.
*/
public function getNutrientsSummaryAttribute(): string {
$summary = [];
foreach (Nutrients::$all as $nutrient) {
$amount = round($this->{$nutrient['value']}(), 2);
$summary[] = "{$nutrient['label']}: {$amount}";
}
return implode(', ', $summary);
}
/**
* Get a "formatted" unit.
*

View File

@ -16,7 +16,7 @@
<div class="bg-white overflow-hidden shadow-sm sm:rounded-lg">
<div class="p-6 bg-white border-b border-gray-200">
<div class="flex flex-col-reverse justify-between pb-4 sm:flex-row">
<div>
<div x-data="{showNutrientsSummary: false}">
@if(!$recipe->tags->isEmpty())
<div class="mb-2 text-gray-700 text-sm">
<span class="font-extrabold">Tags:</span>
@ -27,24 +27,33 @@
<h3 class="mb-2 font-bold text-2xl">Description</h3>
<div class="mb-2 text-gray-800">{{ $recipe->description }}</div>
@endif
<h3 class="mb-2 font-bold text-2xl">Ingredients</h3>
@foreach($recipe->ingredientAmounts as $ia)
<div class="flex flex-row space-x-2 mb-2">
<div>{{ \App\Support\Number::fractionStringFromFloat($ia->amount) }}</div>
@if($ia->unitFormatted)<div>{{ $ia->unitFormatted }}</div>@endif
<h3 class="mb-2 font-bold text-2xl">
Ingredients
<span class="text-sm font-normal cursor-pointer"
x-on:click="showNutrientsSummary = !showNutrientsSummary">[toggle nutrients]</span>
</h3>
<div class="space-y-2">
@foreach($recipe->ingredientAmounts as $ia)
<div>
@if($ia->ingredient->type === \App\Models\Recipe::class)
<a class="text-gray-500 hover:text-gray-700 hover:border-gray-300"
href="{{ route('recipes.show', $ia->ingredient) }}">
{{ $ia->ingredient->name }}
</a>
@else
{{ $ia->ingredient->name }}@if($ia->ingredient->detail), {{ $ia->ingredient->detail }}@endif
@endif
<div class="flex flex-row space-x-2">
<div>{{ \App\Support\Number::fractionStringFromFloat($ia->amount) }}</div>
@if($ia->unitFormatted)<div>{{ $ia->unitFormatted }}</div>@endif
<div>
@if($ia->ingredient->type === \App\Models\Recipe::class)
<a class="text-gray-500 hover:text-gray-700 hover:border-gray-300"
href="{{ route('recipes.show', $ia->ingredient) }}">
{{ $ia->ingredient->name }}
</a>
@else
{{ $ia->ingredient->name }}@if($ia->ingredient->detail), {{ $ia->ingredient->detail }}@endif
@endif
</div>
@if($ia->detail)<div class="text-gray-500">{{ $ia->detail }}</div>@endif
</div>
<div x-show="showNutrientsSummary" class="text-sm text-gray-500">{{ $ia->nutrients_summary }}</div>
</div>
@if($ia->detail)<div class="text-gray-500">{{ $ia->detail }}</div>@endif
</div>
@endforeach
@endforeach
</div>
</div>
<div>
<div class="p-1 border-2 border-black font-sans md:w-72">