Start map component

src/dom_components/main.js

@@ -41,9 +41,11 @@ define(function(require) {
 			ComponentText = require('./model/ComponentText'),
 			ComponentImage = require('./model/ComponentImage'),
 			ComponentLink = require('./model/ComponentLink'),
+			ComponentMap = require('./model/ComponentMap'),
 			ComponentView = require('./view/ComponentView'),
 			ComponentImageView = require('./view/ComponentImageView'),
-			ComponentTextView	= require('./view/ComponentTextView');
+			ComponentTextView	= require('./view/ComponentTextView'),
+			ComponentMapView	= require('./view/ComponentMapView'),
 			ComponentLinkView	= require('./view/ComponentLinkView');
 		var component, componentView;
 
@@ -283,6 +285,14 @@ define(function(require) {
 				this.clear().addComponent(components);
 			},
 
+			/**
+			 * Add new component type
+			 * @private
+			 */
+			addComponentType: function(type, methods) {
+
+			}
+
 		};
 	};
 });

src/dom_components/model/ComponentMap.js

@@ -0,0 +1,19 @@
+define(['./Component'],
+	function (Component) {
+
+		return Component.extend({
+
+			defaults: _.extend({}, Component.prototype.defaults, {
+					tagName: 'iframe',
+          staticUrl: 'http://maps.googleapis.com/maps/api/staticmap',
+          mapUrl: 'https://maps.google.com/maps',
+          zoom: '1',
+          mapType: '',
+          staticHeight: '',
+          staticWidth: '',
+          src: 'http://maps.googleapis.com/maps/api/staticmap?zoom=1&format=jpg&size=500x300',//'https://maps.google.com/maps?output=embed',
+					traits: ['mapTraits'],
+			}),
+
+		});
+});

src/dom_components/model/Components.js

@@ -26,7 +26,7 @@ define([ 'backbone', 'require'],
 
 						case 'text':
 							if(!this.mComponentText)
-					    		this.mComponentText		= require("./ComponentText");
+					    		this.mComponentText = require("./ComponentText");
 							model	= new this.mComponentText(attrs, options);
 							break;
 
@@ -38,13 +38,19 @@ define([ 'backbone', 'require'],
 
 						case 'image':
 							if(!this.mComponentImage)
-					    		this.mComponentImage	= require("./ComponentImage");
+					    		this.mComponentImage = require("./ComponentImage");
 							model	= new this.mComponentImage(attrs, options);
 							break;
 
+						case 'map':
+							if(!this.mComponentMap)
+					    		this.mComponentMap = require("./ComponentMap");
+							model	= new this.mComponentMap(attrs, options);
+							break;
+
 						default:
 							if(!this.mComponent)
-					    		this.mComponent			= require("./Component");
+					    		this.mComponent = require("./Component");
 							model	= new this.mComponent(attrs, options);
 
 					}

src/dom_components/view/ComponentImageView.js

@@ -3,9 +3,9 @@ define(['backbone', './ComponentView'],
 
 	return ComponentView.extend({
 
-		tagName		: 'img',
+		tagName: 'img',
 
-		events		: {
+		events: {
 				'dblclick' 	: 'openModal',
 		},
 

src/dom_components/view/ComponentMapView.js

@@ -0,0 +1,15 @@
+define(['backbone', './ComponentImageView'],
+	function (Backbone, ComponentView) {
+
+	return ComponentView.extend({
+
+		events: {},
+
+		initialize: function(o){
+			ComponentView.prototype.initialize.apply(this, arguments);
+			//on width/height change update static url
+			//zomm 1-22
+		},
+
+	});
+});

src/dom_components/view/ComponentsView.js

@@ -52,6 +52,11 @@ function(Backbone, require) {
 						this.compViewLink	=	require('./ComponentLinkView');
 					viewObject	= this.compViewLink;
 					break;
+				case 'map':
+					if(!this.compViewMap)
+						this.compViewMap	=	require('./ComponentMapView');
+					viewObject	= this.compViewMap;
+					break;
 			}
 
 			var view 		= new viewObject({

src/editor/config/config.js

@@ -185,6 +185,14 @@ define(function () {
 						content:'Link',
 						style:{color: '#d983a6'}
 					},
+	      },{
+					id: 'map',
+	        label: 'Map',
+	        attributes: {class:'fa fa-map-o'},
+	        content: {
+						type: 'map',
+						style: {color: '#fff'}
+					},
 	      }],
 		},
 

src/trait_manager/view/TraitView.js

@@ -18,7 +18,6 @@ define(['backbone'], function (Backbone) {
 			this.model.off('change:value', this.onValueChange);
 			this.listenTo(this.model, 'change:value', this.onValueChange);
 			this.tmpl = '<div class="' + this.fieldClass +'"><div class="' + this.inputhClass +'"></div></div>';
-			console.log(this.model.attributes);
 		},
 
 		/**