Update trait views

src/trait_manager/model/Trait.js

@@ -9,6 +9,8 @@ define(['backbone'],
         name: '',
         value: '',
 				target: '',
+				default: '',
+				placeholder: '',
         options: [],
 			},
 

src/trait_manager/model/TraitFactory.js

@@ -27,6 +27,17 @@ define(['backbone'],
                 break;
             }
 
+            // Define placeholder
+            switch (prop) {
+              case 'title': case 'alt': case 'id':
+                obj.placeholder = 'eg. Text here';
+                break;
+              case 'href':
+                obj.placeholder = 'eg. https://google.com';
+                break;
+            }
+
+
             // Define options
             switch (prop) {
               case 'target':

src/trait_manager/view/TraitSelectView.js

@@ -3,6 +3,14 @@ define(['backbone','./TraitView'],
 
 	return TraitView.extend({
 
+		initialize: function(o) {
+			TraitView.prototype.initialize.apply(this, arguments);
+			var ppfx = this.ppfx;
+			this.fieldClass += ' ' + ppfx + 'select';
+			this.tmpl = '<div class="' + this.fieldClass +'"><div class="' + this.inputhClass +'"></div>'+
+			'<div class="' + ppfx + 'sel-arrow"><div class="' + ppfx + 'd-s-arrow"></div></div> </div>';
+		},
+
     /**
 		 * Returns input element
 		 * @return {HTMLElement}

src/trait_manager/view/TraitView.js

@@ -17,6 +17,7 @@ define(['backbone'], function (Backbone) {
 			this.inputhClass = this.ppfx + 'input-holder';
 			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>';
 		},
 
 		/**
@@ -65,10 +66,11 @@ define(['backbone'], function (Backbone) {
 		 */
 		getInputEl: function() {
 			if(!this.$input){
+				var md = this.model;
 				this.$input = $('<input>', {
-					placeholder: this.model.get('defaults'),
+					placeholder: md.get('placeholder') || md.get('default'),
 					type: 'text',
-					value: this.model.get('value')
+					value: md.get('value')
 				});
 			}
 			return this.$input.get(0);
@@ -80,7 +82,7 @@ define(['backbone'], function (Backbone) {
 		 * */
 		renderField: function(){
 			if(!this.$input){
-				this.$el.append('<div class="' + this.fieldClass +'"><div class="' + this.inputhClass +'"></div></div>');
+				this.$el.append(this.tmpl);
 				var el = this.getInputEl();
 				this.$el.find('.' + this.inputhClass).html(el);
 			}