Jelajahi Sumber

Pretty config editor (#10)

* add pretty yaml editor

* Update Makefile

* miniy the js add css
rufengsuixing 5 tahun lalu
induk
melakukan
52f45fbf56

+ 1 - 1
Makefile

@@ -7,7 +7,7 @@ include $(TOPDIR)/rules.mk
 
 PKG_NAME:=luci-app-adguardhome
 PKG_VERSION:=1.7
-PKG_RELEASE:=7
+PKG_RELEASE:=8
 
 PKG_BUILD_DIR:=$(BUILD_DIR)/$(PKG_NAME)
 

+ 6 - 1
luasrc/model/cbi/AdGuardHome/manual.lua

@@ -9,8 +9,9 @@ local binpath = uci:get("AdGuardHome","AdGuardHome","binpath")
 s = m:section(TypedSection, "AdGuardHome")
 s.anonymous=true
 s.addremove=false
+--- config
 o = s:option(TextValue, "escconf")
-o.rows = 33
+o.rows = 66
 o.wrap = "off"
 o.rmempty = true
 o.cfgvalue = function(self, section)
@@ -30,6 +31,10 @@ end
 o.remove = function(self, section, value)
 	NXFS.writefile(escconf, "")
 end
+o = s:option(DummyValue, "")
+o.anonymous=true
+o.template = "AdGuardHome/yamleditor"
+--- log
 if (NXFS.access("/tmp/AdGuardHometmpconfig.yaml")) then
 local c=NXFS.readfile("/tmp/AdGuardHometest.log")
 if (c~="") then

+ 26 - 0
luasrc/view/AdGuardHome/yamleditor.htm

@@ -0,0 +1,26 @@
+    <%+cbi/valueheader%>
+	<script src="/luci-static/resources/codemirror/lib/codemirror.js"></script>
+	<link rel="stylesheet" href="/luci-static/resources/codemirror/lib/codemirror.css"/>
+    <script src="/luci-static/resources/codemirror/mode/yaml/yaml.js"></script>
+	<link rel="stylesheet" href="/luci-static/resources/codemirror/theme/dracula.css"/>
+	<link rel="stylesheet" href="/luci-static/resources/codemirror/addon/fold/foldgutter.css"/>
+	<script src="/luci-static/resources/codemirror/addon/fold/foldcode.js"></script>
+	<script src="/luci-static/resources/codemirror/addon/fold/foldgutter.js"></script>
+	<script src="/luci-static/resources/codemirror/addon/fold/indent-fold.js"></script>
+	<script type="text/javascript">//<![CDATA[
+	var editor = CodeMirror.fromTextArea(document.getElementById("cbid.AdGuardHome.AdGuardHome.escconf"), {
+	mode: "text/yaml",    //实现groovy代码高亮
+	    styleActiveLine: true,
+lineNumbers: true,	//显示行号
+theme: "dracula",	//设置主题
+lineWrapping: true,	//代码折叠
+foldGutter: true,
+gutters: ["CodeMirror-linenumbers", "CodeMirror-foldgutter"],
+matchBrackets: true,//括号匹配
+foldGutter: true
+}
+);
+//]]>
+</script> 
+<%+cbi/valuefooter%>
+	

File diff ditekan karena terlalu besar
+ 0 - 0
root/www/luci-static/resources/codemirror/addon/fold/foldcode.js


+ 1 - 0
root/www/luci-static/resources/codemirror/addon/fold/foldgutter.css

@@ -0,0 +1 @@
+.CodeMirror-foldmarker{color:blue;text-shadow:#b9f 1px 1px 2px,#b9f -1px -1px 2px,#b9f 1px -1px 2px,#b9f -1px 1px 2px;font-family:arial;line-height:.3;cursor:pointer}.CodeMirror-foldgutter{width:.7em}.CodeMirror-foldgutter-open,.CodeMirror-foldgutter-folded{cursor:pointer}.CodeMirror-foldgutter-open:after{content:"\25BE"}.CodeMirror-foldgutter-folded:after{content:"\25B8"}

File diff ditekan karena terlalu besar
+ 0 - 0
root/www/luci-static/resources/codemirror/addon/fold/foldgutter.js


+ 1 - 0
root/www/luci-static/resources/codemirror/addon/fold/indent-fold.js

@@ -0,0 +1 @@
+!function(e){"object"==typeof exports&&"object"==typeof module?e(require("../../lib/codemirror")):"function"==typeof define&&define.amd?define(["../../lib/codemirror"],e):e(CodeMirror)}(function(e){"use strict";function n(n,t){var i=n.getLine(t),o=i.search(/\S/);return-1==o||/\bcomment\b/.test(n.getTokenTypeAt(e.Pos(t,o+1)))?-1:e.countColumn(i,null,n.getOption("tabSize"))}e.registerHelper("fold","indent",function(t,i){var o=n(t,i.line);if(!(o<0)){for(var r=null,l=i.line+1,f=t.lastLine();l<=f;++l){var u=n(t,l);if(-1==u);else{if(!(u>o))break;r=l}}return r?{from:e.Pos(i.line,t.getLine(i.line).length),to:e.Pos(r,t.getLine(r).length)}:void 0}})});

File diff ditekan karena terlalu besar
+ 0 - 0
root/www/luci-static/resources/codemirror/lib/codemirror.css


File diff ditekan karena terlalu besar
+ 0 - 0
root/www/luci-static/resources/codemirror/lib/codemirror.js


+ 1 - 0
root/www/luci-static/resources/codemirror/mode/yaml/yaml.js

@@ -0,0 +1 @@
+!function(e){"object"==typeof exports&&"object"==typeof module?e(require("../../lib/codemirror")):"function"==typeof define&&define.amd?define(["../../lib/codemirror"],e):e(CodeMirror)}(function(e){"use strict";e.defineMode("yaml",function(){var e=new RegExp("\\b(("+["true","false","on","off","yes","no"].join(")|(")+"))$","i");return{token:function(i,t){var r=i.peek(),n=t.escaped;if(t.escaped=!1,"#"==r&&(0==i.pos||/\s/.test(i.string.charAt(i.pos-1))))return i.skipToEnd(),"comment";if(i.match(/^('([^']|\\.)*'?|"([^"]|\\.)*"?)/))return"string";if(t.literal&&i.indentation()>t.keyCol)return i.skipToEnd(),"string";if(t.literal&&(t.literal=!1),i.sol()){if(t.keyCol=0,t.pair=!1,t.pairStart=!1,i.match(/---/))return"def";if(i.match(/\.\.\./))return"def";if(i.match(/\s*-\s+/))return"meta"}if(i.match(/^(\{|\}|\[|\])/))return"{"==r?t.inlinePairs++:"}"==r?t.inlinePairs--:"["==r?t.inlineList++:t.inlineList--,"meta";if(t.inlineList>0&&!n&&","==r)return i.next(),"meta";if(t.inlinePairs>0&&!n&&","==r)return t.keyCol=0,t.pair=!1,t.pairStart=!1,i.next(),"meta";if(t.pairStart){if(i.match(/^\s*(\||\>)\s*/))return t.literal=!0,"meta";if(i.match(/^\s*(\&|\*)[a-z0-9\._-]+\b/i))return"variable-2";if(0==t.inlinePairs&&i.match(/^\s*-?[0-9\.\,]+\s?$/))return"number";if(t.inlinePairs>0&&i.match(/^\s*-?[0-9\.\,]+\s?(?=(,|}))/))return"number";if(i.match(e))return"keyword"}return!t.pair&&i.match(/^\s*(?:[,\[\]{}&*!|>'"%@`][^\s'":]|[^,\[\]{}#&*!|>'"%@`])[^#]*?(?=\s*:($|\s))/)?(t.pair=!0,t.keyCol=i.indentation(),"atom"):t.pair&&i.match(/^:\s*/)?(t.pairStart=!0,"meta"):(t.pairStart=!1,t.escaped="\\"==r,i.next(),null)},startState:function(){return{pair:!1,pairStart:!1,keyCol:0,inlinePairs:0,inlineList:0,literal:!1,escaped:!1}},lineComment:"#",fold:"indent"}}),e.defineMIME("text/x-yaml","yaml"),e.defineMIME("text/yaml","yaml")});

+ 1 - 0
root/www/luci-static/resources/codemirror/theme/dracula.css

@@ -0,0 +1 @@
+.cm-s-dracula.CodeMirror,.cm-s-dracula .CodeMirror-gutters{background-color:#282a36 !important;color:#f8f8f2 !important;border:0}.cm-s-dracula .CodeMirror-gutters{color:#282a36}.cm-s-dracula .CodeMirror-cursor{border-left:solid thin #f8f8f0}.cm-s-dracula .CodeMirror-linenumber{color:#6d8a88}.cm-s-dracula .CodeMirror-selected{background:rgba(255,255,255,0.10)}.cm-s-dracula .CodeMirror-line::selection,.cm-s-dracula .CodeMirror-line>span::selection,.cm-s-dracula .CodeMirror-line>span>span::selection{background:rgba(255,255,255,0.10)}.cm-s-dracula .CodeMirror-line::-moz-selection,.cm-s-dracula .CodeMirror-line>span::-moz-selection,.cm-s-dracula .CodeMirror-line>span>span::-moz-selection{background:rgba(255,255,255,0.10)}.cm-s-dracula span.cm-comment{color:#6272a4}.cm-s-dracula span.cm-string,.cm-s-dracula span.cm-string-2{color:#f1fa8c}.cm-s-dracula span.cm-number{color:#bd93f9}.cm-s-dracula span.cm-variable{color:#50fa7b}.cm-s-dracula span.cm-variable-2{color:white}.cm-s-dracula span.cm-def{color:#50fa7b}.cm-s-dracula span.cm-operator{color:#ff79c6}.cm-s-dracula span.cm-keyword{color:#ff79c6}.cm-s-dracula span.cm-atom{color:#bd93f9}.cm-s-dracula span.cm-meta{color:#f8f8f2}.cm-s-dracula span.cm-tag{color:#ff79c6}.cm-s-dracula span.cm-attribute{color:#50fa7b}.cm-s-dracula span.cm-qualifier{color:#50fa7b}.cm-s-dracula span.cm-property{color:#66d9ef}.cm-s-dracula span.cm-builtin{color:#50fa7b}.cm-s-dracula span.cm-variable-3,.cm-s-dracula span.cm-type{color:#ffb86c}.cm-s-dracula .CodeMirror-activeline-background{background:rgba(255,255,255,0.1)}.cm-s-dracula .CodeMirror-matchingbracket{text-decoration:underline;color:white !important}

Beberapa file tidak ditampilkan karena terlalu banyak file yang berubah dalam diff ini