diff --git a/services/web/app/views/project/list.jade b/services/web/app/views/project/list.jade index fc335ef372..a3eafb8bf6 100644 --- a/services/web/app/views/project/list.jade +++ b/services/web/app/views/project/list.jade @@ -7,6 +7,7 @@ block scripts tags: !{tags} }; + script(src=jsPath+'libs/fineuploader.js') script(src=jsPath+'project-list.js') block content @@ -26,9 +27,12 @@ block content a( href="#", ng-click="openCreateProjectModal('example')" - ) Example Project + ) Example Project li - a#uploadNewProject(href="#", data-csrf=csrfToken) Upload Project + a( + href="#", + ng-click="openUploadProjectModal()" + ) Upload Project li.divider li.dropdown-header Templates li @@ -62,7 +66,10 @@ block content ) a.menu-indent(href="#", ng-click="selectTag()") i.icon.fa( - ng-class="{'fa-folder-open-o': tag.selected, 'fa-folder-o': !tag.selected}" + ng-class="{\ + 'fa-folder-open-o': tag.selected,\ + 'fa-folder-o': !tag.selected\ + }" ) | {{tag.name}} span.small ({{tag.project_ids.length}}) @@ -247,3 +254,12 @@ block content ) span(ng-hide="state.inflight") Create span(ng-show="state.inflight") Creating... + + + script(type="text/ng-template", id="uploadProjectModalTemplate") + .modal-header + h3 Upload Zipped Project + .modal-body(ng-fine-upload) + span Upload a zipped project + .modal-footer + button.btn.btn-default.cancel Cancel diff --git a/services/web/public/coffee/project-list.coffee b/services/web/public/coffee/project-list.coffee index 1df0f964ec..ad54da7ae2 100644 --- a/services/web/public/coffee/project-list.coffee +++ b/services/web/public/coffee/project-list.coffee @@ -262,6 +262,12 @@ ProjectPageApp.controller "ProjectPageController", ($scope, $modal, $http, $q) - $scope.updateVisibleProjects() + $scope.openUploadProjectModal = () -> + modalInstance = $modal.open( + templateUrl: "uploadProjectModalTemplate" + controller: "UploadProjectModalController" + ) + ProjectPageApp.controller "ProjectListItemController", ($scope) -> $scope.onSelectedChange = () -> $scope.$emit "selected:on-change" @@ -356,4 +362,43 @@ ProjectPageApp.controller 'NewProjectModalController', ($scope, $modalInstance, $modalInstance.close(project_id) $scope.cancel = () -> - $modalInstance.dismiss('cancel') \ No newline at end of file + $modalInstance.dismiss('cancel') + +ProjectPageApp.directive 'ngFineUpload', ($timeout) -> + return (scope, element, attrs) -> + console.log "Creating fine uploader" + new qq.FineUploader + element: element[0] + multiple: false + disabledCancelForFormUploads: true + validation: + allowedExtensions: ["zip"] + request: + endpoint: "/project/new/upload" + forceMultipart: true + params: + _csrf: window.csrfToken + callbacks: + onComplete: (error, name, response)-> + if response.project_id? + window.location = '/project/'+response.project_id + text: + waitingForResponse: "Creating project..." + failUpload: "Upload failed. Is it a valid zip file?" + uploadButton: "Select a .zip file" + template: """ +
+
{dragZoneText}
+
+
{uploadButtonText}
+
+ or + drag a .zip file + {dropProcessingText} + +
+ """ + +ProjectPageApp.controller 'UploadProjectModalController', ($scope, $modalInstance, $timeout) -> + $scope.cancel = () -> + $modalInstance.dismiss('cancel') diff --git a/services/web/public/stylesheets/style.less b/services/web/public/stylesheets/style.less index 0d28cc6ce6..81bcdf9730 100755 --- a/services/web/public/stylesheets/style.less +++ b/services/web/public/stylesheets/style.less @@ -39,6 +39,7 @@ @import "components/panels.less"; @import "components/wells.less"; @import "components/close.less"; +@import "components/fineupload.less"; // Components w/ JavaScript @import "components/modals.less";