Skip to content

fix(assets): Fix asset genration #3485

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

Merged
merged 4 commits into from
Mar 22, 2018
Merged

fix(assets): Fix asset genration #3485

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
63109ad
fix(assets): Fix asset generation
rosen-vladimirov Mar 21, 2018
35e2594
chore: Update to latest common lib
rosen-vladimirov Mar 21, 2018
c9d4d8f
fix(assets): Improve image definitions for iOS
rosen-vladimirov Mar 22, 2018
920cb8e
chore: fix incorrect assets definitions
rosen-vladimirov Mar 22, 2018
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
2 changes: 1 addition & 1 deletion lib/common
Open in desktop
Submodule common updated 0 files
3 changes: 3 additions & 0 deletions lib/constants.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -162,4 +162,7 @@ export class AssetConstants {
public static assets = "assets";

public static sizeDelimiter = "x";

public static defaultScale = 1;
public static defaultOverlayImageScale = 0.8;
}
3 changes: 2 additions & 1 deletion lib/definitions/project.d.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -157,9 +157,10 @@ interface IAssetItem {
height: number;
filename: string;
directory: string;
scale: number;
scale: string;
idiom: string;
resizeOperation?: string;
overlayImageScale?: number;
}

interface IAssetSubGroup {
Expand Down
33 changes: 24 additions & 9 deletions lib/services/assets-generation/assets-generation-service.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
import * as Jimp from "jimp";
import * as Color from "color";
import { exported } from "../../common/decorators";
import { AssetConstants } from '../../constants';

export const enum Operations {
OverlayWith = "overlayWith",
Expand Down Expand Up @@ -39,12 +40,12 @@ export class AssetsGenerationService implements IAssetsGenerationService {
const assetsStructure = await this.$projectDataService.getAssetsStructure(generationData);

const assetItems = _(assetsStructure)
.filter((assetGroup: IAssetGroup, platform: string) => {
return !generationData.platform || platform.toLowerCase() === generationData.platform.toLowerCase();
})
.filter((assetGroup: IAssetGroup, platform: string) =>
!generationData.platform || platform.toLowerCase() === generationData.platform.toLowerCase()
)
.map((assetGroup: IAssetGroup) =>
_.filter(assetGroup, (assetSubGroup: IAssetSubGroup, imageTypeKey: string) =>
propertiesToEnumerate.indexOf(imageTypeKey) !== -1 && !assetSubGroup[imageTypeKey]
assetSubGroup && propertiesToEnumerate.indexOf(imageTypeKey) !== -1
)
)
.flatten<IAssetSubGroup>()
Expand All @@ -55,20 +56,34 @@ export class AssetsGenerationService implements IAssetsGenerationService {

for (const assetItem of assetItems) {
const operation = assetItem.resizeOperation || Operations.Resize;
const scale = assetItem.scale || 0.8;
let tempScale: number = null;
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

In case when assetItem.scale is a number, scale will always be 0.8 and assetItem.scale will be disregarded. Is it the desired behaviour?

If not it should be let tempScale = assetItem.scale

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks , I've fixed it in the code below

if (assetItem.scale) {
if (_.isNumber(assetItem.scale)) {
tempScale = assetItem.scale;
} else {
const splittedElements = `${assetItem.scale}`.split(AssetConstants.sizeDelimiter);
tempScale = splittedElements && splittedElements.length && splittedElements[0] && +splittedElements[0];
}
}

const scale = tempScale || AssetConstants.defaultScale;

const outputPath = assetItem.path;
const width = assetItem.width * scale;
const height = assetItem.height * scale;

switch (operation) {
case Operations.OverlayWith:
const imageResize = Math.round(Math.min(assetItem.width, assetItem.height) * scale);
const overlayImageScale = assetItem.overlayImageScale || AssetConstants.defaultOverlayImageScale;
const imageResize = Math.round(Math.min(width, height) * overlayImageScale);
const image = await this.resize(generationData.imagePath, imageResize, imageResize);
await this.generateImage(generationData.background, assetItem.width, assetItem.height, outputPath, image);
await this.generateImage(generationData.background, width, height, outputPath, image);
break;
case Operations.Blank:
await this.generateImage(generationData.background, assetItem.width, assetItem.height, outputPath);
await this.generateImage(generationData.background, width, height, outputPath);
break;
case Operations.Resize:
const resizedImage = await this.resize(generationData.imagePath, assetItem.width, assetItem.height);
const resizedImage = await this.resize(generationData.imagePath, width, height);
resizedImage.write(outputPath);
break;
default:
Expand Down
46 changes: 28 additions & 18 deletions lib/services/project-data-service.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -137,25 +137,35 @@ export class ProjectDataService implements IProjectDataService {
image.path = path.join(dirPath, image.filename);
}

if (image.size) {
// size is basically <width>x<height>
const [width, height] = image.size.toString().split(AssetConstants.sizeDelimiter);
if (width && height) {
image.width = +width;
image.height = +height;
}
} else {
// Find the image size based on the hardcoded values in the image-definitions.json
_.each(imageDefinitions, (assetSubGroup: IAssetItem[]) => {
_.each(assetSubGroup, assetItem => {
if (assetItem.filename === image.filename && path.basename(assetItem.directory) === path.basename(dirPath)) {
image.width = assetItem.width;
image.height = assetItem.height;
image.size = `${assetItem.width}${AssetConstants.sizeDelimiter}${assetItem.height}`;
// Find the image size based on the hardcoded values in the image-definitions.json
_.each(imageDefinitions, (assetSubGroup: IAssetItem[]) => {
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Just a suggestion (not a merge stopper), not sure if it is working correctly.

_(imageDefinitions)
				.filter((assetSubGroup: IAssetItem[]) => _.find(assetSubGroup, assetElement => assetElement.filename === image.filename && path.basename(assetElement.directory) === path.basename(dirPath)))
				.map((assetItem: IAssetItem) => {
					if (image.size) {
						// size is basically <width>x<height>
						const [width, height] = image.size.toString().split(AssetConstants.sizeDelimiter);
						if (width && height) {
							image.width = +width;
							image.height = +height;
						}
					}

					if (!image.width || !image.height) {
						image.width = assetItem.width;
						image.height = assetItem.height;
						image.size = image.size || `${assetItem.width}${AssetConstants.sizeDelimiter}${assetItem.height}`;
					}
				});

const assetItem = _.find(assetSubGroup, assetElement =>
assetElement.filename === image.filename && path.basename(assetElement.directory) === path.basename(dirPath)
);

if (assetItem) {
if (image.size) {
// size is basically <width>x<height>
const [width, height] = image.size.toString().split(AssetConstants.sizeDelimiter);
if (width && height) {
image.width = +width;
image.height = +height;
}
});
});
}
}

if (!image.width || !image.height) {
image.width = assetItem.width;
image.height = assetItem.height;
image.size = image.size || `${assetItem.width}${AssetConstants.sizeDelimiter}${assetItem.height}`;
}

image.resizeOperation = image.resizeOperation || assetItem.resizeOperation;
image.overlayImageScale = image.overlayImageScale || assetItem.overlayImageScale;
image.scale = image.scale || assetItem.scale;
// break each
return false;
}
});
});

return content;
Expand Down
Loading