Skip to content

Commit c7b5c6f

Browse files
thrijiththrijith
authored
Merge pull request #98 from thrijith/add/amp-story-video-support
Add support for AMP Stories
2 parents ec87244 + d74fe2b commit c7b5c6f

16 files changed

+11652
-30
lines changed

‎.babelrc

Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,35 @@
1+
{
2+
"presets": [
3+
[ "env", {
4+
"modules": false,
5+
"targets": {
6+
"browsers": [
7+
"last 2 Chrome versions",
8+
"last 2 Firefox versions",
9+
"last 2 Safari versions",
10+
"last 2 Edge versions",
11+
"last 2 Opera versions",
12+
"last 2 iOS versions",
13+
"last 1 Android version",
14+
"last 1 ChromeAndroid version",
15+
"ie 11",
16+
"> 1%"
17+
]
18+
}
19+
} ]
20+
],
21+
"plugins": [
22+
"transform-object-rest-spread",
23+
[ "transform-react-jsx", {
24+
"pragma": "wp.element.createElement"
25+
} ]
26+
],
27+
"env": {
28+
"default": {
29+
"plugins": [
30+
"lodash",
31+
"transform-runtime"
32+
]
33+
},
34+
}
35+
}

‎.eslintignore

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
**/*.min.js
2+
**/*.build.js
3+
**/node_modules/**
4+
**/vendor/**
5+
build
6+
node_modules
7+
Gruntfile.js

‎.eslintrc

Lines changed: 262 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,262 @@
1+
{
2+
"root": true,
3+
"parser": "babel-eslint",
4+
"extends": [
5+
"wordpress",
6+
"plugin:react/recommended",
7+
"plugin:jsx-a11y/recommended",
8+
"plugin:jest/recommended"
9+
],
10+
"env": {
11+
"browser": false,
12+
"es6": true,
13+
"node": true,
14+
"mocha": true,
15+
"jest/globals": true
16+
},
17+
"parserOptions": {
18+
"sourceType": "module",
19+
"ecmaFeatures": {
20+
"jsx": true
21+
}
22+
},
23+
"globals": {
24+
"wp": true,
25+
"wpApiSettings": true,
26+
"window": true,
27+
"document": true
28+
},
29+
"plugins": [
30+
"wordpress",
31+
"react",
32+
"jsx-a11y",
33+
"jest"
34+
],
35+
"settings": {
36+
"react": {
37+
"pragma": "wp"
38+
}
39+
},
40+
"rules": {
41+
"array-bracket-spacing": [
42+
"error",
43+
"always"
44+
],
45+
"brace-style": [
46+
"error",
47+
"1tbs"
48+
],
49+
"camelcase": [
50+
"error",
51+
{
52+
"properties": "never"
53+
}
54+
],
55+
"comma-dangle": [
56+
"error",
57+
"always-multiline"
58+
],
59+
"comma-spacing": "error",
60+
"comma-style": "error",
61+
"computed-property-spacing": [
62+
"error",
63+
"always"
64+
],
65+
"constructor-super": "error",
66+
"dot-notation": "error",
67+
"eol-last": "error",
68+
"eqeqeq": "error",
69+
"func-call-spacing": "error",
70+
"indent": [
71+
"error",
72+
"tab",
73+
{
74+
"SwitchCase": 1
75+
}
76+
],
77+
"jsx-a11y/label-has-for": [
78+
"error",
79+
{
80+
"required": "id"
81+
}
82+
],
83+
"jsx-a11y/media-has-caption": "off",
84+
"jsx-a11y/no-noninteractive-tabindex": "off",
85+
"jsx-a11y/role-has-required-aria-props": "off",
86+
"jsx-quotes": "error",
87+
"key-spacing": "error",
88+
"keyword-spacing": "error",
89+
"lines-around-comment": "off",
90+
"no-alert": "error",
91+
"no-bitwise": "error",
92+
"no-caller": "error",
93+
"no-console": "error",
94+
"no-const-assign": "error",
95+
"no-debugger": "error",
96+
"no-dupe-args": "error",
97+
"no-dupe-class-members": "error",
98+
"no-dupe-keys": "error",
99+
"no-duplicate-case": "error",
100+
"no-duplicate-imports": "error",
101+
"no-else-return": "error",
102+
"no-eval": "error",
103+
"no-extra-semi": "error",
104+
"no-fallthrough": "error",
105+
"no-lonely-if": "error",
106+
"no-mixed-operators": "error",
107+
"no-mixed-spaces-and-tabs": "error",
108+
"no-multiple-empty-lines": [
109+
"error",
110+
{
111+
"max": 1
112+
}
113+
],
114+
"no-multi-spaces": "error",
115+
"no-multi-str": "off",
116+
"no-negated-in-lhs": "error",
117+
"no-nested-ternary": "error",
118+
"no-redeclare": "error",
119+
"no-restricted-syntax": [
120+
"error",
121+
{
122+
"selector": "ImportDeclaration[source.value=/^@wordpress\\u002F.+\\u002F/]",
123+
"message": "Path access on WordPress dependencies is not allowed."
124+
},
125+
{
126+
"selector": "ImportDeclaration[source.value=/^blocks$/]",
127+
"message": "Use @wordpress/blocks as import path instead."
128+
},
129+
{
130+
"selector": "ImportDeclaration[source.value=/^components$/]",
131+
"message": "Use @wordpress/components as import path instead."
132+
},
133+
{
134+
"selector": "ImportDeclaration[source.value=/^date$/]",
135+
"message": "Use @wordpress/date as import path instead."
136+
},
137+
{
138+
"selector": "ImportDeclaration[source.value=/^editor$/]",
139+
"message": "Use @wordpress/editor as import path instead."
140+
},
141+
{
142+
"selector": "ImportDeclaration[source.value=/^element$/]",
143+
"message": "Use @wordpress/element as import path instead."
144+
},
145+
{
146+
"selector": "ImportDeclaration[source.value=/^i18n$/]",
147+
"message": "Use @wordpress/i18n as import path instead."
148+
},
149+
{
150+
"selector": "ImportDeclaration[source.value=/^data$/]",
151+
"message": "Use @wordpress/data as import path instead."
152+
},
153+
{
154+
"selector": "ImportDeclaration[source.value=/^utils$/]",
155+
"message": "Use @wordpress/utils as import path instead."
156+
},
157+
{
158+
"selector": "ImportDeclaration[source.value=/^edit-poost$/]",
159+
"message": "Use @wordpress/edit-post as import path instead."
160+
},
161+
{
162+
"selector": "CallExpression[callee.name=/^__|_n|_x$/]:not([arguments.0.type=/^Literal|BinaryExpression$/])",
163+
"message": "Translate function arguments must be string literals."
164+
},
165+
{
166+
"selector": "CallExpression[callee.name=/^_n|_x$/]:not([arguments.1.type=/^Literal|BinaryExpression$/])",
167+
"message": "Translate function arguments must be string literals."
168+
},
169+
{
170+
"selector": "CallExpression[callee.name=_nx]:not([arguments.2.type=/^Literal|BinaryExpression$/])",
171+
"message": "Translate function arguments must be string literals."
172+
}
173+
],
174+
"no-shadow": "error",
175+
"no-undef": "error",
176+
"no-undef-init": "error",
177+
"no-unreachable": "error",
178+
"no-unsafe-negation": "error",
179+
"no-unused-expressions": "error",
180+
"no-unused-vars": "error",
181+
"no-useless-computed-key": "error",
182+
"no-useless-constructor": "error",
183+
"no-useless-return": "error",
184+
"no-var": "error",
185+
"no-whitespace-before-property": "error",
186+
"object-curly-spacing": [
187+
"error",
188+
"always"
189+
],
190+
"padded-blocks": [
191+
"error",
192+
"never"
193+
],
194+
"prefer-const": "error",
195+
"quote-props": [
196+
"error",
197+
"as-needed"
198+
],
199+
"react/display-name": "off",
200+
"react/jsx-curly-spacing": [
201+
"error",
202+
{
203+
"when": "always",
204+
"children": true
205+
}
206+
],
207+
"react/jsx-equals-spacing": "error",
208+
"react/jsx-indent": [
209+
"error",
210+
"tab"
211+
],
212+
"react/jsx-indent-props": [
213+
"error",
214+
"tab"
215+
],
216+
"react/jsx-key": "error",
217+
"react/jsx-tag-spacing": "error",
218+
"react/no-children-prop": "off",
219+
"react/no-find-dom-node": "warn",
220+
"react/prop-types": "off",
221+
"semi": "error",
222+
"semi-spacing": "error",
223+
"space-before-blocks": [
224+
"error",
225+
"always"
226+
],
227+
"space-before-function-paren": [
228+
"error",
229+
"never"
230+
],
231+
"space-in-parens": [
232+
"error",
233+
"always"
234+
],
235+
"space-infix-ops": [
236+
"error",
237+
{
238+
"int32Hint": false
239+
}
240+
],
241+
"space-unary-ops": [
242+
"error",
243+
{
244+
"overrides": {
245+
"!": true
246+
}
247+
}
248+
],
249+
"template-curly-spacing": [
250+
"error",
251+
"always"
252+
],
253+
"valid-jsdoc": [
254+
"error",
255+
{
256+
"requireReturn": false
257+
}
258+
],
259+
"valid-typeof": "error",
260+
"yoda": "off"
261+
}
262+
}

‎.gitignore

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -33,4 +33,5 @@ Thumbs.db
3333
sftp-config.json
3434
*.sublime-project
3535
*.sublime-workspace
36-
.editorconfig
36+
.editorconfig
37+
.cache/

‎.jscsrc

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,8 +2,8 @@
22
"preset": "wordpress",
33
"excludeFiles": [
44
"**/*.min.js",
5-
"**/*.jsx",
65
"**/node_modules/**",
6+
"**/build/**",
77
"**/vendor/**"
88
]
99
}

‎.jshintignore

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
**/build/**

‎.npmrc

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
save-exact = true

‎admin/images/amp-story-fallback-poster.png

18.5 KB
Loading

‎admin/images/amp-story-video-fallback-poster.png

5.69 KB
Loading

‎admin/js/rt-transcoder-block-editor-support.js

Lines changed: 44 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,44 @@
1+
import apiFetch from '@wordpress/api-fetch';
2+
3+
const { rtTranscoderBlockEditorSupport } = window;
4+
5+
const updateAMPStoryPoster = ( BlockEdit ) => {
6+
return ( props ) => {
7+
const mediaAttributes = props.attributes;
8+
const isAMPStory = 'amp/amp-story-page' === props.name;
9+
const isVideoBlock = 'core/video' === props.name;
10+
const mediaId = isAMPStory ? mediaAttributes.mediaId : mediaAttributes.id;
11+
if ( typeof mediaId !== 'undefined' ) {
12+
if ( typeof mediaAttributes.poster === 'undefined' ) {
13+
if ( isAMPStory && typeof mediaAttributes.mediaType !== 'undefined' &&
14+
'video' === mediaAttributes.mediaType && ! mediaAttributes.mediaUrl.endsWith( 'mp4' ) ) {
15+
props.attributes.poster = rtTranscoderBlockEditorSupport.amp_story_fallback_poster;
16+
} else if ( isVideoBlock && typeof mediaAttributes.src !== 'undefined' &&
17+
mediaAttributes.src.indexOf( 'blob:' ) !== 0 && ! mediaAttributes.src.endsWith( 'mp4' ) ) {
18+
props.attributes.poster = rtTranscoderBlockEditorSupport.amp_video_fallback_poster;
19+
}
20+
} else if ( mediaAttributes.poster.endsWith( '-fallback-poster.png' ) ) {
21+
const restBase = '/wp-json/transcoder/v1/amp-media';
22+
apiFetch( {
23+
path: `${ restBase }/${ mediaId }`,
24+
} ).then( data => {
25+
if ( false !== data && null !== data ) {
26+
if ( data.poster.length ) {
27+
if ( isAMPStory && typeof mediaAttributes.mediaType !== 'undefined' && 'video' === mediaAttributes.mediaType ) {
28+
props.attributes.poster = data.poster;
29+
} else if ( isVideoBlock ) {
30+
props.attributes.poster = data.poster;
31+
}
32+
}
33+
}
34+
} );
35+
}
36+
}
37+
38+
return (
39+
<BlockEdit { ...props } />
40+
);
41+
};
42+
};
43+
44+
wp.hooks.addFilter( 'editor.BlockEdit', 'rt-transcoder-amp/with-inspector-controls', updateAMPStoryPoster );

0 commit comments

Comments
 (0)