Summernote wysiwyg editor converted for Materialize
Clone or download
Permalink
Failed to load latest commit information.
.sass-cache/a779f9fde598216d7e97129c394bb7d31a66df18 started v2 - implemented toolbar buttons ui - fixed button tooltips t… Jul 31, 2017
dist minor style updates Nov 26, 2017
examples added test example Dec 1, 2017
grunts renamed bs3 directory, updated package infos Aug 31, 2017
lang implementing materialize card component Sep 9, 2017
meteor updated package.js Nov 25, 2017
plugin changed package name to materialnote Aug 9, 2017
src minor style updates Nov 26, 2017
test updating tests Sep 1, 2017
tools started v2 - implemented toolbar buttons ui - fixed button tooltips t… Jul 31, 2017
.agignore started v2 - implemented toolbar buttons ui - fixed button tooltips t… Jul 31, 2017
.editorconfig renamed bs3 directory, updated package infos Aug 31, 2017
.gitignore added version updater to the project Nov 21, 2017
.jscsrc started v2 - implemented toolbar buttons ui - fixed button tooltips t… Jul 31, 2017
.jshintignore started v2 - implemented toolbar buttons ui - fixed button tooltips t… Jul 31, 2017
.jshintrc updating tests Sep 1, 2017
.npmignore started v2 - implemented toolbar buttons ui - fixed button tooltips t… Jul 31, 2017
.travis.yml renamed bs3 directory, updated package infos Aug 31, 2017
.workinprogress improved helpDialog style Aug 23, 2017
Gruntfile.js fixed multi-instances bug with dropdowns - updated gruntfile wit serv… Nov 21, 2017
LICENSE renamed bs3 directory, updated package infos Aug 31, 2017
MAINTAIN.md changed package name to materialnote Aug 9, 2017
README.md updated multi-instances demo Nov 21, 2017
bower.json renamed bs3 directory, updated package infos Aug 31, 2017
composer.json renamed bs3 directory, updated package infos Aug 31, 2017
ie8.html renamed bs3 directory, updated package infos Aug 31, 2017
index.html updated multi-instances demo Nov 21, 2017
issue_template.md started v2 - implemented toolbar buttons ui - fixed button tooltips t… Jul 31, 2017
lite.html changed package name to materialnote Aug 9, 2017
nuget-build.cmd changed package name to materialnote Aug 9, 2017
package.js fixed multi-instances bug with dropdowns - updated gruntfile wit serv… Nov 21, 2017
package.json updated multi-instances demo Nov 21, 2017
pull_request_template.md changed package name to materialnote Aug 9, 2017
summernote.nuspec renamed bs3 directory, updated package infos Aug 31, 2017

README.md

MaterialNote v2.0.5

WYSIWYG editor for the web, based on materialnote.js and materializeCss. Version 2 is currently in beta...

Editor Api

MaterialNote is based on summernote.js, so the API is still the same. Please visit summernote.js api guide to deep dive.

Settings additions

Other to the standard summernote.js settings, materialNote have some extras (take a look at official summernote guide for the summernote.js initialization options).

  • popover.image: added ['responsivity', ['responsive']] btn group containing button to handle materialize's image responsivity class.
  • popover.link: added openLinkNewWindow btn to handle target attribute of the link directly from the popover.
  • popover.table: added ['materializeOptions', ['borderedTable', 'stripedTable', 'highlightedTable', 'responsiveTable', 'centeredTable']] btn group to handle materialize's table options.
  • defaultColors.text [String]: default text color used for recent-color button at startup.
  • defaultColors.background [String]: default background color used for recent-color button at startup.
  • followingToolbar [Boolean]: enable/disable following toolbar.
  • otherStaticBarClass [String]: if your app already have a fixed positioned topBar, you will need to add here its class to let materialNote able to calculate the right offset for the editor's toolbar.

Editor colors

If you wish to change any of the editor color, you can quickly achieve the desired result by editing file src/sass/variables.scss, which defines all colours used by the editor as sass variables.

After making desired changes, just run grunt build to create a new dist in the dist folder.

Multi instances

If you put more than one editor in the same page, some parts such as dropdowns will not work properly (since they use ids) unless you pass a unique posIndex parameter to each instance:

$.each($('.materialnote'), function(index, node) {
    $(node).materialnote({
        height: 300,
        posIndex: index
    });
});

Contribute

Some lang strings have been added in materialNote other than the ones supplied with summernote.js; by default only english and italian lang files are kept up to date in this repo; if you can help by adding missing strings for your language, please submit a pull request (thank you);

Pull requests are welcome anyway...