this repo has no description
at main 163 lines 6.7 kB view raw
1import { ASPECT_RATIOS } from '@amp/web-app-components/src/components/Artwork/constants'; 2import { ArtworkConfig } from '@amp/web-app-components/config/components/artwork'; 3import type { ArtworkProfileMap } from '@amp/web-app-components/config/components/artwork'; 4import type { CropCode } from '@amp/web-app-components/src/components/Artwork/types'; 5 6const { HD, ONE, THREE_QUARTERS, HD_ASPECT_RATIO } = ASPECT_RATIOS; 7 8const AppIconSize = { 9 DEFAULT: [48], 10 SMALL: [64], 11 MEDIUM: [100], 12 LARGE: [200], 13 XLARGE: [800], 14}; 15 16const cardSizes = [525, 525, 490, 394, 738]; 17const brickSizes = [520, 400, 450, 450, 300]; 18const heroSizes = [1600, 1240, 920, 920, 490]; 19 20export type NamedProfile = 21 | 'app-event-detail' 22 | 'app-event-detail-small' 23 | 'app-icon' 24 | 'app-icon-large' 25 | 'app-icon-medium' 26 | 'app-icon-small' 27 | 'app-icon-xlarge' 28 | 'app-icon-pill' 29 | 'app-icon-large-pill' 30 | 'app-icon-medium-pill' 31 | 'app-icon-small-pill' 32 | 'app-icon-river-pill' 33 | 'app-icon-tv-rect' 34 | 'app-icon-large-tv-rect' 35 | 'app-icon-xlarge-tv-rect' 36 | 'app-icon-medium-tv-rect' 37 | 'app-icon-small-tv-rect' 38 | 'app-icon-river-tv-rect' 39 | 'app-icon-river' 40 | 'app-promotion' 41 | 'app-promotion-in-article' 42 | 'app-trailer-lockup-video' 43 | 'brick' 44 | 'brick-app-icon' 45 | 'card' 46 | 'card-horizontal' 47 | 'category-brick' 48 | 'editorial-story-card' 49 | 'in-app-purchase' 50 | 'large-brick' 51 | 'large-hero' 52 | 'large-hero-portrait' 53 | 'large-hero-portrait-iphone' 54 | 'large-hero-breakout' 55 | 'large-hero-breakout-rtl' 56 | 'large-hero-west' 57 | 'large-hero-east' 58 | 'large-hero-story-card' 59 | 'large-hero-story-card-portrait' 60 | 'large-hero-story-card-rtl' 61 | 'large-image-lockup' 62 | 'poster-lockup' 63 | 'poster-title' 64 | 'medium-story-card' 65 | 'screenshot-vision' 66 | 'screenshot-phone' 67 | 'screenshot-phone_portrait' 68 | 'screenshot-iphone_5_8' 69 | 'screenshot-iphone_5_8_portrait' 70 | 'screenshot-iphone_6_5' 71 | 'screenshot-iphone_6_5_portrait' 72 | 'screenshot-iphone_d74' 73 | 'screenshot-iphone_d74_portrait' 74 | 'screenshot-mac' 75 | 'screenshot-tv' 76 | 'screenshot-pad' 77 | 'screenshot-pad-portrait' 78 | 'screenshot-watch' 79 | 'small-brick' 80 | 'small-story-card-portrait' 81 | 'small-story-card' 82 | 'small-story-card-legacy' 83 | 'uber-shelf'; 84 85const PROFILES: ArtworkProfileMap<NamedProfile> = new Map([ 86 ['app-event-detail', [[480, 336, 336], 9 / 16, 'sr']], 87 ['app-event-detail-small', [[480, 336, 336], HD_ASPECT_RATIO, 'sr']], 88 ['app-icon', [AppIconSize.DEFAULT, ONE, 'bb']], 89 ['app-icon-large', [AppIconSize.LARGE, ONE, 'bb']], 90 ['app-icon-medium', [AppIconSize.MEDIUM, ONE, 'bb']], 91 ['app-icon-small', [AppIconSize.SMALL, ONE, 'bb']], 92 ['app-icon-xlarge', [AppIconSize.XLARGE, ONE, 'bb']], 93 ['app-icon-pill', [AppIconSize.DEFAULT, 4 / 3, 'sr']], 94 ['app-icon-large-pill', [AppIconSize.LARGE, 4 / 3, 'sr']], 95 ['app-icon-medium-pill', [AppIconSize.MEDIUM, 4 / 3, 'sr']], 96 ['app-icon-small-pill', [AppIconSize.SMALL, 4 / 3, 'sr']], 97 ['app-icon-tv-rect', [AppIconSize.DEFAULT, HD, 'sr']], 98 ['app-icon-large-tv-rect', [AppIconSize.LARGE, HD, 'sr']], 99 ['app-icon-xlarge-tv-rect', [AppIconSize.XLARGE, HD, 'sr']], 100 ['app-icon-medium-tv-rect', [AppIconSize.MEDIUM, HD, 'sr']], 101 ['app-icon-small-tv-rect', [AppIconSize.SMALL, HD, 'bb']], 102 ['app-icon-river-tv-rect', [[128, 128, 128, 88, 88], HD, 'bb']], 103 ['app-icon-river', [[128, 128, 128, 88, 88], ONE, 'bb']], 104 ['app-icon-river-pill', [[128, 128, 128, 88, 88], 4 / 3, 'sr']], 105 ['app-promotion', [[385, 330, 400, 450, 298], 16 / 9, 'sr']], 106 ['app-promotion-in-article', [[800, 600], 16 / 9, 'sr']], 107 ['app-trailer-lockup-video', [[385, 330, 400, 450, 298], 16 / 10, 'sr']], 108 ['brick', [brickSizes, HD, 'sr']], 109 ['brick-app-icon', [[83, 60, 60, 60, 50], ONE, 'bb']], 110 ['card', [cardSizes, THREE_QUARTERS, 'sr']], 111 ['card-horizontal', [[1020], HD, 'sr']], 112 ['category-brick', [[368, 368, 368, 208, 288], HD, 'sr']], 113 ['editorial-story-card', [[385, 400, 450], THREE_QUARTERS, 'sr']], 114 ['in-app-purchase', [[153, 160, 160, 140, 168], ONE, 'sr']], 115 ['large-brick', [[520, 610, 450, 298, 298], HD, 'sr']], 116 ['large-hero', [heroSizes, HD, 'sr']], 117 ['large-hero-portrait', [[430], 9 / 16, 'sr']], 118 ['large-hero-portrait-iphone', [[430], THREE_QUARTERS, 'SH.ApCSC01']], 119 ['large-hero-west', [heroSizes, 2.79, 'grav.west']], 120 ['large-hero-east', [heroSizes, 2.79, 'grav.east']], 121 ['large-hero-story-card', [heroSizes, 2.25, 'CC.ApSHW01']], 122 ['large-hero-story-card-rtl', [heroSizes, 2.25, 'sr']], 123 ['large-hero-story-card-portrait', [cardSizes, 3 / 4, 'CC.ApSHT01']], 124 ['large-hero-breakout', [heroSizes, 8 / 3, 'sr']], 125 ['large-image-lockup', [[790, 610, 919, 298, 298], HD, 'sr']], 126 ['poster-lockup', [[520, 520, 400, 450, 300], HD, 'sr']], 127 ['poster-title', [[400, 300, 200], HD, 'bb']], 128 [ 129 'large-hero-breakout-rtl', 130 [[1600, 1240, 920, 920, 688], 8 / 3, 'gk' as CropCode], 131 ], // the `rtl` version of `large-hero-breakout` assets max out at 1344px wide 132 ['medium-story-card', [[298, 579, 490, 394], THREE_QUARTERS, 'sr']], 133 ['small-brick', [[300, 300, 300, 200, 300], HD, 'sr']], 134 ['small-story-card-portrait', [[182, 232, 215, 192], THREE_QUARTERS, 'sr']], 135 ['screenshot-vision', [[480, 480, 335, 520, 520], HD, 'sr']], 136 ['screenshot-phone', [[313, 643, 313, 480, 643], 20 / 9, 'w']], 137 ['screenshot-phone_portrait', [[230, 230, 157, 300, 300], 9 / 20, 'w']], 138 ['screenshot-iphone_5_8', [[313, 643, 313, 480, 643], 498 / 230, 'w']], 139 [ 140 'screenshot-iphone_5_8_portrait', 141 [[230, 230, 157, 300, 300], 230 / 498, 'w'], 142 ], 143 ['screenshot-iphone_6_5', [[313, 643, 313, 480, 643], 498 / 230, 'w']], 144 [ 145 'screenshot-iphone_6_5_portrait', 146 [[230, 230, 157, 300, 300], 230 / 498, 'w'], 147 ], 148 ['screenshot-iphone_d74', [[313, 643, 313, 480, 643], 466 / 215, 'w']], 149 [ 150 'screenshot-iphone_d74_portrait', 151 [[230, 230, 157, 300, 300], 215 / 466, 'w'], 152 ], 153 ['screenshot-mac', [[313, 643, 313, 480, 643], 16 / 10, 'w']], 154 ['screenshot-tv', [[313, 643, 313, 480, 643], HD, 'w']], 155 ['screenshot-pad', [[313, 643, 313, 480, 643], 4 / 3, 'w']], 156 ['screenshot-pad-portrait', [[480, 528, 313, 480, 643], 3 / 4, 'w']], 157 ['screenshot-watch', [[300, 157, 230, 230, 230], 4 / 5, 'w']], 158 ['small-story-card', [brickSizes, HD, 'CC.ApSHSC01']], 159 ['small-story-card-legacy', [brickSizes, HD, 'SCS.ApDPCS01']], 160 ['uber-shelf', [[1680, 1680, 1320, 1000, 390], 8 / 3, 'sr']], 161]); 162 163ArtworkConfig.set({ PROFILES });