scratchfoundation/scratch-blocks
1
0
Fork 0
mirror of https://github.com/scratchfoundation/scratch-blocks.git synced 2025-08-11 05:29:12 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions3

Add optional icon to category menu

Browse source
This commit is contained in:
Eric Rosenbaum 2017-12-19 14:23:45 -05:00
parent 0edc587b2d
commit f4aff45250
3 changed files with 20 additions and 5 deletions

3
blocks_vertical/default_toolbox.js
View file

@ -640,7 +640,8 @@ Blockly.Blocks.defaultToolbox = '<xml id="toolbox-categories" style="display: no
'</category>' +
'<category name="More" colour="#FF6680" secondaryColour="#FF4D6A" custom="PROCEDURE">' +
'</category>' +
'<category name="Extensions" colour="#FF6680" secondaryColour="#FF4D6A">'+
'<category name="Extensions" colour="#FF6680" secondaryColour="#FF4D6A" '+
'iconURI="../media/extensions/wedo2-block-icon.svg">'+
'<block type="extension_pen_down" id="extension_pen_down"></block>'+
'<block type="extension_music_drum" id="extension_music_drum">'+
'<value name="NUMBER">'+

7
core/css.js
View file

@ -1181,6 +1181,13 @@ Blockly.Css.CONTENT = [
'margin: 0 auto 0.125rem;',
'}',
'.scratchCategoryItemIcon {',
'width: 1.25rem;',
'height: 1.25rem;',
'margin: 0 auto 0.125rem;',
'background-size: 100%;',
'}',
'.scratchCategoryMenuItem:hover {',
'color: $colour_toolboxHover !important;',
'}',

15
core/toolbox.js
View file

@ -506,6 +506,7 @@ Blockly.Toolbox.Category = function(parent, parentHtml, domTree) {
this.name_ = domTree.getAttribute('name');
this.setColour(domTree);
this.custom_ = domTree.getAttribute('custom');
this.iconURI_ = domTree.getAttribute('iconURI');
this.contents_ = [];
if (!this.custom_) {
this.parseContents_(domTree);
@ -536,10 +537,16 @@ Blockly.Toolbox.Category.prototype.createDom = function() {
this.label_ = goog.dom.createDom('div',
{'class': 'scratchCategoryMenuItemLabel'},
this.name_);
this.bubble_ = goog.dom.createDom('div',
{'class': 'scratchCategoryItemBubble'});
this.bubble_.style.backgroundColor = this.colour_;
this.bubble_.style.borderColor = this.secondaryColour_;
if (this.iconURI_) {
this.bubble_ = goog.dom.createDom('div',
{'class': 'scratchCategoryItemIcon'});
this.bubble_.style.backgroundImage = 'url(' + this.iconURI_ + ')';
} else {
this.bubble_ = goog.dom.createDom('div',
{'class': 'scratchCategoryItemBubble'});
this.bubble_.style.backgroundColor = this.colour_;
this.bubble_.style.borderColor = this.secondaryColour_;
}
this.item_.appendChild(this.bubble_);
this.item_.appendChild(this.label_);
this.parentHtml_.appendChild(this.item_);