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.

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

Support gradients for slide background #2

Merged
merged 1 commit into from
Jul 27, 2022
Merged

Conversation

tjinauyeung
Copy link

@tjinauyeung tjinauyeung commented Jul 26, 2022

Adds gradient support for slide backgrounds.

Usage

slide.background = { 
  gradient: { 
    angle: 90, 
    stops: { 
      0: "#FF00FF", 
      100: "#00FF00" 
    } 
  } 
}

How to test

  1. In your terminal, go to demo folder cd ./demos
  2. Run npm i
  3. Run node ./browser_server.mjs
  4. Open up http://localhost:8000/browser/index.html in the browser
  5. Replace the html snippet and run export

@tjinauyeung tjinauyeung self-assigned this Jul 26, 2022
@tjinauyeung tjinauyeung changed the title support gradients for slide background Linear gradients for slide Jul 26, 2022
* @returns XML string
*/
function createGradientElements(gradient: Gradient, internalElements: string): string {
let strXml = '',
Copy link
Author

@tjinauyeung tjinauyeung Jul 27, 2022

Choose a reason for hiding this comment

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

Very imperative code here, but consistent with the style used in the project, see createGlowElement above

stops = gradient.stops

if (!isGradient(gradient)) {
console.warn(`This is not a valid gradient:`, gradient)
Copy link
Author

@tjinauyeung tjinauyeung Jul 27, 2022

Choose a reason for hiding this comment

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

This is handled similar to colors.

When no valid color is found, we log a warning in the console, and use a default color.

See createColorElement fn.

@tjinauyeung tjinauyeung marked this pull request as ready for review July 27, 2022 07:07
@tjinauyeung tjinauyeung changed the title Linear gradients for slide Support gradients for slide background Jul 27, 2022
@sam-pitch
Copy link

sam-pitch commented Jul 27, 2022

When trying to run the node ./browser_server.mjs I get
I just had to run npm i first.

internal/process/esm_loader.js:74
    internalBinding('errors').triggerUncaughtException(
                              ^

Error [ERR_MODULE_NOT_FOUND]: Cannot find package 'express' imported from /home/sam/Code/repos/PptxGenJS/demos/browser_server.mjs
    at new NodeError (internal/errors.js:322:7)
    at packageResolve (internal/modules/esm/resolve.js:732:9)
    at moduleResolve (internal/modules/esm/resolve.js:773:18)
    at Loader.defaultResolve [as _resolve] (internal/modules/esm/resolve.js:887:11)
    at Loader.resolve (internal/modules/esm/loader.js:89:40)
    at Loader.getModuleJob (internal/modules/esm/loader.js:242:28)
    at ModuleWrap.<anonymous> (internal/modules/esm/module_job.js:76:40)
    at link (internal/modules/esm/module_job.js:75:36) {
  code: 'ERR_MODULE_NOT_FOUND'
}

@sam-pitch
Copy link

Screenshot from 2022-07-27 09-44-05

Looks very good to me!

Copy link

@zarkone zarkone left a comment

Choose a reason for hiding this comment

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

looks great!

Interesting that all the compiled code is not in .gitignore

@pastafari
Copy link

@tjinauyeung can we make a plan for attempting to merge changes to upstream?
e.g

  • Should we make a PR from add-gradients to upstream/master or from pitch-main to upstream/master?
  • How do we rebase against changes to upstream?

@tjinauyeung tjinauyeung merged commit f0b2cac into pitch-main Jul 27, 2022
@tjinauyeung tjinauyeung deleted the add-gradients branch July 27, 2022 09:01
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Development

Successfully merging this pull request may close these issues.

4 participants