Add TraitSelectView

src/dom_components/model/ComponentLink.js

@@ -6,7 +6,7 @@ define(['./Component'],
 			defaults: _.extend({}, Component.prototype.defaults, {
 					tagName: 'a',
 					droppable: false,
-					traits: ['title', 'href', 'blank'],
+					traits: ['title', 'href', 'target'],
 			}),
 
 		});

src/domain_abstract/view/DomainViews.js

@@ -5,6 +5,11 @@ function(Backbone) {
 
     itemView: '',
 
+    // Defines the View per type
+    itemsView: '',
+
+    itemType: 'type',
+
     initialize: function(opts, config) {
       this.config = config || {};
     },
@@ -27,7 +32,12 @@ function(Backbone) {
      * */
     add: function(model, fragment){
       var frag = fragment || null;
-      var view = new this.itemView({
+      var itemView = this.itemView;
+      if(this.itemsView){
+        var typeField = model.get(this.itemType);
+        itemView = this.itemsView[typeField];
+      }
+      var view = new itemView({
         model: model,
         config: this.config
       }, this.config);

src/trait_manager/model/TraitFactory.js

@@ -19,6 +19,24 @@ define(['backbone'],
             var obj = {};
             var prop = props[i];
             obj.name = prop;
+
+            // Define type
+            switch (prop) {
+              case 'target':
+                obj.type = 'select';
+                break;
+            }
+
+            // Define options
+            switch (prop) {
+              case 'target':
+                obj.options = [
+                  {value: '_self', name: 'This window'},
+                  {value: '_blank', name: 'New window'}
+                ];
+                break;
+            }
+
             objs.push(obj);
           }
 

src/trait_manager/view/TraitSelectView.js

@@ -0,0 +1,38 @@
+define(['backbone','./TraitView'],
+	function (Backbone, TraitView) {
+
+	return TraitView.extend({
+
+    /**
+		 * Returns input element
+		 * @return {HTMLElement}
+		 * @private
+		 */
+		getInputEl: function() {
+      if(!this.$input){
+        var opts = this.model.get('options') || [];
+        this.input = '<select>';
+				if(opts.length){
+					_.each(opts, function(el){
+            var name, value, style;
+            var attrs = '';
+            if(typeof el === 'string'){
+              name = el;
+              value = el;
+            }else{
+              name = el.name ? el.name : el.value;
+              value = el.value.replace(/"/g,'&quot;');
+              style = el.style ? el.style.replace(/"/g,'&quot;') : '';
+              attrs += style ? 'style="' + style + '"' : '';
+            }
+						this.input += '<option value="' + value + '" ' + attrs + '>' + name + '</option>';
+					}, this);
+				}
+				this.input 	+= '</select>';
+				this.$input = $(this.input);
+      }
+			return this.$input.get(0);
+		},
+
+	});
+});

src/trait_manager/view/TraitView.js

@@ -64,6 +64,13 @@ define(['backbone'], function (Backbone) {
 		 * @private
 		 */
 		getInputEl: function() {
+			if(!this.$input){
+				this.$input = $('<input>', {
+					placeholder: this.model.get('defaults'),
+					type: 'text',
+					value: this.model.get('value')
+				});
+			}
 			return this.$input.get(0);
 		},
 
@@ -74,12 +81,8 @@ define(['backbone'], function (Backbone) {
 		renderField: function(){
 			if(!this.$input){
 				this.$el.append('<div class="' + this.fieldClass +'"><div class="' + this.inputhClass +'"></div></div>');
-				this.$input = $('<input>', {
-					placeholder: this.model.get('defaults'),
-					type: 'text',
-					value: this.model.get('value')
-				});
-				this.$el.find('.' + this.inputhClass).html(this.$input);
+				var el = this.getInputEl();
+				this.$el.find('.' + this.inputhClass).html(el);
 			}
 		},
 

src/trait_manager/view/TraitsView.js

@@ -1,9 +1,12 @@
-define(['backbone', 'Abstract/view/DomainViews', './TraitView'],
-	function (Backbone, DomainViews, TraitView) {
+define(['backbone', 'Abstract/view/DomainViews', './TraitView', './TraitSelectView'],
+	function (Backbone, DomainViews, TraitView, TraitSelectView) {
 
 		return DomainViews.extend({
 
-			itemView: TraitView,
+			itemsView: {
+				'text': TraitView,
+				'select': TraitSelectView,
+			},
 
 			initialize: function(o) {
 				this.config = o.config || {};