\
'
)());
- this.updating = false;
+ this.virtualContentSelector = this.$box.find('.io-virtual-content');
+ this.fpgaContentSelector = this.$box.find('.io-fpga-content');
+ this.headerSelector = this.$box.find('.header');
+
+ this.model.on('change', this.updateBox, this);
+ this.model.on('remove', this.removeBox, this);
+
+ this.listenTo(this.model, 'process:ports', this.update);
+ joint.dia.ElementView.prototype.initialize.apply(this, arguments);
// Prevent paper from handling pointerdown.
var self = this;
@@ -684,6 +700,10 @@ joint.shapes.ice.IOView = joint.shapes.ice.ModelView.extend({
}
});
+ this.updateBox();
+
+ this.updating = false;
+
// Apply data
if (!this.model.get('disabled')) {
this.applyChoices();
@@ -693,31 +713,6 @@ joint.shapes.ice.IOView = joint.shapes.ice.ModelView.extend({
this.applyClock();
},
- applyShape: function() {
- var virtualPortId = '#virtualPort' + this.id;
- var fpgaPortId = '#fpgaPort' + this.id;
- var data = this.model.get('data');
- var name = data.name + (data.range || '');
- var virtual = data.virtual || this.model.get('disabled');
-
- this.$box.find('label').text(name || '');
-
- if (virtual) {
- // Virtual port (green)
- $(fpgaPortId).addClass('hidden');
- $(virtualPortId).removeClass('hidden');
- this.model.attributes.size.height = 64;
- }
- else {
- // FPGA I/O port (yellow)
- $(virtualPortId).addClass('hidden');
- $(fpgaPortId).removeClass('hidden');
- if (data.pins) {
- this.model.attributes.size.height = 32 + 32 * data.pins.length;
- }
- }
- },
-
applyChoices: function() {
var data = this.model.get('data');
if (data.pins) {
@@ -740,12 +735,35 @@ joint.shapes.ice.IOView = joint.shapes.ice.ModelView.extend({
this.updating = false;
},
- applyClock: function() {
- if (this.model.get('data').clock) {
- this.$box.find('p').removeClass('hidden');
+ applyShape: function() {
+ var data = this.model.get('data');
+ var name = data.name + (data.range || '');
+ var virtual = data.virtual || this.model.get('disabled');
+
+ var $label = this.$box.find('label');
+ $label.text(name || '');
+
+ if (virtual) {
+ // Virtual port (green)
+ this.fpgaContentSelector.addClass('hidden');
+ this.virtualContentSelector.removeClass('hidden');
+ this.model.attributes.size.height = 64;
}
else {
- this.$box.find('p').addClass('hidden');
+ // FPGA I/O port (yellow)
+ this.virtualContentSelector.addClass('hidden');
+ this.fpgaContentSelector.removeClass('hidden');
+ if (data.pins) {
+ this.model.attributes.size.height = 32 + 32 * data.pins.length;
+ }
+ }
+ },
+
+ applyClock: function() {
+ if (this.model.get('data').clock) {
+ this.$box.find('svg').removeClass('hidden');
+ } else {
+ this.$box.find('svg').addClass('hidden');
}
},
@@ -769,8 +787,8 @@ joint.shapes.ice.IOView = joint.shapes.ice.ModelView.extend({
apply: function() {
this.applyChoices();
this.applyValues();
- this.applyClock();
this.applyShape();
+ this.applyClock();
this.render();
},
@@ -779,19 +797,95 @@ joint.shapes.ice.IOView = joint.shapes.ice.ModelView.extend({
joint.dia.ElementView.prototype.update.apply(this, arguments);
},
+ updateBox: function() {
+ var i, port;
+ var bbox = this.model.getBBox();
+ var data = this.model.get('data');
+ var state = this.model.get('state');
+ var rules = this.model.get('rules');
+ var leftPorts = this.model.get('leftPorts');
+ var rightPorts = this.model.get('rightPorts');
+ var modelId = this.model.id;
+
+ // Render ports width
+ var width = WIRE_WIDTH * state.zoom;
+ this.$('.port-wire').css('stroke-width', width);
+ // Set buses
+ for (i in leftPorts) {
+ port = leftPorts[i];
+ if (port.size > 1) {
+ this.$('#port-wire-' + modelId + '-' + port.id).css('stroke-width', width * 3);
+ }
+ }
+ for (i in rightPorts) {
+ port = rightPorts[i];
+ if (port.size > 1) {
+ this.$('#port-wire-' + modelId + '-' + port.id).css('stroke-width', width * 3);
+ }
+ }
+ // Render rules
+ if (data && data.ports && data.ports.in) {
+ for (i in data.ports.in) {
+ port = data.ports.in[i];
+ var portDefault = this.$('#port-default-' + modelId + '-' + port.name);
+ if (rules && port.default && port.default.apply) {
+ portDefault.css('display', 'inline');
+ portDefault.find('path').css('stroke-width', width);
+ portDefault.find('rect').css('stroke-width', state.zoom);
+ }
+ else {
+ portDefault.css('display', 'none');
+ }
+ }
+ }
+
+ // Render io virtual content
+ var virtualtopOffset = 24;
+ this.virtualContentSelector.css({
+ left: bbox.width / 2.0 * (state.zoom - 1),
+ top: (bbox.height - virtualtopOffset) / 2.0 * (state.zoom - 1) + virtualtopOffset / 2.0 * state.zoom,
+ width: bbox.width,
+ height: bbox.height - virtualtopOffset,
+ transform: 'scale(' + state.zoom + ')'
+ });
+
+ // Render io FPGA content
+ var fpgaTopOffset = (data.name || data.range || data.clock) ? 0 : 24;
+ this.fpgaContentSelector.css({
+ left: bbox.width / 2.0 * (state.zoom - 1),
+ top: (bbox.height - fpgaTopOffset) / 2.0 * (state.zoom - 1) + fpgaTopOffset / 2.0 * state.zoom,
+ width: bbox.width,
+ height: bbox.height - fpgaTopOffset,
+ transform: 'scale(' + state.zoom + ')'
+ });
+
+ if (data.name || data.range || data.clock) {
+ this.headerSelector.removeClass('hidden');
+ } else {
+ this.headerSelector.addClass('hidden');
+ }
+
+ // Render block
+ this.$box.css({
+ left: bbox.x * state.zoom + state.pan.x,
+ top: bbox.y * state.zoom + state.pan.y,
+ width: bbox.width * state.zoom,
+ height: bbox.height * state.zoom
+ });
+ },
+
removeBox: function() {
// Close select options on remove
this.$box.find('select').select2('close');
this.$box.remove();
}
-
});
joint.shapes.ice.InputView = joint.shapes.ice.IOView;
joint.shapes.ice.OutputView = joint.shapes.ice.IOView;
-// Constant blocks
+// Constant block
joint.shapes.ice.Constant = joint.shapes.ice.Model.extend({
defaults: joint.util.deepSupplement({
@@ -806,24 +900,43 @@ joint.shapes.ice.Constant = joint.shapes.ice.Model.extend({
joint.shapes.ice.ConstantView = joint.shapes.ice.ModelView.extend({
- template: '\
-
\
- ',
-
initialize: function() {
- joint.shapes.ice.ModelView.prototype.initialize.apply(this, arguments);
+ _.bindAll(this, 'updateBox');
+ joint.dia.ElementView.prototype.initialize.apply(this, arguments);
- this.updating = false;
+ this.$box = $(joint.util.template(
+ '\
+
\
+ '
+ )());
+
+ this.inputSelector = this.$box.find('.constant-input');
+ this.contentSelector = this.$box.find('.constant-content');
+ this.headerSelector = this.$box.find('.header');
+
+ this.model.on('change', this.updateBox, this);
+ this.model.on('remove', this.removeBox, this);
+
+ this.listenTo(this.model, 'process:ports', this.update);
+ joint.dia.ElementView.prototype.initialize.apply(this, arguments);
// Prevent paper from handling pointerdown.
+ this.inputSelector.on('mousedown click', function(event) { event.stopPropagation(); });
+
+ this.updateBox();
+
+ this.updating = false;
+
var self = this;
- var selector = this.$box.find('.constant-input');
- selector.on('mousedown click', function(event) { event.stopPropagation(); });
- selector.on('input', function(event) {
+ this.inputSelector.on('input', function(event) {
if (!self.updating) {
var target = $(event.target);
var data = JSON.parse(JSON.stringify(self.model.get('data')));
@@ -831,7 +944,7 @@ joint.shapes.ice.ConstantView = joint.shapes.ice.ModelView.extend({
self.model.set('data', data);
}
});
- selector.on('paste', function(event) {
+ this.inputSelector.on('paste', function(event) {
var data = event.originalEvent.clipboardData.getData('text');
if (data.startsWith('{"icestudio":')) {
// Prevent paste blocks
@@ -843,39 +956,72 @@ joint.shapes.ice.ConstantView = joint.shapes.ice.ModelView.extend({
this.apply();
},
+ apply: function() {
+ this.applyName();
+ this.applyLocal();
+ this.applyValue();
+ },
+
applyName: function() {
var name = this.model.get('data').name;
this.$box.find('label').text(name);
},
- applyValue: function() {
- this.updating = true;
- if (this.model.get('disabled')) {
- this.$box.find('.constant-input').css({'pointer-events': 'none'});
- }
- var value = this.model.get('data').value;
- this.$box.find('.constant-input').val(value);
- this.updating = false;
- },
-
applyLocal: function() {
if (this.model.get('data').local) {
this.$box.find('svg').removeClass('hidden');
- }
- else {
+ } else {
this.$box.find('svg').addClass('hidden');
}
},
- apply: function() {
- this.applyName();
- this.applyLocal();
- this.applyValue();
+ applyValue: function() {
+ this.updating = true;
+ if (this.model.get('disabled')) {
+ this.inputSelector.css({'pointer-events': 'none'});
+ }
+ var value = this.model.get('data').value;
+ this.inputSelector.val(value);
+ this.updating = false;
},
update: function() {
this.renderPorts();
joint.dia.ElementView.prototype.update.apply(this, arguments);
+ },
+
+ updateBox: function() {
+ var bbox = this.model.getBBox();
+ var data = this.model.get('data');
+ var state = this.model.get('state');
+
+ // Set wire width
+ var width = WIRE_WIDTH * state.zoom;
+ this.$('.port-wire').css('stroke-width', width);
+
+ // Render content
+ var topOffset = (data.name || data.local) ? 0 : 24;
+ this.contentSelector.css({
+ left: bbox.width / 2.0 * (state.zoom - 1),
+ top: (bbox.height + topOffset ) / 2.0 * (state.zoom - 1) + topOffset,
+ width: bbox.width,
+ height: bbox.height - topOffset,
+ transform: 'scale(' + state.zoom + ')'
+ });
+
+ if (data.name || data.local) {
+ this.headerSelector.removeClass('hidden');
+ } else {
+ this.headerSelector.addClass('hidden');
+ }
+
+ // Render block
+ this.$box.css({
+ left: bbox.x * state.zoom + state.pan.x,
+ top: bbox.y * state.zoom + state.pan.y,
+ width: bbox.width * state.zoom,
+ height: bbox.height * state.zoom
+ });
}
});
@@ -887,7 +1033,7 @@ joint.shapes.ice.Memory = joint.shapes.ice.Model.extend({
type: 'ice.Memory',
size: {
width: 96,
- height: 112
+ height: 104
}
}, joint.shapes.ice.Model.prototype.defaults)
});
@@ -904,8 +1050,10 @@ joint.shapes.ice.MemoryView = joint.shapes.ice.ModelView.extend({
'\
\
\
\
\
@@ -926,6 +1075,7 @@ joint.shapes.ice.MemoryView = joint.shapes.ice.ModelView.extend({
this.editorSelector = this.$box.find('.memory-editor');
this.contentSelector = this.$box.find('.memory-content');
+ this.headerSelector = this.$box.find('.header');
this.model.on('change', this.updateBox, this);
this.model.on('remove', this.removeBox, this);
@@ -1014,6 +1164,12 @@ joint.shapes.ice.MemoryView = joint.shapes.ice.ModelView.extend({
this.apply({ ini: true });
},
+ apply: function(opt) {
+ this.applyName();
+ this.applyLocal();
+ this.applyValue(opt);
+ },
+
applyName: function() {
var name = this.model.get('data').name;
this.$box.find('label').text(name);
@@ -1022,8 +1178,7 @@ joint.shapes.ice.MemoryView = joint.shapes.ice.ModelView.extend({
applyLocal: function() {
if (this.model.get('data').local) {
this.$box.find('svg').removeClass('hidden');
- }
- else {
+ } else {
this.$box.find('svg').addClass('hidden');
}
},
@@ -1069,12 +1224,6 @@ joint.shapes.ice.MemoryView = joint.shapes.ice.ModelView.extend({
}, 10, this);
},
- apply: function(opt) {
- this.applyName();
- this.applyLocal();
- this.applyValue(opt);
- },
-
update: function() {
this.renderPorts();
this.editor.setReadOnly(this.model.get('disabled'));
@@ -1082,14 +1231,9 @@ joint.shapes.ice.MemoryView = joint.shapes.ice.ModelView.extend({
},
updateBox: function() {
- var i, port;
var bbox = this.model.getBBox();
var data = this.model.get('data');
var state = this.model.get('state');
- var rules = this.model.get('rules');
- var leftPorts = this.model.get('leftPorts');
- var rightPorts = this.model.get('rightPorts');
- var modelId = this.model.id;
// Set font size
if (this.editor) {
@@ -1097,11 +1241,8 @@ joint.shapes.ice.MemoryView = joint.shapes.ice.ModelView.extend({
this.prevZoom = state.zoom;
// Scale editor
this.editorSelector.css({
- top: 22 * state.zoom,
- left: -2 * state.zoom,
- right: -2 * state.zoom,
- bottom: -2 * state.zoom,
- margin: 8 * state.zoom,
+ top: 24 * state.zoom,
+ margin: 7 * state.zoom,
'border-radius': 5 * state.zoom,
'border-width': state.zoom + 0.5
});
@@ -1121,47 +1262,26 @@ joint.shapes.ice.MemoryView = joint.shapes.ice.ModelView.extend({
this.editor.resize();
}
- // Set ports width
+ // Set wire width
var width = WIRE_WIDTH * state.zoom;
this.$('.port-wire').css('stroke-width', width);
- // Set buses
- for (i in leftPorts) {
- port = leftPorts[i];
- if (port.size > 1) {
- this.$('#port-wire-' + modelId + '-' + port.id).css('stroke-width', width * 3);
- }
- }
- for (i in rightPorts) {
- port = rightPorts[i];
- if (port.size > 1) {
- this.$('#port-wire-' + modelId + '-' + port.id).css('stroke-width', width * 3);
- }
- }
- // Render rules
- if (data && data.ports && data.ports.in) {
- for (i in data.ports.in) {
- port = data.ports.in[i];
- var portDefault = this.$('#port-default-' + modelId + '-' + port.name);
- if (rules && port.default && port.default.apply) {
- portDefault.css('display', 'inline');
- portDefault.find('path').css('stroke-width', width);
- portDefault.find('rect').css('stroke-width', state.zoom);
- }
- else {
- portDefault.css('display', 'none');
- }
- }
- }
// Render content
+ var topOffset = (data.name || data.local) ? 0 : 24;
this.contentSelector.css({
left: bbox.width / 2.0 * (state.zoom - 1),
- top: bbox.height / 2.0 * (state.zoom - 1),
+ top: (bbox.height + topOffset ) / 2.0 * (state.zoom - 1) + topOffset,
width: bbox.width,
- height: bbox.height,
+ height: bbox.height - topOffset,
transform: 'scale(' + state.zoom + ')'
});
+ if (data.name || data.local) {
+ this.headerSelector.removeClass('hidden');
+ } else {
+ this.headerSelector.addClass('hidden');
+ }
+
// Render block
this.$box.css({
left: bbox.x * state.zoom + state.pan.x,
@@ -1395,11 +1515,7 @@ joint.shapes.ice.CodeView = joint.shapes.ice.ModelView.extend({
this.prevZoom = state.zoom;
// Scale editor
this.editorSelector.css({
- top: -2 * state.zoom,
- left: -2 * state.zoom,
- right: -2 * state.zoom,
- bottom: -2 * state.zoom,
- margin: 8 * state.zoom,
+ margin: 7 * state.zoom,
'border-radius': 5 * state.zoom,
'border-width': state.zoom + 0.5
});
@@ -1753,17 +1869,13 @@ joint.shapes.ice.InfoView = joint.shapes.ice.ModelView.extend({
width: bbox.width - 14,
height: bbox.height - 14,
transform: 'scale(' + state.zoom + ')',
- 'font-size': Math.round(aceFontSize * state.zoom) + 'px'
+ 'font-size': aceFontSize + 'px'
});
}
else if (this.editor) {
// Scale editor
this.editorSelector.css({
- top: -2 * state.zoom,
- left: -2 * state.zoom,
- right: -2 * state.zoom,
- bottom: -2 * state.zoom,
- margin: 8 * state.zoom,
+ margin: 7 * state.zoom,
'border-radius': 5 * state.zoom,
'border-width': state.zoom + 0.5
});
diff --git a/app/scripts/services/blocks.js b/app/scripts/services/blocks.js
index 8334919f2..243923e4e 100644
--- a/app/scripts/services/blocks.js
+++ b/app/scripts/services/blocks.js
@@ -57,7 +57,7 @@ angular.module('icestudio')
gettextCatalog.getString('FPGA pin'),
gettextCatalog.getString('Show clock')
], [
- 'in',
+ '',
true,
false
],
@@ -71,27 +71,26 @@ angular.module('icestudio')
// Validate values
var portInfo, portInfos = [];
for (var l in labels) {
- if (labels[l]) {
- portInfo = utils.parsePortLabel(labels[l], common.PATTERN_GLOBAL_PORT_LABEL);
- if (portInfo) {
- evt.cancel = false;
- portInfos.push(portInfo);
- }
- else {
- evt.cancel = true;
- resultAlert = alertify.warning(gettextCatalog.getString('Wrong block name {{name}}', { name: labels[l] }));
- return;
- }
+ portInfo = utils.parsePortLabel(labels[l], common.PATTERN_GLOBAL_PORT_LABEL);
+ if (portInfo) {
+ evt.cancel = false;
+ portInfos.push(portInfo);
}
else {
evt.cancel = true;
- //return;
+ resultAlert = alertify.warning(gettextCatalog.getString('Wrong block name {{name}}', { name: labels[l] }));
+ return;
}
}
// Create blocks
var cells = [];
for (var p in portInfos) {
portInfo = portInfos[p];
+ if (portInfo.rangestr && clock) {
+ evt.cancel = true;
+ resultAlert = alertify.warning(gettextCatalog.getString('Clock not allowed for data buses'));
+ return;
+ }
var pins = getPins(portInfo);
blockInstance.data = {
name: portInfo.name,
@@ -121,7 +120,7 @@ angular.module('icestudio')
gettextCatalog.getString('Enter the output blocks'),
gettextCatalog.getString('FPGA pin')
], [
- 'out',
+ '',
true
],
function(evt, values) {
@@ -133,21 +132,15 @@ angular.module('icestudio')
// Validate values
var portInfo, portInfos = [];
for (var l in labels) {
- if (labels[l]) {
- portInfo = utils.parsePortLabel(labels[l], common.PATTERN_GLOBAL_PORT_LABEL);
- if (portInfo) {
- evt.cancel = false;
- portInfos.push(portInfo);
- }
- else {
- evt.cancel = true;
- resultAlert = alertify.warning(gettextCatalog.getString('Wrong block name {{name}}', { name: labels[l] }));
- return;
- }
+ portInfo = utils.parsePortLabel(labels[l], common.PATTERN_GLOBAL_PORT_LABEL);
+ if (portInfo) {
+ evt.cancel = false;
+ portInfos.push(portInfo);
}
else {
evt.cancel = true;
- //return;
+ resultAlert = alertify.warning(gettextCatalog.getString('Wrong block name {{name}}', { name: labels[l] }));
+ return;
}
}
// Create blocks
@@ -195,7 +188,7 @@ angular.module('icestudio')
gettextCatalog.getString('Enter the constant blocks'),
gettextCatalog.getString('Local parameter')
], [
- 'C',
+ '',
false
],
function(evt, values) {
@@ -207,21 +200,15 @@ angular.module('icestudio')
// Validate values
var paramInfo, paramInfos = [];
for (var l in labels) {
- if (labels[l]) {
- paramInfo = utils.parseParamLabel(labels[l], common.PATTERN_GLOBAL_PARAM_LABEL);
- if (paramInfo) {
- evt.cancel = false;
- paramInfos.push(paramInfo);
- }
- else {
- evt.cancel = true;
- resultAlert = alertify.warning(gettextCatalog.getString('Wrong block name {{name}}', { name: labels[l] }));
- return;
- }
+ paramInfo = utils.parseParamLabel(labels[l], common.PATTERN_GLOBAL_PARAM_LABEL);
+ if (paramInfo) {
+ evt.cancel = false;
+ paramInfos.push(paramInfo);
}
else {
evt.cancel = true;
- //return;
+ resultAlert = alertify.warning(gettextCatalog.getString('Wrong block name {{name}}', { name: labels[l] }));
+ return;
}
}
// Create blocks
@@ -248,13 +235,13 @@ angular.module('icestudio')
data: {},
type: 'basic.memory',
position: { x: 0, y: 0 },
- size: { width: 96, height: 112 }
+ size: { width: 96, height: 104 }
};
utils.inputcheckboxprompt([
gettextCatalog.getString('Enter the memory blocks'),
gettextCatalog.getString('Local parameter')
], [
- 'M',
+ '',
false
],
function(evt, values) {
@@ -266,21 +253,15 @@ angular.module('icestudio')
// Validate values
var paramInfo, paramInfos = [];
for (var l in labels) {
- if (labels[l]) {
- paramInfo = utils.parseParamLabel(labels[l], common.PATTERN_GLOBAL_PARAM_LABEL);
- if (paramInfo) {
- evt.cancel = false;
- paramInfos.push(paramInfo);
- }
- else {
- evt.cancel = true;
- resultAlert = alertify.warning(gettextCatalog.getString('Wrong block name {{name}}', { name: labels[l] }));
- return;
- }
+ paramInfo = utils.parseParamLabel(labels[l], common.PATTERN_GLOBAL_PARAM_LABEL);
+ if (paramInfo) {
+ evt.cancel = false;
+ paramInfos.push(paramInfo);
}
else {
evt.cancel = true;
- //return;
+ resultAlert = alertify.warning(gettextCatalog.getString('Wrong block name {{name}}', { name: labels[l] }));
+ return;
}
}
// Create blocks
@@ -293,7 +274,7 @@ angular.module('icestudio')
local: local
};
cells.push(loadBasicMemory(blockInstance));
- blockInstance.position.x += 19 * gridsize;
+ blockInstance.position.x += 15 * gridsize;
}
if (callback) {
callback(cells);
@@ -314,8 +295,8 @@ angular.module('icestudio')
size: { width: 192, height: 128 }
};
var defaultValues = [
- 'a , b',
- 'c , d',
+ '',
+ '',
''
];
if (block) {
@@ -830,6 +811,11 @@ angular.module('icestudio')
var portInfo = utils.parsePortLabel(label, common.PATTERN_GLOBAL_PORT_LABEL);
if (portInfo) {
evt.cancel = false;
+ if (portInfo.rangestr && clock) {
+ evt.cancel = true;
+ resultAlert = alertify.warning(gettextCatalog.getString('Clock not allowed for data buses'));
+ return;
+ }
if ((block.data.range || '') !==
(portInfo.rangestr || '')) {
var pins = getPins(portInfo);
diff --git a/app/scripts/services/graph.js b/app/scripts/services/graph.js
index 1cd1ca32a..028ac1708 100644
--- a/app/scripts/services/graph.js
+++ b/app/scripts/services/graph.js
@@ -297,6 +297,25 @@ angular.module('icestudio')
// Events
+ var shiftPressed = false;
+
+ $(document).on('keydown', function(evt) {
+ if (utils.hasShift(evt)) {
+ shiftPressed = true;
+ }
+ });
+ $(document).on('keyup', function(evt) {
+ if (!utils.hasShift(evt)) {
+ shiftPressed = false;
+ }
+ });
+
+ $(document).on('disableSelected', function() {
+ if (!shiftPressed) {
+ disableSelected();
+ }
+ });
+
$('body').mousemove(function(event) {
mousePosition = {
x: event.pageX,
@@ -329,7 +348,7 @@ angular.module('icestudio')
}
else {
// Toggle selected cell
- if (utils.hasShift(evt)) {
+ if (shiftPressed) {
var cell = selection.get($(evt.target).data('model'));
selection.reset(selection.without(cell));
selectionView.destroySelectionBox(cell);
@@ -337,35 +356,14 @@ angular.module('icestudio')
}
});
- var pointerDown = false;
- var dblClickCell = false;
-
paper.on('cell:pointerclick', function(cellView, evt/*, x, y*/) {
- if (utils.hasShift(evt)) {
+ if (shiftPressed) {
// If Shift is pressed process the click (no Shift+dblClick allowed)
- processCellClick(cellView, evt);
- }
- else {
- // If not, wait 200ms to ensure that it's not a dblclick
- var ensureTime = 200;
- pointerDown = false;
- setTimeout(function() {
- if (!dblClickCell && !pointerDown) {
- processCellClick(cellView, evt);
- }
- }, ensureTime);
- }
-
- function processCellClick(cellView, evt) {
if (paper.options.enabled) {
if (!cellView.model.isLink()) {
// Disable current focus
document.activeElement.blur();
if (utils.hasLeftButton(evt)) {
- if (!utils.hasShift(evt)) {
- // Cancel previous selection
- disableSelected();
- }
// Add cell to selection
selection.add(cellView.model);
selectionView.createSelectionBox(cellView.model);
@@ -375,50 +373,39 @@ angular.module('icestudio')
}
});
- paper.on('cell:pointerdown', function(/*cellView, evt, x, y*/) {
- if (paper.options.enabled) {
- pointerDown = true;
- }
- });
-
paper.on('cell:pointerup', function(/*cellView, evt, x, y*/) {
if (paper.options.enabled) {
updateWiresOnObstacles();
}
});
- paper.on('cell:pointerdblclick', function(cellView, evt/*, x, y*/) {
- if (!utils.hasShift(evt)) {
+ paper.on('cell:pointerdblclick', function(cellView/*, evt, x, y*/) {
+ if (!shiftPressed) {
// Allow dblClick if Shift is not pressed
- dblClickCell = true;
- processDblClick(cellView);
- // Enable click event
- setTimeout(function() { dblClickCell = false; }, 200);
- }
- });
-
- function processDblClick(cellView) {
- var type = cellView.model.get('blockType');
- if (type.indexOf('basic.') !== -1) {
- if (paper.options.enabled) {
- blocks.editBasic(type, cellView, function(cell) {
- addCell(cell);
- selectionView.cancelSelection();
+ var type = cellView.model.get('blockType');
+ if (type.indexOf('basic.') !== -1) {
+ // Edit basic blocks
+ if (paper.options.enabled) {
+ blocks.editBasic(type, cellView, function(cell) {
+ addCell(cell);
+ selectionView.cancelSelection();
+ });
+ }
+ }
+ else if (common.allDependencies[type]) {
+ // Navigate inside generic blocks
+ z.index = 1;
+ var project = common.allDependencies[type];
+ var breadcrumbsLength = self.breadcrumbs.length;
+ $rootScope.$broadcast('navigateProject', {
+ update: breadcrumbsLength === 1,
+ project: project
});
+ self.breadcrumbs.push({ name: project.package.name || '#', type: type });
+ utils.rootScopeSafeApply();
}
}
- else if (common.allDependencies[type]) {
- z.index = 1;
- var project = common.allDependencies[type];
- var breadcrumbsLength = self.breadcrumbs.length;
- $rootScope.$broadcast('navigateProject', {
- update: breadcrumbsLength === 1,
- project: project
- });
- self.breadcrumbs.push({ name: project.package.name || '#', type: type });
- utils.rootScopeSafeApply();
- }
- }
+ });
paper.on('blank:pointerdown', function(evt, x, y) {
// Disable current focus
@@ -521,14 +508,23 @@ angular.module('icestudio')
// Replace wire's target
replaceWireConnection(wire, 'target');
});
- // 3. Move the upperModel to be centerd with the lowerModel
+ // 3. Move the upperModel to be centered with the lowerModel
+ var upperBlockType = upperBlock.get('type');
var lowerBlockSize = lowerBlock.get('size');
var upperBlockSize = upperBlock.get('size');
var lowerBlockPosition = lowerBlock.get('position');
- upperBlock.set('position', {
- x: lowerBlockPosition.x + (lowerBlockSize.width - upperBlockSize.width) / 2,
- y: lowerBlockPosition.y + (lowerBlockSize.height - upperBlockSize.height) / 2
- });
+ if (upperBlockType === 'ice.Constant' || upperBlockType === 'ice.Memory') {
+ upperBlock.set('position', {
+ x: lowerBlockPosition.x + (lowerBlockSize.width - upperBlockSize.width) / 2,
+ y: lowerBlockPosition.y + lowerBlockSize.height - upperBlockSize.height
+ });
+ }
+ else {
+ upperBlock.set('position', {
+ x: lowerBlockPosition.x + lowerBlockSize.width - upperBlockSize.width,
+ y: lowerBlockPosition.y + (lowerBlockSize.height - upperBlockSize.height) / 2
+ });
+ }
// 4. Remove the lowerModel
lowerBlock.remove();
prevLowerBlock = null;
@@ -984,10 +980,6 @@ angular.module('icestudio')
}
};
- $(document).on('disableSelected', function() {
- disableSelected();
- });
-
function disableSelected() {
if (hasSelection()) {
selectionView.cancelSelection();
diff --git a/app/styles/design.css b/app/styles/design.css
index 891eef6d6..718920d87 100644
--- a/app/styles/design.css
+++ b/app/styles/design.css
@@ -195,82 +195,85 @@ g {
white-space: nowrap;
}
-.virtual-port {
+.io-block {
position: absolute;
- background: #E2FBC9;
- border-radius: 5px;
- border: 1px solid #777;
pointer-events: none;
- -webkit-user-select: none;
- user-select: none;
z-index: 0;
transition: opacity 0.2s;
}
-.virtual-port p {
+.io-block .io-virtual-content {
position: absolute;
- top: 0;
- right: 5px;
- font-size: 13px;
- color: #555;
+ background: #E2FBC9;
+ border-radius: 5px;
+ border: 1px solid #777;
}
-.virtual-port label {
- display: block;
- margin-top: 22px;
+.io-block .io-virtual-content .header {
+ display: flex;
+ padding: 0 6px;
+ margin-top: 10px;
+ height: 18px;
+}
+
+.io-block .io-virtual-content .header label {
+ flex-grow: 1;
+ height: 100%;
text-align: center;
font-size: 14px;
font-weight: normal;
- height: 18px;
+ line-height: 18px;
color: #222;
text-overflow: ellipsis;
overflow: hidden;
}
-.fpga-port {
+.io-block .io-virtual-content .header svg {
+ padding-left: 2px;
+ padding-right: 2px;
+ width: 10px;
+ stroke: #444;
+}
+
+.io-block .io-fpga-content {
position: absolute;
+ width: 100%;
background: #FBFBC9;
border-radius: 5px;
border: 1px solid #777;
- pointer-events: none;
- -webkit-user-select: none;
- user-select: none;
- z-index: 0;
- transition: opacity 0.2s;
}
-.fpga-port p {
- position: absolute;
- top: 0;
- right: 5px;
- font-size: 13px;
- color: #555;
+.io-block .io-fpga-content .header {
+ display: flex;
+ padding: 0 6px;
+ margin-top: 6px;
+ height: 18px;
}
-.fpga-port label {
- display: block;
- margin-top: 5px;
- margin-bottom: 7px;
+.io-block .io-fpga-content .header label {
+ flex-grow: 1;
+ height: 100%;
text-align: center;
font-size: 14px;
font-weight: normal;
- height: 18px;
+ line-height: 18px;
color: #222;
text-overflow: ellipsis;
overflow: hidden;
}
-.fpga-port div p {
- position: relative;
- top: 0px;
- left: -20px;
- float: left;
+.io-block .io-fpga-content .header svg {
+ padding-left: 2px;
+ padding-right: 2px;
+ width: 10px;
+ stroke: #444;
}
-.fpga-port div .select2 {
+.io-block .io-fpga-content div .select2 {
position: relative;
- width: 84px;
- left: 5px;
+ width: 82px;
+ top: 6px;
+ left: 6px;
margin-bottom: 6px;
pointer-events: auto;
}
@@ -309,51 +312,60 @@ g {
.constant-block {
position: absolute;
- background: #FBF0C9;
- border-radius: 5px;
- border: 1px solid #777;
pointer-events: none;
- -webkit-user-select: none;
- user-select: none;
z-index: 0;
transition: opacity 0.2s;
}
-.constant-block svg {
+.constant-block .constant-content {
position: absolute;
- right: 0;
- margin: 4px;
- width: 8px;
- fill: #444;
+ background: #FBF0C9;
+ border-radius: 5px;
+ border: 1px solid #777;
}
-.constant-block label {
- display: block;
- margin-top: 5px;
- margin-bottom: 7px;
+.constant-block .constant-content .header {
+ display: flex;
+ padding: 0 6px;
+ margin-top: 6px;
+ height: 18px;
+}
+
+.constant-block .constant-content .header label {
+ flex-grow: 1;
+ height: 100%;
text-align: center;
font-size: 14px;
font-weight: normal;
- height: 18px;
+ line-height: 18px;
color: #222;
text-overflow: ellipsis;
overflow: hidden;
}
-.constant-block input {
+.constant-block .constant-content .header svg {
+ padding-left: 2px;
+ padding-right: 2px;
+ width: 10px;
+ fill: #444;
+}
+
+.constant-block .constant-content input {
position: absolute;
text-align: center;
- left: 5px;
- width: 84px;
+ left: 6px;
+ bottom: 6px;
+ width: 82px;
height: 26px;
font-size: 14px;
font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', 'Consolas', 'source-code-pro', monospace;
+ line-height: 15px;
border-radius: 4px;
border: 1px solid #AAA;
pointer-events: auto;
}
-.constant-block input:focus {
+.constant-block .constant-content input:focus {
outline: none;
}
@@ -371,34 +383,39 @@ g {
border: 1px solid #777;
}
-.memory-block .memory-content svg {
- position: absolute;
- right: 0;
- margin: 4px;
- width: 8px;
- fill: #444;
+.memory-block .memory-content .header {
+ display: flex;
+ padding: 0 6px;
+ margin-top: 6px;
+ height: 18px;
}
-.memory-block .memory-content label {
- display: block;
- margin-top: 5px;
- margin-bottom: 7px;
+.memory-block .memory-content .header label {
+ flex-grow: 1;
+ height: 100%;
text-align: center;
font-size: 14px;
font-weight: normal;
- height: 18px;
+ line-height: 18px;
color: #222;
text-overflow: ellipsis;
overflow: hidden;
}
+.memory-block .memory-content .header svg {
+ padding-left: 2px;
+ padding-right: 2px;
+ width: 10px;
+ fill: #444;
+}
+
.memory-block .memory-editor {
position: absolute;
- top: 22px;
- left: -2px;
- right: -2px;
- bottom: -2px;
- margin: 8px;
+ top: 24px;
+ left: 0;
+ right: 0;
+ bottom: 0;
+ margin: 7px;
border-radius: 5px;
border: 1px solid #AAA;
pointer-events: auto;
@@ -420,11 +437,11 @@ g {
.code-block .code-editor {
position: absolute;
- top: -2px;
- left: -2px;
- right: -2px;
- bottom: -2px;
- margin: 8px;
+ top: 0;
+ left: 0;
+ right: 0;
+ bottom: 0;
+ margin: 7px;
border-radius: 5px;
border: 1px solid #AAA;
pointer-events: auto;
@@ -446,11 +463,11 @@ g {
.info-block .info-editor {
position: absolute;
- top: -2px;
- left: -2px;
- right: -2px;
- bottom: -2px;
- margin: 8px;
+ top: 0;
+ left: 0;
+ right: 0;
+ bottom: 0;
+ margin: 6px;
border-radius: 5px;
border: 1px solid #AAA;
pointer-events: auto;
@@ -465,11 +482,11 @@ g {
position: absolute;
overflow: visible;
background: transparent;
- top: -2px;
- left: -2px;
- right: -2px;
- bottom: -2px;
- margin: 8px;
+ top: 0;
+ left: 0;
+ right: 0;
+ bottom: 0;
+ margin: 7px;
border-radius: 5px;
border: 1px solid transparent;
pointer-events: none;
diff --git a/app/styles/main.css b/app/styles/main.css
index 6f050f2dc..61dc7c2e1 100644
--- a/app/styles/main.css
+++ b/app/styles/main.css
@@ -18,7 +18,7 @@ body {
}
.hidden {
- visibility: hidden;
+ display: none;
}
.ice-bar {