Skip to content

Commit

Permalink
Render no image photo
Browse files Browse the repository at this point in the history
  • Loading branch information
@mjkuranda
mjkuranda committed Aug 23, 2022
1 parent 47ab455 commit 6d3a9fa
Show file tree
Hide file tree
Showing 8 changed files with 28 additions and 95 deletions.
1 change: 1 addition & 0 deletions IDEAS.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,7 @@
- Edition of existing meals - you can edit anything you want apart from the title - because it occurs as the name.
- Each result has a property called `relevance` - could be measured as a percentage. The found results should be sorted according to the this property.
- Better handling MongoDB errors - types of errors and their communicates.
- Improved README and guide for developers how to add ingredients and other things.

## Bugs

Expand Down
4 changes: 2 additions & 2 deletions public/css/meals-add-new.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -31,8 +31,8 @@ body {
margin-left: 0.5em;
}

.new-meal-ingredients-container > ul > li > i + span {
margin-left: 0.5em;
.new-meal-ingredients-container > ul > li > img + span {
margin-left: 0.2em;
}

.new-meal-ingredients-container > ul > li > span {
Expand Down
Binary file added public/icons/no-image.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
6 changes: 6 additions & 0 deletions src/YummyData.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -61,6 +61,12 @@ export const icons = {
undefined,
"https://icons8.com/icon/13296/list-view"
),
noImage: new Icon(
"no-image",
"",
undefined,
"https://icons8.com/icon/1G2BW7-tQJJJ/no-image"
),
// Food - berries
blueberry: new Icon(
"blueberry",
Expand Down
10 changes: 3 additions & 7 deletions src/YummyRouter.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -85,13 +85,7 @@ export class YummyRouter {
},
mealTypes: mealTypes,
meals: meals,
});
}

private result(req: Request, res: Response): void {
res.render("result", {
elements: elements.result,
isNotMain: res.req.url !== "/",
noImage: icons.noImage,
});
}

Expand All @@ -114,6 +108,7 @@ export class YummyRouter {
meal: meal,
ingredients: ings,
sourceUrl: `/search?${res.req.url.split("?")[1] ?? ""}`,
noImage: icons.noImage,
});
}

Expand Down Expand Up @@ -168,6 +163,7 @@ export class YummyRouter {
meal: newMeal,
mealType: Type[newMeal.type as keyof typeof Type],
ingredients: ings,
noImage: icons.noImage,
});
} catch (err: any) {
console.log(err);
Expand Down
8 changes: 7 additions & 1 deletion views/layouts/meals-add-new.handlebars
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,13 @@
<div><h3>{{meal.title}}</h3></div>
<div><p>{{meal.description}}</p></div>
<div><p>{{mealType}}</p></div>
<div class="flex-center"><img src="../../uploads/{{meal.image}}" alt="{{meal.title}} photo" width="256" /></div>
<div class="flex-center">
{{#if meal.image}}
<img src="../../uploads/{{meal.image}}" alt="{{meal.title}} photo" width="256" />
{{else}}
<img src="../../icons/no-image.png" alt="{{meal.title}} no photo" width="256" />
{{/if}}
</div>
<div class="new-meal-ingredients-container">
<ul>
{{#each ingredients as |ing|}}
Expand Down
6 changes: 5 additions & 1 deletion views/layouts/result.handlebars
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,11 @@
></i>Wróć do wyszukiwania</a></div>
<div class="result-container">
<div class="result-image"><img
src="{{prefixPath}}uploads/{{meal.image}}"
{{#if meal.image}}
src="{{#if meal.image}}{{prefixPath}}uploads/{{meal.image}}{{else}}{{/if}}"
{{else}}
src="{{prefixPath}}icons/no-image.png"
{{/if}}
alt="Zdjęcie posiłku o nazwie {{meal.title}}"
/></div>
<div class="result-details">
Expand Down
88 changes: 4 additions & 84 deletions views/layouts/search.handlebars
View file
Original file line number Diff line number Diff line change
Expand Up @@ -55,7 +55,11 @@
{{#each meals as |meal| }}
<div class="result-container flex-center">
<div class="result-image">
{{#if meal.image}}
<img src="uploads/{{meal.image}}" alt="Zdjęcie posiłku o nazwie {{meal.title}}" />
{{else}}
<img src="icons/no-image.png" alt="Brak zdjęcia posiłku o nazwie {{meal.title}}" />
{{/if}}
</div>
<div class="result-label">
<div class="result-description">
Expand All @@ -68,90 +72,6 @@
</div>
</div>
{{/each}}
<div class="result-container flex-center">
<div class="result-image">
<img src="img/berries.jpg" alt="img-title" />
</div>
<div class="result-label">
<div class="result-description">
<div class="result-title">Tytuł</div>
<div class="result-text">Opis tego czegoś</div>
</div>
<div class="result-button flex-center">
<button>Zobacz</button>
</div>
</div>
</div>
<div class="result-container flex-center">
<div class="result-image">
<img src="img/berries.jpg" alt="img-title" />
</div>
<div class="result-label">
<div class="result-description">
<div class="result-title">Tytuł</div>
<div class="result-text">Opis tego czegoś</div>
</div>
<div class="result-button flex-center">
<button>Zobacz</button>
</div>
</div>
</div>
<div class="result-container flex-center">
<div class="result-image">
<img src="img/berries.jpg" alt="img-title" />
</div>
<div class="result-label">
<div class="result-description">
<div class="result-title">Tytuł</div>
<div class="result-text">Opis tego czegoś</div>
</div>
<div class="result-button flex-center">
<button>Zobacz</button>
</div>
</div>
</div>
<div class="result-container flex-center">
<div class="result-image">
<img src="img/berries.jpg" alt="img-title" />
</div>
<div class="result-label">
<div class="result-description">
<div class="result-title">Tytuł</div>
<div class="result-text">Opis tego czegoś</div>
</div>
<div class="result-button flex-center">
<button>Zobacz</button>
</div>
</div>
</div>
<div class="result-container flex-center">
<div class="result-image">
<img src="img/berries.jpg" alt="img-title" />
</div>
<div class="result-label">
<div class="result-description">
<div class="result-title">Tytuł</div>
<div class="result-text">Opis tego czegoś</div>
</div>
<div class="result-button flex-center">
<button>Zobacz</button>
</div>
</div>
</div>
<div class="result-container flex-center">
<div class="result-image">
<img src="img/berries.jpg" alt="img-title" />
</div>
<div class="result-label">
<div class="result-description">
<div class="result-title">Tytuł</div>
<div class="result-text">Opis tego czegoś</div>
</div>
<div class="result-button flex-center">
<button>Zobacz</button>
</div>
</div>
</div>
</section>
<section id="adder">
<div class="flex-center"><p>Brakuje szukanego posiłku? Dodaj go!</p></div>
Expand Down

0 comments on commit 6d3a9fa

Please sign in to comment.