/ - Diff - Synnefo - Greek Research and Technology Network's projects

     	      dist: {
     	       files: {
               'javascripts/okeanos.js': ['javascripts/okeanos-scripts/common.js', 'javascripts/okeanos-scripts/checkboxes-radiobuttons.js', 'javascripts/okeanos-scripts/wizard.js', 'javascripts/okeanos-scripts/sshkeys-wizard.js'],
               'javascripts/okeanos-ember.js': ['javascripts/okeanos-ember/app.js', 'javascripts/okeanos-ember/obj.js', 'javascripts/okeanos-ember/ember-all.js'],
               'javascripts/okeanos-ember.js': ['javascripts/okeanos-ember/app.js', 'javascripts/okeanos-ember/obj.js', 'javascripts/okeanos-ember/routers.js', 'javascripts/okeanos-ember/controllers.js', 'javascripts/okeanos-ember/views.js', 'javascripts/okeanos-ember/components.js'],
+            }
     	      },
         },

     	 LOG_TRANSITIONS: true, // To have Ember write out transition events to the log (it can be helpful to see exactly what is going on with the router)
     });
     Synnefo.ApplicationAdapter = DS.FixtureAdapter.extend();;Ember.Inflector.inflector.uncountable('account');
     Synnefo.ApplicationAdapter = DS.FixtureAdapter.extend();;/* Objects */
     Ember.Inflector.inflector.uncountable('account');
     Synnefo.Account = DS.Model.extend({
     	email: DS.attr('string')
-...
         action: 'is this a function?'
     }]
     };
     ;/* Mapping */
     Synnefo.wizards = {
       vmWizard: {
         // each step must have a headline
         stepsHeadlines: [
+            {
               title:'Select an OS',
               subtitle:'Choose your preferred image'
             },
+            {
               title:'Select CPUs, RAM and Disk Size',
               subtitle:'Available options are filtered based on the selected image'
             },
+            {
               title:'Virtual machine custom options',
               subtitle:'tba'
             },
+            {
               title:'Confirm your settings',
               subtitle:'Confirm that the options you have selected are correct'
             },
         ],
         stepsContent: ['step-1', 'step-2', 'step-3', 'step-4']
       },
       networkWizard: {}
     };/* Mapping */
     Synnefo.Router.map(function() {
     // I defined the above resource to extend its Route
-...
     	},
     });
     /* Items Routes */
     Synnefo.SectionsRoute = Ember.Route.extend({
     	modelName: undefined,
     	model: function() {
-...
+    	}
     });
     Synnefo.CreateRoute = Ember.Route.extend({
     	model: function(){
     		return {name: 'vm-wizard'}
     	},
     	renderTemplate: function(controller) {
     		this.render('wizard',{controller: controller});
+    	}
     });
     Synnefo.VmsRoute = Synnefo.SectionsRoute.extend({
     	modelName: 'vm'
-...
     	modelName: 'userImage'
     });
     Synnefo.VmsCreateRoute = Synnefo.CreateRoute.extend({});
     Synnefo.NetworksCreateRoute = Synnefo.CreateRoute.extend({});
     Synnefo.VolumesCreateRoute = Synnefo.CreateRoute.extend({});
     /* Wizards Routes */
     Synnefo.SnapshotsCreateRoute = Synnefo.CreateRoute.extend({});
     Synnefo.CreateRoute = Ember.Route.extend({
     	model: function(){
     		return [{name: 'vm-wizard'}]
     	},
     	renderTemplate: function(controller) {
     		this.render('wizard',{controller: controller});
     	},
     /*	beforeModel: function() {
     		this._super();
     		console.log('beforeModel ',this.get('router.url'))
     		this.previousRoute = this.get('router.url'); // should return the current path but some times it returns the path where the user was before (when i dont type the url of the wizard)
     	},
     	previousRoute: undefined,*/
     	actions: {
     		closeWizard: function() {
     			history.back();
+    		}
+    	}
     });
     Synnefo.ImagesCreateRoute = Synnefo.CreateRoute.extend({});
     Synnefo.VmsCreateRoute = Synnefo.CreateRoute.extend({
     	model: function() {
     		return Synnefo.wizards.vmWizard;
+    	}
     });
     Synnefo.NetworksCreateRoute = Synnefo.CreateRoute.extend();
     Synnefo.VolumesCreateRoute = Synnefo.CreateRoute.extend();
     Synnefo.SnapshotsCreateRoute = Synnefo.CreateRoute.extend();
     /* Controllers */
     Synnefo.ImagesCreateRoute = Synnefo.CreateRoute.extend({});;/* Controllers */
     Synnefo.ApplicationController = Ember.Controller.extend({
     	updateCurrentPath: function() {
-...
     });
     /* Items Controllers */
     Synnefo.ElemsController = Ember.ArrayController.extend({
     	type: undefined,
-...
     		return	Synnefo.conf.sectors.findBy('destination', this.get('type')).icon.replace('outline', 'full');
     	}.property(),
     	hasOS: function(){
     			if(Synnefo.get('currentPath') == "vms")
     			if(Synnefo.get('currentPath') === "vms" || Synnefo.get('currentPath') === "vms.index")
     				return true;
     			else return false;
     	}.property(),
     		hasTags: function(){
     			if(Synnefo.get('currentPath') == "vms")
     			if(Synnefo.get('currentPath') == "vms" || Synnefo.get('currentPath') === "vms.index")
     				return true;
     			else return false;
     	}.property(),
-...
     });
     /* Controllers for each Item */
     Synnefo.ElemController = Ember.ObjectController.extend({
     	needs: [],
-...
     });
     /* Views */
     /* Controllers for Wizards */
     Synnefo.CreateController = Ember.ObjectController.extend({
     	currentStep: undefined,
     	totalStep: function() {
     		return this.get('stepsContent').length;
     	}.property(),
     	init: function() {
     		this._super();
     		this.set('currentStep', 1)
     	},
     	btnLeftLabel: function(){
     	return (this.get('currentStep') === 1)?'CANCEL':'PREVIOUS';
     	}.property('currentStep'),
     	btnRightLabel: function(){
     	return (this.get('currentStep') === this.get('totalStep'))?'CREATE':'NEXT';
     	}.property('currentStep'),
     	actions: {
     		moveNext: function() {
     			var self = this;
     			var step = this.get('currentStep');
     			if(step!== this.get('totalStep')) {
     				step++;
     				this.set('currentStep', step);
+    			}
     			else
     				this.get('target').send('closeWizard');
     		},
     		moveBack: function() {
     			var step = this.get('currentStep');
     			if(step === 1) {
     				this.get('target').send('closeWizard');
+    			}
     			else {
     				step--;
     				this.set('currentStep', step);
+    			}
+    		}
     	},
     });
     Synnefo.VmsCreateController =Synnefo.CreateController.extend({
     });; /* Views */
     Synnefo.ApplicationView = Ember.View.extend({
     	classNames: ['content']
     });
     /* Navigation Menu */
     Synnefo.NavIconView = Ember.View.extend({
     	tagName: 'span',
     	click: function(e) {
     	click: function() {
     		var parentEl = this.$().parent('a');
     		var currentEl = this.$().parents('li').siblings('li').find('a.current');
-...
     });
     /* Items Parts */
     Synnefo.ElemView = Ember.View.extend({
     	// templateName: 'elem',
     	addNewBtn: false,
-...
     Synnefo.ImmediateActionView = Ember.View.extend({
     	templateName: 'actions',
     	classNames: ['actions']
     })
     });
     /* Wizard */
     Synnefo.WizardHeadersView = Ember.CollectionView.extend({
     	tagName: 'ul',
     	classNames:['nums'],
     	content: Synnefo.wizards.vmWizard.stepsHeadlines,
     	counter: 0,
     	setCurrentHeader: function() {
     		step = this.get('controller').get('currentStep');
     		console.log('* step', step);
     		return  step;
     	}.property('controller.currentStep'),
     	didInsertElement: function() {
     		console.log('collecton inserted');
     		this.setCurrentHeader;
     	},
     	itemViewClass: Ember.View.extend({
     		templateName: 'wizardStepHeader',
     		classNameBindings: ['isCurrent:current::', 'isFirst:preselected', 'isPast:past::'],
     		index: undefined,
     		isCurrent: false,
     		isFirst: false,
     		init: function() {
     			this._super();
     			console.log('init');
     			var prevIndex = this.get('parentView').get('counter');
     			prevIndex++;
     			console.log('prevIndex', prevIndex)
     			this.get('parentView').set('counter', prevIndex);
     			this.set('index', prevIndex);
     			if(prevIndex === 1) {
     				this.set('isFirst', true);
     				// this.set('isCurrent', true);
+    			}
     			console.log('current', this.isVisible)
     		},
     		isCurrent: function() {
     			return this.index === this.get('controller').get('currentStep');
     		}.property('controller.currentStep'),
     		isPast: function() {
     			return this.index < this.get('controller').get('currentStep');
     		}.property('controller.currentStep'),
     		didInsertElement: function() {
+    		}
     	}),
     });
     /* Components */
     // The only buttons that are views are the buttons that move the wizard
     // The reason is that they shouldn't be isolated from the surrounding
     // (Their labels changes depanding the current step)
     Synnefo.WizardBtnBackView = Ember.View.extend({
     	classNames: ['nav', 'prev'],
     	tagName: 'a',
     	templateName: 'components/btns-span',
     	content: function(){
     		return this.get('controller').get('btnLeftLabel');
     	}.property('controller.btnLeftLabel'),
     	click: function() {
     		this.get('controller').send('moveBack');
+    	}
     });
     Synnefo.WizardBtnNextView = Ember.View.extend({
     	classNames: ['nav', 'next'],
     	tagName: 'a',
     	templateName: 'components/btns-span',
     	content: function(){
     		return this.get('controller').get('btnRightLabel');
     	}.property('controller.btnRightLabel'),
     	click: function() {
     		this.get('controller').send('moveNext');
+    	}
     });
     ;/* Components */
     Synnefo.Btn1Component = Ember.Component.extend({
     	tagName: 'a',
     	click: function() {
     		this.sendAction("action", this.get('param'));
     	},
     	content: undefined // will be set if we want to print a message inside the span
     });
     Synnefo.BtnsSpanComponent = Ember.Component.extend({
     	tagName: 'a',
     	templateName: 'components/btns-span',
     	click: function() {
     		this.sendAction("action");
+    	}
     });
     /* Wizard Buttons */
     Synnefo.Close1Component = Synnefo.BtnsSpanComponent.extend({
     	classNames: ['close'],
     	spanClass: 'snf-close' // has to be modified to array of strings
     });
     	//  there's another close icon to confirm/info modals
     /*
     Back and Next buttons are constructed as views and not as components
     {{cancel-1 action="moveBack" step=currentStep minStep=1}}
     {{next-1 action="moveNext" step=currentStep maxStep=totalStep}}
     Synnefo.Cancel1Component = Synnefo.BtnsSpanComponent.extend({
     	// classNameBindings: ['el3'], the element that should be focused when the user goes to the next step
     	content: 'CANCEL',
     	click: function(){
     		var currentStep =this.get('step');
     		var minStep =this.get('minStep');
     		console.log('minStep ', minStep);
     		this.sendAction();
     		if(currentStep === minStep)
     			this.set('content', 'CANCEL');
     		else
     			this.set('content', 'PREVIOUS');
+    	}
     });
     Synnefo.Next1Component = Synnefo.BtnsSpanComponent.extend({
     	classNames: ['nav', 'next'],
     	// classNameBindings: ['el3'], the element that should be focused when the user goes to the next step
     	content: 'NEXT',
     	click: function() {
     		var currentStep =this.get('step');
     		var maxStep =this.get('maxStep');
     		this.sendAction('action');
     		if(currentStep === maxStep)
     			this.set('content', 'CREATE');
     		else
     			this.set('content', 'NEXT');
+    	}
     }); */
     /* Add New Item */
     Synnefo.AddNewComponent = Ember.Component.extend({
     	templateName: 'snfElem',
     	addNewBtn: true,
-...
+    		}
     });
     /* Login Menu */
     Synnefo.LoginMenuComponent = Ember.Component.extend({
     	classNames: ['login'],
     	didInsertElement: function() {
-...
+    	}
     });
     /* Checkboxes and Radiobuttons */
     Synnefo.SnfCheckboxComponent = Ember.Component.extend({
     	tagName: 'a',
     	classNames: ['check'],

     /* Components */
     Synnefo.Btn1Component = Ember.Component.extend({
     	tagName: 'a',
     	click: function() {
     		this.sendAction("action", this.get('param'));
     	},
     	content: undefined // will be set if we want to print a message inside the span
     });
     Synnefo.BtnsSpanComponent = Ember.Component.extend({
     	tagName: 'a',
     	templateName: 'components/btns-span',
     	click: function() {
     		this.sendAction("action");
+    	}
     });
     /* Wizard Buttons */
     Synnefo.Close1Component = Synnefo.BtnsSpanComponent.extend({
     	classNames: ['close'],
     	spanClass: 'snf-close' // has to be modified to array of strings
     });
     	//  there's another close icon to confirm/info modals
     /*
     Back and Next buttons are constructed as views and not as components
     {{cancel-1 action="moveBack" step=currentStep minStep=1}}
     {{next-1 action="moveNext" step=currentStep maxStep=totalStep}}
     Synnefo.Cancel1Component = Synnefo.BtnsSpanComponent.extend({
     	// classNameBindings: ['el3'], the element that should be focused when the user goes to the next step
     	content: 'CANCEL',
     	click: function(){
     		var currentStep =this.get('step');
     		var minStep =this.get('minStep');
     		console.log('minStep ', minStep);
     		this.sendAction();
     		if(currentStep === minStep)
     			this.set('content', 'CANCEL');
     		else
     			this.set('content', 'PREVIOUS');
+    	}
     });
     Synnefo.Next1Component = Synnefo.BtnsSpanComponent.extend({
     	classNames: ['nav', 'next'],
     	// classNameBindings: ['el3'], the element that should be focused when the user goes to the next step
     	content: 'NEXT',
     	click: function() {
     		var currentStep =this.get('step');
     		var maxStep =this.get('maxStep');
     		this.sendAction('action');
     		if(currentStep === maxStep)
     			this.set('content', 'CREATE');
     		else
     			this.set('content', 'NEXT');
+    	}
     }); */
     /* Add New Item */
     Synnefo.AddNewComponent = Ember.Component.extend({
     	templateName: 'snfElem',
     	addNewBtn: true,
     	selectable: false,
     	icon: function() {
     		baseIcon = Synnefo.conf.sectors.findBy('destination', this.get('type')).icon;
     		return	baseIcon.replace('outline', 'create-full');
     	}.property(),
     	tagName: 'li',
     	status: 'add-new',
     	classNameBindings: ['status'],
     	attributeBindings: ['data-status, data-reveal-id'],
     	'data-reveal-id': function(){
     		if(addNewBtn)
     			return /*this.get('type').substring(0, type.length - 1)+*/'-wizard';
     		else
     			return undefined;
     	}.property(),
     	'data-status': function() {
     		return this.status;
     	}.property(),
     	name: function() {
     		var msg = 'Create New ';
     		var btnType = this.get('type')
     		switch(btnType){
     			case 'vms':
     				return msg + 'Machine';
     			case 'networks':
     				return msg + 'Network';
     			case 'volumes':
     				return msg + 'Volume';
     			case 'snapshots':
     				return msg + 'Snapshot';
     			case 'images':
     				return '+ Upload New Image';
+    		}
     	}.property(),
     		click: function () {
     	        this.sendAction('action');
+    		}
     });
     /* Login Menu */
     Synnefo.LoginMenuComponent = Ember.Component.extend({
     	classNames: ['login'],
     	didInsertElement: function() {
     		var self = this.$();
     		self.mouseenter(function(e){
     	        self.find('ul').stop(true, true).slideDown(200);
         	});
         	self.mouseleave(function(e){
             self.find('ul').stop(true, true).slideUp(200);
         });
+    	}
     });
     /* Checkboxes and Radiobuttons */
     Synnefo.SnfCheckboxComponent = Ember.Component.extend({
     	tagName: 'a',
     	classNames: ['check'],
     	templateName: 'components/select-btn',
     	initState: function() {
     		return this.get('initState');
     	}.property(),
     	didInsertElement: function() {
     		var el = this.$();
     		var self =this;
     		this.setInitClasses();
     		el.click(function(e) {
                 e.preventDefault();
                 e.stopPropagation();
                 self.changeState(el);
                 // ui.entitiesActionsEnabled();
             });
     	},
     	setInitClasses: function() {
     		var self =this.$();
     		switch(this.initState){
     			case 'unchecked': {
     				this.uncheck(self);
     				break;
+    			}
     			case 'prechecked': {
     				self.find('span').addClass('prechecked')
     				this.check(self);
     				break;
+    			}
+    		}
     	},
     	// used to be in ui.checkbox
     	changeState : function(checkbox_link) {
             $(checkbox_link).find('.snf-checkbox-unchecked, .snf-checkbox-checked').toggleClass('snf-checkbox-unchecked snf-checkbox-checked');
             $(checkbox_link).closest('li').toggleClass('selected');
         },
         check : function(checkbox_link) {
             $(checkbox_link).find('span').removeClass('snf-checkbox-unchecked').addClass('snf-checkbox-checked');
             $(checkbox_link).closest('li').addClass('selected');
         },
         uncheck : function(checkbox_link) {
             $(checkbox_link).find('span').removeClass('snf-checkbox-checked').addClass('snf-checkbox-unchecked');
             $(checkbox_link).closest('li').removeClass('selected');
         },
         reset: function(area) {
             $(area).find('.snf-radio-checked').not('.prechecked').toggleClass('snf-radio-checked snf-radio-unchecked');
             $(area).find('.snf-radio-unchecked.prechecked').toggleClass('snf-radio-checked snf-radio-unchecked');
         },
     });

     /* Controllers */
     Synnefo.ApplicationController = Ember.Controller.extend({
     	updateCurrentPath: function() {
     		// we need the set because ElemsController gets the value of current path in every transition
     		Synnefo.set('currentPath', this.get('currentPath'))
     		return this.get('currentPath');
     	}.observes('currentPath'),
     	pageTitle : function() {
     		var currentPath =this.get('currentPath');
     		if(currentPath!== 'index') return Synnefo.conf.sectors.findBy('destination', this.get('currentPath')).title;
     			else return 'Home';
     	}.property('currentPath'),
     	// name: "okeanos application",
     });
     /* Items Controllers */
     Synnefo.ElemsController = Ember.ArrayController.extend({
     	type: undefined,
     	itemController: function(){
     		var type = this.type;
     		return type.substring(0, type.length - 1);
     	}.property(),
     	icon: function() {
     		// should this be placed in ElemsView?
     		return	Synnefo.conf.sectors.findBy('destination', this.get('type')).icon.replace('outline', 'full');
     	}.property(),
     	hasOS: function(){
     			if(Synnefo.get('currentPath') === "vms" || Synnefo.get('currentPath') === "vms.index")
     				return true;
     			else return false;
     	}.property(),
     		hasTags: function(){
     			if(Synnefo.get('currentPath') == "vms" || Synnefo.get('currentPath') === "vms.index")
     				return true;
     			else return false;
     	}.property(),
     });
     Synnefo.VmsController = Synnefo.ElemsController.extend({
     	type: 'vms'
     });
     Synnefo.NetworksController = Synnefo.ElemsController.extend({
     	type: 'networks'
     });
     Synnefo.VolumesController = Synnefo.ElemsController.extend({
     	type: 'volumes'
     });
     Synnefo.SnapshotsController = Synnefo.ElemsController.extend({
     	type: 'snapshots'
     });
     Synnefo.ImagesController = Synnefo.ElemsController.extend({
     	type: 'images'
     });
     /* Controllers for each Item */
     Synnefo.ElemController = Ember.ObjectController.extend({
     	needs: [],
     	actionsList: Synnefo.conf.userActions,
     	setAvailableActions: function() {
     		var parent = this.needs;
     		var self = this;
     		return this.actionsList.filter(function(el) {
     			return _.contains(el['snf-components'], self.get('controllers.'+parent).type) &&( _.contains(el['enabled-status'], self.get('model.status')) || _.contains(el['enabled-status'], 'all'));
     		})
     	}.property(),
     	createBtn: false,
     	actions: {
     		shutdown: function(param) {
     			this.set('model.status', 'shutting');
     		},
     		destroyElement: function(param) {
     			var element = this.get('model');
     			element.deleteRecord();
     			element.save();
+    		}
+    	}
     });
     Synnefo.VmController = Synnefo.ElemController.extend({
     	needs: ['vms']
     });
     Synnefo.NetworkController = Synnefo.ElemController.extend({
     	needs: ['networks']
     });
     Synnefo.VolumeController = Synnefo.ElemController.extend({
     	needs: ['volumes']
     });
     Synnefo.SnapshotController = Synnefo.ElemController.extend({
     	needs: ['snapshots']
     });
     Synnefo.ImageController = Synnefo.ElemController.extend({
     	needs: ['images']
     });
     /* Controllers for Wizards */
     Synnefo.CreateController = Ember.ObjectController.extend({
     	currentStep: undefined,
     	totalStep: function() {
     		return this.get('stepsContent').length;
     	}.property(),
     	init: function() {
     		this._super();
     		this.set('currentStep', 1)
     	},
     	btnLeftLabel: function(){
     	return (this.get('currentStep') === 1)?'CANCEL':'PREVIOUS';
     	}.property('currentStep'),
     	btnRightLabel: function(){
     	return (this.get('currentStep') === this.get('totalStep'))?'CREATE':'NEXT';
     	}.property('currentStep'),
     	actions: {
     		moveNext: function() {
     			var self = this;
     			var step = this.get('currentStep');
     			if(step!== this.get('totalStep')) {
     				step++;
     				this.set('currentStep', step);
+    			}
     			else
     				this.get('target').send('closeWizard');
     		},
     		moveBack: function() {
     			var step = this.get('currentStep');
     			if(step === 1) {
     				this.get('target').send('closeWizard');
+    			}
     			else {
     				step--;
     				this.set('currentStep', step);
+    			}
+    		}
     	},
     });
     Synnefo.VmsCreateController =Synnefo.CreateController.extend({
     });

     Synnefo.CreateRoute = Ember.Route.extend({
     	model: function(){
     		return {name: 'vm-wizard'}
     		return [{name: 'vm-wizard'}]
     	},
     	renderTemplate: function(controller) {
     		this.render('wizard',{controller: controller});
     	},
     /*	beforeModel: function() {
     		this._super();
     		console.log('beforeModel ',this.get('router.url'))
     		this.previousRoute = this.get('router.url'); // should return the current path but some times it returns the path where the user was before (when i dont type the url of the wizard)
     	},
     	previousRoute: undefined,*/
     	actions: {
     		closeWizard: function() {
     			history.back();
+    		}
+    	}
     });
-...
     	modelName: 'userImage'
     });
     Synnefo.VmsCreateRoute = Synnefo.CreateRoute.extend({});
     Synnefo.VmsCreateRoute = Synnefo.CreateRoute.extend({
     	model: function() {
     		return Synnefo.conf.wizards.findBy('name', 'vm-wizard').data;
+    	}
     });
     Synnefo.NetworksCreateRoute = Synnefo.CreateRoute.extend({});
-...
     		return	Synnefo.conf.sectors.findBy('destination', this.get('type')).icon.replace('outline', 'full');
     	}.property(),
     	hasOS: function(){
     			if(Synnefo.get('currentPath') == "vms")
     			console.log('hasOS ', Synnefo.get('currentPath'))
     			if(Synnefo.get('currentPath') === "vms" || Synnefo.get('currentPath') === "vms.index")
     				return true;
     			else return false;
     	}.property(),
     		hasTags: function(){
     			if(Synnefo.get('currentPath') == "vms")
     			if(Synnefo.get('currentPath') == "vms" || Synnefo.get('currentPath') === "vms.index")
     				return true;
     			else return false;
     	}.property(),
-...
     });
     Synnefo.VmsCreateController = Ember.ObjectController.extend({});
     Synnefo.ElemController = Ember.ObjectController.extend({
     	needs: [],
-...
     });
     Synnefo.CreateController = Ember.ArrayController.extend({
     	actions: {
     		moveNext: function() {
     			console.log('move to next step');
+    		}
+    	}
     });
     Synnefo.VmsCreateController =Synnefo.CreateController.extend({
     });
     /* Views */
     Synnefo.ApplicationView = Ember.View.extend({
     	classNames: ['content']
     })
     Synnefo.NavIconView = Ember.View.extend({
     	tagName: 'span',
     	click: function(e) {
     	click: function() {
     		var parentEl = this.$().parent('a');
     		var currentEl = this.$().parents('li').siblings('li').find('a.current');
-...
     });
     Synnefo.WizardHeadersView = Ember.CollectionView.extend({
     	tagName: 'ul',
     	classNames:['nums'],
     	content: Synnefo.conf.wizards.findBy('name', 'vm-wizard').data[0].stepsHeadlines,
     	counter: 0,
     	itemViewClass: Ember.View.extend({
     		templateName: 'wizardStepHeader',
     		classNameBindings: ['isCurrent:current', 'isFirst:preselected'],
     		index: undefined,
     		isCurrent: false,
     		isFirst: false,
     		init: function() {
     			this._super();
     			console.log('init');
     			var prevIndex = this.get('parentView').get('counter');
     			prevIndex++;
     			console.log('prevIndex', prevIndex)
     			this.get('parentView').set('counter', prevIndex);
     			this.set('index', prevIndex);
     			if(prevIndex === 1) {
     				this.set('isFirst', true);
     				this.set('isCurrent', true);
+    			}
     			console.log('current', this.isCurrent)
     		},
     		didInsertElement: function() {
+    		}
     	}),
     });
     Synnefo.ElemView = Ember.View.extend({
     	// templateName: 'elem',
     	addNewBtn: false,
-...
     	tagName: 'a',
     	click: function() {
     		this.sendAction("action", this.get('param'));
     	},
     	content: undefined // will be set if we want to print a message inside the span
     });
     Synnefo.BtnsSpanComponent = Ember.Component.extend({
     	tagName: 'a',
     	templateName: 'components/btns-span',
     	click: function() {
     		this.sendAction("action");
+    	}
     })
     Synnefo.Close1Component = Synnefo.BtnsSpanComponent.extend({
     	classNames: ['close'],
     });
     //  there's another close to modals
     Synnefo.Cancel1Component = Synnefo.BtnsSpanComponent.extend({
     	classNames: ['nav', 'prev'],
     	// classNameBindings: ['el3'], the element that should be focused when the user goes to the next step
     	content: 'CANCEL'
     });
     Synnefo.Next1Component = Synnefo.BtnsSpanComponent.extend({
     	classNames: ['nav', 'next'],
     	// classNameBindings: ['el3'], the element that should be focused when the user goes to the next step
     	content: 'NEXT'
     });
     Synnefo.AddNewComponent = Ember.Component.extend({

     /* Objects */
     Ember.Inflector.inflector.uncountable('account');
     Synnefo.Account = DS.Model.extend({
-...
         action: 'is this a function?'
     }]
     };
     Synnefo.wizards = {
       vmWizard: {
         // each step must have a headline
         stepsHeadlines: [
+            {
               title:'Select an OS',
               subtitle:'Choose your preferred image'
             },
+            {
               title:'Select CPUs, RAM and Disk Size',
               subtitle:'Available options are filtered based on the selected image'
             },
+            {
               title:'Virtual machine custom options',
               subtitle:'tba'
             },
+            {
               title:'Confirm your settings',
               subtitle:'Confirm that the options you have selected are correct'
             },
         ],
         stepsContent: ['step-1', 'step-2', 'step-3', 'step-4']
       },
       networkWizard: {}
+    }

     /* Mapping */
     Synnefo.Router.map(function() {
     // I defined the above resource to extend its Route
     this.resource('sections', {'path':'/'});
     for(var i=0; i<Synnefo.conf.sectors.length; i++)
     	this.resource(Synnefo.conf.sectors[i].destination, function() {
     		// this.route('grid');
     		// this.route('list');
     		this.route('create');
     	});
     });
     /* Routes */
     Synnefo.ApplicationRoute = Ember.Route.extend({
     	model: function() {
     		return {email: 'athina@mail.com'};
     	},
     	redirect: function() {
     		//  have to set vm navigation icon full
     		this.transitionTo('vms');
     	},
     });
     /* Items Routes */
     Synnefo.SectionsRoute = Ember.Route.extend({
     	modelName: undefined,
     	model: function() {
     		return this.store.find(this.modelName);
     	},
     	renderTemplate: function(controller) {
     		this.render('snfElems', {controller: controller});
     	},
     	actions: {
     		openWizard: function() {
     			var wizardType = this.routeName;
     			this.transitionTo(wizardType+'.create')
+    		}
+    	}
     });
     Synnefo.VmsRoute = Synnefo.SectionsRoute.extend({
     	modelName: 'vm'
     });
     Synnefo.NetworksRoute = Synnefo.SectionsRoute.extend({
     	modelName: 'network'
     });
     Synnefo.VolumesRoute = Synnefo.SectionsRoute.extend({
     	modelName: 'volume'
     });
     Synnefo.SnapshotsRoute = Synnefo.SectionsRoute.extend({
     	modelName: 'snapshot'
     });
     Synnefo.ImagesRoute = Synnefo.SectionsRoute.extend({
     	modelName: 'userImage'
     });
     /* Wizards Routes */
     Synnefo.CreateRoute = Ember.Route.extend({
     	model: function(){
     		return [{name: 'vm-wizard'}]
     	},
     	renderTemplate: function(controller) {
     		this.render('wizard',{controller: controller});
     	},
     /*	beforeModel: function() {
     		this._super();
     		console.log('beforeModel ',this.get('router.url'))
     		this.previousRoute = this.get('router.url'); // should return the current path but some times it returns the path where the user was before (when i dont type the url of the wizard)
     	},
     	previousRoute: undefined,*/
     	actions: {
     		closeWizard: function() {
     			history.back();
+    		}
+    	}
     });
     Synnefo.VmsCreateRoute = Synnefo.CreateRoute.extend({
     	model: function() {
     		return Synnefo.wizards.vmWizard;
+    	}
     });
     Synnefo.NetworksCreateRoute = Synnefo.CreateRoute.extend();
     Synnefo.VolumesCreateRoute = Synnefo.CreateRoute.extend();
     Synnefo.SnapshotsCreateRoute = Synnefo.CreateRoute.extend();
     Synnefo.ImagesCreateRoute = Synnefo.CreateRoute.extend({});

      /* Views */
     Synnefo.ApplicationView = Ember.View.extend({
     	classNames: ['content']
     });
     /* Navigation Menu */
     Synnefo.NavIconView = Ember.View.extend({
     	tagName: 'span',
     	click: function() {
     		var parentEl = this.$().parent('a');
     		var currentEl = this.$().parents('li').siblings('li').find('a.current');
     		ui.replaceClass(currentEl, 'full', 'outline', 'snf-');
     		ui.replaceClass(parentEl, 'outline', 'full', 'snf-');
+    	}
     });
     Synnefo.NavigationView = Ember.CollectionView.extend({
       tagName: "ul",
       classNames: ['icons-nav'],
       content: Synnefo.conf.sectors,
       itemViewClass: Ember.View.extend({
         templateName: "navigationItem"
       }),
     });
     /* Items Parts */
     Synnefo.ElemView = Ember.View.extend({
     	// templateName: 'elem',
     	addNewBtn: false,
     	templateName: 'snfElem',
     	tagName: 'li',
     	selectable: true,
     	initSelect: 'unchecked',
     	classNameBindings: ['status'],
     	attributeBindings: ['data-status'],
     	'data-status': function() {
     		return this.status;
     	}.property(),
     	status: function() {
     		return this.get('controller.status');
     	}.property('controller.status')
     });
     Synnefo.ImgWrapView = Ember.View.extend({
     	templateName: 'img-wrap',
     	classNames: ['img-wrap'],
     	icon: function() {
     		var parentView = this.get('parentView');
     		var addNewBtn = parentView.get('addNewBtn');
     		if(addNewBtn)
     			return parentView.get('icon');
     		else
     			return parentView.get('controller').get('parentController').get('icon');
     	}.property()
     });
     Synnefo.NameView = Ember.View.extend({
     	templateName: 'name',
     	tagName: 'h4',
     	name: function() {
     		// the name may be defined inside the parent view or in its model or controller
     		return this.get('parentView').get('controller').get('name');
     	}.property()
     });
     // to be changed
     Synnefo.ImmediateActionView = Ember.View.extend({
     	templateName: 'actions',
     	classNames: ['actions']
     });
     /* Wizard */
     Synnefo.WizardHeadersView = Ember.CollectionView.extend({
     	tagName: 'ul',
     	classNames:['nums'],
     	content: Synnefo.wizards.vmWizard.stepsHeadlines,
     	counter: 0,
     	setCurrentHeader: function() {
     		step = this.get('controller').get('currentStep');
     		console.log('* step', step);
     		return  step;
     	}.property('controller.currentStep'),
     	didInsertElement: function() {
     		console.log('collecton inserted');
     		this.setCurrentHeader;
     	},
     	itemViewClass: Ember.View.extend({
     		templateName: 'wizardStepHeader',
     		classNameBindings: ['isCurrent:current::', 'isFirst:preselected', 'isPast:past::'],
     		index: undefined,
     		isCurrent: false,
     		isFirst: false,
     		init: function() {
     			this._super();
     			console.log('init');
     			var prevIndex = this.get('parentView').get('counter');
     			prevIndex++;
     			console.log('prevIndex', prevIndex)
     			this.get('parentView').set('counter', prevIndex);
     			this.set('index', prevIndex);
     			if(prevIndex === 1) {
     				this.set('isFirst', true);
     				// this.set('isCurrent', true);
+    			}
     			console.log('current', this.isVisible)
     		},
     		isCurrent: function() {
     			return this.index === this.get('controller').get('currentStep');
     		}.property('controller.currentStep'),
     		isPast: function() {
     			return this.index < this.get('controller').get('currentStep');
     		}.property('controller.currentStep'),
     		didInsertElement: function() {
+    		}
     	}),
     });
     // The only buttons that are views are the buttons that move the wizard
     // The reason is that they shouldn't be isolated from the surrounding
     // (Their labels changes depanding the current step)
     Synnefo.WizardBtnBackView = Ember.View.extend({
     	classNames: ['nav', 'prev'],
     	tagName: 'a',
     	templateName: 'components/btns-span',
     	content: function(){
     		return this.get('controller').get('btnLeftLabel');
     	}.property('controller.btnLeftLabel'),
     	click: function() {
     		this.get('controller').send('moveBack');
+    	}
     });
     Synnefo.WizardBtnNextView = Ember.View.extend({
     	classNames: ['nav', 'next'],
     	tagName: 'a',
     	templateName: 'components/btns-span',
     	content: function(){
     		return this.get('controller').get('btnRightLabel');
     	}.property('controller.btnRightLabel'),
     	click: function() {
     		this.get('controller').send('moveNext');
+    	}
     });

     /**/) {
     this.compilerInfo = [4,'>= 1.0.0'];
     helpers = this.merge(helpers, Ember.Handlebars.helpers); data = data || {};
       var buffer = '', helper, options, helperMissing=helpers.helperMissing, escapeExpression=this.escapeExpression;
       data.buffer.push("<section class=\"overlay-area-custom\">\n	<div id=\"vm-wizard\" class=\"overlay-div wizard\">\n		<div class=\"top\">\n			<div class=\"numbers\">\n				<div class=\"row\">\n					");
       data.buffer.push(escapeExpression((helper = helpers['close-1'] || (depth0 && depth0['close-1']),options={hash:{
         'action': ("closeWizard")
       },hashTypes:{'action': "STRING"},hashContexts:{'action': depth0},contexts:[],types:[],data:data},helper ? helper.call(depth0, options) : helperMissing.call(depth0, "close-1", options))));
       data.buffer.push("\n					");
       data.buffer.push(escapeExpression((helper = helpers.collection || (depth0 && depth0.collection),options={hash:{},hashTypes:{},hashContexts:{},contexts:[depth0],types:["ID"],data:data},helper ? helper.call(depth0, "Synnefo.WizardHeadersView", options) : helperMissing.call(depth0, "collection", "Synnefo.WizardHeadersView", options))));
       data.buffer.push("\n				</div>\n			</div>\n		</div>\n		<div class=\"middle\"></div>\n		<div class=\"bottom\">\n			<div class=\"row\">\n				");
       data.buffer.push(escapeExpression(helpers.view.call(depth0, "Synnefo.WizardBtnBackView", {hash:{},hashTypes:{},hashContexts:{},contexts:[depth0],types:["ID"],data:data})));
       data.buffer.push("\n				");
       data.buffer.push(escapeExpression(helpers.view.call(depth0, "Synnefo.WizardBtnNextView", {hash:{},hashTypes:{},hashContexts:{},contexts:[depth0],types:["ID"],data:data})));
       data.buffer.push("\n				\n				</div>\n		</div>\n	</div>\n</section>");
       return buffer;
     });
     Ember.TEMPLATES["wizardStepHeader"] = Ember.Handlebars.template(function anonymous(Handlebars,depth0,helpers,partials,data
     /**/) {
     this.compilerInfo = [4,'>= 1.0.0'];
     helpers = this.merge(helpers, Ember.Handlebars.helpers); data = data || {};
       var buffer = '', stack1;
       data.buffer.push("<section class=\"overlay-area-custom\">\n	<div id=\"vm-wizard\" class=\"overlay-div wizard\">\n		<h2>Wizard</h2>\n	</div>\n</section>");
       data.buffer.push("<em><span>");
       stack1 = helpers._triageMustache.call(depth0, "view.index", {hash:{},hashTypes:{},hashContexts:{},contexts:[depth0],types:["ID"],data:data});
       if(stack1 || stack1 === 0) { data.buffer.push(stack1); }
       data.buffer.push("</span></em>\n<p><strong>");
       stack1 = helpers._triageMustache.call(depth0, "view.content.title", {hash:{},hashTypes:{},hashContexts:{},contexts:[depth0],types:["ID"],data:data});
       if(stack1 || stack1 === 0) { data.buffer.push(stack1); }
       data.buffer.push("</strong> ");
       stack1 = helpers._triageMustache.call(depth0, "view.content.subtitle", {hash:{},hashTypes:{},hashContexts:{},contexts:[depth0],types:["ID"],data:data});
       if(stack1 || stack1 === 0) { data.buffer.push(stack1); }
       data.buffer.push("</p>");
       return buffer;
     });
-...
     });
     Ember.TEMPLATES["components/btns-span"] = Ember.Handlebars.template(function anonymous(Handlebars,depth0,helpers,partials,data
     /**/) {
     this.compilerInfo = [4,'>= 1.0.0'];
     helpers = this.merge(helpers, Ember.Handlebars.helpers); data = data || {};
       var buffer = '', stack1, escapeExpression=this.escapeExpression;
       data.buffer.push("<span ");
       data.buffer.push(escapeExpression(helpers['bind-attr'].call(depth0, {hash:{
         'class': ("view.spanClass")
       },hashTypes:{'class': "STRING"},hashContexts:{'class': depth0},contexts:[],types:[],data:data})));
       data.buffer.push(">");
       stack1 = helpers._triageMustache.call(depth0, "view.content", {hash:{},hashTypes:{},hashContexts:{},contexts:[depth0],types:["ID"],data:data});
       if(stack1 || stack1 === 0) { data.buffer.push(stack1); }
       data.buffer.push("</span>");
       return buffer;
     });
     Ember.TEMPLATES["components/login-menu"] = Ember.Handlebars.template(function anonymous(Handlebars,depth0,helpers,partials,data
     /**/) {
     this.compilerInfo = [4,'>= 1.0.0'];

b/snf-cyclades-app/synnefo/ui/new_ui/ui/javascripts/templates/components/btns-span.hbs
	1	<span {{bind-attr class="view.spanClass"}}>{{view.content}}</span>

     <section class="overlay-area-custom">
     	<div id="vm-wizard" class="overlay-div wizard">
     		<h2>Wizard</h2>
     		<div class="top">
     			<div class="numbers">
     				<div class="row">
     					{{close-1 action="closeWizard"}}
     					{{collection Synnefo.WizardHeadersView}}
     				</div>
     			</div>
     		</div>
     		<div class="middle"></div>
     		<div class="bottom">
     			<div class="row">
     				{{view Synnefo.WizardBtnBackView}}
     				{{view Synnefo.WizardBtnNextView}}
     				{{!-- {{cancel-1 action="moveBack" step=currentStep minStep=1}}
     				{{next-1 action="moveNext" step=currentStep maxStep=totalStep}} --}}
     				</div>
     		</div>
     	</div>
     </section>

b/snf-cyclades-app/synnefo/ui/new_ui/ui/javascripts/templates/wizardStepHeader.hbs
	1	<em><span>{{view.index}}</span></em>
	2	<p><strong>{{view.content.title}}</strong> {{view.content.subtitle}}</p>

+    	}
+    }
     // test animations for wizard header
     @include keyframes( fadeIn) {
 % {
     		display: none;
     		opacity: 0;
+    	}
 % {
     		display: inline;
     		opacity: 0.1;
+    	}
 % {
     		opacity: 1;
+    	}
+    }
     // temp

     /* Layout ----------------------------------------------- */
     html,body {
     html,body, .content {
     	height:100%;
+    }

b/snf-cyclades-app/synnefo/ui/new_ui/ui/sass/_wizards.scss
108	108	}
109	109	&.current{
110	110	float: left;
	111	animation: fadeIn 0.7s;
	112	-webkit-animation: fadeIn 0.7s;
111	113	p {
112	114	display: inline-block;
113	115	}
...	...
122	124	}
123	125	}
124	126	}
	127	&.past {
	128	display: none;
	129	}
125	130	}
126	131	}
127	132	}

     /* Layout ----------------------------------------------- */
     /* line 309, ../sass/_common.scss */
     html, body {
     html, body, .content {
       height: 100%;
+    }
-...
+      }
+    }
     /* line 50, ../sass/_animations.scss */
     @-webkit-keyframes fadeIn {
       /* line 51, ../sass/_animations.scss */
 % {
         display: none;
         opacity: 0;
+      }
       /* line 55, ../sass/_animations.scss */
 % {
         display: inline;
         opacity: 0.1;
+      }
       /* line 59, ../sass/_animations.scss */
 % {
         opacity: 1;
+      }
+    }
     @-moz-keyframes fadeIn {
       /* line 51, ../sass/_animations.scss */
 % {
         display: none;
         opacity: 0;
+      }
       /* line 55, ../sass/_animations.scss */
 % {
         display: inline;
         opacity: 0.1;
+      }
       /* line 59, ../sass/_animations.scss */
 % {

Synnefo

Revision 1933ffd6