Skip to content

Commit 882bbc7

Browse files
committed
feat(codepen): support for codepen embedding added
1 parent 4a18e4e commit 882bbc7

3 files changed

Lines changed: 36 additions & 1 deletion

File tree

src/embed.es6

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -45,7 +45,8 @@ import Twitter from './modules/twitter.es6';
4545
align : 'none',
4646
lang : 'en'
4747
},
48-
excludeEmbed : []
48+
excludeEmbed : [],
49+
codeEmbedHeight : 500
4950
};
5051

5152
class EmbedJS {

src/modules/code/code.es6

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@ import Highlight from './highlight.es6';
44
import Ideone from './ideone.es6';
55
import Plunker from './plunker.es6';
66
import JsBin from './jsbin.es6';
7+
import CodePen from './codepen.es6';
78

89
class Code {
910
constructor(input, output, options, embeds) {
@@ -21,6 +22,7 @@ class Code {
2122
embeds = utils.ifEmbed(this.options, 'ideone') ? await (new Ideone(this.input, this.options, embeds).process()) : embeds;
2223
embeds = utils.ifEmbed(this.options, 'plunker') ? await (new Plunker(this.input, this.options, embeds).process()) : embeds;
2324
embeds = utils.ifEmbed(this.options, 'jsbin') ? await (new JsBin(this.input, this.options, embeds).process()) : embeds;
25+
embeds = utils.ifEmbed(this.options, 'codepen') ? await (new CodePen(this.input, this.options, embeds).process()) : embeds;
2426

2527
return [output, embeds];
2628
} catch (error) {

src/modules/code/codepen.es6

Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
import utils from '../utils.es6';
2+
3+
class CodePen{
4+
constructor(input,options, embeds){
5+
this.input = input;
6+
this.options = options;
7+
this.embeds = embeds;
8+
this.regex = /http:\/\/codepen.io\/([A-Za-z0-9_]+)\/pen\/([A-Za-z0-9_]+)/gi;
9+
}
10+
11+
template(id){
12+
let template =
13+
`<div class="ejs-embed ejs-codepen">
14+
<iframe scrolling="no" height="${this.options.codeEmbedHeight}" src="${id.replace(/\/pen\//, '/embed/')}/?height=${this.options.codeEmbedHeight}"></iframe>'
15+
</div>`;
16+
return template;
17+
}
18+
19+
process(){
20+
let match;
21+
while((match = utils.matches(this.regex, this.input)) !== null){
22+
let text = this.template(match[0]);
23+
this.embeds.push({
24+
text:text,
25+
index:match.index
26+
})
27+
}
28+
return this.embeds;
29+
}
30+
}
31+
32+
module.exports = CodePen;

0 commit comments

Comments
 (0)