profile
viewpoint
Wassim Gharbi wassgha Lafayette College, Google Easton, Pa. http://gharbi.me/ Software Engineer, Designer, Computer Vision Undergraduate Researcher. Currently working on Google Docs and @ampproject at @google

react-native-community/react-native-camera 8521

A Camera component for React Native. Also supports barcode scanning!

react-designer/react-designer 1518

Editable vector graphics in your react apps

google/web-stories-wp 173

Web Stories WordPress plugin

wassgha/FaceRecognitionAPI 30

A Django OpenCV wrapper that acts as a RESTful API for face recognition

wassgha/digital-signage 22

📺 Simple self-hosted digital signage software for turning screens into beautiful content displays

newmuis/amphtml-story 12

THIS IS DEPRECATED! See ampproject/amphtml for the amp-story component.

wassgha/CalcTutor 6

Intelligent Tutor System for Calculus classes (includes Javascript virtual math keyboard and random function/derivative/integral generator)

alexander-e-andrews/ChickPea 3

Lafayette College Senior Display Project

HuyLafa/MathTutor 1

Redesign of WebWork, Lafayette College

Laucksy/HTTP-Simulator 1

A simple HTTP web browser/web server implementation on top of a simulated network. Project 1 for Lafayette College CS305 Spring 2018.

PR opened google/web-stories-wp

Reviewers
[WIP/Experimental] Eye dropper functionality on color picker

Eye dropper demo

Summary

Adds the eye dropper tool to the color picker which enables users to pick a color from any existing element on the canvas.

Relevant Technical Choices

  • Used html2canvas to take a "screenshot" of the editor's canvas on click and use the generated <canvas> element to get the color at the clicked pixel location

To-do

  • [ ] Fix some oddities with capturing the click event (prevent closing the color picker while the user is still choosing colors)
  • [ ] Refactor and clean up code
  • [ ] Add karma tests
  • [ ] Specify a default color (out of canvas)

User-facing changes

The eye dropper tool is now active and usable.

Testing Instructions

  • Insert an element into the canvas
  • Click on the background/page
  • Click on the page color setting to open the color picker
  • Tap on the eye dropper tool
  • Click anywhere on the previously inserted element
  • The page's background color should now change to match the color at the clicked pixel location

<!-- Please reference the issue(s) this PR addresses. -->

Fixes #262

+135 -12

0 comment

8 changed files

pr created time in a day

create barnchgoogle/web-stories-wp

branch : feature/eyedropper

created branch time in 2 days

create barnchgoogle/web-stories-wp

branch : feature/textmagic

created branch time in 3 days

push eventgoogle/web-stories-wp

Clinton Volzke

commit sha 48b58b5210f3c8b46d328372c70b4d5c68b654c0

Pull out common reducer.js logic to media/common

view details

Clinton Volzke

commit sha f06f691899e742d4e3c8c04278f0cd4a0f3ec7d4

Rename local media 'pagingNum' to 'pageToken' for consistency between media3p and local

view details

Mariano Martinez III

commit sha b5a1f4a2e17cfbd0c35242ec8fc101b9e4a83eb3

Dashboard: Fixed button placement and swapped watch in Fitness template

view details

Mariano Martinez III

commit sha f2f54d692dcf250d9e41687e93f2c97eda4f36be

Merge pull request #2880 from google/fix/update-fitness-template Dashboard: Fixed button placement and swapped watch in Fitness template

view details

Mariano Martinez III

commit sha 0c734799179f39bf24d276b960363654b9d36ba9

Dashboard: Applied design updates to Wellbeing template

view details

Mariano Martinez III

commit sha 088b9e32e169c9526604eb919ccb01ad08e33b90

Fixed style issues

view details

Mariano Martinez III

commit sha c1a8181e9385abb7783c5513226a347b2443962e

Fixed shapes in wellbeing

view details

Wassim Gharbi

commit sha c4f143e6b60a12940c457efa057e7f64e46cbf17

Added test to test adding a link

view details

Wassim Gharbi

commit sha bce2b50e7b9d3df68d1bb79c319a2258c2ab2c5e

Merge branch 'master' into links/shortcut

view details

Mariano Martinez III

commit sha bb5132c4c593bd2e1bbf524971a33a31fa2d0b69

Merge pull request #2659 from google/task/apply-916-wellness Dashboard: Applied design updates to Wellbeing template

view details

Joanna Lee

commit sha b69cc4e7d1430447f18987c244383eaa8ced2f8a

3P Media: Use react-photo-gallery (#2716)

view details

Brittany Feenstra

commit sha b4cda2171ee5096ddff15118f53b35b01e22089a

Dashboard: Prevent scroll to top on pagination (#2883)

view details

imgbot[bot]

commit sha 1a7097bf87aa4aaccd7096524981b08c5af28e20

[ImgBot] Optimize images (#2881) Co-authored-by: ImgBotApp <ImgBotHelp@gmail.com>

view details

dependabot-preview[bot]

commit sha 051d71c8fcd96f9b63ccdebcb393f5ede0910fc2

Bump @babel/preset-react from 7.10.1 to 7.10.4 (#2863)

view details

dependabot-preview[bot]

commit sha 08288738918d217677757146687644ec38459427

Bump @babel/core from 7.10.3 to 7.10.4 (#2870)

view details

dependabot-preview[bot]

commit sha 724dc98eb696f84be7e7165878c398acd85d1669

Bump @babel/plugin-proposal-private-methods from 7.10.1 to 7.10.4 (#2862) Bumps [@babel/plugin-proposal-private-methods](https://github.com/babel/babel/tree/HEAD/packages/babel-plugin-proposal-private-methods) from 7.10.1 to 7.10.4. - [Release notes](https://github.com/babel/babel/releases) - [Changelog](https://github.com/babel/babel/blob/main/CHANGELOG.md) - [Commits](https://github.com/babel/babel/commits/v7.10.4/packages/babel-plugin-proposal-private-methods) Signed-off-by: dependabot-preview[bot] <support@dependabot.com> Co-authored-by: dependabot-preview[bot] <27856297+dependabot-preview[bot]@users.noreply.github.com>

view details

dependabot-preview[bot]

commit sha b34724708e86f8a6b977e17536bf550f02cabf21

Bump @storybook/addon-knobs from 6.0.0-beta.37 to 6.0.0-beta.38 (#2877)

view details

Paul Bakaus

commit sha f1544f01efd5c9edf4625e2e864bfd9f295b548e

Templates: Fix beauty template image (#2889)

view details

Pascal Birchler

commit sha 9ce45c4985009db63dcc88969d74382cddacc7e6

Version 1.0.0-beta.1 (#2890)

view details

Miina Sikk

commit sha ce7063dd8bf9f6208323526f235dd428964307f0

Fix detecting contenteditable.

view details

push time in 3 days

push eventwassgha/amphtml

Micajuine Ho

commit sha 33e0c090956904a9adcf1d877b4c7727a6352543

Allow amp-story-consent to work with new amp-consent config (#29055) * Merge legacy, examples, doc * Added test

view details

Jake Fried

commit sha a28fa129d225ce79d6b537f500c4540ae844caae

amp-date-picker: restore rrule support (#28887) * amp-date-picker: restore rrule support, via a fork * patch instead of fork, but also dont auto-update * misplaced semicolon * Revert "Remove RRule support (#25230)" This reverts commit 11e9de2afe47eeac78082130ad18cb1e1f3500a0. * liven up the test fixture * use es5 bc cc cant handle the build * support both browserify/cc * lint * remove renovate change * remove unecessary tslib * reduce yarn.lock diffsize * cc typefix * thanks justin * bring back warnings, but incorrect behavior * super nit

view details

Raghu Simha

commit sha df16572d8957be9da58004321e7cbd0d543ae584

🏗🚮 Stop testing on Sauce Labs and delete all related infrastructure (#29038)

view details

Philip Bell

commit sha f2b4ef33f5621ebc42aa5b3efd182e992c57ff56

🖍 Transforms only fix to display small percentages in binary polls. (#29060) * Fixes display of small percentages. * Update extensions/amp-story/1.0/amp-story-interactive-poll.css Co-authored-by: Enrique Marroquin <5449100+Enriqe@users.noreply.github.com> * Makes top file constant for minimum horizontal padding. * 🖍 Fixes display of small percentages in binary polls with transforms. * Use setStyle. * Transforms calculation and RTL display handling. * refactor min value clamping in getTransformVal_ * add !important to css declarations Co-authored-by: Enrique Marroquin <5449100+Enriqe@users.noreply.github.com>

view details

Jake Fried

commit sha c73f5626d2416665a5a51307c661d90074d47fa8

Add asterisk to comments that were meant to be jsdocs in amp.extern (#29091)

view details

Wassim Gharbi

commit sha 092eb08523ba949a7d2b3c93d9f45e32ccf9fadc

Merge branch 'master' into sidebar/warning

view details

push time in 6 days

push eventgoogle/web-stories-wp

Clinton Volzke

commit sha 2c258edd459e8f6dbe07b05921cbe4463c07fdaa

Create media3p reducer folder structure

view details

Brittany Feenstra

commit sha 32ab3042530f09a8696df947357fed186c4591d9

clean up template detail nav bar to be reusable for story details as well

view details

Brittany Feenstra

commit sha d38a807d0d8398ddb57f7a49aaf2f7ec82356759

check if click handler for bookmarking is present before rendering button for bookmarking

view details

Brittany Feenstra

commit sha 002865b81c82bb6812681b165f765ddf5897baa1

keep flag and use a callback :)

view details

Clinton Volzke

commit sha cfb61910d2ade5036a81be3fa1c507e2b3075a07

Merge branch 'task/2424-move-local-reducer' into task/2427-media-reducer-folders

view details

Clinton Volzke

commit sha ff19b6a086210daf25d5fff361aac9952809eeb1

Add test for media3p/reducer.js

view details

Clinton Volzke

commit sha 2656d0cf867200416978d87717504d1f8399449e

Move state initial values to use reducer function defaults

view details

Clinton Volzke

commit sha 927c5e8bf5e3f9fe0542d2b68a4c1324140536b4

Move context value provider from MediaProvider to local/useContextValue

view details

Clinton Volzke

commit sha 06eb30bd2c75af76c03fa272531652263ad7420d

Move context value provider from MediaProvider to local/useContextValue

view details

Clinton Volzke

commit sha a2f3cde316877652de46b66113eb4e1325507271

Create media3p state folder structure

view details

dependabot-preview[bot]

commit sha e1899ea7ae117fd4da62da7e138dc3988a08215f

Bump @testing-library/dom from 7.18.0 to 7.18.1 (#2759)

view details

dependabot-preview[bot]

commit sha d3c4cad3aa2e64548cb41b2f83545c7d4caa4452

Bump dealerdirect/phpcodesniffer-composer-installer from 0.6.2 to 0.7.0 (#2768) Co-authored-by: dependabot-preview[bot] <27856297+dependabot-preview[bot]@users.noreply.github.com>

view details

dependabot-preview[bot]

commit sha 2130cd31eba5800c6028ebec1b19a3d7a5231909

Bump @wordpress/block-editor from 4.1.0 to 4.2.0 (#2777)

view details

dependabot-preview[bot]

commit sha b464f0a3659a8742edba36221caeab05a9b46178

Bump browserslist from 4.12.0 to 4.12.1 (#2769)

view details

dependabot-preview[bot]

commit sha 1028353abb8cb2789b59660cfeb44a1c81e8de6d

Bump @wordpress/e2e-test-utils from 4.9.0 to 4.10.0 (#2775)

view details

dependabot-preview[bot]

commit sha d2a727a9b45a8c20a6a810064777bda8c7c12fe2

Bump @storybook/addon-actions from 6.0.0-beta.36 to 6.0.0-beta.37 (#2780)

view details

dependabot-preview[bot]

commit sha cfe05684ec8a4da726d893ec3d496c1e2dc16417

Bump @storybook/addon-knobs from 6.0.0-beta.36 to 6.0.0-beta.37 (#2779)

view details

dependabot-preview[bot]

commit sha d50ca2300c5eed7132ed2707a24eaaa31df0fa4e

Bump @storybook/client-logger from 6.0.0-beta.36 to 6.0.0-beta.37 (#2774)

view details

dependabot-preview[bot]

commit sha bf1364422878e80fccefdff8964d97e89d5edf6d

Bump @wordpress/icons from 2.2.0 to 2.3.0 (#2773) Bumps [@wordpress/icons](https://github.com/WordPress/gutenberg/tree/HEAD/packages/icons) from 2.2.0 to 2.3.0. - [Release notes](https://github.com/WordPress/gutenberg/releases) - [Changelog](https://github.com/WordPress/gutenberg/blob/master/changelog.txt) - [Commits](https://github.com/WordPress/gutenberg/commits/@wordpress/icons@2.3.0/packages/icons) Signed-off-by: dependabot-preview[bot] <support@dependabot.com> Co-authored-by: dependabot-preview[bot] <27856297+dependabot-preview[bot]@users.noreply.github.com>

view details

dependabot-preview[bot]

commit sha 497b1b7a8df9a77f8d4a74793f15da9dd47ea20d

Bump @storybook/addon-storysource from 6.0.0-beta.36 to 6.0.0-beta.37 (#2778)

view details

push time in 7 days

push eventgoogle/web-stories-wp

Diego Varese

commit sha d8146da406fe1cef2f16a6b61467c18db28a23ec

Remove fetch.js and use window.fetch instead

view details

Clinton Volzke

commit sha e2ab1072d462242f7eb16adede694e98d59da874

Remove useMediaReducer folder and move reducer to media/local/reducer.js.

view details

Clinton Volzke

commit sha 2c258edd459e8f6dbe07b05921cbe4463c07fdaa

Create media3p reducer folder structure

view details

Diego Varese

commit sha 9d7391b600acff65955ee658ab3247019231669d

remove extra mockImplementation.

view details

Brittany Feenstra

commit sha 32ab3042530f09a8696df947357fed186c4591d9

clean up template detail nav bar to be reusable for story details as well

view details

dependabot-preview[bot]

commit sha 1fb2d94eebaa2f2048a9ebdf50abb29cbc0562a4

Bump @testing-library/jest-dom from 5.10.1 to 5.11.0 (#2758) Bumps [@testing-library/jest-dom](https://github.com/testing-library/jest-dom) from 5.10.1 to 5.11.0. - [Release notes](https://github.com/testing-library/jest-dom/releases) - [Changelog](https://github.com/testing-library/jest-dom/blob/master/CHANGELOG.md) - [Commits](https://github.com/testing-library/jest-dom/compare/v5.10.1...v5.11.0) Signed-off-by: dependabot-preview[bot] <support@dependabot.com> Co-authored-by: dependabot-preview[bot] <27856297+dependabot-preview[bot]@users.noreply.github.com>

view details

dependabot-preview[bot]

commit sha 496ab65a89e059222fd83e5b894ac11f93855aba

Bump @wordpress/blocks from 6.18.0 to 6.19.0 (#2740) Co-authored-by: dependabot-preview[bot] <27856297+dependabot-preview[bot]@users.noreply.github.com>

view details

dependabot-preview[bot]

commit sha cbbbccf605ea8e85e4920bc5161a31bb333009ce

Bump @wordpress/babel-plugin-import-jsx-pragma from 2.6.0 to 2.7.0 (#2742) Co-authored-by: dependabot-preview[bot] <27856297+dependabot-preview[bot]@users.noreply.github.com>

view details

Brittany Feenstra

commit sha d38a807d0d8398ddb57f7a49aaf2f7ec82356759

check if click handler for bookmarking is present before rendering button for bookmarking

view details

Brittany Feenstra

commit sha 002865b81c82bb6812681b165f765ddf5897baa1

keep flag and use a callback :)

view details

Clinton Volzke

commit sha 5563c694839770caacebcdcd1b3c833ce420b35b

Merge branch 'master' into task/2424-move-local-reducer

view details

Clinton Volzke

commit sha cfb61910d2ade5036a81be3fa1c507e2b3075a07

Merge branch 'task/2424-move-local-reducer' into task/2427-media-reducer-folders

view details

Clinton Volzke

commit sha d42e965b3b607213bfb33f2e2d78b6e407f1918e

Merge pull request #2722 from google/task/2424-move-local-reducer

view details

Clinton Volzke

commit sha ff19b6a086210daf25d5fff361aac9952809eeb1

Add test for media3p/reducer.js

view details

Clinton Volzke

commit sha 2656d0cf867200416978d87717504d1f8399449e

Move state initial values to use reducer function defaults

view details

Clinton Volzke

commit sha 927c5e8bf5e3f9fe0542d2b68a4c1324140536b4

Move context value provider from MediaProvider to local/useContextValue

view details

Clinton Volzke

commit sha 06eb30bd2c75af76c03fa272531652263ad7420d

Move context value provider from MediaProvider to local/useContextValue

view details

Clinton Volzke

commit sha a2f3cde316877652de46b66113eb4e1325507271

Create media3p state folder structure

view details

Diego Varese

commit sha 6f44f87fa4ef2b2807a37b4cc4ac50ad74b2a2c4

Log statusText.

view details

Diego Varese

commit sha 25b3d6f6812e857a6c4b55df67bc0a448be2a7c5

Merge pull request #2715 from google/media3p-api-fetcher Remove fetch.js and use window.fetch instead

view details

push time in 7 days

push eventgoogle/web-stories-wp

Wassim Gharbi

commit sha 80fe12cc1e32d34fcad2ecf96a88356ca4fa4d24

Added Karma tests

view details

push time in 7 days

push eventgoogle/web-stories-wp

Wassim Gharbi

commit sha ec36bbac11a6719dd03ad5e96b1da0679942d75c

Added karma test

view details

push time in 7 days

PR opened ampproject/amphtml

Nit warning text fix for `amp-sidebar` being descendant of body

Follow up to #28867

+2 -2

0 comment

2 changed files

pr created time in 7 days

create barnchwassgha/amphtml

branch : sidebar/warning

created branch time in 7 days

issue commentgoogle/web-stories-wp

Firefox preset circles partially filled

Moving to QA

merapi

comment created time in 7 days

push eventgoogle/web-stories-wp

Wassim Gharbi

commit sha 7f1186f29747071f9278d0ec76d7ea693350904b

Change default shape color (#2858)

view details

push time in 7 days

delete branch google/web-stories-wp

delete branch : fix/shape-color

delete time in 7 days

PR merged google/web-stories-wp

Change default shape color Elements: Shape Type: Enhancement cla: yes

Summary

Changes the default shape color from #ffffff to #c4c4c4

User-facing changes

Shapes should be more visible by default on white backgrounds.

Testing Instructions

  1. Insert a shape by either dragging it or clicking on it
  2. Observe the shape's color, should no longer be white

<!-- Please reference the issue(s) this PR addresses. -->

Fixes #2819

+2 -2

2 comments

1 changed file

wassgha

pr closed time in 7 days

issue closedgoogle/web-stories-wp

Shapes Added As White

Bug Description

Adding a shape to an image appears in white - unable to see when defaulting to a white background

Expected Behaviour

Shape should not default as #FFFFFF

Steps to Reproduce

  • create new page
  • select Shapes tab
  • click shape to add to page

note white shape added

Screenshots

https://drive.google.com/file/d/11gK6xGkQj89n-4u0Hg2OElqVyzfrXPQ0/view

image

Additional Context

<!-- Please complete the following information. -->

  • Plugin Version:
  • Operating System: Win10
  • Browser: Chrome (latest)

Do not alter or remove anything below. The following sections will be managed by moderators only.

Acceptance Criteria

  • Shapes should be added with color #EEEEEE

Implementation Brief

<!-- One or more bullet points for how to technically implement the feature. -->

closed time in 7 days

csossi

push eventgoogle/web-stories-wp

Wassim Gharbi

commit sha 18fe750cf1f32894cf431b55a00f0e4b3c637155

Change default shape color

view details

push time in 7 days

push eventgoogle/web-stories-wp

Wassim Gharbi

commit sha 2eda2d676c99f953f4a0a61617c04722477ad52e

Change default shape color

view details

push time in 7 days

push eventgoogle/web-stories-wp

Wassim Gharbi

commit sha 19034c9a84fe20d81e26f8f763b33401c4718e40

Change default shape color

view details

push time in 7 days

PR opened google/web-stories-wp

Change default shape color

Summary

Changes the default shape color from #ffffff to #eeeeee

User-facing changes

Shapes should be more visible by default on white backgrounds.

Testing Instructions

  1. Insert a shape by either dragging it or clicking on it
  2. Observe the shape's color, should no longer be white

<!-- Please reference the issue(s) this PR addresses. -->

Fixes #2819

+2 -2

0 comment

1 changed file

pr created time in 7 days

create barnchgoogle/web-stories-wp

branch : fix/shape-color

created branch time in 7 days

issue commentampproject/amphtml

AMP multiple video auto-playing issue

@alanorozco to verify but this sounds to me like a bug in visibility of the first video, autoplaying seems to initialize correctly but does not trigger

ngurav

comment created time in 7 days

Pull request review commentgoogle/web-stories-wp

Workspace: Dark UI for Font Picker

 function FontPicker({ onChange, lightMode = false, placeholder, value }) {         <FontPickerTitle>{value || placeholder}</FontPickerTitle>         <DropDownIcon />       </FontPickerSelect>-      <Popup anchor={ref} isOpen={isOpen} fillWidth={DEFAULT_WIDTH}>+      <Popup+        showOverflow

Correct!

carlos-kelly

comment created time in 7 days

pull request commentampproject/amphtml

✨ Warn when amp-sidebar is not a direct descendent of body

Hey @morsssss , amp-sidebar is indeed the only case covered here, ${TAG} will be replaced by amp-sidebar so I thought it made sense in context. What did you have in mind?

wassgha

comment created time in 8 days

issue commentampproject/amphtml

AMP multiple video auto-playing issue

Would be great if you could please provide a demo url for this.

ngurav

comment created time in 8 days

PR opened google/web-stories-wp

[WIP] Blob editor

Summary

Experimentation branch for shape editing.

Relevant Technical Choices

<!-- Please describe your changes. -->

To-do

<!-- A list of things that need to be addressed in this PR or follow-up changes. -->

User-facing changes

<!-- Please describe your changes. -->

Testing Instructions

<!-- How can the changes in this PR be verified? Relevant for QA and user acceptance testing. -->


<!-- Please reference the issue(s) this PR addresses. -->

Fixes #686

+148 -4

0 comment

5 changed files

pr created time in 9 days

create barnchgoogle/web-stories-wp

branch : shapes/blob-editor

created branch time in 9 days

PR opened google/web-stories-wp

Ability to expand panels using shortcuts

Summary

Adds ability to use keyboard shortcuts to expand design panels, implements the <kbd>mod+k</kbd> shortcut to add a link.

Relevant Technical Choices

Extended the Panel element with a shortcut prop, not sure if that's ideal but it avoids having to use a context.

User-facing changes

Users are now able to use <kbd>⌘+k</kbd> to add a link to elements.

Testing Instructions

  1. Insert an element that supports links (preferably text, since the text design panel is long enough to observe scrolling)
  2. Select the element
  3. Press <kbd>⌘+k</kbd>
  4. Observe that if the Link design panel was collapsed it would be expanded, scrolled into view and the URL field would be highlighted

<!-- Please reference the issue(s) this PR addresses. -->

Fixes #732

+70 -24

0 comment

5 changed files

pr created time in 11 days

create barnchgoogle/web-stories-wp

branch : links/shortcut

created branch time in 11 days

issue commentgoogle/web-stories-wp

Media Edit Mode: Extend draggable area to include shaded area

@samitron7 I'd like to confirm that the desired behavior is for the area outside the box (area #3 in the screenshot) to be draggable as well even though clicking that area is already assigned to closing the editor? (It makes sense for me to have area #2 be draggable, but not sure about #3) Screen Shot 2020-06-26 at 2 07 28 AM

wassgha

comment created time in 11 days

issue commentgoogle/web-stories-wp

Media Edit Mode: display different cursor where panning is allowed

Created https://github.com/google/web-stories-wp/issues/2765

miina

comment created time in 11 days

issue openedgoogle/web-stories-wp

Media Edit Mode: Extend draggable area to include shaded area

Feature Description

See comment at https://github.com/google/web-stories-wp/issues/1192#issuecomment-631926009


Do not alter or remove anything below. The following sections will be managed by moderators only.

Acceptance Criteria

<!-- One or more bullet points for acceptance criteria. -->

Implementation Brief

<!-- One or more bullet points for how to technically implement the feature. -->

created time in 11 days

issue commentgoogle/web-stories-wp

Media Edit Mode: display different cursor where panning is allowed

@swissspidy it's approved, this is the PR https://github.com/google/web-stories-wp/pull/2754

miina

comment created time in 11 days

issue commentgoogle/web-stories-wp

Media Edit Mode: display different cursor where panning is allowed

I believe the cursor change is still needed so let's keep this issue for the cursor change and spin off the draggable area change into another issue.

miina

comment created time in 11 days

Pull request review commentgoogle/web-stories-wp

Add 'Enter' key as a trigger to enter edit mode

 function useCanvasKeys(ref) {     [arrangeSelection]   ); +  // Edit mode+  useGlobalKeyDownEffect(+    'enter',+    () => {+      if (selectedElements.length === 0) {+        return;+      }++      const { type, id } = selectedElements[0];+      const { hasEditMode } = getDefinitionForType(type);+      // Only handle Enter key for editable elements+      if (!hasEditMode) {+        return;+      }++      setEditingElement(id);

The text editor has more specificity for the <kbd>Enter</kbd> event so it should be able to take over. I'll add tests!

wassgha

comment created time in 12 days

Pull request review commentgoogle/web-stories-wp

Scrollwheel support for the image editor

 function MediaEdit({ element, box }) {     ref: setFullMedia,     draggable: false,     opacity: opacity / 100,+    onClick: clearEditing,

See comment on @miina 's review, this is now needed because I removed pointer-events: none in order to be able to capture the wheel event on the faded part

wassgha

comment created time in 12 days

pull request commentgoogle/web-stories-wp

Smooth media editor zooming + keyboard user detection refactor

@dvoytenko can this be merged?

wassgha

comment created time in 12 days

PR opened google/web-stories-wp

Different cursor on the image editor indicating panning

Summary

Simple change for displaying a different cursor on the draggable portions of the image/video editor

Relevant Technical Choices

None

To-do

None

User-facing changes

User will see a grab cursor instead of the default cursor when panning/moving the image in edit mode

Testing Instructions

  1. Insert an shape into the canvas
  2. Drag an image/video onto the shape to created a masked image/video
  3. Enter edit mode by double-clicking on the element
  4. Try to move/pan the image/video, the cursor should look like a hand instead of its default appearance.

<!-- Please reference the issue(s) this PR addresses. -->

Fixes #1192

+1 -0

0 comment

1 changed file

pr created time in 12 days

create barnchgoogle/web-stories-wp

branch : edit/cursor

created branch time in 12 days

PR opened google/web-stories-wp

Add 'Enter' key as a trigger to enter edit mode

Summary

Allow the <kbd>Enter</kbd> key to enter the edit mode for images and videos

Relevant Technical Choices

No significant choices

To-do

None

User-facing changes

User can now enter the edit mode by pressing the <kbd>Enter</kbd> key

Testing Instructions

From the original issue: Scenario 1:

  1. Add an image from Media Library to the Workspace
  2. Press <kbd>Enter</kbd>
  3. Enter edit mode for images.

Scenario 2:

  1. Select/focus an image in the workspace
  2. Press <kbd>Enter</kbd>
  3. Enter edit mode

<!-- Please reference the issue(s) this PR addresses. -->

Fixes #1830

+26 -2

0 comment

1 changed file

pr created time in 12 days

create barnchgoogle/web-stories-wp

branch : edit/enter

created branch time in 12 days

Pull request review commentgoogle/web-stories-wp

Scrollwheel support for the image editor

 function MediaEdit({ element, box }) {    const isImage = 'image' === type;   const isVideo = 'video' === type;++  const wheelHandler = useCallback(+    (evt) => {+      let newScale = scale || 100;+      if (event.deltaY > 0) {+        newScale += 10;+      } else {+        newScale -= 10;+      }+      setProperties({ scale: newScale });+      evt.preventDefault();+    },+    [setProperties, scale]+  );++  useEffect(() => {+    const editEl = editElementRef.current;+    editEl.addEventListener('wheel', wheelHandler, {+      passive: false,+    });+    return () => {+      editEl.removeEventListener('wheel', wheelHandler, {+        passive: false,+      });+    };+  });+   return (-    <Element>+    <Element ref={editElementRef}>

I added this behavior but that required removing point-events: none on the faded image in order to be able to capture the wheel event. This in turn caused the clicks on the faded image to be captured (and thus it broke closing the editor by clicking on the faded part) so I added a click event that clears editing when the faded part is clicked. Please review that behavior to make sure there are no other repercussions from removing pointer-events: none.

wassgha

comment created time in 12 days

push eventgoogle/web-stories-wp

Wassim Gharbi

commit sha bce29343c80c892892b2a10f198facdcb1eb9d53

Add wheel event to the faded image

view details

push time in 12 days

Pull request review commentgoogle/web-stories-wp

Scrollwheel support for the image editor

 function MediaEdit({ element, box }) {    const isImage = 'image' === type;   const isVideo = 'video' === type;++  const wheelHandler = useCallback(+    (evt) => {+      let newScale = scale || 100;+      if (event.deltaY > 0) {

TIL window.event stores the last event handled so both work! wow.

wassgha

comment created time in 13 days

push eventgoogle/web-stories-wp

Wassim Gharbi

commit sha a41b97e2ed4a0d091c1b91f416e6f3d43241aff5

Same footprint for listener removers

view details

push time in 13 days

push eventampproject/amphtml

Wassim Gharbi

commit sha f311ec6d6e5200b222d58604edd1f134f1e6d817

🐛 Missing condition fix for amp-next-page with JSON config (#28939) * Fix infinite loop on Amp-next-page * Suggested change

view details

push time in 13 days

PR merged ampproject/amphtml

Reviewers
🐛 Missing condition fix for amp-next-page with JSON config cla: yes

Fixes #28924

+15 -5

0 comment

1 changed file

wassgha

pr closed time in 13 days

issue closedampproject/amphtml

amp-next-page v1.0 freezes browser tab

What's the issue?

amp-next-page freezes the browser tab when a remote url is given as src. This happens when the JSON configuration contains the next key

How do we reproduce the issue?

  • repo containing an express app serving static html demonstrating the issue > https://github.com/ags1773/express-app
  • URL of deployed app > https://amp-bug.herokuapp.com
  • Screen Recording for reference https://youtu.be/CTApdnz1v0U

What browsers are affected?

All browsers that I tested on Chrome 83.0.4103.106 (MacBook Pro) Firefox 76.0.1 (MacBook Pro) Chrome 83.0.xx (Android 9)

Which AMP version is affected?

amp-next-page version 1.0

Is this a new issue? Or was it always broken? Paste the version of AMP where you saw this issue. Not sure if it's new or existing issue Version 2006050512000

closed time in 13 days

ags1773

push eventampproject/amphtml

Wassim Gharbi

commit sha d2c7c68c5a3ea943f653f40e564e6f785308d084

✨ Warn when amp-sidebar is not a direct descendent of body (#28867) * Warn when amp-sidebar is not a direct descendent of body * Fix warning check

view details

push time in 13 days

PR merged ampproject/amphtml

Reviewers
✨ Warn when amp-sidebar is not a direct descendent of body cla: yes

Fixes #28399

+20 -0

0 comment

2 changed files

wassgha

pr closed time in 13 days

issue closedampproject/amphtml

Warn if <amp-sidebar> isn't a direct child of <body>

I was glad when, in #21895, we removed the requirement for <amp-sidebar> to be a direct child of <body>. There were plenty of cases before where this requirement made it hard to convert a page to AMP. Sometimes you had to rejigger your HTML and CSS substantially.

That said, I just got bit by this while teaching a class yesterday. Trying to code live, I forgot this requirement, and I couldn't tell why my sidebar turned gray along with the rest of the page when the menu was opened. A number of students had the same problem.

Looking at it today, of course it made sense. It's the old issue with the z-index.

Given the way the sidebar works, I don't know of an easy way to make it work consistently when placed anywhere in the DOM. Unless someone who's better at CSS than me has a fix, I'd suggest we output a warning when the sidebar isn't a direct child of the <body>. This is nicely documented, but not everyone notices this caveat 🙄

(/cc @sebastianbenz in case you're curious)

closed time in 13 days

morsssss

push eventampproject/amphtml

Wassim Gharbi

commit sha 985fed47eae03bd926ae6f72890b12bac3bc14b8

✨ amp-facebook fullscreen support (#28141) * Facebook fullscreen support * Updated validator tests

view details

push time in 13 days

PR merged ampproject/amphtml

Reviewers
✨ amp-facebook fullscreen support cla: yes

Closes #28087

+14 -2

3 comments

5 changed files

wassgha

pr closed time in 13 days

issue closedampproject/amphtml

amp-facebook: Cannot play videos in fullscreen mode

What's the issue?

The fullscreen button in the video controls does not work.

How do we reproduce the issue?

Fail:

<amp-facebook
    width="560"
    height="315"
    layout="responsive"
    data-embed-as="video"
    data-href="https://www.facebook.com/nasaearth/videos/10155187938052139/">
</amp-facebook>

Fail:

<amp-facebook
    width="560"
    height="315"
    layout="responsive"
    data-allowfullscreen="true"
    data-embed-as="video"
    data-href="https://www.facebook.com/nasaearth/videos/10155187938052139/">
</amp-facebook>

Pass (copy + paste of embed code from facebook.com):

<iframe
    src="https://www.facebook.com/plugins/video.php?href=https%3A%2F%2Fwww.facebook.com%2Fnasaearth%2Fvideos%2F10155187938052139%2F&show_text=0&width=560" 
    width="560"
    height="315"
    style="border:none;overflow:hidden"
    scrolling="no"
    frameborder="0"
    allowTransparency="true"
    allowFullScreen="true">
</iframe>

What browsers are affected?

  • Google Chrome Version 81.0.4044.122 (Official Build) (64-bit)
  • Perhaps all

Which AMP version is affected?

Powered by AMP ⚡ HTML – Version 2004172112280

closed time in 13 days

jmooring

push eventwassgha/amphtml

Wassim Gharbi

commit sha dd87d3799c3017930269ffb5978fbface0aecfea

Fix warning check

view details

push time in 13 days

push eventwassgha/amphtml

Philip Bell

commit sha 9c434c20c9a3a5fb5634c74f6d2689ca348440af

Remove aria-live attribute on amp-story. (#28860)

view details

Yuxuan Zhou

commit sha 88c8a56dd11a2ba3b9fc5662048d0eaa91d396b6

doc enabled (#28819)

view details

Wassim Gharbi

commit sha 44e35f62982e11f55376cc06337864dbdbbe66dc

🐛 Fix `amp-imgur` embed format (#28143) * Fix amp-imgur embed format * Update extensions/amp-imgur/0.1/amp-imgur.js Co-authored-by: Alan Orozco <alanorozco@users.noreply.github.com> * Fix tests Co-authored-by: Alan Orozco <alanorozco@users.noreply.github.com>

view details

William Chou

commit sha 58a1d281cbd6e3fc2bf99fad3704551489467dbc

Unbreak SL. (#28863)

view details

WhiteSource Renovate

commit sha efcb64c4514eb2ffd1cc328c8a458888f50e10c6

📦 Update dependency renovate to v21.7.1 (#28870)

view details

Yuxuan Zhou

commit sha e05738429980dec194f206176e2b5cab0f7565c0

Support variable expansion in amp-consent (#28700) * support variable expansion in amp-consent * switch to head * type check

view details

Enrique Marroquin

commit sha 0ccf6f4e1b8a08a03ecf73f714add7610543cf05

🔄🗑🚮 Alias amp-story 0.1 to 1.0 and delete code (#28776) * alias amp-story 0.1 to 1.0 * delete generation of 0.1 bundle * delete 0.1 code * deps, more code

view details

glevitzky

commit sha f9426d3fb89cb51c40d7a1faeee6406f63e46a31

Revert "Launch no center css for ad container (#28551)" (#28844) This reverts commit f2843ea4f25c72b5eab4695e37e69ccce63b13e7.

view details

WhiteSource Renovate

commit sha 081ee6915c360d9440e464a2ee3f9646a28cfcd1

📦 Update dependency renovate to v21.8.0 (#28871)

view details

Enrique Marroquin

commit sha 53f591640c25545772a7db8effe7fccec1fa1fc9

🖍 Increase target size of swipe up (#28743) * increase target size of swipe up * Revert "increase target size of swipe up" This reverts commit 09933250af6d5ff857f0848da366af13489e0025. * use padding instead of margins for spacing in page attachment label

view details

Gabriel Majoulet

commit sha 152d92ccc35e86bc1c5ed3ff802a8f7bc2e72dcc

Always prefix auto advance advancement modes with autoAdvance. (#28104) * Always prefix auto advance advancement modes with autoAdvance. * Plural

view details

Enrique Marroquin

commit sha ab06293084522677e915a7ece5e0a76c1605dba0

only add additionaly sandbox flag when iframe was sandboxed previously (#28873)

view details

Yuxuan Zhou

commit sha 28963ab3daeea640b1194fd1cd9a053dbecb89a2

📖 Document all analytics advanced variable syntax (#28822) * add doc * nit

view details

Yuxuan Zhou

commit sha 81ba51c9911b51c3511e126617c70123cbc397af

Include data-vars value to all analytics events by default (#28748) * pass data-vars value by default * add comments * default vars

view details

Shihua Zheng

commit sha baf656ee5ab2767520093921023a4afbf55bd914

Add padding to amp-sticky-ad on all-screen iPhone (#28845) * Add padding to amp-sticky-ad on all-screen iPhone * CHange to safe-area-inset-bottom * remove device gate * Comments

view details

Raghu Simha

commit sha f8ee003f7239be737c03a6626b0a326c5e9aae6a

🏗 Run integration tests and only some unit tests on Sauce Labs, only during push builds (#28838)

view details

Kevin Dwan

commit sha b580a534a9bd5bb18d910548043de289748c71d0

🐛 [amp-list] Call scheduleUnlayout when amp-list container is updated (#28781) * Schedule unlayout when amp-list container is updated * Update parent in scheduleUnlayout * Update closure types * Update unit test, found one other place to call unschedulelayout * Added to-do comment for diff use-case * Fix a check-types issue * Fix type issue * Empty commit to re-run travis

view details

Dejan Grbavcic

commit sha 13994faacc52976034230fbde21b82e97eda032d

Adding docs/tests for brid-player dock (#28329)

view details

Caleb Cordry

commit sha f718f20fd81646f383af9b923234592b72cce594

fix stuck (#28868)

view details

Michael Rybak

commit sha daa084a5dd67cd6cf7438e48d569ded50bb2c63f

Validator rollup (#28875) * cl/316183673 Break spec_name into two purposes: a unique id (still named spec_name) and a descriptive error message string (now named descriptive_name). * cl/316158221 Fix amp.dev documentation URLs so as to avoid one redirect.

view details

push time in 13 days

push eventwassgha/amphtml

William Chou

commit sha 58a1d281cbd6e3fc2bf99fad3704551489467dbc

Unbreak SL. (#28863)

view details

WhiteSource Renovate

commit sha efcb64c4514eb2ffd1cc328c8a458888f50e10c6

📦 Update dependency renovate to v21.7.1 (#28870)

view details

Yuxuan Zhou

commit sha e05738429980dec194f206176e2b5cab0f7565c0

Support variable expansion in amp-consent (#28700) * support variable expansion in amp-consent * switch to head * type check

view details

Enrique Marroquin

commit sha 0ccf6f4e1b8a08a03ecf73f714add7610543cf05

🔄🗑🚮 Alias amp-story 0.1 to 1.0 and delete code (#28776) * alias amp-story 0.1 to 1.0 * delete generation of 0.1 bundle * delete 0.1 code * deps, more code

view details

glevitzky

commit sha f9426d3fb89cb51c40d7a1faeee6406f63e46a31

Revert "Launch no center css for ad container (#28551)" (#28844) This reverts commit f2843ea4f25c72b5eab4695e37e69ccce63b13e7.

view details

WhiteSource Renovate

commit sha 081ee6915c360d9440e464a2ee3f9646a28cfcd1

📦 Update dependency renovate to v21.8.0 (#28871)

view details

Enrique Marroquin

commit sha 53f591640c25545772a7db8effe7fccec1fa1fc9

🖍 Increase target size of swipe up (#28743) * increase target size of swipe up * Revert "increase target size of swipe up" This reverts commit 09933250af6d5ff857f0848da366af13489e0025. * use padding instead of margins for spacing in page attachment label

view details

Gabriel Majoulet

commit sha 152d92ccc35e86bc1c5ed3ff802a8f7bc2e72dcc

Always prefix auto advance advancement modes with autoAdvance. (#28104) * Always prefix auto advance advancement modes with autoAdvance. * Plural

view details

Enrique Marroquin

commit sha ab06293084522677e915a7ece5e0a76c1605dba0

only add additionaly sandbox flag when iframe was sandboxed previously (#28873)

view details

Yuxuan Zhou

commit sha 28963ab3daeea640b1194fd1cd9a053dbecb89a2

📖 Document all analytics advanced variable syntax (#28822) * add doc * nit

view details

Yuxuan Zhou

commit sha 81ba51c9911b51c3511e126617c70123cbc397af

Include data-vars value to all analytics events by default (#28748) * pass data-vars value by default * add comments * default vars

view details

Shihua Zheng

commit sha baf656ee5ab2767520093921023a4afbf55bd914

Add padding to amp-sticky-ad on all-screen iPhone (#28845) * Add padding to amp-sticky-ad on all-screen iPhone * CHange to safe-area-inset-bottom * remove device gate * Comments

view details

Raghu Simha

commit sha f8ee003f7239be737c03a6626b0a326c5e9aae6a

🏗 Run integration tests and only some unit tests on Sauce Labs, only during push builds (#28838)

view details

Kevin Dwan

commit sha b580a534a9bd5bb18d910548043de289748c71d0

🐛 [amp-list] Call scheduleUnlayout when amp-list container is updated (#28781) * Schedule unlayout when amp-list container is updated * Update parent in scheduleUnlayout * Update closure types * Update unit test, found one other place to call unschedulelayout * Added to-do comment for diff use-case * Fix a check-types issue * Fix type issue * Empty commit to re-run travis

view details

Dejan Grbavcic

commit sha 13994faacc52976034230fbde21b82e97eda032d

Adding docs/tests for brid-player dock (#28329)

view details

Caleb Cordry

commit sha f718f20fd81646f383af9b923234592b72cce594

fix stuck (#28868)

view details

Michael Rybak

commit sha daa084a5dd67cd6cf7438e48d569ded50bb2c63f

Validator rollup (#28875) * cl/316183673 Break spec_name into two purposes: a unique id (still named spec_name) and a descriptive error message string (now named descriptive_name). * cl/316158221 Fix amp.dev documentation URLs so as to avoid one redirect.

view details

Malte Ubl

commit sha 5ba7326cceb2608e7031fb52a7da489059d43b1c

✨ Add a defense-in-depth to the viewer in case communication fails (#28807) This will declare a doc to be visible if it isn't but gets a user action. In Google Search this should never happen, because the doc isn't actually shown until the viewer handshake happened. But other viewers do show documents right away. Fixes #28227

view details

Elijah Soria

commit sha a812458154980791e2d00fc6f39a13f711f05648

♻️ Refactor AES-GCM decryption function. (#28753) * Refactor AES-GCM decryption function. * Rename variables and fix indents

view details

Justin Ridgewell

commit sha 49aa278f2e0ca400f6f19ddd4e58b904085e14b3

Fix Intrinsic layout in IE11 (#28806) * Use a correctly-sized transparent png for intrinsic layout in IE * Add comments * Add integration test for intrinsic size * Move to utils * Allowlist the query selector * Fix function name * Fix types * Use IS_ESM to guard transparentPng usage * Skip test in Safari No idea why it fails, but I can manually verify that the SVG (which Safari uses) scales correctly. * Review updates * Fix types * Fix tests

view details

push time in 13 days

push eventwassgha/amphtml

Wassim Gharbi

commit sha 37057a8a1cc11ea02e065dd04a08e86649690234

Suggested change

view details

push time in 13 days

pull request commentgoogle/web-stories-wp

Single blob shape + fix blob alignment

@pbakaus or @samitron7 to confirm that this temporary change is ok

wassgha

comment created time in 18 days

Pull request review commentampproject/amphtml

🐛Support non-single-doc AMP docs for video docking

 export class VideoDocking {    * @private    */   getDoc_() {-    return /** @type {!Document} */ (this.ampdoc_.getRootNode());+    const root = this.ampdoc_.getRootNode();+    return /** @type {!Document} */ (root.ownerDocument+      ? root.ownerDocument+      : root);
    return /** @type {!Document} */ (root.ownerDocument || root);
cramforce

comment created time in 18 days

create barnchwassgha/amphtml

branch : fix/next-page-loop

created branch time in 19 days

issue commentampproject/amphtml

amp-next-page v1.0 freezes browser tab

@ags1773 Thank you for the highly detailed bug report and demo pages! Looking into this.

ags1773

comment created time in 20 days

push eventgoogle/web-stories-wp

Clinton Volzke

commit sha 0c63ac07c79a6f7c1d8d609e4b20fbc853bd673f

Remove fetch after upload

view details

Clinton Volzke

commit sha 88c43e4352d6d5370276c6ae1d7ad695886e6abe

Add selectors to useContext calls

view details

Clinton Volzke

commit sha 1104cf408a1dc6c5ff0f2745c49ab1069122fa2f

Fix selector in editLayer.js

view details

Clinton Volzke

commit sha cdf472a4cd8b7f189b13af9e47635d8da5793c52

Move processing and processed from media context state to a ref scoped to uploadVideoPoster

view details

Clinton Volzke

commit sha 47c045dd93d0a2e945b5e19a7e1366d47b921aa3

Undo previous commit that was pushed by mistake

view details

Clinton Volzke

commit sha a9943703044650a39601223164b8b513d00098f3

Merge branch 'master' into fix/1466-add-context-selectors

view details

Clinton Volzke

commit sha 658d719f453a18f6c4c1e406181bee9fc035ea75

Add a test for updating media resources from the upload rpc response

view details

Clinton Volzke

commit sha 062bd68694fb36005e96c8ed0d93eee2ec918cdd

Merge branch 'master' into fix/remove-fetch-after-upload

view details

Clinton Volzke

commit sha a1f4d1d253f1a665b674dfe7bc1453eccaac2301

Merge branch 'master' into fix/1466-add-context-selectors

view details

Clinton Volzke

commit sha faa56ec85010a78f9e5e7deefb6b1fac2e92b7da

Add new instances of useMedia and useStory.

view details

Clinton Volzke

commit sha 10961d4d20e24528ab8c05be37729f8e1f4c3c7a

Fix lint error

view details

Clinton Volzke

commit sha 50a278b1d6f02e54f64e62c0329d7125a622fc39

Merge branch 'master' into fix/remove-fetch-after-upload

view details

Miina Sikk

commit sha 292d162bab0769057475c0143b34d1601d3dec7a

Temporarily remove textStyles from presets logic.

view details

Miina Sikk

commit sha 9abd5357c128b0c1efb6f33986c98a6b659bb5a0

Add test data.

view details

Miina Sikk

commit sha ec9b47ad54da1dcec0a65bc6a742804d9222b9a1

Add removing element out of canvas for single selection.

view details

Miina Sikk

commit sha d92cb78f15f8867a183a49238b89e64b00b6d386

Add deleting elements to multi-selection, too.

view details

Miina Sikk

commit sha 02d0521f90b5b296cc53389a2a32f1b7d24d9005

Prevent dragging when cntrl is pressed.

view details

Miina Sikk

commit sha 984f6e2407ee25e1151bcbf8cd389d44e2d40fd8

Add check for right-click button.

view details

Miina Sikk

commit sha 9852322279c814582827960472601129d60a5633

Add test placeholders.

view details

Miina Sikk

commit sha 3da85732355b8866d9cf2a7a28d80c438989399d

Update Moveable.

view details

push time in 20 days

PR opened google/web-stories-wp

Single blob shape + fix blob alignment

Summary

Temporarily removes the 8 different blob shapes and replaces them with a single shape in preparation for #686

Relevant Technical Choices

Added a migration script that switches all blobs to the single blob object.

User-facing changes

❗❗ This alters the appearance of stories that used the old blobs in two ways: Stories that used blob-1 will now see a bigger blob since the path was changed to fill empty space and stories that used other blobs will be replaced by blob-1

Testing Instructions

  1. Drag a blob element into the canvas
  2. Notice how the outline, drop target and frame align to the blob's shape (no longer showing empty space around it)

<!-- Please reference the issue(s) this PR addresses. -->

Fixes #1896

+238 -69

0 comment

4 changed files

pr created time in 20 days

create barnchgoogle/web-stories-wp

branch : fix/blobs

created branch time in 20 days

issue commentgoogle/web-stories-wp

Edit mode slider has no visible focus state

@samitron7 any update on this?

pbakaus

comment created time in 20 days

create barnchgoogle/web-stories-wp

branch : image-editor/scroll-wheel

created branch time in 20 days

PR opened google/web-stories-wp

Scrollwheel support for the image editor

Summary

Zoom in/out of the image/video using the scroll wheel

User-facing changes

User now has the ability to use the scroll wheel to zoom in/out while editing an image or a video

Testing Instructions

  1. Insert an image into the canvas
  2. Double click the element to enter edit mode
  3. Use the scroll wheel / trackpad gesture to zoom in and out

<!-- Please reference the issue(s) this PR addresses. -->

Fixes #1427

+30 -2

0 comment

1 changed file

pr created time in 20 days

Pull request review commentgoogle/web-stories-wp

Keyboard navigation for media editor

 function EditPanMovable({   const translateRef = useRef([0, 0]);   const transformFlip = getTransformFlip(flip); -  const update = () => {+  const {+    state: { framesLayer },+  } = useCanvas();++  const update = useCallback(() => {     const [tx, ty] = translateRef.current;     fullMedia.style.transform = `translate(${tx}px, ${ty}px) ${       transformFlip ?? ''     }`;     croppedMedia.style.transform = `translate(${tx}px, ${ty}px) ${       transformFlip ?? ''     }`;-  };+  }, [croppedMedia, fullMedia, transformFlip]);    // Refresh moveables to ensure that the selection rect is always correct.   useEffect(() => {     moveableRef.current.updateRect();   }); +  useKeyDownEffect(+    framesLayer,

It seems like the current behavior of mousetrap is to prevent the propagation of captured key events from child to parent, however I've tried using EditElement, EditLayer and EditPageArea to capture these events with no success, the only thing that seems to be working is strangely framesLayer. Any idea as to why that happens?

wassgha

comment created time in 20 days

delete branch google/web-stories-wp

delete branch : fix/drop-target-order

delete time in 21 days

push eventgoogle/web-stories-wp

Wassim Gharbi

commit sha deec488fd5d5524544b1749e46907c06371f1c2a

Drop target prioritization (#1994) * Fix drop target sorting * Revert opacity * Memoize sorted drop target IDs * Karma tests for drop target order Co-authored-by: merapi <marcin@webskill.pl>

view details

push time in 21 days

PR merged google/web-stories-wp

Drop target prioritization Pod: Workspace Type: Enhancement cla: yes

Closes #943

Fixes drop target targeting the lower z-index elements instead of the highest element on the stack.

+158 -4

7 comments

3 changed files

wassgha

pr closed time in 21 days

issue closedgoogle/web-stories-wp

Drop target prioritizing covered (not top) element

Bug Description

Per comment below, the overarching issue here is that drop targets are prioritizing the covered element when two elements are in the same area. We should prioritize the visible (top) element.

Expected Behaviour

We should prioritize the visible (top) element for drop targets.

Steps to Reproduce

  1. Add a new page
  2. Add a media element as element (not bg)
  3. Click to set the media element as fill
  4. Drag a new media element to replace the fill in what looks to be the fill drop target
  5. See that nothing changes (unless you unfill the first media element, in which case you'll see the second media element being background now).

Screenshots

fill-droptarget


Do not alter or remove anything below. The following sections will be managed by moderators only.

Acceptance Criteria

QA Instructions

closed time in 21 days

barklund

push eventgoogle/web-stories-wp

Wassim Gharbi

commit sha c7ae2c39ea9fec13e17d2327798362ad047ccafd

Adapt popup height to contents (#2306) * Adapt popup height to contents * Add onViewChange. * Suggested changes * onViewChange optional Co-authored-by: Miina Sikk <miina.sikk@gmail.com>

view details

push time in 21 days

delete branch google/web-stories-wp

delete branch : fix/popup-height

delete time in 21 days

PR merged google/web-stories-wp

Adapt popup height to contents cla: yes

Summary

Makes the popup component dynamically adapt to height changes of its content, thereby preventing scrollable overflow (especially visible on the calendar element which switching views, see https://github.com/google/web-stories-wp/pull/1743#discussion_r427682509).

To-do

  • [x] Trigger the height change automatically without need for a scroll event

User-facing changes

  • Link popups are now fixed (no longer showing an unnecessary scroll bar)
  • Calendar will now be fully visible without need for scrolling

Testing Instructions

  • See https://github.com/google/web-stories-wp/pull/1743#discussion_r427682509

<!-- Please reference the issue(s) this PR addresses. -->

Fixes #1931 , see context on https://github.com/google/web-stories-wp/pull/1743#discussion_r427682509 Part of #1082 Fixes #2343

+44 -24

8 comments

5 changed files

wassgha

pr closed time in 21 days

issue closedgoogle/web-stories-wp

Tooltips: tooltip with longer text goes out of the screen

Bug Description

When longer text is added to the tooltip, it stays on one line causing the tooltip to go out of the screen. <!-- A clear and concise description of what the bug is. -->

Expected Behaviour

Tooltip should wrap the text instead to always stay within the borders of the viewport. <!-- Please describe clearly and concisely what the expected behaviour should be. -->

Steps to Reproduce

  1. Add a tooltip with longer text to something in the Design Panel
  2. See the tooltip partially not visible. <!-- Please provide detailed steps on how to reproduce the bug. -->

Screenshots

Screenshot 2020-06-10 at 17 16 20

<!-- If applicable, please add screenshots to help explain your problem. Bonus points for videos! -->

Additional Context

<!-- Please complete the following information. -->

  • Plugin Version:
  • Operating System:
  • Browser:

Do not alter or remove anything below. The following sections will be managed by moderators only.

Acceptance Criteria

<!-- One or more bullet points for acceptance criteria. -->

Implementation Brief

<!-- One or more bullet points for how to technically implement the feature. -->

closed time in 21 days

miina

issue closedgoogle/web-stories-wp

Popup: proper height/width handling with reasonable defaults

Feature Description

It would be good to limit popup to some width/height by default and allow overriding these values per use case.

If the popup content exceeds the limits, scrolling will help.

Additionally, the popup should adjust to width/height changes of the content. For example, if the popup is displayed in the bottom edge of the viewport and the content was previously 100px, and then changes to 300px, part of the popup will get hidden "below" the bottom edge of the viewport. Video with example.

<!-- A clear and concise description of what the problem is and what you want to happen. -->

Alternatives Considered

<!-- A clear and concise description of any alternative solutions or features you've considered. -->

Additional Context

<!-- Add any other context or screenshots about the feature request. -->


Do not alter or remove anything below. The following sections will be managed by moderators only.

Acceptance Criteria

<!-- One or more bullet points for acceptance criteria. -->

Implementation Brief

<!-- One or more bullet points for how to technically implement the feature. -->

closed time in 21 days

miina

push eventgoogle/web-stories-wp

Brittany Feenstra

commit sha a5b2731d36df9436588c16b48e9223fbbd480b61

date formating util w/ tests and setting up in my stories grid and list views

view details

Brittany Feenstra

commit sha 4befb56ca0fa69d13909a04b79d04c9bb08bf3bc

storybook for storyGridView, the preview does not work but the layout does. mock data for storybook as a util. some date util clean up

view details

Brittany Feenstra

commit sha 0c7b041b7aceb4e719e99953340d53357e55ee4f

import cleanup for girdStoryView

view details

Brittany Feenstra

commit sha 11880bb91d08b2a5b334039ce24f0794f4e6a54a

removing old sanity check on status matching caption

view details

Brittany Feenstra

commit sha 58b0dbef0b4ea3c2a248536a162e0d8627ab736c

no need to call edit function inline - this has no functional difference but still

view details

Brittany Feenstra

commit sha 0797e012bd8e4e56b9f8f06df802be16e515ad71

clean up translation for modified date string in card item

view details

Brittany Feenstra

commit sha 50855f175cb4292ce22ce073bb70cf25f65dbf25

moving date formatting to the card title level and memoizing

view details

Brittany Feenstra

commit sha 60b46220a916f2c7231edd2bbbadafeb6a77a7f4

some organization of imports

view details

Brittany Feenstra

commit sha 824734a280cb3c39172b17da1b98805d023f850f

moving required for users prop type to component level so that we can reuse the shape without it being required. updating displayDate propType to object not string

view details

Brittany Feenstra

commit sha dab94bee031ab7bfed9fd5a62d128aa78918d9f9

adding check for user name to display author

view details

Brittany Feenstra

commit sha faaadca314e9c23714e59ed4da6f833b9937d526

Merge pull request #1693 from google/feature/1492-my-stories-grid-item-captions #1492 Dashboard: Update story grid item caption

view details

Brittany Feenstra

commit sha 1e23ae6aafced8fb36a2cdd60621c840e9668dac

swapping to use the decoded html version of the title we have access to to turn html symbols from &amp; to characters &

view details

Diego Varese

commit sha 1cc01a1a6479d70931b8d4fc3645a963964f33ff

add feature flags doc to readme.

view details

Diego Varese

commit sha e681935a59bc4ec5de706481ecfb6b6675a2817d

Merge branch 'master' of https://github.com/google/web-stories-wp into flagged

view details

Wassim Gharbi

commit sha 4a2391ca1e07ab3c5311b3256be2a0156e6ca41c

Fixes element measuring relative to fullbleed (better) (#1558) * Fixes element measuring relative to fullbleed (better) * Requested changes

view details

Diego Varese

commit sha df09c8124f9f72de7d635e238d7384c0e451f223

Merge branch 'master' of https://github.com/google/web-stories-wp into flagged

view details

dependabot-preview[bot]

commit sha 53bcf80c2abf8d0250c4141c7ffd5011f8b4dcde

Bump @testing-library/dom from 7.5.1 to 7.5.2 (#1732)

view details

imgbot[bot]

commit sha cc181a2f6d249be28a1404bf541c287ffd892855

[ImgBot] Optimize images (#1723)

view details

Brittany Feenstra

commit sha e9108d63fd3bca94f7a724d5e773303a8c945543

update tests around reshaping story object

view details

Brittany Feenstra

commit sha c3d8b7887cb4b8e042dab91afd86a7683be9dac9

Merge pull request #1730 from google/task/1725-html-encoded-titles Dashboard: Show decoded story titles

view details

push time in 21 days

Pull request review commentgoogle/web-stories-wp

Adapt popup height to contents

 function DatePicker({ currentDate, onChange }) {    return (     <CalendarWrapper ref={nodeRef}>-      <Calendar value={value} onChange={handleOnChange} />+      <Calendar+        value={value}+        onChange={handleOnChange}+        onViewChange={onViewChange}+      />     </CalendarWrapper>   ); }  DatePicker.propTypes = {   onChange: PropTypes.func.isRequired,+  onViewChange: PropTypes.func.isRequired,

No, sorry, it got reverted :)

wassgha

comment created time in 21 days

push eventgoogle/web-stories-wp

Wassim Gharbi

commit sha 67115102f75d77a6018d48689d431c94f27dd472

onViewChange optional

view details

push time in 21 days

pull request commentgoogle/web-stories-wp

Drop target prioritization

@googlebot I consent.

wassgha

comment created time in 21 days

pull request commentgoogle/web-stories-wp

Adapt popup height to contents

Ready!

wassgha

comment created time in 21 days

push eventgoogle/web-stories-wp

Clinton Volzke

commit sha 0c63ac07c79a6f7c1d8d609e4b20fbc853bd673f

Remove fetch after upload

view details

Clinton Volzke

commit sha 88c43e4352d6d5370276c6ae1d7ad695886e6abe

Add selectors to useContext calls

view details

Clinton Volzke

commit sha 1104cf408a1dc6c5ff0f2745c49ab1069122fa2f

Fix selector in editLayer.js

view details

Clinton Volzke

commit sha cdf472a4cd8b7f189b13af9e47635d8da5793c52

Move processing and processed from media context state to a ref scoped to uploadVideoPoster

view details

Clinton Volzke

commit sha 47c045dd93d0a2e945b5e19a7e1366d47b921aa3

Undo previous commit that was pushed by mistake

view details

Clinton Volzke

commit sha a9943703044650a39601223164b8b513d00098f3

Merge branch 'master' into fix/1466-add-context-selectors

view details

Clinton Volzke

commit sha 658d719f453a18f6c4c1e406181bee9fc035ea75

Add a test for updating media resources from the upload rpc response

view details

Clinton Volzke

commit sha 062bd68694fb36005e96c8ed0d93eee2ec918cdd

Merge branch 'master' into fix/remove-fetch-after-upload

view details

Clinton Volzke

commit sha a1f4d1d253f1a665b674dfe7bc1453eccaac2301

Merge branch 'master' into fix/1466-add-context-selectors

view details

Clinton Volzke

commit sha faa56ec85010a78f9e5e7deefb6b1fac2e92b7da

Add new instances of useMedia and useStory.

view details

Clinton Volzke

commit sha 10961d4d20e24528ab8c05be37729f8e1f4c3c7a

Fix lint error

view details

Clinton Volzke

commit sha 50a278b1d6f02e54f64e62c0329d7125a622fc39

Merge branch 'master' into fix/remove-fetch-after-upload

view details

Miina Sikk

commit sha 9abd5357c128b0c1efb6f33986c98a6b659bb5a0

Add test data.

view details

Miina Sikk

commit sha ec9b47ad54da1dcec0a65bc6a742804d9222b9a1

Add removing element out of canvas for single selection.

view details

Miina Sikk

commit sha d92cb78f15f8867a183a49238b89e64b00b6d386

Add deleting elements to multi-selection, too.

view details

Miina Sikk

commit sha 02d0521f90b5b296cc53389a2a32f1b7d24d9005

Prevent dragging when cntrl is pressed.

view details

Miina Sikk

commit sha 984f6e2407ee25e1151bcbf8cd389d44e2d40fd8

Add check for right-click button.

view details

Miina Sikk

commit sha 9852322279c814582827960472601129d60a5633

Add test placeholders.

view details

Miina Sikk

commit sha 3da85732355b8866d9cf2a7a28d80c438989399d

Update Moveable.

view details

Clinton Volzke

commit sha 41a0451a2a7df605e960f33b102c08fb020bd759

Merge branch 'master' into fix/1466-add-context-selectors

view details

push time in 21 days

push eventgoogle/web-stories-wp

Wassim Gharbi

commit sha f1eb370bb50f0e8151c6acfd77443eac136b71f0

Suggested changes

view details

push time in 21 days

pull request commentgoogle/web-stories-wp

Smooth media editor zooming + keyboard user detection refactor

@dvoytenko Ready

wassgha

comment created time in 21 days

Pull request review commentgoogle/web-stories-wp

Smooth media editor zooming + keyboard user detection refactor

 const ResetButton = styled.button`   padding: 1px 8px 0 8px; `; +const ACCEPTED_KEYS = [+  'ArrowUp',+  'ArrowDown',+  'ArrowLeft',+  'ArrowRight',+  'PageUp',+  'PageDown',+];+ function ScalePanel({ setProperties, width, height, x, y, scale }) {+  // Handle different step size for mouse and keyboard users+  const usingKeyboard = useIsUsingKeyboard(null, ACCEPTED_KEYS);

It looks like using shift was dismissed as per the discussions on the original issue, but let me know if that's still needed

wassgha

comment created time in 21 days

push eventgoogle/web-stories-wp

Wassim Gharbi

commit sha 504c33e77ace85fef7886a473bb06114d93db5f2

Suggested changes

view details

push time in 21 days

Pull request review commentgoogle/web-stories-wp

Karma: support synthetic DND events

+/*

Very clean!

dvoytenko

comment created time in 22 days

Pull request review commentampproject/amphtml

✨ Warn when amp-sidebar is not a direct descendent of body

 export class AmpSidebar extends AMP.BaseElement {      this.action_ = Services.actionServiceForDoc(element); +    if (+      this.element.parentNode != this.element.ownerDocument.body &&+      this.element.parentNode != this.getAmpDoc().getBody()

For Shadow

wassgha

comment created time in 22 days

issue commentgoogle/web-stories-wp

Modals and popups should always be on top of all other layers

@csossi can we please verify QA fo these use cases?

merapi

comment created time in 22 days

push eventgoogle/web-stories-wp

Wassim Gharbi

commit sha 176c8e3a95d7605ff24c17c367fae55ba638b933

Remove unnecessary comment

view details

push time in 25 days

PR opened google/web-stories-wp

Smooth media editor zooming + keyboard user detection refactor

Summary

Refactors the detection mechanism for whether the user is a keyboard vs mouse user into a react hook that can be re-used by both the image editor and for the focus styles. Removes the need to have predefined steps while dragging the zoom slider for mouse users.

User-facing changes

Zooming in and out of images while editing should be smoother for mouse users.

Testing Instructions

  1. Insert a photo into the canvas
  2. Double-click to enter edit mode
  3. Using the mouse, slide the zoom slider
  4. There should no longer be any restriction while dragging
  5. Now use the keyboard, the functionality should still work with the arrow keys as well as the page up / page down keys

<!-- Please reference the issue(s) this PR addresses. -->

Fixes #372

+157 -69

0 comment

5 changed files

pr created time in 25 days

push eventgoogle/web-stories-wp

Wassim Gharbi

commit sha a0a5d82575115dc58305089e3f93be675e90e991

Refactor keyboard usage monitor + smoother zooming on photo editor

view details

push time in 25 days

create barnchgoogle/web-stories-wp

branch : fix/editor-zoom

created branch time in 25 days

create barnchwassgha/amphtml

branch : warn/sidebar-child-body

created branch time in 25 days

delete branch wassgha/amphtml

delete branch : amp-imgur-fix

delete time in 25 days

push eventampproject/amphtml

Wassim Gharbi

commit sha 44e35f62982e11f55376cc06337864dbdbbe66dc

🐛 Fix `amp-imgur` embed format (#28143) * Fix amp-imgur embed format * Update extensions/amp-imgur/0.1/amp-imgur.js Co-authored-by: Alan Orozco <alanorozco@users.noreply.github.com> * Fix tests Co-authored-by: Alan Orozco <alanorozco@users.noreply.github.com>

view details

push time in 25 days

more