Canvas Rendered EDitor
JavaScript HTML CSS
Switch branches/tags
Nothing to show
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
img
vendor
Curry.js
LICENSE
README.org
background.css
canvas-postmortem.org
index.html
main.js
manifest.json
welcome.js

README.org

cred (demo)

img/with-cursors.png Canvas Rendered EDitor

What

Cred is a text editor implemented in JavaScript and targeting Google Chrome Browser 52 or later. A Chrome App version with enhanced capabilities (especially regarding local files) is planned, but for now this is a web page with a Spacemacs-like UI/UX.

Why

There are text editors already, even for Chrome OS. Why another? And why JavaScript for #@^%’s sake?

  • experiment with immediate-mode rendering in a text editor [update: no longer using Canvas for text]
  • something Spacemacs-like (but “native” for Chromebooks) doesn’t exist yet
  • writing single-browser ES6 is quite pleasant (but I’m used to embedded C++ so YMMV)

Some TODOs

  • ditch Canvas because its text is fuzzy on devices with lots of pixels
  • full rewrite of normal-mode command parser:
    • yip, d3x, caw (operators besides the implicit “move”)
    • figure out how generic API should be (do we need specific functions for “word” or “paragraph” finding?)
    • visual mode
    • text object spans (e.g. daw should delete an entire word touching the cursor, even if the cursor is in the middle of the word)
  • undo/redo
  • File I/O
  • syntax/semantic highlighting
  • assorted WYSIWYG features: inline images, font style and sizes, drag-and-drop, etc.

Contributing

Fork, pull request.

License

MIT

Style Conventions

Some inspiration comes from this K style guide. Other conventions include:

  • complete thoughts which are short enough (about 100 chars) should go on one line
  • /* permanent documentation comment */
  • // temporary, TODO, or debugging comment
  • { always wrap blocks in braces }
  • always terminate statements with a semicolon ;
  • const use=(fat_arrow_notation)=>{/* whenever possible */};
  • const use(alternative_syntax){/* for functions declared inside of objects */};
  • avoid var
  • prefer const over let
  • cu /* commonly used name with a comment explaining its purpose */
  • self_documenting_name
  • ClassName /* with documentation comments */

Links

general

specific