Merge branch 'development' of git://github.com/novakps/kemia into dev…

…elopment

kemia/controller/reaction_editor_demo.html

@@ -5,7 +5,7 @@
 <title >
 kemia.controller.ReactionEditor
 </title>
-		<script src="http://localhost:9810/compile?id=controller_reaction_editor_demo" ></script>
+		<script src="http://10.37.129.2:9810/compile?id=controller_reaction_editor_demo" ></script>
 		<script>
 		(function() {
 			window.onload = function() {

kemia/graphics/element_array.js

@@ -0,0 +1,64 @@
+goog.provide("kemia.graphics.ElementArray");
+goog.require('goog.array');
+goog.require("goog.debug.Logger");
+
+/**
+ * convenience class to contain group of goog.graphics.Elements since nested vml groups do not seem to work for IE8 in standards mode
+ * 
+ * @constructor
+ */
+kemia.graphics.ElementArray = function() {
+    /** @type{Array.<goog.graphics.Element>}
+     * @private
+	 */
+    this._elements = [];
+}
+
+/**
+ * Logging object.
+ * 
+ * @type {goog.debug.Logger}
+ * @protected
+ */
+kemia.graphics.ElementArray.prototype.logger = goog.debug.Logger
+.getLogger('kemia.graphics.ElementArray');
+
+/**
+ * add a graphics element
+ * @param {goog.graphics.Element} element the element to add
+ */
+kemia.graphics.ElementArray.prototype.add = function(element) {
+    goog.asserts.assert(element instanceof goog.graphics.Element);
+    this._elements.push(element);
+    return this;
+}
+
+/** 
+ * remove all elements
+ */
+kemia.graphics.ElementArray.prototype.clear = function() {
+    goog.array.forEach(this._elements,
+    function(element) {
+        element.getGraphics().removeElement(element);
+    },
+    this);
+    this._elements.length = 0;
+}
+
+/**
+ * Set the transformation of the elements.
+ * @param {number} x The x coordinate of the translation transform.
+ * @param {number} y The y coordinate of the translation transform.
+ * @param {number} rotate The angle of the rotation transform.
+ * @param {number} centerX The horizontal center of the rotation transform.
+ * @param {number} centerY The vertical center of the rotation transform.
+ */
+kemia.graphics.ElementArray.prototype.setTransformation = function(x, y, rotate,
+centerX, centerY) {
+    goog.array.forEach(this._elements,
+    function(element) {
+        element.setTransformation(x, y, rotate, centerX, centerY);
+    });
+}
+
+

kemia/view/aromaticity_renderer.js

@@ -26,11 +26,11 @@ goog.require('kemia.view.BondRenderer');
  * @extends {kemia.view.BondRenderer}
  */
 kemia.view.AromaticityRenderer = function(graphics, opt_config) {
-	kemia.view.BondRenderer.call(
-			this,
-			graphics, 
-			kemia.view.AromaticityRenderer.defaultConfig, 
-			opt_config);
+    kemia.view.BondRenderer.call(
+    this,
+    graphics,
+    kemia.view.AromaticityRenderer.defaultConfig,
+    opt_config);
 }
 goog.inherits(kemia.view.AromaticityRenderer, kemia.view.BondRenderer);
 
@@ -41,31 +41,27 @@ goog.inherits(kemia.view.AromaticityRenderer, kemia.view.BondRenderer);
  *            ring
  * @param {kemia.graphics.AffineTransform}
  *            transform
- * @return {goog.graphics.GroupElement}
+ * @param {kemia.graphics.ElementArray=} opt_element_array
+ * @return {kemia.graphics.ElementArray}
  */
 
-kemia.view.AromaticityRenderer.prototype.render = function(ring,transform) {
+kemia.view.AromaticityRenderer.prototype.render = function(ring, transform, bondPath) {
 
-	this.setTransform(transform);
+    this.setTransform(transform);
 
-	var bondFill = null;
-	var strokeWidth = this.config.get("bond")['stroke']['width'];
-	var bondStroke = new goog.graphics.Stroke(strokeWidth, this.config.get("bond")['stroke']['color']);
+    var aromaticCircle = new goog.graphics.Path();
+    var ringCenter = this.transform.transformCoords([ring.getCenter()])[0];
 
-  var aromaticCircle = new goog.graphics.Path();
- 	var ringCenter = this.transform.transformCoords( [ ring.getCenter() ])[0];
+    // Radius of the aromatic circle proportional to the ring size	
+    var circleRadiusProportion = 0.5;
+    //Assumption: ring is symmetrical, so pick any one of the ring atom coords
+    var anyAtomCoord = this.transform.transformCoords([ring.atoms[0].coord])[0];
+    var spokeSize = goog.math.Coordinate.distance(ringCenter, anyAtomCoord)
+    var omeletRadius = spokeSize * circleRadiusProportion;
 
-	// Radius of the aromatic circle proportional to the ring size	
-	var circleRadiusProportion=0.5;
-	//Assumption: ring is symmetrical, so pick any one of the ring atom coords
-	var anyAtomCoord=this.transform.transformCoords( [ ring.atoms[0].coord ])[0];
-	var spokeSize=goog.math.Coordinate.distance(ringCenter, anyAtomCoord)	
-  var omeletRadius=spokeSize*circleRadiusProportion;
-
-	aromaticCircle.moveTo(ringCenter.x+(omeletRadius),ringCenter.y);
-	aromaticCircle.arcTo(omeletRadius,omeletRadius,0,180);
-	aromaticCircle.moveTo(ringCenter.x+(omeletRadius),ringCenter.y);
-	aromaticCircle.arcTo(omeletRadius,omeletRadius,0,-180);
+    aromaticCircle.moveTo(ringCenter.x + (omeletRadius), ringCenter.y);
+    aromaticCircle.arcTo(omeletRadius, omeletRadius, 0, 180);
+    aromaticCircle.moveTo(ringCenter.x + (omeletRadius), ringCenter.y);
+    aromaticCircle.arcTo(omeletRadius, omeletRadius, 0, -180);
 
-	this.graphics.drawPath(aromaticCircle, bondStroke, bondFill);
 }

kemia/view/arrow_renderer.js

@@ -49,7 +49,15 @@ goog.inherits(kemia.view.ArrowRenderer, kemia.view.Renderer);
  */
 kemia.view.ArrowRenderer.prototype.render = function(arrow, transform) {
 	this.setTransform(transform);
-	arrow.group = this.graphics.createGroup();
+	// TTD this does not belong on arrow, neighborlist should track graphic elements not just model objects
+		if (!arrow._elements){
+			/** @type {kemia.graphics.ElementArray} 
+			 * @private
+			*/
+		    arrow._elements = new kemia.graphics.ElementArray();
+		} else {
+			arrow._elements.clear();
+		}
 	var h = this.config.get('arrow')['height'];
 	var l = goog.math.Coordinate.distance(arrow.target, arrow.source);
 	var angle = goog.math.angle(arrow.source.x, arrow.source.y, arrow.target.x,
@@ -115,15 +123,15 @@ kemia.view.ArrowRenderer.prototype.render = function(arrow, transform) {
 			fontSize * Math.cos(angle_down_rads), -fontSize
 					* Math.sin(angle_down_rads)), coords[1]);
 
-	this.graphics.drawTextOnLine(arrow.reagents_text, reagents_nock.x,
+	arrow._elements.add(this.graphics.drawTextOnLine(arrow.reagents_text, reagents_nock.x,
 			reagents_nock.y, reagents_tip.x, reagents_tip.y, 'center', font,
-			textStroke, fill, arrow.group);
-	this.graphics.drawTextOnLine(arrow.conditions_text, conditions_nock.x,
+			textStroke, fill));
+	arrow._elements.add(this.graphics.drawTextOnLine(arrow.conditions_text, conditions_nock.x,
 			conditions_nock.y, conditions_tip.x, conditions_tip.y, 'center',
-			font, textStroke, fill, arrow.group);
+			font, textStroke, fill));
 
 	// visible arrow
-	this.graphics.drawPath(path, arrowStroke, null, arrow.group);
+	arrow._elements.add(this.graphics.drawPath(path, arrowStroke));
 }
 /**
  * @param {kemia.model.Arrow}