Commit 0185a1ad authored by Kostas Papadimitriou's avatar Kostas Papadimitriou
Browse files

ui: Networks/IPs updates and fixes

parent 4bbb68b5
......@@ -6517,6 +6517,12 @@ table.list-machines .wave {
font-size: 0.8em;
}
.create-vm .network-select {
height: 278px;
overflow-y: scroll;
padding-right: 10px;
}
.vm-connect .connect-cont {
margin-bottom: 20px;
border-bottom: 1px solid #A1C8DB;
......@@ -7422,6 +7428,14 @@ input.has-errors {
.steps-container .floating-ips .collection {
}
.ip-port-view .title {
font-weight: normal !important;
}
.pane-view .title.floating-ip {
font-weight: bold !important;
}
.items-list.floating-ips {
margin-top: -5px;
}
......
......@@ -163,26 +163,38 @@
this.trigger("change:" + attr_name, obj);
} else {
var self = this;
var retry = window.setInterval(function(){
var obj = store.get(val);
if (obj) {
data[key] = obj;
self.set(data, {silent:true})
self.trigger("change:" + attr_name, obj);
clearInterval(retry);
}
}, 500);
var retry_to_resolve = function(store, val, key) {
var retries = 0;
var retry = window.setInterval(function(){
retries++;
if (retries > 200) {
clearInterval(retry);
}
var obj = store.get(val);
if (obj) {
data[key] = obj;
self.set(data, {silent:false});
clearInterval(retry);
}
}, 500);
return retry
}
retry_to_resolve(store, val, key);
}
}
var self = this;
this.bind('change:' + attr, function(model) {
resolve_related_instance.call(model, store, key, attr_resolver(model, attr));
}, this);
function init_bindings(instance, store, key, attr, attr_resolver) {
instance.bind('change:' + attr, function(model) {
resolve_related_instance.call(model, store, key, attr_resolver(model, attr));
}, this);
this.bind('add', function(model) {
resolve_related_instance.call(model, store, key, attr_resolver(model, attr));
}, this);
instance.bind('add', function(model) {
resolve_related_instance.call(model, store, key, attr_resolver(model, attr));
}, this);
}
init_bindings(this, store, key, attr, attr_resolver);
resolve_related_instance.call(this, store, key, attr_resolver(this, attr));
}, this);
},
......@@ -317,6 +329,15 @@
initialize: function() {
models.Collection.__super__.initialize.apply(this, arguments);
this.api_call = _.bind(this.api.call, this);
if (this.sortFields) {
_.each(this.sortFields, function(f) {
this.bind("change:" + f, _.bind(this.resort, this));
}, this);
}
},
resort: function() {
this.sort();
},
url: function(options, method) {
......@@ -1024,6 +1045,10 @@
return _.contains(["ACTIVE", "STOPPED"], this.get("status"))
},
can_disconnect: function() {
return _.contains(["ACTIVE", "STOPPED"], this.get("status"))
},
can_resize: function() {
return this.get('status') == 'STOPPED';
},
......@@ -1325,6 +1350,7 @@
},
connect_floating_ip: function(ip, cb) {
this.set({'status': 'CONNECTING'});
synnefo.storage.ports.create({
port: {
network_id: ip.get('floating_network_id'),
......@@ -1332,7 +1358,6 @@
fixed_ips: [{'ip_address': ip.get('floating_ip_address')}]
}
}, {complete: cb, skip_api_error: false})
// TODO: Implement
},
// action helper
......
......@@ -414,9 +414,13 @@
disconnect: function(cb) {
var network = this.get('network');
var vm = this.get('vm');
network.pending_disconnects++;
network.update_connecting_status();
var success = _.bind(function() {
if (vm) {
vm.set({'status': 'DISCONNECTING'});
}
this.set({'status': 'DISCONNECTING'});
cb();
}, this);
......@@ -472,7 +476,8 @@
if (vm && vm.get("task_state")) { return false }
if (vm && vm.in_error_state()) { return false }
var status_ok = _.contains(['ACTIVE', 'CONNECTED'], this.get('status'))
return status_ok
var vm_status_ok = vm.can_disconnect();
return status_ok && vm_status_ok;
}]
},
......
......@@ -94,7 +94,7 @@
'CONNECTED': 'status-active',
'ACTIVE': 'status-active',
'CONNECTING': 'status-progress',
'DISCONNECTING': 'status-inactive',
'DISCONNECTING': 'status-progress',
'DOWN': 'status-inactive',
'DISCONNECTED': 'status-inactive',
'UP': 'status-active',
......
......@@ -795,13 +795,6 @@
tpl: '#networks-select-floating-ips-tpl',
model_view_cls: views.NetworkSelectFloatingIpView,
select_if_available: function() {
var selected = false;
if (this._subviews[0]) {
this._subviews[0].select();
}
},
deselect_all: function() {
this.each_ip_view(function(v) { v.deselect() });
},
......@@ -854,11 +847,11 @@
this.hide_parent();
return;
}
this.select_first();
this.parent_view.item.addClass("selected");
this.parent_view.input.attr("checked", true);
this.parent_view.selected = true;
this.show(true);
this.select_if_available();
},
update_available: function() {
......@@ -904,6 +897,7 @@
},
update_selected: function() {
// reset missing entries
_.each(this.selected_ips.length, function(ip) {
if (!this.collection.get(ip.id)) {
this.selected_ips = _.without(this.selected_ips, ip);
......@@ -913,11 +907,11 @@
if (this.selected_ips.length) {
this.parent_view.input.attr("checked", true);
this.parent_view.item.addClass("selected");
this.parent_view.item.selected = true;
this.parent_view.selected = true;
} else {
this.parent_view.input.attr("checked", false);
this.parent_view.item.removeClass("selected");
this.parent_view.item.selected = false;
this.parent_view.selected = false;
}
},
......@@ -955,14 +949,20 @@
skip_api_error: true
});
},
select_first: function() {
if (this.selected_ips.length > 0) { return }
if (this._subviews.length == 0) { return }
this._subviews[0].select();
if (!_.contains(this.selected_ips, this._subviews[0].model)) {
this.selected_ips.push(this._subviews[0].model);
}
},
post_add_model_view: function(view, model) {
view.bind("change:select", this.handle_ip_select)
if (!this.selected_ips.length && this._subviews.length == 1) {
this._subviews[0].select();
if (!_.contains(this.selected_ips, model)) {
this.selected_ips.push(model);
}
this.select_first();
}
},
......
......@@ -304,6 +304,14 @@
this.model.remove(function() {
synnefo.storage.keys.fetch();
});
},
post_hide: function() {
views.PublicKeyView.__super__.post_hide.apply(this);
if (this.content_visible) {
this.toggle_content();
this.content.hide();
}
}
});
......
......@@ -65,6 +65,9 @@
var self = this;
this.toggler.click(function() {
if(self.toggler.parent().parent().hasClass("disabled")) {
return;
}
self.toggle();
});
......
......@@ -237,7 +237,7 @@
update_quota: function() {
var available = this.quota.get_available();
if (available) {
if (available > 0) {
this.create_button.removeClass("disabled");
this.create_button.attr("title", this.quota_limit_message || "Quota limit reached")
} else {
......@@ -277,11 +277,14 @@
if (!view) { return }
el = view.el;
parent = this.parent_for_model(model);
index = this.collection.indexOf(model);
if (!parent.find(el).length) {
index = this.collection.indexOf(model);
anim = true;
this.place_in_parent(parent, el, model, index, anim);
}
if (index != view.el.data('index')) {
this.place_in_parent(parent, el, model, index, false);
}
},
handle_collection_change: function() {
......@@ -320,7 +323,7 @@
},
place_in_parent: function(parent, el, m, index, anim) {
var place_func, place_func_context, position_found;
var place_func, place_func_context, position_found, exists;
_.each(parent.find(".model-item"), function(el) {
var el = $(el);
......
......@@ -5,7 +5,7 @@
<div class="inner clearfix main-content">
<div class="model-logo vm-icon medium2 state1"
data-rv-style="model.vm.status|vm_style"></div>
<h5 class="title" data-rv-text="model.vm.name|truncate 50"></h5>
<h3 class="title" data-rv-text="model.vm.name|truncate 40"></h3>
<h5 class="subtitle">
<span class="key" data-rv-show="model.mac_address">MAC:</span>
<span class="value" data-rv-text="model.mac_address"></span>
......@@ -21,7 +21,7 @@
<div class="main-content-inner clearfix">
<img class="logo" src="{{ SYNNEFO_IMAGES_URL }}internet.png" />
<div class="entry inline" data-rv-class-connected="model.device_id">
<h3 class="title">
<h3 class="title floating-ip">
<span data-rv-text="model.floating_ip_address">IP ADDRESS</span>
</h3>
<div data-rv-if="model.port_id" class="ports nested-model-list proxy inline">
......
......@@ -93,7 +93,7 @@
<div class="border2"></div>
<div class="inner clearfix main-content">
<img class="model-logo" data-rv-src="model.vm.status|vm_logo_url" />
<h5 class="title" data-rv-text="model.vm.name"></h5>
<h5 class="title" data-rv-text="model.vm.name|truncate 35"></h5>
<ul class="ip-addresses">
<li data-rv-each-item="model.fixed_ips">
<span data-rv-text="item:ip_address|ip_type" class="type"></span>
......@@ -230,7 +230,7 @@
<div class="collection">
<div id="create-network" class="create-button">
<a href="#">{% trans "New network +" %}</a>
<a href="#">{% trans "New Network +" %}</a>
</div>
<div class="empty-list hidden">
......@@ -273,7 +273,9 @@
<div class="checkbox">
<input type="checkbox" data-rv-data-id="model.id" />
</div>
<div class="ico"><img data-rv-src="model.is_public|get_network_icon" /></div>
<div class="ico">
<img data-rv-src="model.is_public|get_network_icon" />
</div>
<div class="name">
<span class="" data-rv-text="model.name"></span>
<span class="no-available hidden">{% trans "No IPs available" %}</span>
......@@ -290,7 +292,7 @@
<div class="select-item private-network clearfix">
<div class="checkbox"><input type="checkbox" data-rv-data-id="model.id"></div>
<div class="ico"><img data-rv-src="model.is_public|get_network_icon" /></div>
<div class="name"><span class="" data-rv-text="model.name|truncate 50"></span></div>
<div class="name"><span class="" data-rv-text="model.name|truncate 45"></span></div>
<div class="cidr"><span class="" data-rv-text="model.subnet.cidr"></span></div>
</div>
</div>
......
......@@ -90,7 +90,7 @@
<div class="collection">
<div id="create-keypair" class="create-button">
<a href="#">{% trans "New public key +" %}</a>
<a href="#">{% trans "New Keypair +" %}</a>
</div>
<div class="empty-list hidden">
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment