Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add referrer policy option to the img tag #40

Merged
merged 9 commits into from
Apr 5, 2022
Merged

Add referrer policy option to the img tag #40

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
9 commits
Select commit Hold shift + click to select a range
f6b7fef
Merge branch 'develop'
Heatmanofurioso Nov 3, 2021
436f769
Merge pull request #31 from Heatmanofurioso/develop
Heatmanofurioso Nov 7, 2021
d5c2dda
Merge branch 'master' into develop
Heatmanofurioso Feb 14, 2022
902c5ca
Merge branch 'develop'
Heatmanofurioso Feb 14, 2022
a4eb521
Merge branch 'master' into develop
Heatmanofurioso Feb 14, 2022
04b9ab2
Merge branch 'develop' into feature/39-add-referrer-policy-option-to-…
Heatmanofurioso Apr 5, 2022
680abee
Remove unused TSLint
Heatmanofurioso Apr 5, 2022
68ed6ae
Add referrerpolicy option
Heatmanofurioso Apr 5, 2022
6543093
Update documentation
Heatmanofurioso Apr 5, 2022
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
1 change: 1 addition & 0 deletions CHANGELOG
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).

## [Unreleased]
- Add referrerpolicy option to the img tag configurations

# [1.3.1] - 2022-02-14
- Update Angular to 13.2.2
Expand Down
48 changes: 25 additions & 23 deletions README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -140,29 +140,30 @@ $ ng serve

## Options

| Attribute | Type | Default | Description |
| ------------- | ---------------- | ------- | ------------------------------------------------------------------------------------------------------ |
| `facebookId` | *string \| null* | | Facebook ID |
| `googleId` | *string \| null* | | Google ID |
| `twitterId` | *string \| null* | | Twitter Handle |
| `instagramId` | *string \| null* | | Instagram Handle |
| `vkontakteId` | *string \| null* | | VK ID |
| `skypeId` | *string \| null* | | Skype ID |
| `gravatarId` | *string \| null* | | email or md5 email related to gravatar |
| `githubId` | *string \| null* | | Github ID |
| `src` | *string \| null* | | Fallback image to use |
| `name` | *string \| null* | | Will be used to generate avatar based on the initials of the person |
| `value` | *string \| null* | | Show a value as avatar |
| `initialsSize`| *number* | 0 | Restricts the size of initials - it goes along with the name property and can be used to fix the number of characters that will be displayed as initials. The `0` means no restrictions. |
| `bgColor` | *string* | random | Give the background a fixed color with a hex like for example #FF0000 |
| `fgColor` | *string* | #FFF | Give the text a fixed color with a hex like for example #FF0000 |
| `size` | *number* | 50 | Size of the avatar |
| `textSizeRatio`| *number* | 3 | For text based avatars the size of the text as a fragment of size (size / textSizeRatio) |
| `round` | *boolean* | true | Round the avatar corners |
| `cornerRadius`| *number* | 0 | Square avatars can have rounded corners using this property |
| `borderColor` | *string* | undefined | Add border with the given color. boder's default style is '1px solid borderColor' |
| `style` | *object* | | Style that will be applied on the root element |
| `clickOnAvatar`| *Output* | | Fired when the avatar is clicked. The component emits the source object that has been used to fetch the avatar.|
| Attribute | Type | Default | Description |
|------------------|------------|-----------|------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|
| `facebookId` | *string* | null | | Facebook ID |
| `googleId` | *string* | null | | Google ID |
| `twitterId` | *string* | null | | Twitter Handle |
| `instagramId` | *string* | null | | Instagram Handle |
| `vkontakteId` | *string* | null | | VK ID |
| `skypeId` | *string* | null | | Skype ID |
| `gravatarId` | *string* | null | | email or md5 email related to gravatar |
| `githubId` | *string* | null | | Github ID |
| `src` | *string* | null | | Fallback image to use |
| `name` | *string* | null | | Will be used to generate avatar based on the initials of the person |
| `value` | *string* | null | | Show a value as avatar |
| `initialsSize` | *number* | 0 | Restricts the size of initials - it goes along with the name property and can be used to fix the number of characters that will be displayed as initials. The `0` means no restrictions. |
| `bgColor` | *string* | random | Give the background a fixed color with a hex like for example #FF0000 |
| `fgColor` | *string* | #FFF | Give the text a fixed color with a hex like for example #FF0000 |
| `size` | *number* | 50 | Size of the avatar |
| `textSizeRatio` | *number* | 3 | For text based avatars the size of the text as a fragment of size (size / textSizeRatio) |
| `round` | *boolean* | true | Round the avatar corners |
| `cornerRadius` | *number* | 0 | Square avatars can have rounded corners using this property |
| `borderColor` | *string* | undefined | Add border with the given color. border's default style is '1px solid borderColor' |
| `style` | *object* | | Style that will be applied on the root element |
| `clickOnAvatar` | *Output* | | Fired when the avatar is clicked. The component emits the source object that has been used to fetch the avatar. |
| `referrerpolicy` | *string* | null | Adds the noreferrer flag to the img tag. |

The source object has the following properties:
* sourceType : avatar source ( Facebook, twitter, etc)
Expand Down Expand Up @@ -261,6 +262,7 @@ export class AppModule { }
```

## Release Notes & History
* Unreleased: Add referrerpolicy configuration to img tag.
* 1.3.1: Update dependencies
* 1.3.0: Added ability to disable src cache.
* 1.2.1: Updated several dependencies. Update Angular minor version. Add Husky Git Hooks. Migrate from TSLint to ESLint
Expand Down
3 changes: 3 additions & 0 deletions projects/ngx-avatars/src/lib/avatar.component.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -49,6 +49,7 @@ type Style = Partial<CSSStyleDeclaration>;
[width]="size"
[height]="size"
[ngStyle]="avatarStyle"
[referrerPolicy]="referrerpolicy"
(error)="fetchAvatarSource()"
class="avatar-content"
loading="lazy"
Expand Down Expand Up @@ -101,6 +102,8 @@ export class AvatarComponent implements OnChanges, OnDestroy {
@Input()
public value?: string | null;
@Input()
public referrerpolicy?: string | null;
@Input()
public placeholder?: string;
@Input()
public initialsSize: string | number = 0;
Expand Down
18 changes: 0 additions & 18 deletions projects/ngx-avatars/tslint.json
View file
Open in desktop

This file was deleted.