Skip to content

Instantly share code, notes, and snippets.

@esironal

esironal/CodeMirror-50-lines.html

Last active October 4, 2018 15:50
Show Gist options
  • Save esironal/5be8dd7813db663044bb52a50df97b69 to your computer and use it in GitHub Desktop.
Save esironal/5be8dd7813db663044bb52a50df97b69 to your computer and use it in GitHub Desktop.
Download ZIP
some testing
Raw
CodeMirror-50-lines.html
<!DOCTYPE html>
<html >
<head>
<meta charset="UTF-8">
<title>Code Mirror CDN</title>
<link rel="stylesheet" href="http://esironal.github.io/cmtouch/lib/codemirror.css">
<link rel="stylesheet" href="http://esironal.github.io/cmtouch/addon/hint/show-hint.css">
<link rel="stylesheet" href="http://esironal.github.io/cmtouch/addon/fold/foldgutter.css">
<script src="http://esironal.github.io/cmtouch/lib/codemirror.js"></script>
<script src="http://esironal.github.io/cmtouch/addon/fold/foldcode.js"></script>
<script src="http://esironal.github.io/cmtouch/addon/fold/foldgutter.js"></script>
<script src="http://esironal.github.io/cmtouch/addon/fold/brace-fold.js"></script>
<script src="http://esironal.github.io/cmtouch/addon/fold/xml-fold.js"></script>
<script src="http://esironal.github.io/cmtouch/addon/fold/indent-fold.js"></script>
<script src="http://esironal.github.io/cmtouch/addon/fold/comment-fold.js"></script>
<script src="http://esironal.github.io/cmtouch/addon/hint/show-hint.js"></script>
<script src="http://esironal.github.io/cmtouch/ddon/hint/xml-hint.js"></script>
<script src="http://esironal.github.io/cmtouch/addon/hint/html-hint.js"></script>
<script src="http://esironal.github.io/cmtouch/mode/xml/xml.js"></script>
<script src="http://esironal.github.io/cmtouch/mode/javascript/javascript.js"></script>
<script src="http://esironal.github.io/cmtouch/mode/css/css.js"></script>
<script src="http://esironal.github.io/cmtouch/mode/htmlmixed/htmlmixed.js"></script>
<script src="http://esironal.github.io/cmtouch/addon/selection/active-line.js"></script>
<script src="http://esironal.github.io/cmtouch/addon/edit/matchbrackets.js"></script>
<link rel="stylesheet" href="http://esironal.github.io/cmtouch/theme/neonsyntax.css">
<style type="text/css">.CodeMirror {font-size:14px; width: 100%,; height: 100%;}</style>
</head>
<body>
<!-- This is an awsome comment -->
<div id="code"></div>
<script type="text/javascript">
var minLines = 50;
var startingValue = '';
for (var i = 0; i < minLines; i++) {
startingValue += '\n';
}
CodeMirror.commands.autocomplete = function(cm) {
CodeMirror.showHint(cm, CodeMirror.hint.html);
}
window.onload = function() {
editor = CodeMirror(document.getElementById("code"), {
mode: "text/html",
theme: "neonsyntax",
lineWrapping: true,
lineNumbers: true,
styleActiveLine: true,
matchBrackets: true,
foldGutter: true,
extraKeys: {"Ctrl-Space": "autocomplete"},
value: startingValue
});
editor.setValue(startingValue);
};
</script>
</body>
</html>
Raw
LitterBella.html
<script>
var star_url = "/LitterBella/codes/04uor7zptvc8mqw91feha50/star";
var star_count = 0;
var stared = false;
var login = true;
$(document).ready(function(){
$(".star-btn").click(function(){
if(login == false) {
alert("请您先登录，再进行相关操作。");
location.href = "/login";
return;
}
$.post(star_url, function(data, status){
if($(".star-btn").hasClass("stared")) {
star_count--;
startext = "Star";
$(".star-btn").removeClass("stared");
}else{
star_count++;
startext = "Unstar";
$(".star-btn").addClass("stared");
}
$(".star-count").html(star_count);
$(".star-btn .text").html(startext);
});
});
});
$('.code-share-link').popup({
inline: true,
hoverable: true,
position: 'bottom left',
delay: {
hide: 500
}
})
$('.show-square-popup').popup()
</script>
<div class='ui grid page' id='index-nav'>
<script src="/assets/editor-c01ea5087961416ace6ad2b6faaee2ee.js" type="text/javascript"></script>
<div class='add-top no-padding row' id='code-show'>
<div class='tree-content-holder' id='tree-content-holder'>
<div class='cp-title'>
<a class='anchor' name='封装的原生ajax'></a>
封装的原生ajax
</div>
<div class='file-holder-cp'>
<div class='file_holder'>
<div class='cp-action'>
<a href="/LitterBella/codes/04uor7zptvc8mqw91feha50/raw?blob_name=%E5%B0%81%E8%A3%85%E7%9A%84%E5%8E%9F%E7%94%9Fajax">Raw</a>
<textarea class="blob-raw" id="blob_raw" name="blob_raw" style="display:none;">
function ajax(option) {&#x000A; var xhr = new XMLHttpRequest();&#x000A; // 如果是get 并且有数据&#x000A; if (option.type == &#x27;get&#x27; &amp;&amp; option.data) {&#x000A; option.url += &#x27;?&#x27;;&#x000A; option.url += option.data;&#x000A; option.data = null; // 这样最后直接send data即可 &#x000A; }&#x000A; xhr.open(option.type, option.url);&#x000A; // post请求 并且有数据&#x000A; if (option.type == &#x27;post&#x27; &amp;&amp; option.data) {&#x000A; xhr.setRequestHeader(&#x27;Content-type&#x27;, &#x27;application/x-www-form-urlencoded&#x27;);&#x000A; }&#x000A; xhr.onreadystatechange = function () {&#x000A; if (xhr.readyState == 4 &amp;&amp; xhr.status == 200) {&#x000A; // option.success(xhr.responseText);&#x000A; // console.log(xhr.getResponseHeader(&#x27;Content-Type&#x27;));&#x000A; var type = xhr.getResponseHeader(&#x27;Content-Type&#x27;);&#x000A; // 是否为json&#x000A; if (type.indexOf(&#x27;json&#x27;) != -1) {&#x000A; option.success(JSON.parse(xhr.responseText));&#x000A; }&#x000A; // 是否为xml&#x000A; else if (type.indexOf(&#x27;xml&#x27;) != -1) {&#x000A; option.success(xhr.responseXML);&#x000A; }&#x000A; // 普通字符串&#x000A; else {&#x000A; option.success(xhr.responseText);&#x000A; }&#x000A; }&#x000A; }&#x000A; xhr.send(option.data);&#x000A;}&#x000A;&#x000A;&#x000A;/*&#x000A; 总结&#x000A; 封装的目的&#x000A; 让我们把精力集中在逻辑&#x000A; 页面的交互效果&#x000A; 基础的部分不用每次都来一遍&#x000A; 封装的步骤&#x000A; 固定的部分 抽取&#x000A; 不固定的部分 作为参数&#x000A; 参数很多==&gt;&#x000A; 使用对象 来优化&#x000A; 封装的好坏&#x000A; 功能能否正常执行&#x000A; 代码的简洁程度(可读性)&#x000A; 考虑的问题是否足够多,兼容性问题,异常处理&#x000A;*/</textarea>
<a class='copy-text' style='border-left: none;'>
Copy
</a>
</div>
<div class='clearfix'></div>
<div class='file_content code'>
<div class='lines monokai'>
<div class='line-numbers'><a href='#L封装的原生ajax1' class ='L封装的原生ajax1'>1</a><a href='#L封装的原生ajax2' class ='L封装的原生ajax2'>2</a><a href='#L封装的原生ajax3' class ='L封装的原生ajax3'>3</a><a href='#L封装的原生ajax4' class ='L封装的原生ajax4'>4</a><a href='#L封装的原生ajax5' class ='L封装的原生ajax5'>5</a><a href='#L封装的原生ajax6' class ='L封装的原生ajax6'>6</a><a href='#L封装的原生ajax7' class ='L封装的原生ajax7'>7</a><a href='#L封装的原生ajax8' class ='L封装的原生ajax8'>8</a><a href='#L封装的原生ajax9' class ='L封装的原生ajax9'>9</a><a href='#L封装的原生ajax10' class ='L封装的原生ajax10'>10</a><a href='#L封装的原生ajax11' class ='L封装的原生ajax11'>11</a><a href='#L封装的原生ajax12' class ='L封装的原生ajax12'>12</a><a href='#L封装的原生ajax13' class ='L封装的原生ajax13'>13</a><a href='#L封装的原生ajax14' class ='L封装的原生ajax14'>14</a><a href='#L封装的原生ajax15' class ='L封装的原生ajax15'>15</a><a href='#L封装的原生ajax16' class ='L封装的原生ajax16'>16</a><a href='#L封装的原生ajax17' class ='L封装的原生ajax17'>17</a><a href='#L封装的原生ajax18' class ='L封装的原生ajax18'>18</a><a href='#L封装的原生ajax19' class ='L封装的原生ajax19'>19</a><a href='#L封装的原生ajax20' class ='L封装的原生ajax20'>20</a><a href='#L封装的原生ajax21' class ='L封装的原生ajax21'>21</a><a href='#L封装的原生ajax22' class ='L封装的原生ajax22'>22</a><a href='#L封装的原生ajax23' class ='L封装的原生ajax23'>23</a><a href='#L封装的原生ajax24' class ='L封装的原生ajax24'>24</a><a href='#L封装的原生ajax25' class ='L封装的原生ajax25'>25</a><a href='#L封装的原生ajax26' class ='L封装的原生ajax26'>26</a><a href='#L封装的原生ajax27' class ='L封装的原生ajax27'>27</a><a href='#L封装的原生ajax28' class ='L封装的原生ajax28'>28</a><a href='#L封装的原生ajax29' class ='L封装的原生ajax29'>29</a><a href='#L封装的原生ajax30' class ='L封装的原生ajax30'>30</a><a href='#L封装的原生ajax31' class ='L封装的原生ajax31'>31</a><a href='#L封装的原生ajax32' class ='L封装的原生ajax32'>32</a><a href='#L封装的原生ajax33' class ='L封装的原生ajax33'>33</a><a href='#L封装的原生ajax34' class ='L封装的原生ajax34'>34</a><a href='#L封装的原生ajax35' class ='L封装的原生ajax35'>35</a><a href='#L封装的原生ajax36' class ='L封装的原生ajax36'>36</a><a href='#L封装的原生ajax37' class ='L封装的原生ajax37'>37</a><a href='#L封装的原生ajax38' class ='L封装的原生ajax38'>38</a><a href='#L封装的原生ajax39' class ='L封装的原生ajax39'>39</a><a href='#L封装的原生ajax40' class ='L封装的原生ajax40'>40</a><a href='#L封装的原生ajax41' class ='L封装的原生ajax41'>41</a><a href='#L封装的原生ajax42' class ='L封装的原生ajax42'>42</a><a href='#L封装的原生ajax43' class ='L封装的原生ajax43'>43</a><a href='#L封装的原生ajax44' class ='L封装的原生ajax44'>44</a><a href='#L封装的原生ajax45' class ='L封装的原生ajax45'>45</a><a href='#L封装的原生ajax46' class ='L封装的原生ajax46'>46</a><a href='#L封装的原生ajax47' class ='L封装的原生ajax47'>47</a><a href='#L封装的原生ajax48' class ='L封装的原生ajax48'>48</a><a href='#L封装的原生ajax49' class ='L封装的原生ajax49'>49</a><a href='#L封装的原生ajax50' class ='L封装的原生ajax50'>50</a><a href='#L封装的原生ajax51' class ='L封装的原生ajax51'>51</a><a href='#L封装的原生ajax52' class ='L封装的原生ajax52'>52</a></div><div class='highlight'><pre><div class='line' id='LC1'>function ajax(option) {
</div><div class='line' id='LC2'> var xhr = new XMLHttpRequest();
</div><div class='line' id='LC3'> // 如果是get 并且有数据
</div><div class='line' id='LC4'> if (option.type == 'get' &amp;&amp; option.data) {
</div><div class='line' id='LC5'> option.url += '?';
</div><div class='line' id='LC6'> option.url += option.data;
</div><div class='line' id='LC7'> option.data = null; // 这样最后直接send data即可
</div><div class='line' id='LC8'> }
</div><div class='line' id='LC9'> xhr.open(option.type, option.url);
</div><div class='line' id='LC10'> // post请求 并且有数据
</div><div class='line' id='LC11'> if (option.type == 'post' &amp;&amp; option.data) {
</div><div class='line' id='LC12'> xhr.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
</div><div class='line' id='LC13'> }
</div><div class='line' id='LC14'> xhr.onreadystatechange = function () {
</div><div class='line' id='LC15'> if (xhr.readyState == 4 &amp;&amp; xhr.status == 200) {
</div><div class='line' id='LC16'> // option.success(xhr.responseText);
</div><div class='line' id='LC17'> // console.log(xhr.getResponseHeader('Content-Type'));
</div><div class='line' id='LC18'> var type = xhr.getResponseHeader('Content-Type');
</div><div class='line' id='LC19'> // 是否为json
</div><div class='line' id='LC20'> if (type.indexOf('json') != -1) {
</div><div class='line' id='LC21'> option.success(JSON.parse(xhr.responseText));
</div><div class='line' id='LC22'> }
</div><div class='line' id='LC23'> // 是否为xml
</div><div class='line' id='LC24'> else if (type.indexOf('xml') != -1) {
</div><div class='line' id='LC25'> option.success(xhr.responseXML);
</div><div class='line' id='LC26'> }
</div><div class='line' id='LC27'> // 普通字符串
</div><div class='line' id='LC28'> else {
</div><div class='line' id='LC29'> option.success(xhr.responseText);
</div><div class='line' id='LC30'> }
</div><div class='line' id='LC31'> }
</div><div class='line' id='LC32'> }
</div><div class='line' id='LC33'> xhr.send(option.data);
</div><div class='line' id='LC34'>}
</div><div class='line' id='LC35'>
</div><div class='line' id='LC36'>
</div><div class='line' id='LC37'>/*
</div><div class='line' id='LC38'> 总结
</div><div class='line' id='LC39'> 封装的目的
</div><div class='line' id='LC40'> 让我们把精力集中在逻辑
</div><div class='line' id='LC41'> 页面的交互效果
</div><div class='line' id='LC42'> 基础的部分不用每次都来一遍
</div><div class='line' id='LC43'> 封装的步骤
</div><div class='line' id='LC44'> 固定的部分 抽取
</div><div class='line' id='LC45'> 不固定的部分 作为参数
</div><div class='line' id='LC46'> 参数很多==&gt;
</div><div class='line' id='LC47'> 使用对象 来优化
</div><div class='line' id='LC48'> 封装的好坏
</div><div class='line' id='LC49'> 功能能否正常执行
</div><div class='line' id='LC50'> 代码的简洁程度(可读性)
</div><div class='line' id='LC51'> 考虑的问题是否足够多,兼容性问题,异常处理
</div><div class='line' id='LC52'>*/
</div></pre></div>
</div>
</div>
</div>
</div>
</div>
<style>
.tree-dimmer{z-index:99 !important;width:100% !important}.tree-dimmer .ui.loader{position:absolute;top:100px}a.anchor:target{display:block;position:relative;top:-80px}
</style>
<div class='row code-comment-field'>
<div class='column'>
<div class='ui comments'>
<h3 class='ui header'>
Comment list(
<span class='comment_count'>
0
</span>
)
</h3>
<div class='ui divider'>
<div id='git-issue-comments' style='color:#999;padding:0px'></div>
</div>
<div class='column' style='margin: 0.5rem 0 0.5rem 0'>
<div class='ui comments middle aligned' id='notes-list'>
<div class='note hide'>
<a class='avatar' name='小白' username='LitterBella'></a>
</div>
</div>
</div>
<div class='ui segment' id='comment-loadder'>
<div class='ui loader' id='loadding-state'></div>
</div>
<div class='js-main-target-form'></div>
<div class='js-new-note-form form-with-gravatar'>
<img avatar="esironal" class="ui circular avatar image" />
<div class='note-form-body'>
<form accept-charset="UTF-8" action="/LitterBella/codes/04uor7zptvc8mqw91feha50/note" class="new_note common-note-form" data-remote="true" enctype="multipart/form-data" method="post" style="margin:3px"><div style="margin:0;padding:0;display:inline"><input name="utf8" type="hidden" value="&#x2713;" /><input name="authenticity_token" type="hidden" value="EIs+E6hJPDwCyIVRkdIEpBWoEivtj+rOljfxi7XNHRU=" /></div><input id="target_type" name="target_type" type="hidden" /><input id="target_id" name="target_id" type="hidden" />
<input id="note_commit_id" name="note[commit_id]" type="hidden" />
<input id="note_line_code" name="note[line_code]" type="hidden" />
<input id="note_noteable_id" name="note[noteable_id]" type="hidden" value="157936" />
<input id="note_noteable_type" name="note[noteable_type]" type="hidden" value="Code" />
<input class='default-template' type='hidden' value='0'>
<div class='comment-form js-comment-form rnd_81960' id='git-comment-form'>
<div class='tab-content tab-border'>
<div class='tab-pane active write-content'>
<textarea cols="40" id="hidden-contentedit81960" name="note[note]" rows="20" style="display:none">
</textarea>
<textarea id='editoredit81960' style='color:#000'></textarea>
</div>
</div>
</div>
<style>
.tab-border.tab-content{
border: 1px solid transparent;
min-height: 140px;
padding:0;
}
.tab-border .tab-pane textarea{
border-radius: 0px;
border: 0px;
}
#git-comment-form .ui.tabular.menu .active.item{
border: none;
box-shadow: none;
background-color: #f1f1f1;
border-radius: 5px;
margin-bottom: 5px;
}
#git-comment-form .md-editor .md-upload,
#git-comment-form .md-editor > .md-emoji {
z-index: 11;
}
#git-comment-form .ui.tabular.menu .item{
border: none;
box-shadow: none;
margin-bottom: 5px;
}
.md-editor.md-fullscreen-mode .md-header {
position: absolute !important;
width: 100% !important;
top: 0 !important;
}
.md-input{
height:180px;
}
.md-preview {
padding:12px;
color:#000;
}
.md-preview > ol > li {
list-style: decimal inside;
/*padding-left: 20px;*/
}
.md-preview > ul > li {
list-style: disc;
/*padding-left: 20px;*/
}
</style>
<script>
(function () {
// 自动固定元素到屏幕顶端
function stickup(options) {
var that = {};
function getOffset(elem) {
var top = elem.offsetTop;
var left = elem.offsetLeft;
while (elem.offsetParent) {
elem = elem.offsetParent;
top += elem.offsetTop;
left += elem.offsetLeft;
}
return {
top: top,
left: left
};
}
function update() {
var elem = that.element;
var parent = elem.parentNode;
var top = getOffset(parent).top;
var classlist = elem.className.split(' ');
var pos = classlist.indexOf(options.class);
var scroll = document.documentElement.scrollTop;
var bottom = getOffset(parent).top + parent.offsetHeight;
scroll = Math.max(scroll, document.body.scrollTop);
bottom = bottom - options.offsetBottom;
// 仅在元素不在可见区域内、并且元素位置未超出父元素区域的情况下置顶它
if (scroll >= top && scroll + elem.offsetHeight < bottom) {
var classlist = elem.className.split(' ');
if (pos < 0) {
classlist.push(options.class);
elem.className = classlist.join(' ');
}
elem.style.position = 'fixed';
elem.style.width = elem.parentNode.offsetWidth - 2 + 'px';
elem.style.top = options.top;
elem.parentNode.style.paddingTop = elem.offsetHeight + 'px';
} else {
if (pos > 0) {
classlist.splice(pos, 1);
elem.className = classlist.join(' ');
}
elem.parentNode.style.paddingTop = 0;
elem.style.position = '';
elem.style.top = '';
elem.style.width = '';
that.offsetTop = getOffset(elem).top;
}
}
that.update = update;
options = options || {};
options.class = options.class || 'stickup';
options.offsetBottom = options.offsetBottom || 0;
if (options.element) {
that.element = options.element;
} else {
that.element = document.getElementById(options.id);
}
document.addEventListener('scroll', update);
window.addEventListener('resize', update);
return that;
}
var $editor = $("#editoredit81960");
var delayUpdate = null
$editor.markdown({
language: 'zh',
imgurl: "/upload",
base64url: "/upload_with_base_64",
onShow: function () {
var $header = $editor.parent().find('.md-header');
var handle = stickup({
element: $header[0],
top: '45px',
offsetBottom: 80
});
delayUpdate = function() {
setTimeout(handle.update, 200);
// 由于由 js 更改内容 autosize 无法监听，故需手动更新 size
autosize.update($editor);
}
},
onFullscreen: function() {
delayUpdate()
},
onHidenFullscreen: function() {
// 此处失去焦点是为了再次获取焦点时利用浏览器会自动滚动到焦点位置
$editor.blur()
delayUpdate()
}
});
var form_div = $(".rnd_81960").parent().parent().parent();
form_div.find('.md-input').on("keyup", function() {
var $box = $(this).parents().eq(4);
var $btnCommit = $box.find('.js-commit-button');
var $btnComment = $box.find('.js-comment-button');
if ($.trim($(this).val()).length == 0) {
$btnComment.addClass('disabled').prop('disabled', true);
$btnCommit.addClass('disabled').prop('disabled', true);
} else {
$btnComment.removeClass('disabled').prop('disabled', false);
$btnCommit.removeClass('disabled').prop('disabled', false);
}
});
$(function() {
var $loader = $editor.parents().eq(3).find('.small.loader');
$editor.val($("#hidden-contentedit81960").val());
$editor.bind("drop", function(e) {
e.preventDefault();
e.stopPropagation();
var fileList = e.originalEvent.dataTransfer.files;
if (fileList.length == 0) {
return;
}
if (fileList[0].type.indexOf('text') != -1) {
if (fileList[0].size > 1024 * 100) {
Flash.show("文本文件不能超过100k");
return;
}
var reader = new FileReader();
reader.onload = function(e) {
var contents = e.target.result;
var old_content = $editor.val();
$editor.val(old_content + contents);
var b = jQuery.Event('keyup', {
which: 39
});
$editor.trigger(b);
}
reader.readAsText(fileList[0]);
return;
}
if (fileList[0].type.indexOf('image') === -1) {
Flash.show('无法上传非图片');
return;
}
if (fileList[0].size > 2 * 1024 * 1024) {
Flash.show('上传图片大小不能超过 2MB');
return;
}
var reader = new FileReader();
reader.onload = function(e) {
$loader.show();
}
reader.readAsDataURL(fileList[0]);
var xhr = new XMLHttpRequest();
xhr.open("post", "/upload", true);
xhr.setRequestHeader("X-Requested-With", "XMLHttpRequest");
xhr.upload.addEventListener("progress",
function(e) {
if (e.lengthComputable) {
var loaded = Math.ceil((e.loaded / e.total) * 100);
}
},
false);
xhr.addEventListener("load",
function(e) {
$loader.hide();
var i = $.parseJSON(e.target.response);
if (i.success) {
var val = $editor.val();
val += '![输入图片说明](' + i.files[0].url + ' "在这里输入图片标题")';
$editor.val(val);
var b = jQuery.Event('keyup', {
which: 39
});
$editor.trigger(b);
} else if (i.msg) {
Flash.show(i.msg, 'error')
}
},
false);
xhr.setRequestHeader("Cache-Control", "no-cache");
xhr.setRequestHeader('X-CSRF-Token', $('meta[name="csrf-token"]').attr('content'));
xhr.setRequestHeader("X-Requested-With", "XMLHttpRequest");
var fd = new FormData();
fd.append('files', fileList[0]);
xhr.send(fd);
});
form_div.find('.js-comment-button').prop('disabled', true).addClass('disabled');
form_div.find('.js-commit-button').prop('disabled', true).addClass('disabled');
});
$('form').submit(function(e) {
var $this = $(this);
var $target = $(e.target);
var formFor = $this.data('for');
if ($target.attr('id') == 'navbar-search-form') {
return true;
}
if ($target.hasClass('project-refs-form')) {
return true;
}
if ($target.hasClass('edit_pull_request')) {
var o = $('#loadding-state').clone();
o.show();
o.attr('id', 'loadding-l');
$('#git-comment-divider').before(o);
return true;
}
$("#hidden-contentedit81960").val($editor.val());
// Issue、PR 和 Release 的表单不在此处做处理
if (['issue', 'pull request', 'release'].indexOf(formFor) >= 0) {
return true;
}
if ($.trim($this.find(".md-input").val()).length == 0) {
$("#hidden-contentedit81960").val('');
Flash.show("内容不能为空");
return false;
}
var loading = $this.parent().parent().prev().prev().find("#loadding-state");
loading.addClass("active").removeClass("disabled");
if (!$this.parent().hasClass('new_note')) {
$this.find('.md-input').prop('disabled', true);
}
var $btnComment = $this.find('.js-comment-button');
$btnComment.prop('disabled', true).addClass('disabled');
$this.find('.js-commit-button').prop('disabled', true).addClass('disabled');
switch ($btnComment.val()) {
case '评论':
case 'Comment':
var count = $.trim($('#total_count').text());
$('#total_count').text(parseInt(count) + 1);
break;
case '更新':
case 'Update':
if ($this.find('.md-input').val().length == 0) {
Flash.show('内容不能为空');
}
default: break;
}
});
})();
</script>
<input class="ui button orange js-comment-button" name="commit" style="margin: 10px 0 0 0;" type="submit" value="Comment" />
</form>
</div>
</div>
</div>
</div>
</div>
</div>
<script>
var clipboard = null;
$('.comment_count').html(0);
$(function() {
GitLab.GfmAutoComplete.Emoji.assetBase = '/assets/emoji'
GitLab.GfmAutoComplete.setup();
$('.copy-text').popup({
content: 'Copy to clipboard',
position: 'bottom center'
});
});
clipboard = new Clipboard('.copy-text', {
text: function(trigger) {
var $tigger = $(trigger);
return $tigger.parent().find('.blob-raw').val();
}
})
clipboard.on('success', function(e) {
var $trigger = $(e.trigger);
$trigger.popup('hide');
$trigger.popup('destroy');
$trigger.popup({content: 'Copied', position: 'bottom center'});
$trigger.popup('show');
})
clipboard.on('error', function(e) {
var giteeModal = new GiteeModalHelper({okText: 'Confirm'});
giteeModal.alert("Copy", 'Copy failed. Please copy it manually');
})
$("textarea[id^='editor']").on('keydown',function(e) {
if ((e.ctrlKey && e.keyCode == 13) || (e.metaKey && e.keyCode == 13)) {
$('.js-comment-button').trigger('click');
}
});
$('#code-piece-target a').popup({
inline: true,
position: 'bottom center'
})
$('#align-more-code-notes').click(function() {
$('#code-notes-loading-tips').removeClass('hide-loading')
$('#align-more-code-notes').hide()
})
</script>
Raw
showSearch.html
<html>
<div align="center">
<a id="showAdd" href="#">add</a> | <a id="showSearch" href="#">search</a>
<div id="add">
<h1>Add docs to the index</h1>
<p>
enter some title text<br>
<textarea id="title"></textarea>
</p>
<p>
enter some body text<br>
<textarea id="body"></textarea>
</p>
<input type="button" value="add" id="a" />
</div>
<div id="search" style="display:none">
<h1>Search the index</h1>
<p>
<input id="s">
</p>
<p>
<a id="sa" href="#">show all docs in index</a>
</p>
</div>
<br>
<br>
<div id="result" />
</div>
<script src="search-index.min.js"></script>
<script src="searchapp.js"></script>
</html>
Raw
zinoui-window.html
<!DOCTYPE html>
<html lang="en">
<head>
<title>Overlay - Zino UI HTML5 framework</title>
<meta name="description" content="Displays customizable dialog windows.">
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<link rel="stylesheet" href="https://static.zinoui.com/1.5/themes/silver/zino.core.css">
<link rel="stylesheet" href="https://static.zinoui.com/1.5/themes/silver/zino.button.css">
<link rel="stylesheet" href="https://static.zinoui.com/1.5/themes/silver/zino.resizable.css">
<link rel="stylesheet" href="https://static.zinoui.com/1.5/themes/silver/zino.overlay.css">
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/1.11.3/jquery.min.js" integrity="sha256-rsPUGdUPBXgalvIj4YKJrrUlmLXbOb6Cp7cdxn1qeUc=" crossorigin="anonymous"></script>
<script src="https://static.zinoui.com/1.5/compiled/zino.position.min.js"></script>
<script src="https://static.zinoui.com/1.5/compiled/zino.draggable.min.js"></script>
<script src="https://static.zinoui.com/1.5/compiled/zino.resizable.min.js"></script>
<script src="https://static.zinoui.com/1.5/compiled/zino.button.min.js"></script>
<script src="https://static.zinoui.com/1.5/compiled/zino.overlay.min.js"></script>
<script src="https://static.zinoui.com/js/front.min.js"></script>
<style type="text/css">body{padding: 15px; font: normal 12px Arial, sans-serif;}</style>
</head>
<body>
<div id="example_1" title="Example 1" style="display: none">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque dapibus volutpat odio, et lobortis sapien convallis vitae.</p><p>Nullam sed magna eu lectus ornare bibendum. Vestibulum vestibulum scelerisque aliquam. Mauris imperdiet malesuada erat id fringilla.</p>
</div>
<input type="button" id="button_1" value="Open window" />
<script type="text/javascript">
$(function () {
$("#example_1").zinoOverlay({
width: 400,
height: 240,
draggable: true,
resizable: true,
autoOpen: true,
buttons: {
"Close": function (button) {
$(this).zinoOverlay("close");
}
}
});
$("#button_1").click(function () {
$("#example_1").zinoOverlay("open");
});
$(":input[type='button']").zinoButton();
});
</script> </body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment