jianghe2nd/mota-js
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 2 Wiki Activity

Merge pull request #485 from zhaouv/blockly-dark-theme

Browse Source 
blockly dark theme
This commit is contained in:
Zhang Chen 2020-06-08 19:29:38 +08:00 committed by GitHub
commit b51083fafc
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 114 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

114
_server/editor_blockly.js
View File

@ -687,6 +687,120 @@ editor_blockly = function () {
}
editor_blockly.completeItems = [];
editor_blockly.setTheme=function (theme) {
var blocklyAddtionStyleNode;
blocklyAddtionStyleNode=document.getElementById('blocklyAddtionStyleNode_jxzdiv2v376fvcw7v')
if (blocklyAddtionStyleNode==null) {
blocklyAddtionStyleNode=document.createElement('style')
blocklyAddtionStyleNode.setAttribute('id','blocklyAddtionStyleNode_jxzdiv2v376fvcw7v')
document.head.appendChild(blocklyAddtionStyleNode)
var updateColour = Blockly.BlockSvg.prototype.updateColour
var setShadowColour_ = Blockly.BlockSvg.prototype.setShadowColour_
var setBorderColour_ = Blockly.BlockSvg.prototype.setBorderColour_
}
if (theme==='light') {
blocklyAddtionStyleNode.innerHTML=``
Blockly.BlockSvg.prototype.updateColour=updateColour
Blockly.BlockSvg.prototype.setShadowColour_=setShadowColour_
Blockly.BlockSvg.prototype.setBorderColour_=setBorderColour_
}
if (theme=='dark') {
// 改这个调整方块黑的程度 0~1, 越大越黑
var globalScale=0.1
blocklyAddtionStyleNode.innerHTML=`
.blocklySvg {
background-color: #000;
}
.blocklyNonEditableText>rect, .blocklyEditableText>rect {
fill: #000;
fill-opacity: .4;
}
.blocklyNonEditableText>text, .blocklyEditableText>text {
fill: #fff;
}
input.blocklyHtmlInput {
color: white;
background-color: black;
}
`
Blockly.BlockSvg.prototype.updateColour = function() {
if (this.disabled) {
// Disabled blocks don't have colour.
return;
}
var hexColour = this.getColour();
var colourSecondary = this.getColourSecondary();
var colourTertiary = this.getColourTertiary();
var rgb = goog.color.darken(goog.color.hexToRgb(hexColour),globalScale);
hexColour = goog.color.rgbArrayToHex(rgb);
if (this.isShadow()) {
hexColour = this.setShadowColour_(rgb, colourSecondary);
} else {
this.setBorderColour_(rgb, colourTertiary);
}
this.svgPath_.setAttribute('fill', hexColour);
var icons = this.getIcons();
for (var i = 0; i < icons.length; i++) {
icons[i].updateColour();
}
// Bump every dropdown to change its colour.
// TODO (#1456)
for (var x = 0, input; input = this.inputList[x]; x++) {
for (var y = 0, field; field = input.fieldRow[y]; y++) {
field.forceRerender();
}
}
}
;
Blockly.BlockSvg.prototype.setShadowColour_ = function(a, b) {
if (b) {
this.svgPathLight_.style.display = "none";
this.svgPathDark_.style.display = "none";
this.svgPath_.setAttribute("fill", b);
var c = b
} else
a = goog.color.darken(a, .4),
c = goog.color.rgbArrayToHex(a),
this.svgPathLight_.style.display = "none",
this.svgPathDark_.setAttribute("fill", c);
return c
}
;
Blockly.BlockSvg.prototype.setBorderColour_ = function(a, b) {
if (b)
this.svgPathLight_.setAttribute("stroke", "none"),
this.svgPathDark_.setAttribute("fill", "none"),
this.svgPath_.setAttribute("stroke", b);
else {
this.svgPathLight_.style.display = "";
var c = goog.color.rgbArrayToHex(goog.color.darken(a, .2))
, d = goog.color.rgbArrayToHex(goog.color.lighten(a, .3));
this.svgPathLight_.setAttribute("stroke", c);
this.svgPathDark_.setAttribute("fill", d);
this.svgPath_.setAttribute("stroke", "none")
}
}
;
}
}
return editor_blockly;
}