Giter VIP home page Giter VIP logo

brittni-and-the-polar-bear / generative-art-library Goto Github PK

View Code? Open in Web Editor NEW
0.0 2.0 0.0 2.07 MB

A TypeScript compatible library built on p5.js for creating responsive generative art projects.

Home Page: https://brittni-and-the-polar-bear.github.io/generative-art-library/

License: GNU Affero General Public License v3.0

TypeScript 98.43% JavaScript 1.57%
code-art generative-art p5 p5-js p5js p5js-library typescript

generative-art-library's Introduction

@batpb/genart - generative art library

Copyright (C) 2023-2024 brittni and the polar bear LLC.

A TypeScript compatible library built on p5.js for creating responsive generative art projects.

GitHub Pages

Documentation (coming soon!)

Important Notice

This project is currently in active development. Large changes may be made to the API between minor versions.

Package Stats

CodeQL Node.js Build and Test

NPM Version GitHub Release Date - Published_At GitHub License NPM Downloads

Socket Badge

GitHub issues by-label (bug) GitHub issues by-label (security)

GitHub commits since latest release

GitHub contributors


Getting Started

Install with npm

npm install @batpb/genart

Experiments

run the experiments


LICENSE Information

The source code of this project is licensed under the GNU Affero General Public Version 3.0 License. The full text of the license can be found in the LICENSE file of the root directory.


Resources

Color Names

Color Namer

Color Palettes

color-hex

coolors

culrs

generative-art-library's People

Contributors

azurepolarbear avatar blwatkins avatar dependabot[bot] avatar

Watchers

 avatar  avatar

generative-art-library's Issues

Make Issue Template for brittni and the polar bear

Description

We need an issue template because I can never remember it.

Tasks

  • research how to make issue templates for organizations
  • create issue template for brittni and the polar bear organization

Feature Request - Add Color Contrast Checking and Calculations

Description

Use color contrast npm package to check for contrast between color values.

Add unit test to inform if there is a AAA passing contrast pair within the palette.

Add field to palettes to store valid color contrast pairs.

Add unit test to make sure all color contrast pairs are valid pairs (ratio > 7).

Tasks

  • install color contrast package
  • add methods to base library for evaluating contrast and WGAC compliance
    • contrast ratio
    • AA compliance
      • small text
      • large text
    • AAA compliance
      • large text
      • small text
  • implement/add unit test for all palettes
    • passing if there is at least one AAA small text compliant pair in the palette
  • decide what to do with palettes that do not pass
  • add field to palettes to store valid AAA color contrast pairs (ratio > 7)
  • implement/add unit test for all palettes
    • passing if all color contrast pairs are valid pairs (ratio > 7)

Implement Initial Color Scheme Generation

Description

Create the initial classes for the color scheme creation in generative art projects.

Tasks

  • Color class
  • Color builder
  • ColorGroup class
  • Implement color transitions in both directions
    • Transparency Transition
    • Lerp Transition

Implement Background Color Selection

Description

Implement the selection of a background color.

Choices: black, white, color from color scheme.

We should implement a generic method that allows you to pass an array of items and returns a random item.

There should be a method from the ColorScheme class that returns an array of all possible color objects.

There should be a method for copying a Color object.

Create GitHub Pages for Library

Description

We need a GitHub Pages site to serve as the homepage of the library.

Tasks

  • add docs/ directory
  • add initial index.md file
  • begin pages deployment
  • add docs/ directory to ignored files for TypeScript compilation and Rollup bundling
    • test locally to make sure docs/ files are not included in package export

Calendar and Time Based Color Scheme Probabilities

Description

I would like to implement color scheme probabilities so that the closer you are to certain holidays, the more likely you are to generate a color scheme with a collection matching that holiday.

Tasks

Set Up Repository to Deploy to npm

Description

Set up an actions workflow to deploy the library to npm

Tasks

  • make protected development branch for unreleased changes
  • organize project structure for library deployment
  • test local deployment with $ npm link
  • research GitHub packages
    • Do we need to deploy there, too?
  • set up npm GitHub action
  • test npm GitHub action
  • test pulling library in as a dependency in a separate project

Move Files From Generative Art Project Template

Description

We need to move the source code files from the generative art project template repo to this repo.

Tasks

  • clone repository locally
  • set up all dependencies
  • move current library source files
  • move unit test source files
  • run unit tests locally successfully
  • set up protected branches
  • set up protected tags
    • this repo
    • project template repo
  • set up code scanning
  • set up dependency scanning

Feature Request - Weighted ColorSelectorManager

Description

I would like to have a color selector manager where the distribution of color selectors is weighted.

The weights of the color selectors will be applied to groups of selectors (ColorSelectorManager?) where the distribution of the group is even.

Tasks

  • Implement weighted color selector manager
  • Test weighted color selector manager

Move Full Library Into Main Repository

Description

With the new configuration, we can use paths without any issues! Fantastic!

Now, we need to consolidate the base, color palette, and rgb repositories into this repository.

Tasks

  • base repository
    • move source files
    • move unit test files
    • update README
    • run eslint
    • run unit tests
    • run size-limit
    • generate documentation
    • publish new version of repo
    • test new version in color test repo
      • check "tree-shaking". make sure unnecessary classes/variables are being excluded.
    • deprecate latest versions of @batbp/genart-base
    • deprecate whole package
    • move repo issues
    • mark repository as archive
  • color palettes repository
    • move source files
    • move unit test files
    • run eslint
    • run unit tests
    • run size-limit
    • generate documentation
    • publish new version of repo
    • test new version in color test repo
      • check "tree-shaking". make sure unnecessary classes/variables are being excluded.
    • deprecate latest versions of @batbp/genart-palettes
    • deprecate whole package
    • move repo issues
    • mark repository as archive
  • rgb repository
    • move source files
    • move unit test files
    • run eslint
    • run unit tests
    • run size-limit
    • generate documentation
    • publish new version of repo
    • test new version in color test repo
      • check "tree-shaking". make sure unnecessary classes/variables are being excluded.
    • move repo issues

Create Canvas Context Class

Description

When we set WEBGL for the p5 canvas renderer, the origin of the canvas moves to the center. The values returned by mouseX and mouseY are not updated to reflect this change, so the values end up being larger than what is valid on the canvas.

We need a class that will handle any translations that need to happen when using the WEBGL renderer in a 2D context, as we usually do.

Tasks

  • Create Basic Context Class
  • Ability to Set Renderer Mode
  • Get mouseX and mouseY properly depending on mode
  • Get center of canvas coordinates
    • (0, 0) when using WEBGL renderer
    • (width / 2.0, height / 2.0) with default renderer
  • Map from (0, width) to (-width / 2.0, width / 2.0) when using WEBGL renderer
  • Map from (0, height) to (-height / 2.0, height / 2.0) when using WEBGL renderer

Feature Request - 2024-04-25 - Lerp Color Functions

Description

Implement functionality to steadily transition between colors.

There should be an option to lerp all color components at once (using the lerpColor method) or lerp one color component at a time.

Tasks

  • lerp all components
  • lerp one component at a time
    • provided component order
    • random component order
  • unit tests

Configure Passing Unit Tests as a Pull Request Requirement

Description

We want an actions workflow that runs the unit tests and reports a pass or fail. These tests must pass successfully as a requirement of a valid pull request.

Tasks

  • create unit test workflow
  • test action success
  • test action failure
  • make action a requirement of pull requests
  • test action failure in a pull request
  • test action success in a pull request

Implement HSL Range Color Factories

Description

Implement range color factories for HSL colors.

Tasks

  • implement for all previously established hue ranges
    • all
    • top
    • bottom
    • warm
    • cool
    • missing any?
  • regular range (high saturation, 50% lightness)
  • deep range (high saturation, low lightness)
  • pastel range (low saturation, high lightness)
  • single hue with full range of saturation and brightness
  • range of hues with full range of saturation and brightness

Implement Dependency Security Scanning

Description

Implement security scanning for project dependencies.

Tasks

  • research if dependency security workflow is different from dependency update workflow
  • add dependency security scanning to actions
  • add passing scan as a pull request requirement
  • add badge to README
  • test action running in a pull request

Feature Request - 2024-05-16 - MappableColorSelector Interface

Description

We want a way to indicate for certain color selectors that you can map a range of values to a color in the selector. This can be applicable to palettes (e.g. gradient palettes) or HSL selectors (e.g. mapping to a hue value).

Tasks

  • Create MappableColorSelector Interface
  • PaletteColorSelector should implement the interface
  • add a flag in PaletteColorSelector (isMapLerpActive)
    • when flag is true, map will lerp between colors in the indexes
    • when flag is false, map will choose integer index for color

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.