diff --git a/IPython/frontend/html/notebook/static/css/alternate_uploadform.css b/IPython/frontend/html/notebook/static/css/alternate_uploadform.css new file mode 100644 index 0000000..1e5f8a4 --- /dev/null +++ b/IPython/frontend/html/notebook/static/css/alternate_uploadform.css @@ -0,0 +1,23 @@ +/* We need an invisible input field on top of the sentense*/ +/* "Drag file onto the list ..." */ + +.alternate_upload +{ + background-color:none; + display: inline; +} + +.alternate_upload.form +{ + padding: 0; + margin:0; +} + +.alternate_upload input.fileinput +{ + background-color:red; + position:relative; + opacity: 0; + z-index: 2; + width: 356px; +} diff --git a/IPython/frontend/html/notebook/static/js/notebooklist.js b/IPython/frontend/html/notebook/static/js/notebooklist.js index a7e98ee..e8f8b2c 100644 --- a/IPython/frontend/html/notebook/static/js/notebooklist.js +++ b/IPython/frontend/html/notebook/static/js/notebooklist.js @@ -43,33 +43,45 @@ var IPython = (function (IPython) { this.element.bind('dragover', function () { return false; }); - this.element.bind('drop', function (event) { - var files = event.originalEvent.dataTransfer.files; - for (var i = 0, f; f = files[i]; i++) { - var reader = new FileReader(); - reader.readAsText(f); - var fname = f.name.split('.'); - var nbname = fname.slice(0,-1).join('.'); - var nbformat = fname.slice(-1)[0]; - if (nbformat === 'ipynb') {nbformat = 'json';}; - if (nbformat === 'py' || nbformat === 'json') { - var item = that.new_notebook_item(0); - that.add_name_input(nbname, item); - item.data('nbformat', nbformat); - // Store the notebook item in the reader so we can use it later - // to know which item it belongs to. - $(reader).data('item', item); - reader.onload = function (event) { - var nbitem = $(event.target).data('item'); - that.add_notebook_data(event.target.result, nbitem); - that.add_upload_button(nbitem); - }; - }; - } + this.element.bind('drop', function(event){ + console.log('bound to drop'); + that.handelFilesUpload(event,'drop'); return false; }); }; + NotebookList.prototype.handelFilesUpload = function(event, dropOrForm) { + var that = this; + var files; + if(dropOrForm =='drop'){ + files = event.originalEvent.dataTransfer.files; + } else + { + files = event.originalEvent.target.files + } + for (var i = 0, f; f = files[i]; i++) { + var reader = new FileReader(); + reader.readAsText(f); + var fname = f.name.split('.'); + var nbname = fname.slice(0,-1).join('.'); + var nbformat = fname.slice(-1)[0]; + if (nbformat === 'ipynb') {nbformat = 'json';}; + if (nbformat === 'py' || nbformat === 'json') { + var item = that.new_notebook_item(0); + that.add_name_input(nbname, item); + item.data('nbformat', nbformat); + // Store the notebook item in the reader so we can use it later + // to know which item it belongs to. + $(reader).data('item', item); + reader.onload = function (event) { + var nbitem = $(event.target).data('item'); + that.add_notebook_data(event.target.result, nbitem); + that.add_upload_button(nbitem); + }; + }; + } + return false; + }; NotebookList.prototype.clear_list = function () { this.element.children('.list_item').remove(); diff --git a/IPython/frontend/html/notebook/static/js/projectdashboardmain.js b/IPython/frontend/html/notebook/static/js/projectdashboardmain.js index 1f6a69f..5957210 100644 --- a/IPython/frontend/html/notebook/static/js/projectdashboardmain.js +++ b/IPython/frontend/html/notebook/static/js/projectdashboardmain.js @@ -32,8 +32,11 @@ $(document).ready(function () { IPython.notebook_list.load_list(); IPython.cluster_list.load_list(); - IPython.page.show(); - + + // bound the upload method to the on change of the file select list + $("#alternate_upload").change(function (event){ + IPython.notebook_list.handelFilesUpload(event,'form'); + }); }); diff --git a/IPython/frontend/html/notebook/templates/projectdashboard.html b/IPython/frontend/html/notebook/templates/projectdashboard.html index 42aefb4..59d9a0a 100644 --- a/IPython/frontend/html/notebook/templates/projectdashboard.html +++ b/IPython/frontend/html/notebook/templates/projectdashboard.html @@ -4,6 +4,7 @@ {% block stylesheet %} + {% end %} @@ -30,8 +31,14 @@ data-read-only={{read_only}}
{% if logged_in or not read_only %}
- Drag files onto the list to import - notebooks. + +
+ Drag files + onto the list, or click here, to import + notebooks. + +
+