diff --git a/altium_sch.html b/altium_sch.html index 742c06a..a2878ce 100644 --- a/altium_sch.html +++ b/altium_sch.html @@ -80,7 +80,6 @@ function doSave(value, type, name) { type: type }); - } else { var BlobBuilder = window.BlobBuilder || window.MozBlobBuilder || window.WebKitBlobBuilder || window.MSBlobBuilder; diff --git a/altium_sch_renderer.js b/altium_sch_renderer.js index cc8148a..f8a3651 100644 --- a/altium_sch_renderer.js +++ b/altium_sch_renderer.js @@ -59,20 +59,18 @@ class AltiumSchematicRenderer this.graph.removeCells(); } render() { - - this.graph = new mxGraph(document.getElementById('graphContainer')); - mxConnectionHandler.prototype.movePreviewAway = true; + mxConnectionHandler.prototype.movePreviewAway = false; mxConnectionHandler.prototype.waypointsEnabled = true; - mxGraph.prototype.resetEdgesOnConnect = true; + mxGraph.prototype.resetEdgesOnConnect = false; mxConstants.SHADOWCOLOR = '#C0C0C0'; var joinNodeSize = 4; var strokeWidth = 2; // Enables guides - mxGraphHandler.prototype.guidesEnabled = false; + mxGraphHandler.prototype.guidesEnabled = true; // 启用导航线 // Alt disables guides mxGuide.prototype.isEnabledForEvent = function(evt) @@ -81,13 +79,12 @@ class AltiumSchematicRenderer }; // Enables snapping waypoints to terminals - mxEdgeHandler.prototype.snapToTerminals = true; - - + mxEdgeHandler.prototype.snapToTerminals = false; // 自动连接目标 mxEdgeStyle.WireConnector = function(state, source, target, hints, result) { - mxLog.debug('add waypoint'); - mxLog.debug("WireConnector",state,source,target,hint) + console.log(hint) + + // Creates array of all way- and terminalpoints var pts = state.absolutePoints; var horizontal = true; @@ -98,15 +95,13 @@ class AltiumSchematicRenderer { horizontal = state.style['sourceConstraint'] == 'horizontal'; } - else if (source != null) - { + else if (source != null) { horizontal = source.style['portConstraint'] != 'vertical'; // Checks the direction of the shape and rotates var direction = source.style[mxConstants.STYLE_DIRECTION]; - if (direction == 'north' || direction == 'south') - { + if (direction == 'north' || direction == 'south') { horizontal = !horizontal; } } @@ -125,12 +120,12 @@ class AltiumSchematicRenderer } var first = pt; - + console.log(hints) // Adds the waypoints if (hints != null && hints.length > 0) { // FIXME: First segment not movable - hint = state.view.transformControlPoint(state, hints[0]); + /*hint = state.view.transformControlPoint(state, hints[0]); mxLog.show(); mxLog.debug(hints.length,'hints0.y='+hint.y, pt.y) @@ -138,64 +133,162 @@ class AltiumSchematicRenderer { mxLog.show(); mxLog.debug('add waypoint'); - + pt = new mxPoint(pt.x, hint.y); result.push(pt); pt = pt.clone(); //horizontal = !horizontal; - } + }*/ - for (var i = 0; i < hints.length; i++) - { + for (var i = 0; i < hints.length; i++) { horizontal = !horizontal; hint = state.view.transformControlPoint(state, hints[i]); - + if (horizontal) { - if (pt.y != hint.y) - { + if (pt.y != hint.y) { pt.y = hint.y; result.push(pt.clone()); } } - else if (pt.x != hint.x) - { + else if (pt.x != hint.x) { pt.x = hint.x; result.push(pt.clone()); } } } - else - { + else { hint = pt; } - // Adds the last point pt = pts[pts.length - 1]; - // TODO: Should move along connected segment - if (pt == null && target != null) - { - pt = new mxPoint(state.view.getRoutingCenterX(target), state.view.getRoutingCenterY(target)); + if (pt == null && target != null) { + pt = new mxPoint(state.view.getRoutingCenterX(target), + state.view.getRoutingCenterY(target)); } - - if (horizontal) - { - if (pt.y != hint.y && first.x != pt.x) - { - // result.push(new mxPoint(pt.x, hint.y)); + + if (horizontal) { + if (pt.y != hint.y && first.x != pt.x) { + console.log(hint.x,pt.y) + result.push(new mxPoint(pt.x, hint.y)); } } - else if (pt.x != hint.x && first.y != pt.y) - { - // result.push(new mxPoint(hint.x, pt.y)); + else if (pt.x != hint.x && first.y != pt.y) { + result.push(new mxPoint(hint.x, pt.y)); } + }; + mxStyleRegistry.putValue('wireEdgeStyle', mxEdgeStyle.WireConnector); + + // This connector needs an mxEdgeSegmentHandler + let mxGraphCreateHandler = mxGraph.prototype.createHandler; + mxGraph.prototype.createHandler = function(state) + { + var result = null; + + if (state != null) + { + if (this.model.isEdge(state.cell)) + { + var style = this.view.getEdgeStyle(state); + + if (style == mxEdgeStyle.WireConnector) + { + return new mxEdgeSegmentHandler(state); + } + } + } + + return mxGraphCreateHandler.apply(this, arguments); + }; + mxGraphView.prototype.updateFixedTerminalPoint = function(edge, terminal, source, constraint) + { + mxLog.show() + mxLog.debug("updateFixedTerminalPoint") + var pt = null; + if (constraint != null) + { + pt = this.graph.getConnectionPoint(terminal, constraint); + } + if (source) + { + edge.sourceSegment = null; + } + else + { + edge.targetSegment = null; + } + + if (pt == null) + { + var s = this.scale; + var tr = this.translate; + var orig = edge.origin; + var geo = this.graph.getCellGeometry(edge.cell); + pt = geo.getTerminalPoint(source); + + // Computes edge-to-edge connection point + if (pt != null) + { + pt = new mxPoint(s * (tr.x + pt.x + orig.x), + s * (tr.y + pt.y + orig.y)); + + // Finds nearest segment on edge and computes intersection + if (terminal != null && terminal.absolutePoints != null) + { + var seg = mxUtils.findNearestSegment(terminal, pt.x, pt.y); + + // Finds orientation of the segment + var p0 = terminal.absolutePoints[seg]; + var pe = terminal.absolutePoints[seg + 1]; + var horizontal = (p0.x - pe.x == 0); + + // Stores the segment in the edge state + var key = (source) ? 'sourceConstraint' : 'targetConstraint'; + var value = (horizontal) ? 'horizontal' : 'vertical'; + edge.style[key] = value; + + // Keeps the coordinate within the segment bounds + if (horizontal) + { + pt.x = p0.x; + pt.y = Math.min(pt.y, Math.max(p0.y, pe.y)); + pt.y = Math.max(pt.y, Math.min(p0.y, pe.y)); + } + else + { + pt.y = p0.y; + pt.x = Math.min(pt.x, Math.max(p0.x, pe.x)); + pt.x = Math.max(pt.x, Math.min(p0.x, pe.x)); + } + } + } + // Computes constraint connection points on vertices and ports + else if (terminal != null && terminal.cell.geometry.relative) + { + pt = new mxPoint(this.getRoutingCenterX(terminal), + this.getRoutingCenterY(terminal)); + } + + // Snaps point to grid + /*if (pt != null) + { + var tr = this.graph.view.translate; + var s = this.graph.view.scale; + + pt.x = (this.graph.snap(pt.x / s - tr.x) + tr.x) * s; + pt.y = (this.graph.snap(pt.y / s - tr.y) + tr.y) * s; + }*/ + } + + edge.setAbsoluteTerminalPoint(pt, source); + }; - + let mxGraphGetCellStyle = mxGraph.prototype.getCellStyle; mxGraph.prototype.getCellStyle = function(cell) { @@ -282,7 +375,8 @@ class AltiumSchematicRenderer mxConnectionHandler.prototype.createEdgeState = function(me) { var edge = this.graph.createEdge(); - + mxLog.debug("createEdgeState") + if (this.sourceConstraint != null && this.previous != null) { edge.style = mxConstants.STYLE_EXIT_X+'='+this.sourceConstraint.point.x+';'+ @@ -310,6 +404,7 @@ class AltiumSchematicRenderer let mxConnectionHandlerUpdateCurrentState = mxConnectionHandler.prototype.updateCurrentState; mxConnectionHandler.prototype.updateCurrentState = function(me) { + mxLog.debug('updateCurrentState') mxConnectionHandlerUpdateCurrentState.apply(this, arguments); if (this.edgeState != null) @@ -401,30 +496,30 @@ class AltiumSchematicRenderer return result; }; // https://github.com/jgraph/mxgraph/blob/master/javascript/src/js/handler/mxGraphHandler.js#L1036 - mxGraphHandler.prototype.updatePreview = function(remote) { - if (this.livePreviewUsed && !remote) { - if (this.cells != null) - { - this.setHandlesVisibleForCells(this.graph.getSelectionCells(), false); - this.updateLivePreview(this.currentDx, this.currentDy); - } - } - else - { - this.updatePreviewShape(); - } - }; - let oldMove = mxGraphHandler.prototype.mouseMove - mxGraphHandler.prototype.mouseMove = function(sender, me){ - // mxLog.debug("mouse move",sender,me) - // https://github.com/jgraph/mxgraph/blob/master/javascript/src/js/handler/mxGraphHandler.js#L901 - if (!this.livePreviewUsed && this.shape == null) { - this.shape = this.createPreviewShape(this.bounds); - }else if(this.shape != null){ - // mxLog.debug("mouseMove",this) - } - oldMove.call(this, sender, me); - } + // mxGraphHandler.prototype.updatePreview = function(remote) { + // if (this.livePreviewUsed && !remote) { + // if (this.cells != null) + // { + // this.setHandlesVisibleForCells(this.graph.getSelectionCells(), false); + // this.updateLivePreview(this.currentDx, this.currentDy); + // } + // } + // else + // { + // this.updatePreviewShape(); + // } + // }; + // let oldMove = mxGraphHandler.prototype.mouseMove + // mxGraphHandler.prototype.mouseMove = function(sender, me){ + // // mxLog.debug("mouse move",sender,me) + // // https://github.com/jgraph/mxgraph/blob/master/javascript/src/js/handler/mxGraphHandler.js#L901 + // if (!this.livePreviewUsed && this.shape == null) { + // this.shape = this.createPreviewShape(this.bounds); + // }else if(this.shape != null){ + // // mxLog.debug("mouseMove",this) + // } + // oldMove.call(this, sender, me); + // } let oldClick = mxGraphHandler.prototype.mouseDown @@ -546,7 +641,9 @@ class AltiumSchematicRenderer } if((geo != null) && (this.getModel().isEdge(terminal.cell))) { console.log(terminal.cell) - return [new mxConnectionConstraint(new mxPoint(0, 0), false)]; + if(terminal.cell.Wire == true) + return [new mxConnectionConstraint(new mxPoint(1, 0), false), + new mxConnectionConstraint(new mxPoint(0.75, 1), true)]; } return null; }; @@ -567,13 +664,9 @@ class AltiumSchematicRenderer var parent = this.graph.getDefaultParent(); - mxVertexHandler.prototype.livePreview = true; - var labelBackground = (false) ? '#000000' : '#FFFFFF'; var fontColor = (false) ? '#FFFFFF' : '#000000'; var strokeColor = (false) ? '#C0C0C0' : '#000000'; - var fillColor = (false) ? 'none' : '#FFFFFF'; - var style = this.graph.getStylesheet().getDefaultEdgeStyle(); delete style['endArrow']; @@ -591,7 +684,7 @@ class AltiumSchematicRenderer // Sets join node size style['startSize'] = joinNodeSize; style['endSize'] = joinNodeSize; - + style = this.graph.getStylesheet().getDefaultVertexStyle(); //style['gradientColor'] = '#909090'; style['strokeColor'] = strokeColor; @@ -606,77 +699,17 @@ class AltiumSchematicRenderer let doc = this.document; let sheetObject = doc.objects.find(o => o instanceof AltiumSheet); - - // canvas.style.width = sheetObject.width + "px"; - // canvas.style.height = sheetObject.height + "px"; - // canvas.width = sheetObject.width * window.devicePixelRatio; - // canvas.height = sheetObject.height * window.devicePixelRatio; let areaColourInt = Number.parseInt(sheetObject.attributes.areacolor, 10); - let areaColour = this.#altiumColourToHex(areaColourInt); - // canvas.style.backgroundColor = areaColour; - // let ctx = canvas.getContext('2d'); - // ctx.scale(1, -1); - // ctx.translate(0.5, 0.5); - // ctx.translate(0, -canvas.height); - // ctx.font = "7pt sans-serif"; - // ctx.textRendering = "optimizeLegibility"; - // ctx.imageSmoothingQuality = "high"; - // ctx.textBaseline = "bottom"; - // ctx.fillStyle = areaColour; - // ctx.fillRect(0, 0, canvas.width, canvas.height); let results = document.getElementById("results"); let sheet = doc.objects.find((o) => o instanceof AltiumSheet); let gridLight = "#eeeeee"; let gridDark = "#cccccc"; - // ctx.lineWidth = 1; - // ctx.globalAlpha = 0.5; - if (sheet.show_grid) - { - let n = 0; - // for (let x = 0; x < canvas.width; x += sheet.grid_size) - // { - // ctx.strokeStyle = ((n % 10) == 0) ? gridDark : gridLight; - // ctx.beginPath(); - // ctx.moveTo(x, 0); - // ctx.lineTo(x, canvas.height); - // ctx.stroke(); - // n++; - // } - // n = 0; - // for (let y = 0; y < canvas.height; y += sheet.grid_size) - // { - // ctx.strokeStyle = ((n % 10) == 0) ? gridDark : gridLight; - // ctx.beginPath(); - // ctx.moveTo(0, y); - // ctx.lineTo(canvas.width, y); - // ctx.stroke(); - // n++; - // } + if (sheet.show_grid) { + } - // ctx.globalAlpha = 1; - - /* - - ctx.textAlign = "center"; - ctx.font = "bold 100px serif"; - ctx.fillStyle = "#333300"; - ctx.globalAlpha = 0.03; - ctx.save(); - - ctx.rotate(Math.PI/4); - ctx.scale(1,-1); - for (let y = 0; y < canvas.height * 2; y += 400) - { - ctx.fillText("PREVIEW - BETA - PREVIEW - BETA - PREVIEW - BETA - PREVIEW - BETA - PREVIEW - BETA - PREVIEW - BETA - PREVIEW - BETA - PREVIEW - BETA - PREVIEW - BETA - PREVIEW - BETA - PREVIEW - BETA - PREVIEW - BETA - PREVIEW - BETA - PREVIEW - BETA - PREVIEW - BETA - PREVIEW - BETA - PREVIEW - BETA", canvas.width / 2, canvas.height - (y + 200)); - ctx.fillText("BETA - PREVIEW - BETA - PREVIEW - BETA - PREVIEW - BETA - PREVIEW - BETA - PREVIEW - BETA - PREVIEW - BETA - PREVIEW - BETA - PREVIEW - BETA - PREVIEW - BETA - PREVIEW - BETA - PREVIEW - BETA - PREVIEW - BETA - PREVIEW - BETA - PREVIEW - BETA - PREVIEW - BETA - PREVIEW - BETA - PREVIEW", canvas.width / 2, canvas.height - y); - } - - ctx.textAlign = "left"; - */ - this.graph.getModel().beginUpdate(); try{ let bom = []; @@ -694,11 +727,8 @@ class AltiumSchematicRenderer bom.push(bomLine); } //bomLine += obj.description; - } results.innerText = bom.join("\n"); - - for (let obj of doc.objects.filter((o) => o instanceof AltiumBus)) { // if (!this.#shouldShow(obj)) continue; @@ -713,7 +743,6 @@ class AltiumSchematicRenderer // } // ctx.stroke(); } - for (let obj of doc.objects.filter((o) => o instanceof AltiumSheetSymbol)) { // if (!this.#shouldShow(obj)) continue; @@ -748,8 +777,7 @@ class AltiumSchematicRenderer // ctx.stroke(); } let chips = {} - for (let obj of doc.objects.filter((o) => o instanceof AltiumRectangle)) - { + for (let obj of doc.objects.filter((o) => o instanceof AltiumRectangle)) { obj.top = 840 - obj.top obj.bottom = 840 - obj.bottom if(!obj.transparent){ @@ -784,8 +812,7 @@ class AltiumSchematicRenderer } // todo undo - for (let obj of doc.objects.filter((o) => o instanceof AltiumSheetEntry)) - { + for (let obj of doc.objects.filter((o) => o instanceof AltiumSheetEntry)) { if (!this.#shouldShow(obj)) continue; // ctx.strokeStyle = this.#altiumColourToHex(obj.colour); @@ -820,7 +847,7 @@ class AltiumSchematicRenderer for (let obj of doc.objects.filter((o) => o instanceof AltiumPin)) { - var style = 'shape=line;fontColor=#000000;strokeColor=#000000;' + var style = 'shape=line;fontColor=#000000;strokeColor=#000000;routingCenterX=-0.5;portConstraint=horizontal;' let name = '' if(obj.show_name){ name = obj.name @@ -1168,8 +1195,6 @@ class AltiumSchematicRenderer // ctx.fillText(obj.text, obj.x, canvas.height - obj.y); // } } - // ctx.textAlign = "left"; - // ctx.textBaseline = "bottom"; for (let obj of doc.objects.filter((o) => o instanceof AltiumNetLabel)) { obj = obj @@ -1201,12 +1226,6 @@ class AltiumSchematicRenderer // ctx.fillText(obj.text, obj.x, canvas.height - obj.y); // } } - // ctx.textAlign = "left"; - // ctx.textBaseline = "bottom"; - - - // ctx.textAlign = "left"; - // ctx.textBaseline = "bottom"; for (let obj of doc.objects.filter((o) => o instanceof AltiumPowerPort)) { obj = obj @@ -1320,12 +1339,13 @@ class AltiumSchematicRenderer e6.geometry.setTerminalPoint(new mxPoint(obj.points[0].x, obj.points[0].y), true) e6.geometry.setTerminalPoint(new mxPoint(obj.points[obj.points.length - 1].x, obj.points[obj.points.length - 1].y), false) + e6.Wire = true if(this.wires == undefined){ this.wires = [] this.wires.push(e6) }else{ - this.wires.push(e6) + this.wires.push(e6) }