spring ckeditor and prettify sample

POM.XML


<dependency>
<groupId>org.springframework</groupId>
<artifactId>spring-core</artifactId>
<version>${spring.version}</version>
</dependency>

<dependency>
<groupId>org.springframework</groupId>
<artifactId>spring-web</artifactId>
<version>${spring.version}</version>
</dependency>

<dependency>
<groupId>org.springframework</groupId>
<artifactId>spring-webmvc</artifactId>
<version>${spring.version}</version>
</dependency>

<dependency>
<groupId>javax.servlet</groupId>
<artifactId>servlet-api</artifactId>
<version>2.5</version>
<scope>provided</scope>
</dependency>



web configuration

<servlet>
<servlet-name>dispatcher</servlet-name>
<servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class>
<load-on-startup>1</load-on-startup>
<init-param>
<param-name>contextConfigLocation</param-name>
<param-value>/WEB-INF/demo-servlet.xml</param-value>
</init-param>
</servlet>


servlet configuration

<bean
class="org.springframework.web.servlet.view.InternalResourceViewResolver">
<property name="prefix">
<value>/WEB-INF/pages/</value>
</property>
<property name="suffix" value=".jsp" />
</bean>


ckeditor configuration

CKEDITOR.plugins.add('insertcode',

{

requires : [ 'dialog' ],

init : function(a)

{

var b = "insertcode";

a.addCommand(b, new CKEDITOR.dialogCommand(b));

a.ui.addButton("insertcode", {

label : a.lang.toolbar,
command : b,
icon : this.path + "images/code.png"
});

CKEDITOR.dialog.add(b, this.path + "dialogs/insertcode.js");
}

});



(function() {
CKEDITOR.dialog.add("insertcode", function(editor) {

var escape = function(value) {

return value.replace(/&/g, '&')

.replace(/</g, '<')

.replace(/>/g, '>')

.replace(/\"/g, '"')

.replace(/\'/g, ''');

};

return {
title : "Insert Code Dialog",
resizable : CKEDITOR.DIALOG_RESIZE_BOTH,
minWidth : 420,
minHeight : 350,
contents : [ {
id : "cb",
name : "cb",
label : "cb",
title : "resource code",
expand : true,
width : "500px",
height : "500px",
padding : 0,
elements : [
{
type : "select",
label : "Select Language :",
id : "lang",
required : true,
'default' : "java",
items : [ [ 'C#', 'csharp' ], [ 'C++', 'cpp' ],
[ 'CSS', 'css' ], [ 'Delphi', 'delphi' ],
[ 'Html', 'xhtml' ],
[ 'JavaScript', 'js' ], [ 'Java', 'java' ],
[ 'Perl', 'perl' ], [ 'PHP', 'php' ],
[ 'Python', 'py' ], [ 'Ruby', 'rails' ],
[ 'SQL', 'sql' ], [ 'Visual Basic', 'vb' ],
[ 'XML', 'xml' ] ]
}, {
type : 'textarea',
style : 'width:450px;height:350px',
label : 'Code',
id : 'code',
rows : 20,
'default' : ''

} ]
} ],

onOk : function() {

code = this.getValueOf('cb', 'code');
lang = this.getValueOf('cb', 'lang');
html = '' + escape(code) + '';

var i = 0;
var tmp = '';
var tclass = 'prettyprint';

while (html.indexOf('\n') != -1) {
var tnode = i % 2 ? 'nocode' : 'nocode1';
++i;
tmp += '<li class=\"' + tnode + '\"><pre class=\"' + tclass
+ ' lang=' + lang + '\">';
tmp += html.substring(0, html.indexOf('\n') + 1);
html = html.substr(html.indexOf('\n') + 1);
tmp += "</pre></li>";
}

tnode = i % 2 ? 'nocode' : 'nocode1';
tmp += "<li class=\"" + tnode + "\"><pre class=\"" + tclass
+ ' lang=' + lang + '\">' + html + "</pre></li>";
editor.insertHtml("<ol class=\"olcode\">" + tmp + "</ol>");
},

onLoad : function() {
}
};

});
})();



<script type="text/javascript" src="prettify/prettify.js"></script>
<script src="ckeditor/ckeditor.js"></script>

<link href="ckeditor/samples/sample.css" rel="stylesheet" />
<link href="prettify/prettify.css" type="text/css" rel="stylesheet" />

<style>
</style>

</head>
<body>
<form name="myform" action="<%=request.getContextPath()%>/home/add.html"
method="post">
<textarea class="ckeditor" name="content"></textarea>
<input type="submit" name="submit" />
</form>

</body>




评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值