The Art of War
If you know the enemy and know yourself, you need not fear the result of a hundred battles.
If you know yourself but not the enemy, for every victory gained you will also suffer a defeat.
If you know neither the enemy nor yourself, you will succumb in every battle.
- If your enemy is secure at all points, be prepared for him. If he is in superior strength, evade him.
- If your opponent is temperamental, seek to irritate him.
- Pretend to be weak, that he may grow arrogant.
- If he is taking his ease, give him no rest.
- If his forces are united, separate them.
- If sovereign and subject are in accord, put division between them. Attack him where he is unprepared, appear where you are not expected.
- There are not more than five musical notes, yet the combinations of these five give rise to more melodies than can ever be heard.
- There are not more than five primary colours, yet in combination
- they produce more hues than can ever been seen.
- There are not more than five cardinal tastes, yet combinations of
- them yield more flavours than can ever be tasted.
Air Mode
This is an example with airmode option...
MaterialSummernote is a fork of Summernote wysiwyg editor
(See the Original API)
Edited by CK
There are some extra options
that you can pass to the constructor in materialSummernote:- defaultTextColor (used by "color" button to set the default text color)
- defaultBackColor (used by "color" button to set button's color default color)
- followingToolbar [default true] (makes the toolbar follow on window scroll)
MaterialSummernote is not just a conversion of Summernote from bootstrap to materialize,
it also contains some changes
It is provided with scss version of the stylesheet, if you use sass, to change style quickly
In this version, editor's functions that you see on this page are tested; other summernote functions such airmode, still need to be converted;
Constructor
The only difference from Summernote is that you have to call materialnote() instad of summernote().
IMPORTANT: in case of multiple editors on the same page, the id attribute must be provided (if you use airMode, the id is needed always):
<div class="myEditor" id="firstEditor">
<div class="myEditor" id="secondEditor">
<div class="myEditor" id="thirdEditor">
Toolbar
MaterialNote uses a javascript function to keep always visible the toolbar during scrolling.
If you don't want this to be enabled, pass followingToolbar: false option to the constructor.
Paragraph buttons
The paragraph buttons are available in dropdown format like Summernote (['paragraph'] option in the toolbar array) or as separate buttons (['leftButton', 'centerButton', 'rightButton', 'justifyButton', 'outdentButton', 'indentButton']).
Code sample
This is the constructor used for the above example:
var toolbar = [
['style', ['style', 'bold', 'italic', 'underline', 'strikethrough', 'clear']],
['fonts', ['fontsize', 'fontname']],
['color', ['color']],
['undo', ['undo', 'redo', 'help']],
['ckMedia', ['ckImageUploader', 'ckVideoEmbeeder']],
['misc', ['link', 'picture', 'table', 'hr', 'codeview', 'fullscreen']],
['para', ['ul', 'ol', 'paragraph', 'leftButton', 'centerButton', 'rightButton', 'justifyButton', 'outdentButton', 'indentButton']],
['height', ['lineheight']],
];
$('.editor').materialnote({
toolbar: toolbar,
height: 550,
minHeight: 100,
defaultBackColor: '#e0e0e0'
});
All options and methods of the original Summernote's API are still valid, so you can read the Summernote guide page or its API reference.