ルクセリタスのコード表示部分をいじり、パス表示を追加してみました。
diff --git a/js/luxe-blocks.js b/js/luxe-blocks.js
index 47d3ce8..a6e77ef 100644
--- a/js/luxe-blocks.js
+++ b/js/luxe-blocks.js
@@ -4411,6 +4411,10 @@ window.addEventListener("DOMContentLoaded", function() {
language: {
type: "string",
default: ""
+ },
+ filename: {
+ type: "string",
+ default: ""
}
},
supports: {
@@ -4464,45 +4468,66 @@ window.addEventListener("DOMContentLoaded", function() {
value: ""
}];
return Object.keys(luxeHighlighterList).forEach(function(e) {
- c.push({
- label: this[e],
- value: e
- })
- }, luxeHighlighterList), l.push(s(d.SelectControl, {
- label: u("Code Language", "luxeritas"),
- value: a,
- options: c,
- onChange: function(e) {
- return n({
- language: e
- })
- }
- })), t = s("p", null, u("* The theme can be changed from the CSS tab of Luxeritas menu.", "luxeritas")), [s(p.InspectorControls, {
- key: "syntaxHighlighterInspectorControls"
- }, s(d.PanelBody, {
- title: u("Settings")
- }, l, t)), s("div", {
- className: r + " wp-block-code"
- }, s(p.PlainText, {
- value: i,
- onChange: function(e) {
- return n({
- content: e
+ c.push({
+ label: this[e],
+ value: e
})
- },
- placeholder: u("To the right, choose a code language from the block settings.", "luxeritas"),
- "aria-label": u("Syntax Highlighter", "luxeritas")
- }))]
+ }, luxeHighlighterList), l.push(s(d.SelectControl, {
+ label: u("Code Language", "luxeritas"),
+ value: a,
+ options: c,
+ onChange: function(e) {
+ return n({
+ language: e,
+ filename: o.filename
+ })
+ }
+ })),
+ l.push(s(d.TextControl, {
+ label: u("File Name", "luxeritas"),
+ value: o.filename,
+ onChange: function(e) {
+ return n({
+ language: a,
+ filename: e
+ })
+ }
+ })), t = s("p", null, u("* The theme can be changed from the CSS tab of Luxeritas menu.", "luxeritas")), [s(p.InspectorControls, {
+ key: "syntaxHighlighterInspectorControls"
+ }, s(d.PanelBody, {
+ title: u("Settings")
+ }, l, t)), s("div", {
+ className: r + " wp-block-code"
+ }, s(p.PlainText, {
+ value: i,
+ onChange: function(e) {
+ return n({
+ content: e
+ })
+ },
+ placeholder: u("To the right, choose a code language from the block settings.", "luxeritas"),
+ "aria-label": u("Syntax Highlighter", "luxeritas")
+ }))]
},
save: function(e) {
var t = e.attributes,
o = t.content,
n = t.language.replace("highlight_", "");
- return "" != n ? s("pre", {
- className: "line-numbers language-" + n
- }, s("code", {
- className: "language-" + n
- }, o)) : s("pre", null, s("code", null, o))
+ var obj;
+ if ("" != n) {
+ var pre = {
+ className: "line-numbers language-" + n,
+ };
+ if (t.filename) {
+ pre["data-label"] = t.filename;
+ }
+ obj = s("pre", pre, s("code", {
+ className: "language-" + n
+ }, o));
+ } else {
+ obj = s("pre", null, s("code", null, o));
+ }
+ return obj;
}
})
}(),
diff --git a/languages/admin/luxeritas-ja-luxe-blocks.json b/languages/admin/luxeritas-ja-luxe-blocks.json
index 4d04781..8381a3c 100644
--- a/languages/admin/luxeritas-ja-luxe-blocks.json
+++ b/languages/admin/luxeritas-ja-luxe-blocks.json
@@ -200,6 +200,9 @@
"Code Language": [
"言語"
],
+ "File Name" : [
+ "ファイル名"
+ ],
"* The theme can be changed from the CSS tab of Luxeritas menu.": [
"※ テーマ(見た目)は Luxeritas メニューの CSS タブから変更できます。"
],
luxe-blocks.jsはminifyされてたので、以下で整形してから編集してdiffを取っています。
$ npx js-beautify -s 2 luxe-blocks.js >luxe-blocks.js.new
$ mv luxe-blocks.js.new luxe-blocks.js編集後は以下でminifyして使っています。
$ npx -p uglify-js uglifyjs luxe-blocks.js -c --output luxe-blocks.js.new
$ mv luxe-blocks.js.new luxe-blocks.js
$ 手作業でライセンスの貼り付け上記作業はパッチにして以下にまとめてあります。
