Skip to content

Commit

Permalink
Ueditor.parse.js增加audio.js
Browse files Browse the repository at this point in the history
  • Loading branch information
@hbh112233abc
hbh112233abc committed Jun 12, 2020
1 parent b554909 commit 0932469
Show file tree
Hide file tree
Showing 8 changed files with 300 additions and 71 deletions.
46 changes: 46 additions & 0 deletions assets/ueditor/demo.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,46 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>demo</title>
<script type="text/javascript" src="./ueditor.parse.js"></script>
<script type="text/javascript">
uParse('body',{rootPath: '/static/bingher/ueditor'});
</script>
</head>
<body>
<pre><code class="line-numbers language-php">&lt;?php
&nbsp; &nbsp;echo &quot;hello world!&quot;;</code></pre>
<p>
<br/>
</p>
<div class="audio-wrapper" id="1591954465942" style="background-color: #fcfcfc;margin: 10px auto;max-width: 670px;height: 90px;border: 1px solid #e0e0e0;">
<audio>
<source src="http://www.efileyun.cn/test.mp3"/>
</audio>
<div class="audio-left" style="float: left;text-align: center;width: 22%;height: 100%;">
<img src="/static/bingher/ueditor/third-party/H5-audio/image/play.png" class="playicon" style="width: 40px;position: relative;top: 25px;margin: 0;display: initial;cursor: pointer;"/><img src="/static/bingher/ueditor/third-party/H5-audio/image/pause.png" class="pauseicon" style="width: 40px;position: relative;top: 25px;margin: 0;display: none;cursor: pointer;"/>
</div>
<div class="audio-right" style="margin-right: 5%;float: right;width: 73%;height: 100%;">
<p class="audio-title" style="max-width: 490px; font-size: 15px; height: 35%; margin: 8px 0px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;">
test.mp3
</p>
<div class="progress-bar-bg" style="background-color: #d9d9d9;position: relative;height: 2px;cursor: pointer;">
<span class="progress-dot" style="content: &#39; &#39;;width: 12px;height: 12px;border-radius: 50%;-moz-border-radius: 50%;-webkit-border-radius: 50%;background-color: #3e87e8;position: absolute;left: 0;top: -5px;margin-left: 0px;cursor: pointer;"></span>
<div class="progress-bar" style="background-color: #649fec;width: 0;height: 2px;"></div>
</div>
<div class="audio-time" style="overflow: hidden;margin-top: -1px;">
<span class="audio-length-current" style="float: left;margin-top:10px;font-size: 12px;color: #969696">00:00</span><span class="audio-length-total" style="float: right;margin-top:10px;font-size: 12px;color: #969696">04:05</span>
</div>
</div>
</div>
<p>
<br/>
</p>
<script>
// window.onload = function () {
// initAudio();
// };
</script>
</body>
</html>
9 changes: 6 additions & 3 deletions assets/ueditor/third-party/H5-audio/js/audio.js
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,10 @@
document.addEventListener('DOMContentLoaded', function () {
// document.addEventListener('DOMContentLoaded', function () {
// initAudio();
// }, false);

window.onload = function(){
initAudio();
}, false);
}

function initAudio(){
// 设置音频文件名显示宽度
Expand All @@ -11,7 +15,6 @@ function initAudio(){

// 初始化音频控制事件
var audioList = document.querySelectorAll('.audio-wrapper');
console.log(audioList);
audioList.forEach(function(e,i){
initAudioEvent(e);
})
Expand Down
104 changes: 104 additions & 0 deletions assets/ueditor/third-party/codemirror/codemirror - 副本.css
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,104 @@
.CodeMirror {
line-height: 1em;
font-family: monospace;
}

.CodeMirror-scroll {
overflow: auto;
height: 300px;
/* This is needed to prevent an IE[67] bug where the scrolled content
is visible outside of the scrolling box. */
position: relative;
}

.CodeMirror-gutter {
position: absolute; left: 0; top: 0;
z-index: 10;
background-color: #f7f7f7;
border-right: 1px solid #eee;
min-width: 2em;
height: 100%;
}
.CodeMirror-gutter-text {
color: #aaa;
text-align: right;
padding: .4em .2em .4em .4em;
white-space: pre !important;
}
.CodeMirror-lines {
padding: .4em;
}

.CodeMirror pre {
-moz-border-radius: 0;
-webkit-border-radius: 0;
-o-border-radius: 0;
border-radius: 0;
border-width: 0; margin: 0; padding: 0; background: transparent;
font-family: inherit;
font-size: inherit;
padding: 0; margin: 0;
white-space: pre;
word-wrap: normal;
}

.CodeMirror-wrap pre {
word-wrap: break-word;
white-space: pre-wrap;
}
.CodeMirror-wrap .CodeMirror-scroll {
overflow-x: hidden;
}

.CodeMirror textarea {
outline: none !important;
}

.CodeMirror pre.CodeMirror-cursor {
z-index: 10;
position: absolute;
visibility: hidden;
border-left: 1px solid black;
}
.CodeMirror-focused pre.CodeMirror-cursor {
visibility: visible;
}

span.CodeMirror-selected { background: #d9d9d9; }
.CodeMirror-focused span.CodeMirror-selected { background: #d2dcf8; }

.CodeMirror-searching {background: #ffa;}

/* Default theme */

.cm-s-default span.cm-keyword {color: #708;}
.cm-s-default span.cm-atom {color: #219;}
.cm-s-default span.cm-number {color: #164;}
.cm-s-default span.cm-def {color: #00f;}
.cm-s-default span.cm-variable {color: black;}
.cm-s-default span.cm-variable-2 {color: #05a;}
.cm-s-default span.cm-variable-3 {color: #085;}
.cm-s-default span.cm-property {color: black;}
.cm-s-default span.cm-operator {color: black;}
.cm-s-default span.cm-comment {color: #a50;}
.cm-s-default span.cm-string {color: #a11;}
.cm-s-default span.cm-string-2 {color: #f50;}
.cm-s-default span.cm-meta {color: #555;}
.cm-s-default span.cm-error {color: #f00;}
.cm-s-default span.cm-qualifier {color: #555;}
.cm-s-default span.cm-builtin {color: #30a;}
.cm-s-default span.cm-bracket {color: #cc7;}
.cm-s-default span.cm-tag {color: #170;}
.cm-s-default span.cm-attribute {color: #00c;}
.cm-s-default span.cm-header {color: #a0a;}
.cm-s-default span.cm-quote {color: #090;}
.cm-s-default span.cm-hr {color: #999;}
.cm-s-default span.cm-link {color: #00c;}

span.cm-header, span.cm-strong {font-weight: bold;}
span.cm-em {font-style: italic;}
span.cm-emstrong {font-style: italic; font-weight: bold;}
span.cm-link {text-decoration: underline;}

div.CodeMirror span.CodeMirror-matchingbracket {color: #0f0;}
div.CodeMirror span.CodeMirror-nonmatchingbracket {color: #f22;}
106 changes: 106 additions & 0 deletions assets/ueditor/third-party/codemirror/codemirror.css
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,106 @@
.CodeMirror {
line-height: 1em;
font-family: monospace;
background-color: #3f3f3f;
color: #dcdccc;
}

.CodeMirror-scroll {
overflow: auto;
height: 300px;
/* This is needed to prevent an IE[67] bug where the scrolled content
is visible outside of the scrolling box. */
position: relative;
}

.CodeMirror-gutter {
position: absolute; left: 0; top: 0;
z-index: 10;
background-color: #3f3f3f;
border-right: 1px solid #eee;
min-width: 2em;
height: 100%;
}
.CodeMirror-gutter-text {
color: #aaa;
text-align: right;
padding: .4em .2em .4em .4em;
white-space: pre !important;
}
.CodeMirror-lines {
padding: .4em;
}

.CodeMirror pre {
-moz-border-radius: 0;
-webkit-border-radius: 0;
-o-border-radius: 0;
border-radius: 0;
border-width: 0; margin: 0; padding: 0; background: transparent;
font-family: inherit;
font-size: inherit;
padding: 0; margin: 0;
white-space: pre;
word-wrap: normal;
}

.CodeMirror-wrap pre {
word-wrap: break-word;
white-space: pre-wrap;
}
.CodeMirror-wrap .CodeMirror-scroll {
overflow-x: hidden;
}

.CodeMirror textarea {
outline: none !important;
}

.CodeMirror pre.CodeMirror-cursor {
z-index: 10;
position: absolute;
visibility: hidden;
border-left: 1px solid white;
}
.CodeMirror-focused pre.CodeMirror-cursor {
visibility: visible;
}

span.CodeMirror-selected { background: #545454; }
.CodeMirror-focused span.CodeMirror-selected { background: #4f4f4f; }

.CodeMirror-searching {background: #ffa;}

/* Default theme */

.cm-s-default span.cm-keyword {color: #f0dfaf; font-weight: bold;}
.cm-s-default span.cm-atom {color: #bfebbf; }
.cm-s-default span.cm-number {color: #dcdccc;}
.cm-s-default span.cm-def {color: #dcdccc;}
.cm-s-default span.cm-variable {color: #dfaf8f;}
.cm-s-default span.cm-variable-2 {color: #dcdccc;}
.cm-s-default span.cm-variable-3 {color: #085;}
.cm-s-default span.cm-property {color: #dfaf8f;}
.cm-s-default span.cm-operator {color: #f0efd0;}
.cm-s-default span.cm-comment {color: #7f9f7f;}
.cm-s-default span.cm-string {color: #cc9393;}
.cm-s-default span.cm-string-2 {color: #cc9393; }
.cm-s-default span.cm-meta {color: #f0dfaf;}
.cm-s-default span.cm-error {color: #f00;}
.cm-s-default span.cm-qualifier {color: #7cb8bb;}
.cm-s-default span.cm-builtin {color: #dcdccc; font-weight: bold;}
.cm-s-default span.cm-bracket {box-sizing: border-box; background: transparent; border-bottom: 1px solid;}
.cm-s-default span.cm-tag {color: #93e0e3; }
.cm-s-default span.cm-attribute {color: #dfaf8f;}
.cm-s-default span.cm-header {color: #f0efd0;}
.cm-s-default span.cm-quote {color: #090;}
.cm-s-default span.cm-hr {color: #999;}
.cm-s-default span.cm-link {color: #00c;}

span.cm-header, span.cm-strong {font-weight: bold;}
span.cm-em {font-style: italic;}
span.cm-emstrong {font-style: italic; font-weight: bold;}
span.cm-link {text-decoration: underline;}

div.CodeMirror span.CodeMirror-matchingbracket {box-sizing: border-box; background: transparent; border-bottom: 1px solid;}
div.CodeMirror span.CodeMirror-nonmatchingbracket {border-bottom: 1px solid; background: none;}
19 changes: 6 additions & 13 deletions assets/ueditor/ueditor.all.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8072,6 +8072,9 @@ UE.Editor.defaultOptions = function(editor){
'onsuccess':function(r){
try {
var config = isJsonp ? r:eval("("+r.responseText+")");
if(config.code == 0){
return alert('ueditor config:'+config.state);
}
utils.extend(me.options, config);
me.fireEvent('serverConfigLoaded');
me._serverConfigLoaded = true;
Expand Down Expand Up @@ -11997,9 +12000,9 @@ UE.plugins['insertframe'] = function() {
UE.plugins['audio'] = function (){
var me = this;
// 从publis.js中获取的静态文件路径，需自行修改设置
var staticpath = me.options.UEDITOR_HOME_URL + 'themes/default/';
var playicon = staticpath + 'images/play.png';
var pauseicon = staticpath + 'images/pause.png';
var staticpath = me.options.UEDITOR_HOME_URL + 'third-party/H5-audio/image/';
var playicon = staticpath + 'play.png';
var pauseicon = staticpath + 'pause.png';

// 内容填入后初始化音频控件
me.addListener("afterSetContent", function() {
Expand All @@ -12009,16 +12012,6 @@ UE.plugins['audio'] = function (){
initAudioEvent(audioArr[i]);
}
}
// if(audioArr) {
// audioArr.forEach(function(a,i) {
// var aDiv = domUtils.findParent(a, function(node) {
// return node.className === 'audio-wrapper';
// });
// if(aDiv) {
// initAudioEvent(aDiv);
// }
// });
// }
});

/**
Expand Down
31 changes: 4 additions & 27 deletions assets/ueditor/ueditor.all.min.js
View file

Large diffs are not rendered by default.

27 changes: 27 additions & 0 deletions assets/ueditor/ueditor.parse.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -443,6 +443,33 @@ UE.parse.register("insertcode", function(utils) {
}
});

UE.parse.register("audio", function(utils) {
var audio = this.root.querySelectorAll(".audio-wrapper");
if (audio.length) {
var jsurl, cssurl;
if (this.rootPath !== undefined) {
jsurl = utils.removeLastbs(this.rootPath) + "/third-party/H5-audio/js/audio.js";
cssurl = utils.removeLastbs(this.rootPath) + "/third-party/H5-audio/css/audio.css";
} else {
jsurl = this.highlightJsUrl;
cssurl = this.highlightCssUrl;
}
// utils.loadFile(document, {
// id: "audio_css",
// tag: "link",
// rel: "stylesheet",
// type: "text/css",
// href: cssurl
// });
utils.loadFile(document, {
id: "audio_js",
src: jsurl,
tag: "script",
type: "text/javascript"
});
}
});

UE.parse.register('table', function (utils) {
var me = this,
root = this.root,
Expand Down
Loading

0 comments on commit 0932469

Please sign in to comment.