summaryrefslogtreecommitdiff
path: root/src/blockly/core/field_image.js
diff options
context:
space:
mode:
authorDavid Barksdale <amatus@amatus.name>2016-12-03 14:23:02 -0600
committerDavid Barksdale <amatus@amatus.name>2016-12-03 14:23:02 -0600
commit99e916beaf6afe5b2300bd95e73267550767bf7a (patch)
tree2b22c71fbdbf507735635c834de2276450b6372a /src/blockly/core/field_image.js
parent53284a2f5d22d15cd7851fd0f06a53ea1df0c280 (diff)
Add Semantic-UI and get blockly working
Diffstat (limited to 'src/blockly/core/field_image.js')
-rw-r--r--src/blockly/core/field_image.js171
1 files changed, 171 insertions, 0 deletions
diff --git a/src/blockly/core/field_image.js b/src/blockly/core/field_image.js
new file mode 100644
index 0000000..71d8052
--- /dev/null
+++ b/src/blockly/core/field_image.js
@@ -0,0 +1,171 @@
+/**
+ * @license
+ * Visual Blocks Editor
+ *
+ * Copyright 2012 Google Inc.
+ * https://developers.google.com/blockly/
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/**
+ * @fileoverview Image field. Used for titles, labels, etc.
+ * @author fraser@google.com (Neil Fraser)
+ */
+'use strict';
+
+goog.provide('Blockly.FieldImage');
+
+goog.require('Blockly.Field');
+goog.require('goog.dom');
+goog.require('goog.math.Size');
+goog.require('goog.userAgent');
+
+
+/**
+ * Class for an image.
+ * @param {string} src The URL of the image.
+ * @param {number} width Width of the image.
+ * @param {number} height Height of the image.
+ * @param {string=} opt_alt Optional alt text for when block is collapsed.
+ * @extends {Blockly.Field}
+ * @constructor
+ */
+Blockly.FieldImage = function(src, width, height, opt_alt) {
+ this.sourceBlock_ = null;
+ // Ensure height and width are numbers. Strings are bad at math.
+ this.height_ = Number(height);
+ this.width_ = Number(width);
+ this.size_ = new goog.math.Size(this.width_,
+ this.height_ + 2 * Blockly.BlockSvg.INLINE_PADDING_Y);
+ this.text_ = opt_alt || '';
+ this.setValue(src);
+};
+goog.inherits(Blockly.FieldImage, Blockly.Field);
+
+/**
+ * Rectangular mask used by Firefox.
+ * @type {Element}
+ * @private
+ */
+Blockly.FieldImage.prototype.rectElement_ = null;
+
+/**
+ * Editable fields are saved by the XML renderer, non-editable fields are not.
+ */
+Blockly.FieldImage.prototype.EDITABLE = false;
+
+/**
+ * Install this image on a block.
+ */
+Blockly.FieldImage.prototype.init = function() {
+ if (this.fieldGroup_) {
+ // Image has already been initialized once.
+ return;
+ }
+ // Build the DOM.
+ /** @type {SVGElement} */
+ this.fieldGroup_ = Blockly.createSvgElement('g', {}, null);
+ if (!this.visible_) {
+ this.fieldGroup_.style.display = 'none';
+ }
+ /** @type {SVGElement} */
+ this.imageElement_ = Blockly.createSvgElement('image',
+ {'height': this.height_ + 'px',
+ 'width': this.width_ + 'px'}, this.fieldGroup_);
+ this.setValue(this.src_);
+ if (goog.userAgent.GECKO) {
+ /**
+ * Due to a Firefox bug which eats mouse events on image elements,
+ * a transparent rectangle needs to be placed on top of the image.
+ * @type {SVGElement}
+ */
+ this.rectElement_ = Blockly.createSvgElement('rect',
+ {'height': this.height_ + 'px',
+ 'width': this.width_ + 'px',
+ 'fill-opacity': 0}, this.fieldGroup_);
+ }
+ this.sourceBlock_.getSvgRoot().appendChild(this.fieldGroup_);
+
+ // Configure the field to be transparent with respect to tooltips.
+ var topElement = this.rectElement_ || this.imageElement_;
+ topElement.tooltip = this.sourceBlock_;
+ Blockly.Tooltip.bindMouseEvents(topElement);
+};
+
+/**
+ * Dispose of all DOM objects belonging to this text.
+ */
+Blockly.FieldImage.prototype.dispose = function() {
+ goog.dom.removeNode(this.fieldGroup_);
+ this.fieldGroup_ = null;
+ this.imageElement_ = null;
+ this.rectElement_ = null;
+};
+
+/**
+ * Change the tooltip text for this field.
+ * @param {string|!Element} newTip Text for tooltip or a parent element to
+ * link to for its tooltip.
+ */
+Blockly.FieldImage.prototype.setTooltip = function(newTip) {
+ var topElement = this.rectElement_ || this.imageElement_;
+ topElement.tooltip = newTip;
+};
+
+/**
+ * Get the source URL of this image.
+ * @return {string} Current text.
+ * @override
+ */
+Blockly.FieldImage.prototype.getValue = function() {
+ return this.src_;
+};
+
+/**
+ * Set the source URL of this image.
+ * @param {?string} src New source.
+ * @override
+ */
+Blockly.FieldImage.prototype.setValue = function(src) {
+ if (src === null) {
+ // No change if null.
+ return;
+ }
+ this.src_ = src;
+ if (this.imageElement_) {
+ this.imageElement_.setAttributeNS('http://www.w3.org/1999/xlink',
+ 'xlink:href', goog.isString(src) ? src : '');
+ }
+};
+
+/**
+ * Set the alt text of this image.
+ * @param {?string} alt New alt text.
+ * @override
+ */
+Blockly.FieldImage.prototype.setText = function(alt) {
+ if (alt === null) {
+ // No change if null.
+ return;
+ }
+ this.text_ = alt;
+};
+
+/**
+ * Images are fixed width, no need to render.
+ * @private
+ */
+Blockly.FieldImage.prototype.render_ = function() {
+ // NOP
+};