diff --git a/IPython/frontend/html/notebook/static/css/projectdashboard.css b/IPython/frontend/html/notebook/static/css/projectdashboard.css index 6e410c1..c2b960e 100644 --- a/IPython/frontend/html/notebook/static/css/projectdashboard.css +++ b/IPython/frontend/html/notebook/static/css/projectdashboard.css @@ -10,30 +10,30 @@ margin: 30px auto 0px auto; } -#notebooks_toolbar { +.list_toolbar { padding: 5px; height: 25px; line-height: 25px; } -#drag_info { +.toolbar_info { float: left; } -#notebooks_buttons { +.toolbar_buttons { float: right; } -#project_name { +.list_header { height: 25px; line-height: 25px; - padding: 3px; + padding: 3px 5px; } -.notebook_item { +.list_item { height: 25px; line-height: 25px; - padding: 3px; + padding: 3px 5px; } .notebook_item a { diff --git a/IPython/frontend/html/notebook/static/js/clusterlist.js b/IPython/frontend/html/notebook/static/js/clusterlist.js new file mode 100644 index 0000000..f8e38e3 --- /dev/null +++ b/IPython/frontend/html/notebook/static/js/clusterlist.js @@ -0,0 +1,128 @@ +//---------------------------------------------------------------------------- +// Copyright (C) 2008-2011 The IPython Development Team +// +// Distributed under the terms of the BSD License. The full license is in +// the file COPYING, distributed as part of this software. +//---------------------------------------------------------------------------- + +//============================================================================ +// NotebookList +//============================================================================ + +var IPython = (function (IPython) { + + var ClusterList = function (selector) { + this.selector = selector; + if (this.selector !== undefined) { + this.element = $(selector); + this.style(); + this.bind_events(); + } + }; + + ClusterList.prototype.style = function () { + $('#cluster_toolbar').addClass('list_toolbar'); + $('#cluster_list_info').addClass('toolbar_info'); + $('#cluster_buttons').addClass('toolbar_buttons'); + $('div#cluster_header').addClass('list_header ui-widget ui-widget-header'); + $('#refresh_cluster_list').button({ + icons : {primary: 'ui-icon-arrowrefresh-1-s'}, + text : false + }); + }; + + + ClusterList.prototype.bind_events = function () { + var that = this; + $('#refresh_cluster_list').click(function () { + that.load_list(); + }); + }; + + + ClusterList.prototype.load_list = function () { + var settings = { + processData : false, + cache : false, + type : "GET", + dataType : "json", + success : $.proxy(this.load_list_success, this) + }; + var url = $('body').data('baseProjectUrl') + 'clusters'; + $.ajax(url, settings); + }; + + + ClusterList.prototype.clear_list = function () { + this.element.children('.list_item').remove(); + } + + ClusterList.prototype.load_list_success = function (data, status, xhr) { + console.log(data); + this.clear_list(); + var len = data.length; + for (var i=0; i'); + item_div.addClass('list_item ui-widget ui-widget-content ui-helper-clearfix'); + item_div.css('border-top-style','none'); + var item = new ClusterItem(item_div); + item.update_state(data[i]); + item_div.data('item', item); + console.log('appending item', item); + this.element.append(item_div); + }; + }; + + + var ClusterItem = function (element) { + this.element = $(element); + this.data = null; + }; + + + ClusterItem.prototype.update_state = function (data) { + this.data = data; + if (data.status === 'running') { + this.state_running(); + } else if (data.status === 'stopped') { + this.state_stopped(); + }; + + } + + + ClusterItem.prototype.state_stopped = function () { + var item_name = $('').addClass('item_name').text(this.data.profile); + var item_buttons = $('').addClass('item_buttons'); + var start_button = $('Start').button(); + item_buttons.append(start_button); + this.element.append(item_name).append(item_buttons); + start_button.click(function (e) { + console.log('start'); + }); + } + + + ClusterItem.prototype.start_success = function () { + + }; + + ClusterItem.prototype.state_running = function () { + var item_name = $('').addClass('item_name').text(this.data.profile); + var item_buttons = $('').addClass('item_buttons'); + var stop_button = $('Stop').button(); + item_buttons.append(start_button); + this.element.append(item_name).append(item_buttons); + start_button.click(function (e) { + console.log('stop'); + }); + }; + + + IPython.ClusterList = ClusterList; + IPython.ClusterItem = ClusterItem; + + return IPython; + +}(IPython)); + diff --git a/IPython/frontend/html/notebook/static/js/notebooklist.js b/IPython/frontend/html/notebook/static/js/notebooklist.js index 21f9bba..a7e98ee 100644 --- a/IPython/frontend/html/notebook/static/js/notebooklist.js +++ b/IPython/frontend/html/notebook/static/js/notebooklist.js @@ -21,7 +21,14 @@ var IPython = (function (IPython) { }; NotebookList.prototype.style = function () { - $('div#project_name').addClass('ui-widget ui-widget-header'); + $('#notebook_toolbar').addClass('list_toolbar'); + $('#drag_info').addClass('toolbar_info'); + $('#notebook_buttons').addClass('toolbar_buttons'); + $('div#project_name').addClass('list_header ui-widget ui-widget-header'); + $('#refresh_notebook_list').button({ + icons : {primary: 'ui-icon-arrowrefresh-1-s'}, + text : false + }); }; @@ -30,6 +37,9 @@ var IPython = (function (IPython) { return; } var that = this; + $('#refresh_notebook_list').click(function () { + that.load_list(); + }); this.element.bind('dragover', function () { return false; }); @@ -61,7 +71,13 @@ var IPython = (function (IPython) { }; + NotebookList.prototype.clear_list = function () { + this.element.children('.list_item').remove(); + } + + NotebookList.prototype.load_list = function () { + this.clear_list(); var settings = { processData : false, cache : false, @@ -92,7 +108,7 @@ var IPython = (function (IPython) { NotebookList.prototype.new_notebook_item = function (index) { var item = $(''); - item.addClass('notebook_item ui-widget ui-widget-content ui-helper-clearfix'); + item.addClass('list_item ui-widget ui-widget-content ui-helper-clearfix'); item.css('border-top-style','none'); var item_name = $('').addClass('item_name'); @@ -156,7 +172,7 @@ var IPython = (function (IPython) { var that = $(this); // We use the nbname and notebook_id from the parent notebook_item element's // data because the outer scopes values change as we iterate through the loop. - var parent_item = that.parents('div.notebook_item'); + var parent_item = that.parents('div.list_item'); var nbname = parent_item.data('nbname'); var notebook_id = parent_item.data('notebook_id'); var dialog = $(''); diff --git a/IPython/frontend/html/notebook/static/js/projectdashboardmain.js b/IPython/frontend/html/notebook/static/js/projectdashboardmain.js index 4b7c1c1..1762faa 100644 --- a/IPython/frontend/html/notebook/static/js/projectdashboardmain.js +++ b/IPython/frontend/html/notebook/static/js/projectdashboardmain.js @@ -23,9 +23,11 @@ $(document).ready(function () { IPython.read_only = $('body').data('readOnly') === 'True'; IPython.notebook_list = new IPython.NotebookList('div#notebook_list'); + IPython.cluster_list = new IPython.ClusterList('div#cluster_list'); IPython.login_widget = new IPython.LoginWidget('span#login_widget'); IPython.notebook_list.load_list(); + IPython.cluster_list.load_list(); IPython.page.show(); diff --git a/IPython/frontend/html/notebook/templates/projectdashboard.html b/IPython/frontend/html/notebook/templates/projectdashboard.html index 4a84f82..254fba2 100644 --- a/IPython/frontend/html/notebook/templates/projectdashboard.html +++ b/IPython/frontend/html/notebook/templates/projectdashboard.html @@ -29,12 +29,13 @@ data-read-only={{read_only}} {% if logged_in or not read_only %} - + Drag files onto the list to import notebooks. - - New Notebook + + Refresh + New Notebook {% end %} @@ -44,6 +45,19 @@ data-read-only={{read_only}} + + + IPython parallel computing clusters + + + Refresh + + + + + Clusters + + @@ -53,5 +67,6 @@ data-read-only={{read_only}} {% block script %} + {% end %}