Skip to content

Commit

Permalink
[#1506][editresources][m]: Refactored add resource process into new ui
Browse files Browse the repository at this point in the history
  • Loading branch information
teajaymars committed Feb 24, 2012
1 parent daf506b commit 7e61fc0
Show file tree
Hide file tree
Showing 3 changed files with 69 additions and 49 deletions.
72 changes: 38 additions & 34 deletions ckan/public/css/style.css
Expand Up @@ -1046,14 +1046,6 @@ body.editresources #sidebar {
display: none;
}

.dataset-editresources-form .resource-add {
background: #eee;
padding-top: 10px;
padding-bottom: 5px;
border: 1px solid #e0e0e0;
border-left: none;
border-right: none;
}
.dataset-editresources-form .resource-add li h4 {
display: inline;
padding-right: 20px;
Expand Down Expand Up @@ -1520,6 +1512,12 @@ body.authz form button {


/* Dev */
fieldset#resources {
min-height: 380px;
margin-bottom: 40px;
position: relative;
padding: 0;
}
.resource-list {
list-style-type: none;
padding: 0;
Expand All @@ -1531,6 +1529,8 @@ body.authz form button {
border-radius: 4px;
border: 1px solid #eee;
position: relative;
margin-right: 20px;
z-index: 1;
}
.resource-list li a {
display: block;
Expand All @@ -1539,43 +1539,46 @@ body.authz form button {
.resource-list li:hover {
border-color: #ccc;
}
.resource-list li.active {
border-color: #888;
border-right: 0;
background: #f9f9f9;
margin-right: 0;
border-top-right-radius: 0;
border-bottom-right-radius: 0;
}
hr.resource-list-divide {
margin: 10px 0;
width: 380px;
background: #eee;
}

fieldset#resources {
position: relative;
padding: 0;

/* While dragging.... */
.resource-list-edit li.ui-sortable-helper {
box-shadow: 2px 2px 2px rgba(0,0,0,0.1);
}
.resource-list-edit li.ui-sortable-helper.active {
margin-right: 20px;
border-top-right-radius: 4px;
border-bottom-right-radius: 4px;
border-right: 1px solid #888;
}

.dataset-editresources-form .resource-list {
width: 400px;
min-height: 300px;
margin-bottom: 40px;
}
li.resource-edit {
margin-right: 20px;
position: relative;
z-index: 1;
background: #fff;
}
li.resource-edit:hover {
margin-right: 1px;
border-right: 0;
border-top-right-radius: 0;
border-bottom-right-radius: 0;
.resource-list-add li a {
padding-left: 43px;
}
li.resource-edit a {
.resource-list-edit li a {
padding-left: 0;
}
li.resource-edit:hover .drag-bars {
.resource-list-edit li:hover .drag-bars {
color: #999;
}

li.resource-edit.active {
border-color: #888;
border-right: 0;
background: #f9f9f9;
margin-right: 0;
border-top-right-radius: 0;
border-bottom-right-radius: 0;
}


.resource-details-container {
background: #f9f9f9;
Expand All @@ -1586,6 +1589,7 @@ li.resource-edit.active {
left: 399px;
top: 0px;
padding: 10px;
min-height: 300px;
}
.resource-details-container .resource-details-close {
position: absolute;
Expand Down
22 changes: 17 additions & 5 deletions ckan/public/scripts/application.js
Expand Up @@ -620,12 +620,24 @@ CKAN.View.DatasetEditResourcesForm = Backbone.View.extend({
resources.bind('remove', flashWarning);

// Table for editing resources
var $el = this.el.find('.js-resource-list');
var $el = this.el.find('.resource-list-edit');
this.resourceList=new CKAN.View.ResourceEditList({
collection: resources,
el: $el
});

// Trigger the Add Resource pane
var $a = this.el.find('.js-resource-add');
$a.click(function(e) {
e.preventDefault();
$('.resource-list li').removeClass('active');
$('.resource-list-add li').addClass('active');
$('.js-resource-details').hide();
$('.js-resource-details.resource-add').show();
$('.js-resource-details-container').show();
return false;
});

// Tabbed view for adding resources
var $el = this.el.find('.resource-add');
this.addView=new CKAN.View.ResourceAddTabs({
Expand All @@ -636,7 +648,7 @@ CKAN.View.DatasetEditResourcesForm = Backbone.View.extend({
// Close details button
$('.resource-details-close').click(function(e) {
e.preventDefault();
$('.js-resource-list li').removeClass('active');
$('.resource-list li').removeClass('active');
$('.resource-details-container').hide();
return false;
});
Expand Down Expand Up @@ -715,9 +727,9 @@ CKAN.View.ResourceEditList = Backbone.View.extend({
var container = $('.js-resource-details-container');
container.find('.js-resource-details').hide();
container.show();
self.el.find('li.active').removeClass('active');

$li.data('table').show();
$('.resource-list li').removeClass('active');
$table.show();
$table.find('.js-resource-edit-name').focus();
$li.addClass('active');
};

Expand Down
24 changes: 14 additions & 10 deletions ckan/templates/package/new_package_form.html
Expand Up @@ -82,18 +82,22 @@ <h2>Errors in form</h2>
</fieldset>

<fieldset id="resources">
<ul class="resource-list drag-drop-list js-resource-list">
<ul class="resource-list resource-list-edit drag-drop-list">
</ul>
<div class="js-resource-details-container resource-details-container">
<hr class="resource-list-divide"/>
<ul class="resource-list resource-list-add">
<li class="ui-state-default"><a href="#" class="js-resource-add">${h.icon('page_white_add')}New resource...</a></li>
</ul>
<div style="display: none;" class="js-resource-details-container resource-details-container">
<button class="pretty-button danger resource-details-close">x</button>
</div>
<div class="resource-add">
<ul class="button-row">
<li><h4>Add a resource:</h4></li>
<li><button class="pretty-button js-link-file">Link to a file</button></li>
<li><button class="pretty-button js-link-api">Link to an API</button></li>
<li class="js-upload-file ckan-logged-in" style="display: none;"><button class="pretty-button js-upload-file">Upload a file</button></li>
</ul>
<div class="js-resource-details resource-add">
<ul class="button-row">
<li><h4>Add a resource:</h4></li>
<li><button class="pretty-button js-link-file">Link to a file</button></li>
<li><button class="pretty-button js-link-api">Link to an API</button></li>
<li class="js-upload-file ckan-logged-in" style="display: none;"><button class="pretty-button js-upload-file">Upload a file</button></li>
</ul>
</div>
</div>
</fieldset>

Expand Down

0 comments on commit 7e61fc0

Please sign in to comment.