Skip to content
/ fed Public

Very lightweight plain javascript inline rich text/HTML editor

License

Notifications You must be signed in to change notification settings

fesk/fed

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

7 Commits
 
 
 
 
 
 
 
 

Repository files navigation

fed

fed.js v1.04 very minimal / lightweight inline rich text/HTML editor, plain javascript. fed = [f]esk's [ed]itor. Copyright (c) 2021, Nick Besant [email protected]. All rights reserved. licenced under GPLv3, see LICENCE.txt

NOTE: BY DEFAULT, THIS USES FONTAWESOME ICONS FOR ITS TOOLBAR. YOU WILL NEED TO INCLUDE FONTAWESOME ICONS IN YOUR PAGE, OR OVERRIDE fed_icons

usage: include fed.js and fed.css on your page (make sure you also have FontAwesome's icons included);

<link href="/path/to/fed/fed.css" rel="stylesheet">
<script src="/path/to/fed/fed.js"></script>
let my_ed = new fed(divelement,{options});

Options info

      divelement can be queryselector string like #editor or .class, or a plain
              string which is assumed to be an ID, or a DOM element
      options is an object with;
              do_keybinding:bool (default true) - do/don't bind keys
              grabtab:bool (default false) - override default TAB behaviour.  Don't do this,
                                          it breaks accessibility even further.
              language:str (default en-GB) - a key in fed_strings
              strings:object (defaults to built-in fed_strings) - use to provide translated tips
              icons:object (defaults to built-in fed_icons) - replace icons (defaults to
                                          FontAwesome's basic icons).  You will need to make
                                          sure you include _icostart and _icoend keys.
              allow_sourceview:bool (default true) - show the view source button
              allow_images:bool   (default true) - show an image selector button
              img_max_size:int (default 1024*1024) - max size of individual image, if
                                          user adds a larger image, string 'image_too_big' is shown
                                          in the console, and 'error' callbacks (see .on()) are called.
              

highlights;

 .setcontents() and .getcontents() - set / get current content
 .on('edit',function(inst)) - add your function to be called when user makes an edit
 .destroy() - remove wrapper and toolbar and restore DIV back to original state
 .wrapper - the DIV element that wraps the toolbar and the edit content
 .toolbar - the toolbar DIV
 .content - the DIV containing the stuff being edited, this is the element you passed in the constructor

About

Very lightweight plain javascript inline rich text/HTML editor

Topics

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published