Merge branch 'development'

typescriptify 2.0.1
Jeroen Akkerman 6 years ago
commit 82d12b1830

1
.gitignore vendored

@ -6,3 +6,4 @@ node_modules/
*.ipr
*.iws
.idea/
.vscode/

@ -1,9 +1,8 @@
language: node_js
node_js:
- '9'
- '10'
- '8'
- '6'
- '4'
before_script:
- npm install -g gulp
script: gulp

@ -8,7 +8,7 @@ Changes include:
* Guide button works when editor is in preview mode
* Links are now `https://` by default
* Small styling changes
* Node 8 and Node 9 support
* Support for Node 8 and beyond
* Lots of refactored code
My intention is to continue development on this project, improving it and keeping it alive.
@ -22,7 +22,58 @@ Via [npm](https://www.npmjs.com/package/easymde).
npm install easymde --save
```
Below is the original [README](https://github.com/sparksuite/simplemde-markdown-editor/), rewrite for EasyMDE pending.
Via the UNPKG CDN.
```html
<link rel="stylesheet" href="https://unpkg.com/easymde/dist/easymde.min.css">
<script src="https://unpkg.com/easymde/dist/easymde.min.js"></script>
```
## How to use
#### Loading the editor
After installing and/or importing the module, you can load EasyMDE onto the first TextArea on the webpage.
```html
<textarea></textarea>
<script>
var easyMDE = new EasyMDE();
</script>
```
Alternatively you can select a specific TextArea, via Javascript.
```html
<textarea id="my-text-area"></textarea>
<script>
var easyMDE = new EasyMDE({element: document.getElementById('my-text-area')});
</script>
```
Or via jQuery.
```html
<textarea id="my-text-area"></textarea>
<script>
var easyMDE = new EasyMDE({element: $('#my-text-area')[0]});
</script>
```
#### Editor functions
Use EasyMDE.value() to get the content of the editor.
```html
<script>
easyMDE.value();
</script>
```
Use EasyMDE.value(val) to set the content of the editor.
```html
<script>
easyMDE.value('New input for **EasyMDE**');
</script>
```
Below is the original [README](https://github.com/sparksuite/simplemde-markdown-editor/), rewrite for EasyMDE in progress.
# SimpleMDE - Markdown Editor
A drop-in JavaScript textarea replacement for writing beautiful and understandable Markdown. The WYSIWYG-esque editor allows users who may be less experienced with Markdown to use familiar toolbar buttons and shortcuts. In addition, the syntax is rendered while editing to clearly show the expected result. Headings are larger, emphasized words are italicized, links are underlined, etc. SimpleMDE is one of the first editors to feature both built-in autosaving and spell checking.
@ -277,22 +328,22 @@ var simplemde = new SimpleMDE({
SimpleMDE comes with an array of predefined keyboard shortcuts, but they can be altered with a configuration option. The list of default ones is as follows:
Shortcut | Action
:------- | :-----
*Cmd-'* | "toggleBlockquote"
*Cmd-B* | "toggleBold"
*Cmd-E* | "cleanBlock"
*Cmd-H* | "toggleHeadingSmaller"
*Cmd-I* | "toggleItalic"
*Cmd-K* | "drawLink"
*Cmd-L* | "toggleUnorderedList"
*Cmd-P* | "togglePreview"
*Cmd-Alt-C* | "toggleCodeBlock"
*Cmd-Alt-I* | "drawImage"
*Cmd-Alt-L* | "toggleOrderedList"
*Shift-Cmd-H* | "toggleHeadingBigger"
*F9* | "toggleSideBySide"
*F11* | "toggleFullScreen"
Shortcut (Windows / Linux) | Shortcut (macOS) | Action
:--- | :--- | :---
*Ctrl-'* | *Cmd-'* | "toggleBlockquote"
*Ctrl-B* | *Cmd-B* | "toggleBold"
*Ctrl-E* | *Cmd-E* | "cleanBlock"
*Ctrl-H* | *Cmd-H* | "toggleHeadingSmaller"
*Ctrl-I* | *Cmd-I* | "toggleItalic"
*Ctrl-K* | *Cmd-K* | "drawLink"
*Ctrl-L* | *Cmd-L* | "toggleUnorderedList"
*Ctrl-P* | *Cmd-P* | "togglePreview"
*Ctrl-Alt-C* | *Cmd-Alt-C* | "toggleCodeBlock"
*Ctrl-Alt-I* | *Cmd-Alt-I* | "drawImage"
*Ctrl-Alt-L* | *Cmd-Alt-L* | "toggleOrderedList"
*Shift-Ctrl-H* | *Shift-Cmd-H* | "toggleHeadingBigger"
*F9* | *F9* | "toggleSideBySide"
*F11* | *F11* | "toggleFullScreen"
Here is how you can change a few, while leaving others untouched:

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

@ -1,16 +1,16 @@
'use strict';
var gulp = require('gulp'),
minifycss = require('gulp-clean-css'),
uglify = require('gulp-uglify'),
concat = require('gulp-concat'),
header = require('gulp-header'),
buffer = require('vinyl-buffer'),
pkg = require('./package.json'),
eslint = require('gulp-eslint'),
browserify = require('browserify'),
source = require('vinyl-source-stream'),
rename = require('gulp-rename');
var gulp = require('gulp');
var cleanCSS = require('gulp-clean-css');
var uglify = require('gulp-uglify');
var concat = require('gulp-concat');
var header = require('gulp-header');
var buffer = require('vinyl-buffer');
var pkg = require('./package.json');
var eslint = require('gulp-eslint');
var browserify = require('browserify');
var source = require('vinyl-source-stream');
var rename = require('gulp-rename');
var banner = ['/**',
' * <%= pkg.name %> v<%= pkg.version %>',
@ -20,23 +20,23 @@ var banner = ['/**',
' */',
''].join('\n');
gulp.task('lint', function () {
gulp.src('./src/js/**/*.js')
function lint() {
return gulp.src('./src/js/**/*.js')
.pipe(eslint())
.pipe(eslint.format())
.pipe(eslint.failAfterError());
});
}
gulp.task('scripts', ['lint'], function () {
function scripts() {
return browserify({entries: './src/js/easymde.js', standalone: 'EasyMDE'}).bundle()
.pipe(source('easymde.min.js'))
.pipe(buffer())
.pipe(uglify())
.pipe(header(banner, {pkg: pkg}))
.pipe(gulp.dest('./dist/'));
});
}
gulp.task('styles', function () {
function styles() {
var css_files = [
'./node_modules/codemirror/lib/codemirror.css',
'./src/css/*.css',
@ -45,11 +45,13 @@ gulp.task('styles', function () {
return gulp.src(css_files)
.pipe(concat('easymde.css'))
.pipe(minifycss())
.pipe(cleanCSS())
.pipe(rename('easymde.min.css'))
.pipe(buffer())
.pipe(header(banner, {pkg: pkg}))
.pipe(gulp.dest('./dist/'));
});
}
gulp.task('default', ['scripts', 'styles']);
var build = gulp.parallel(gulp.series(lint, scripts), styles);
gulp.task('default', build);

3999
package-lock.json generated

File diff suppressed because it is too large Load Diff

@ -1,6 +1,6 @@
{
"name": "easymde",
"version": "2.0.0",
"version": "2.0.1",
"description": "A simple, beautiful, and embeddable JavaScript Markdown editor that easy to use. Features include autosaving and spell checking.",
"keywords": [
"embeddable",
@ -21,9 +21,9 @@
"marked": "0.3.19"
},
"devDependencies": {
"browserify": "^16.2.0",
"gulp": "^3.9.1",
"gulp-clean-css": "^3.9.0",
"browserify": "^16.2.2",
"gulp": "^4.0.0",
"gulp-clean-css": "^3.9.4",
"gulp-concat": "^2.6.1",
"gulp-eslint": "^4.0.0",
"gulp-header": "^2.0.5",
@ -35,5 +35,8 @@
"repository": {
"type": "git",
"url": "https://github.com/ionaru/easy-markdown-editor"
},
"scripts": {
"prepublishOnly ": "gulp"
}
}

@ -111,7 +111,6 @@
padding: 0;
}
.editor-toolbar a,
.editor-toolbar button {
background: transparent;
display: inline-block;
@ -126,19 +125,12 @@
cursor: pointer;
}
.editor-toolbar a.active,
.editor-toolbar a:hover,
.editor-toolbar button.active,
.editor-toolbar button:hover {
background: #fcfcfc;
border-color: #95a5a6;
}
.editor-toolbar a:before,
.editor-toolbar button:before {
line-height: 30px
}
.editor-toolbar i.separator {
display: inline-block;
width: 0;
@ -149,7 +141,7 @@
margin: 0 6px;
}
.editor-toolbar a.fa-header-x:after {
.editor-toolbar i.fa-header-x:after {
font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
font-size: 65%;
vertical-align: text-bottom;
@ -157,23 +149,23 @@
top: 2px;
}
.editor-toolbar a.fa-header-1:after {
.editor-toolbar i.fa-header-1:after {
content: "1";
}
.editor-toolbar a.fa-header-2:after {
.editor-toolbar i.fa-header-2:after {
content: "2";
}
.editor-toolbar a.fa-header-3:after {
.editor-toolbar i.fa-header-3:after {
content: "3";
}
.editor-toolbar a.fa-header-bigger:after {
.editor-toolbar i.fa-header-bigger:after {
content: "▲";
}
.editor-toolbar a.fa-header-smaller:after {
.editor-toolbar i.fa-header-smaller:after {
content: "▼";
}
@ -183,7 +175,7 @@
}
@media only screen and (max-width: 700px) {
.editor-toolbar a.no-mobile {
.editor-toolbar i.no-mobile {
display: none;
}
}

@ -1145,31 +1145,31 @@ var toolbarBuiltInButtons = {
'heading-smaller': {
name: 'heading-smaller',
action: toggleHeadingSmaller,
className: 'fa fa-header fa-header-x fa-header-smaller',
className: 'fa fa-header fa-heading fa-header-x fa-header-smaller',
title: 'Smaller Heading'
},
'heading-bigger': {
name: 'heading-bigger',
action: toggleHeadingBigger,
className: 'fa fa-header fa-header-x fa-header-bigger',
className: 'fa fa-header fa-heading fa-header-x fa-header-bigger',
title: 'Bigger Heading'
},
'heading-1': {
name: 'heading-1',
action: toggleHeading1,
className: 'fa fa-header fa-header-x fa-header-1',
className: 'fa fa-header fa-heading fa-header-x fa-header-1',
title: 'Big Heading'
},
'heading-2': {
name: 'heading-2',
action: toggleHeading2,
className: 'fa fa-header fa-header-x fa-header-2',
className: 'fa fa-header fa-heading fa-header-x fa-header-2',
title: 'Medium Heading'
},
'heading-3': {
name: 'heading-3',
action: toggleHeading3,
className: 'fa fa-header fa-header-x fa-header-3',
className: 'fa fa-header fa-heading fa-header-x fa-header-3',
title: 'Small Heading'
},
'separator-1': {

Loading…
Cancel
Save