An online canvas based Pixel Art creation tool for Lospec.com
Go to file
Nicola bf35525458
Merge pull request #21 from liamortiz/master
addColor.js refactored to ColorModule.js
2021-07-05 12:23:04 +02:00
_ext Util changes 2021-06-28 19:54:54 -04:00
.github Update issue templates 2021-05-09 09:46:16 +02:00
css Updated help section 2021-07-01 13:10:08 +02:00
images Finished writing update log 2021-04-29 22:02:43 +02:00
js addColor Refactor 2021-07-04 17:36:15 -04:00
logs Added hex input to colour picker 2021-04-29 16:54:02 +02:00
views Updated help section 2021-07-01 13:10:08 +02:00
.eslintrc.json Apply eslint --fix and fix indentation 2020-04-12 10:58:19 +02:00
.gitignore Track changes to SVG assets in a repository 2021-04-25 18:17:32 +02:00
.nvmrc Configure nvm to help us avoid constant switching between lockfile versions 1 and 2 by suggesting which Node.js/npm version to use 2021-04-26 23:14:12 +02:00
build.js Added latest log loading 2021-04-28 23:39:14 +02:00
changelog.json added layers to changelog 2020-09-09 04:00:51 +00:00
debug.log Finished Line Tool 2021-01-14 15:28:57 -05:00
Model.drawio Added random splash images 2021-04-27 11:00:27 +02:00
package-lock.json IIFE and CSS Fixes 2021-06-27 12:45:32 -04:00
package.json Make it possible to run server with file-watching but without automatic webpage reload 2021-04-28 23:51:14 +02:00
README.md Merge pull request #12 from nkoder/reload_page_on_code_change_only_if_asked_to 2021-04-29 22:44:49 +02:00
server.js Make it possible to run server with file-watching but without automatic webpage reload 2021-04-28 23:51:14 +02:00

Lospec Pixel Editor

This is a browser based software for creating pixel art

The tool can be viewed online here: https://lospec.com/pixel-editor

What to Contribute

Any changes that fix bugs or add features are welcome.

The next version is mostly focused on adding missing essential features and porting to mobile.

Suggestions / Planned features:

  • Documentation

  • Possibility to hide and resize menus (layers, palette)

  • Line tool

  • Tiled mode

  • Load palette from LPE file

  • Symmetry options

  • Mobile

    • Touch equivalent for mouse clicks
    • Hide or scale ui
    • Maybe rearrange UI on portrait
    • Stack colors when too many
    • Fix popups
  • Possibly add collaborate function

  • Polish:

    • ctrl a to select everything / selection -> all, same for deselection
    • Warning windows for wrong inputs
    • Palette option remove unused colors
    • Move selection with arrows
    • Update borders by dragging the canvas' edges with the mouse when resizing canvas
    • Move the canvases so they're centered after resizing the canvas (maybe a .center() method in layer class)
    • Scale selection

How to Contribute

Requirements

You must have node.js and git installed.

You also need npm in version 7 (because of 2nd version of lockfile which was introduced there) which comes with Node.js 15 or newer. To simplify installation of proper versions you can make use of nvm and run nvm install it will activate proper Node.js version in your current command prompt session.

Contribution Workflow

  1. Click Fork above. It will automatically create a copy of this repository and add it to your account.
  2. Clone the repository to your computer.
  3. Open the folder in command prompt and run npm install
  4. Make any changes you would like to suggest.
  5. In command prompt run npm run hot which will compile app to the /build folder, serve under http://localhost:3000, then open in your browser. Moreover, it restarts server every time you save your changes in a codebase. You can go even further by running npm run hot:reload, which will also trigger webpage reloads.
  6. Add, Commit and Push your changes to your fork.
  7. On the github page for your fork, click New Pull Request above the file list.
  8. Change the head repository dropdown to your fork.
  9. Add a title and description explaining your changes.
  10. Click create pull request.

If you have any trouble, see this page: https://help.github.com/en/articles/creating-a-pull-request-from-a-fork

Feature Toggles

Some feature might be hidden by default. Functions to enable/disable them are available inside global featureToggles and operate on a window.localStorage.

For example use featureToggles.enableEllipseTool() to make ellipse tool button visible. Then featureToggles.disableEllipseTool() to hide it.

License

This software may not be resold, redistributed, rehosted or otherwise conveyed to a third party.