Synnefo

/* Init Application */

window.Synnefo = Ember.Application.create({

        currentPath: 'vms',

         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.Account = DS.Model.extend({

        email: DS.attr('string')

});

// CHECK can i use a single obj and not an array of obj

Synnefo.Account.FIXTURES = {

        id: 001,

        email: "athina@mail.com"

};

Synnefo.Vm = DS.Model.extend({

        // id: DS.attr('number'),         we do not define it ;)

        name: DS.attr('string'),

        hostname: DS.attr('string'),

        status: DS.attr('string'),

        os: DS.attr()

});

Synnefo.Vm.FIXTURES =

[{

        id: 125355,

        name: "web-server",

        hostname: "user@snf-38389.vm.okeanos.grnet.gr",

        status: "running",

        os: "kubuntu"

},

{

        id: 12,

        name: "another-server",

        hostname: "user@snf-33333.vm.okeanos.grnet.gr",

        status: "off",

        os: "fedora"

}];

Synnefo.Network = DS.Model.extend({

        name: DS.attr('string'),

        status: DS.attr('string'),

});

Synnefo.Network.FIXTURES =

[{

  id: 11,

  name: 'Network-1',

  status: 'running'

},

{

  id: 22,

  name: 'Network-2',

  status: 'error'

}];

Synnefo.Volume = DS.Model.extend({

  name: DS.attr('string'),

  status: DS.attr('string'),

});

Synnefo.Volume.FIXTURES =

[{

  id: 111,

  name: 'Volume-1',

  status: 'running'

},

{

  id: 222,

  name: 'Volume-2',

  status: 'building'

}];

Synnefo.Snapshot = DS.Model.extend({

  name: DS.attr('string'),

  status: DS.attr('string'),

});

Synnefo.Snapshot.FIXTURES =

[{

  id: 33,

  name: 'Snapshot-1',

  status: 'running'

},

{

  id: 44,

  name: 'Snapshot-2',

  status: 'building'

}];

Synnefo.UserImage = DS.Model.extend({

  name: DS.attr('string'),

  status: DS.attr('string'),

});

Synnefo.UserImage.FIXTURES =

[{

  id: 55,

  name: 'Image-1',

  status: 'running'

},

{

  id: 66,

  name: 'Image-2',

  status: 'running'

}];

Synnefo.conf = {

  sectors: [{

          destination: "vms",

          title: "Virtual Machines",

          icon: "snf-pc-outline"

  },

  {

    destination: "networks",

    title: "Network",

          icon: "snf-network-outline"

  },

  {

          destination: "volumes",

          title: "Volumes",

          icon: "snf-volume-outline"

  },

  {

          destination: "pithos",

          title: "Pithos",

          icon: "snf-pithos-outline"

  },

  {

          destination: "images",

          title: "Images",

          icon: "snf-image-outline"

  },

  {

          destination: "snapshots",

          title: "Snapshots",

          icon: "snf-snapshot-outline"

  },

  {

          destination: "ips",

          title: "IPs",

          icon: "snf-nic-outline"

  },

  {

          destination: "sshkeys",

          title: "SSh Keys",

          icon: "snf-key-outline"

  }],

  userActions: [{

    description:'start',

    'snf-components':['vms'],

    'enabled-status': ['off'],

    action: 'is this a function?'

  },

  {

    description:'destroyElement',

    'snf-components': ['vms', 'networks'],

    'enabled-status': ['all'],

    action: 'is this a function?',

  },

  {

    description:'shutdown',

    'snf-components': ['vms'],

    'enabled-status': ['running'],

    action: 'is this a function?'

  },

  {

    description:'add machine',

    'snf-components': ['networks'],

    'enabled-status': ['active'],

    action: 'is this a function?'

  },

  {

    description:'action for all',

    'snf-components': ['vms', 'networks'],

    'enabled-status': ['all'],

    action: 'is this a function?'

}]

};

;/* 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');

        },

});

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.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'

});

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'

});

Synnefo.VmsCreateRoute = Synnefo.CreateRoute.extend({});

Synnefo.NetworksCreateRoute = Synnefo.CreateRoute.extend({});

Synnefo.VolumesCreateRoute = Synnefo.CreateRoute.extend({});

Synnefo.SnapshotsCreateRoute = Synnefo.CreateRoute.extend({});

Synnefo.ImagesCreateRoute = Synnefo.CreateRoute.extend({});

/* 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",

});

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")

                                return true;

                        else return false;

        }.property(),

                hasTags: function(){

                        if(Synnefo.get('currentPath') == "vms")

                                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'

});

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']

});

/* Views */

Synnefo.NavIconView = Ember.View.extend({

        tagName: 'span',

        click: function(e) {

                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"

  }),

});

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']

})

/* Components */

Synnefo.Btn1Component = Ember.Component.extend({

        tagName: 'a',

        click: function() {

                this.sendAction("action", this.get('param'));

        }

});

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');

                }

});

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);

    });

        }

});

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');

    },

});