Comments (4)
You can see here how we convert new line characters into HTML.
I think the fix would be a case of making the regular expression non-greedy, i.e.:
function oldConvert(html) {
return '<p>' + html.replace(/\n([ \t]*\n)+/g, '</p><p>').replace(/\n/g, '<br>') + '</p>';
}
function newConvert(html) {
return '<p>' + html.replace(/\n([ \t]*\n)+?/g, '</p><p>').replace(/\n/g, '<br>') + '</p>';
}
oldConvert('1\n\n2\n\n\n3');
// => "<p>1</p><p>2</p><p>3</p>"
oldConvert('1\n\n2\n\n\n\n3');
// => "<p>1</p><p>2</p><p>3</p>"
newConvert('1\n\n2\n\n\n3');
// => "<p>1</p><p>2</p><p><br>3</p>"
newConvert('1\n\n2\n\n\n\n3');
// => "<p>1</p><p>2</p><p></p><p>3</p>"
My regular expression knowledge isn’t the best, so cc'ing @theefer in on this one.
from scribe.
Bump /cc @theefer
from scribe.
The first step is to determine what the expected result should be.
1
2
3
would give
<p>1<br>2</p>
<p>3</p>
as now.
1
2
3
would give
<p>1<br>2</p>
<p><br></p>
<p>3</p>
?
And
1
2
3
would give
<p>1<br>2</p>
<p><br></p>
<p><br></p>
<p>3</p>
?
(note the dummy <br>
to make the paragraph selectable; the paste handler may not need to care about this if a subsequent formatter normalises <p></p>
to contain a <br>
)
In that case, it sounds like we want to replace:
\n
by <br>
\n\n
by </p><p>
\n\n\n
by </p><p></p><p>
\n\n\n\n
by </p><p></p><p></p><p>
etc?
Can't think of an easy way to do this except using a function as replace argument:
"1\n2\n\n3\n\n\n4".replace(/\n\n+/g, function(newlines){
return Array(newlines.length).join('</p><p>'); // fancy repeating pattern, thanks StackOverflow
}).replace(/\n/g, '<br>');
// "1<br>2</p><p>3</p><p></p><p>4"
from scribe.
Note that this does not correctly work if there is whitespace on the empty lines, something the original pattern accounted for. My solution could be extended to work with that somehow I'm sure.
from scribe.
Related Issues (20)
- allowBlockElements=false in Safari prevents entering new lines HOT 2
- Pressing Enter while having a selection in inline-mode does not delete the range content HOT 1
- Roadmap to making Safari support official?
- lodash dependecy still exists. HOT 10
- Pasting inserts paragraph tags even in inline-mode
- Remove Unexpected Usage of ES6 const HOT 2
- NPM releases improvements HOT 3
- Pull requests welcome? HOT 1
- Scribe commands not working when triggered in child iframe HOT 1
- whether consider supporting umd? HOT 2
- command plugin problem
- Edge compatibility HOT 1
- cjs version [email protected] does not work with browserify w/ deamdify
- UndoManager and a max length plugin
- Any chance of supporting lists?
- Un able to import Scribe using angular Cli
- plugin injection into existing `scribe` instance HOT 1
- Demo is broken
- Selection.range collapses when selecting the last word of a paragraph HOT 5
- Text alignment
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from scribe.