[ckan-changes] [okfn/ckan] 289a36: Add additional bold variant of the Ubuntu font fam...
GitHub
noreply at github.com
Mon Apr 30 15:19:22 UTC 2012
Branch: refs/heads/feature-2204-related-ui
Home: https://github.com/okfn/ckan
Commit: 289a36784403ee6bb23c656bb415770ef52b38d5
https://github.com/okfn/ckan/commit/289a36784403ee6bb23c656bb415770ef52b38d5
Author: Aron Carroll <self at aroncarroll.com>
Date: 2012-04-30 (Mon, 30 Apr 2012)
Changed paths:
M ckan/templates/layout_base.html
Log Message:
-----------
Add additional bold variant of the Ubuntu font family
This allows us to have bold headers at smaller font sizes.
diff --git a/ckan/templates/layout_base.html b/ckan/templates/layout_base.html
index a983d4b..7a8cb9b 100644
--- a/ckan/templates/layout_base.html
+++ b/ckan/templates/layout_base.html
@@ -27,7 +27,7 @@
<link rel="alternate" type="application/atom+xml" title="${g.site_title} - Recent Revision History" href="${h.url_for(controller='revision', action='list', format='atom', days=1)}" />
</py:otherwise>
</py:choose>
- <link href='http://fonts.googleapis.com/css?family=Ubuntu' rel='stylesheet' type='text/css' />
+ <link href='http://fonts.googleapis.com/css?family=Ubuntu:400,700' rel='stylesheet' type='text/css' />
<link rel="stylesheet" href="${h.url_for_static('/scripts/vendor/jqueryui/1.8.14/css/jquery-ui.custom.css')}" type="text/css" media="screen, print" />
<link rel="stylesheet" href="${h.url_for_static('/css/bootstrap.min.css')}" type="text/css" media="screen, projection" />
================================================================
Commit: 762906da1ba23408b0dd16c5420b8cb27e53cc0a
https://github.com/okfn/ckan/commit/762906da1ba23408b0dd16c5420b8cb27e53cc0a
Author: Aron Carroll <self at aroncarroll.com>
Date: 2012-04-30 (Mon, 30 Apr 2012)
Changed paths:
M ckan/public/scripts/application.js
M ckan/templates/_util.html
M ckan/templates/package/related_list.html
Log Message:
-----------
Refactor related delete button
Removed the inline click handlers and moved the JavaScript into
application.js. Also remove the item with JavaScript rather than reload
the page.
diff --git a/ckan/public/scripts/application.js b/ckan/public/scripts/application.js
index 0d3628e..5614ada 100644
--- a/ckan/public/scripts/application.js
+++ b/ckan/public/scripts/application.js
@@ -1145,8 +1145,22 @@ CKAN.Utils = function($, my) {
$('<div class="alert alert-error" />').html(msg).hide().prependTo(form).fadeIn();
}
+ function relatedRequest(action, method, data) {
+ return $.ajax({
+ type: method,
+ dataType: 'json',
+ contentType: 'application/json',
+ url: CKAN.SITE_URL + '/api/3/action/related_' + action,
+ data: data ? JSON.stringify(data) : undefined,
+ error: function(err, txt, w) {
+ // This needs to be far more informative.
+ addAlert('<strong>Error:</strong> Unable to ' + action + ' related item');
+ }
+ });
+ }
+
// Center thumbnails vertically.
- $('.related-items').each(function () {
+ var relatedItems = $('.related-items').each(function () {
var item = $(this);
function vertiallyAlign() {
@@ -1164,6 +1178,15 @@ CKAN.Utils = function($, my) {
item.find('.description').truncate();
});
+ // Add a handler for the delete buttons.
+ relatedItems.on('click', '[data-action=delete]', function (event) {
+ var id = $(this).data('relatedId');
+ relatedRequest('delete', 'POST', {id: id}).done(function () {
+ $('#related-item-' + id).remove();
+ });
+ event.preventDefault();
+ });
+
$(form).submit(function (event) {
event.preventDefault();
@@ -1186,18 +1209,10 @@ CKAN.Utils = function($, my) {
return;
}
- $.ajax({
- type: this.method,
- url: CKAN.SITE_URL + '/api/3/action/related_create',
- data: JSON.stringify(data),
- success: function (data) {
- window.location.reload();
- },
- error: function(err, txt, w) {
- // This needs to be far more informative.
- addAlert('<strong>Error:</strong> Unable to add related item');
- }
- });
+ relatedRequest('create', this.method, data).done(function () {
+ // TODO: Insert item dynamically.
+ window.location.reload();
+ });
});
};
diff --git a/ckan/templates/_util.html b/ckan/templates/_util.html
index 5aa7c07..8c29918 100644
--- a/ckan/templates/_util.html
+++ b/ckan/templates/_util.html
@@ -126,16 +126,16 @@
<py:def function="related_summary(related)">
- <li class="span3">
+ <li id="related-item-${related.id}" class="span3">
<div class="thumbnail">
- <button py:if="c.user and (c.userobj.id == related.owner_id or h.check_access('package_update',{'id':c.pkg.id}))" class="close" onclick="related_delete('${related.id}');">×</button>
+ <button py:if="c.user and (c.userobj.id == related.owner_id or h.check_access('package_update',{'id':c.pkg.id}))" class="close" data-action="delete" data-related-id="${related.id}">×</button>
<a href="${related.url}" class="image">
<img src="${related.image_url}" width="210" py:if="related.image_url" />
<img src="/images/photo-placeholder.png" width="210" py:if="not related.image_url" />
</a>
<div class="caption">
<h5 class="heading" title="${related.title}">${h.markdown_extract(related.title, extract_length=30)}</h5>
- <div class="description" data-truncate="60" py:if="related.description">${h.markdown_extract(related.description, extract_length=1000)}</div>
+ <div class="description" data-truncate="55" py:if="related.description">${h.markdown_extract(related.description, extract_length=1000)}</div>
<i class="empty" py:if="not related.description">No description for this item</i>
<p class="read-more"><a href="${related.url}">View this related item</a></p>
</div>
diff --git a/ckan/templates/package/related_list.html b/ckan/templates/package/related_list.html
index baced80..49a75ea 100644
--- a/ckan/templates/package/related_list.html
+++ b/ckan/templates/package/related_list.html
@@ -40,25 +40,6 @@
</div>
<py:def function="optional_head">
- <script type="text/javascript" py:if="c.user">
- function related_delete(related_id) {
- var data = { 'id' : related_id }
- $.ajax({
- type: "post",
- url: CKAN.SITE_URL + '/api/3/action/related_delete',
- data: JSON.stringify(data),
- success: function (data) {
- window.location.reload();
- },
- error: function(err, txt, w) {
- // This needs to be far more informative.
- var msg = '<strong>Error:</strong> Unable to delete related item';
- $('<div class="alert alert-error" />').html(msg).hide().prependTo($('div#main')).fadeIn();
- }
- });
-
- }
- </script>
<py:if test="config.get('rdf_packages')">
<link rel="alternate" type="application/rdf+xml" title="RDF/XML" href="${config['rdf_packages'] + '/' + c.pkg.id + '.rdf' }" />
<link rel="alternate" type="application/turtle" title="RDF/Turtle" href="${config['rdf_packages'] + '/' + c.pkg.id + '.ttl' }" />
================================================================
Commit: 2379ee908e45502ef0adcb9c51738ec0b28bb4ed
https://github.com/okfn/ckan/commit/2379ee908e45502ef0adcb9c51738ec0b28bb4ed
Author: Aron Carroll <self at aroncarroll.com>
Date: 2012-04-30 (Mon, 30 Apr 2012)
Changed paths:
M ckan/public/css/style.css
M ckan/public/scripts/application.js
Log Message:
-----------
[2204] Related items description expands without breaking the grid
diff --git a/ckan/public/css/style.css b/ckan/public/css/style.css
index 283f5d3..e63766e 100644
--- a/ckan/public/css/style.css
+++ b/ckan/public/css/style.css
@@ -1413,10 +1413,20 @@ body.editresources .error-explanation {
color: #808080;
}
+.thumbnails li {
+ z-index: 0;
+ position: relative;
+ background-color: #fff;
+}
+
.thumbnails li:nth-of-type(5n) {
clear: left;
}
+.thumbnails li.expanded-description {
+ z-index: 1;
+}
+
.thumbnail .heading {
font-weight: bold;
}
diff --git a/ckan/public/scripts/application.js b/ckan/public/scripts/application.js
index 5614ada..27925a5 100644
--- a/ckan/public/scripts/application.js
+++ b/ckan/public/scripts/application.js
@@ -133,10 +133,18 @@ CKAN.Utils = CKAN.Utils || {};
jQuery.fn.truncate = function (max, suffix) {
return this.each(function () {
var element = jQuery(this),
- cached = element.text(),
- length = max || element.data('truncate') || 30,
- text = cached.slice(0, length),
- expand = jQuery('<a href="#" />').text(suffix || '»');
+ isTruncated = element.hasClass('truncated'),
+ cached, length, text, expand;
+
+ if (isTruncated) {
+ element.html(element.data('truncate:' + (max === 'expand' ? 'original' : 'truncated')));
+ return;
+ }
+
+ cached = element.text();
+ length = max || element.data('truncate') || 30;
+ text = cached.slice(0, length);
+ expand = jQuery('<a href="#" />').text(suffix || '»');
// Try to truncate to nearest full word.
while ((/\S/).test(text[text.length - 1])) {
@@ -144,12 +152,15 @@ jQuery.fn.truncate = function (max, suffix) {
}
element.html(jQuery.trim(text));
-
expand.appendTo(element.append(' '));
expand.click(function (event) {
event.preventDefault();
- element.text(cached);
+ element.html(cached);
});
+
+ element.addClass('truncated');
+ element.data('truncate:original', cached);
+ element.data('truncate:truncated', element.html());
});
};
@@ -1160,8 +1171,9 @@ CKAN.Utils = function($, my) {
}
// Center thumbnails vertically.
- var relatedItems = $('.related-items').each(function () {
- var item = $(this);
+ var relatedItems = $('.related-items');
+ relatedItems.find('li').each(function () {
+ var item = $(this), description = item.find('.description');
function vertiallyAlign() {
var img = $(this),
@@ -1175,7 +1187,21 @@ CKAN.Utils = function($, my) {
}
item.find('img').load(vertiallyAlign);
- item.find('.description').truncate();
+ description.data('height', description.height()).truncate();
+ });
+
+ relatedItems.on('mouseenter mouseleave', '.description.truncated', function (event) {
+ var isEnter = event.type === 'mouseenter',
+ description = $(this),
+ parent = description.parents('li:first'),
+ difference = description.data('height') - description.height();
+
+ description.truncate(isEnter ? 'expand' : 'collapse');
+ parent.toggleClass('expanded-description', isEnter);
+
+ // Adjust the bottom margin of the item relative to it's current value
+ // to allow the description to expand without breaking the grid.
+ parent.css('margin-bottom', isEnter ? '-=' + difference + 'px' : '');
});
// Add a handler for the delete buttons.
================================================================
Commit: 29028181dbbb1fe1209b52b02ebcaf71d440166f
https://github.com/okfn/ckan/commit/29028181dbbb1fe1209b52b02ebcaf71d440166f
Author: Aron Carroll <self at aroncarroll.com>
Date: 2012-04-30 (Mon, 30 Apr 2012)
Changed paths:
M ckan/public/scripts/application.js
Log Message:
-----------
[2204] jQuery.fn.truncate() skips short text
If the text is shorter than the max length then the plugin will skip
the element.
diff --git a/ckan/public/scripts/application.js b/ckan/public/scripts/application.js
index 27925a5..d81c209 100644
--- a/ckan/public/scripts/application.js
+++ b/ckan/public/scripts/application.js
@@ -146,6 +146,11 @@ jQuery.fn.truncate = function (max, suffix) {
text = cached.slice(0, length);
expand = jQuery('<a href="#" />').text(suffix || '»');
+ // Bail early if there is nothing to truncate.
+ if (cached.length < length) {
+ return;
+ }
+
// Try to truncate to nearest full word.
while ((/\S/).test(text[text.length - 1])) {
text = text.slice(0, text.length - 1);
================================================================
Commit: abcf0cf5507633e22df6c862dccb947c8ddb0cae
https://github.com/okfn/ckan/commit/abcf0cf5507633e22df6c862dccb947c8ddb0cae
Author: Aron Carroll <self at aroncarroll.com>
Date: 2012-04-30 (Mon, 30 Apr 2012)
Changed paths:
M ckan/public/css/style.css
Log Message:
-----------
[2204] Tidy up delete buttons
Now square with same border on all sides plus they only show on hover.
diff --git a/ckan/public/css/style.css b/ckan/public/css/style.css
index e63766e..6a3e840 100644
--- a/ckan/public/css/style.css
+++ b/ckan/public/css/style.css
@@ -1447,6 +1447,19 @@ body.editresources .error-explanation {
height: auto;
}
+.thumbnail .close {
+ padding-bottom: 7px;
+ padding-top: 2px;
+ position: relative;
+ top: -1px;
+ right: -1px;
+ display: none;
+}
+
+.thumbnail:hover .close {
+ display: block;
+}
+
.thumbnail .empty {
color: #ccc;
}
================================================================
Commit: dcb2432cd2f745faa92b7f0ffde2616cd18f659b
https://github.com/okfn/ckan/commit/dcb2432cd2f745faa92b7f0ffde2616cd18f659b
Author: Aron Carroll <self at aroncarroll.com>
Date: 2012-04-30 (Mon, 30 Apr 2012)
Changed paths:
M ckan/public/scripts/application.js
Log Message:
-----------
[2204] Add hover intent to description toggle
This prevents unwanted expansion of description text when mousing over
the page.
diff --git a/ckan/public/scripts/application.js b/ckan/public/scripts/application.js
index d81c209..4a34249 100644
--- a/ckan/public/scripts/application.js
+++ b/ckan/public/scripts/application.js
@@ -1196,17 +1196,34 @@ CKAN.Utils = function($, my) {
});
relatedItems.on('mouseenter mouseleave', '.description.truncated', function (event) {
- var isEnter = event.type === 'mouseenter',
- description = $(this),
- parent = description.parents('li:first'),
- difference = description.data('height') - description.height();
+ var isEnter = event.type === 'mouseenter'
+ description = $(this)
+ timer = description.data('hover-intent');
- description.truncate(isEnter ? 'expand' : 'collapse');
- parent.toggleClass('expanded-description', isEnter);
+ function update() {
+ var parent = description.parents('li:first'),
+ difference = description.data('height') - description.height();
- // Adjust the bottom margin of the item relative to it's current value
- // to allow the description to expand without breaking the grid.
- parent.css('margin-bottom', isEnter ? '-=' + difference + 'px' : '');
+ description.truncate(isEnter ? 'expand' : 'collapse');
+ parent.toggleClass('expanded-description', isEnter);
+
+ // Adjust the bottom margin of the item relative to it's current value
+ // to allow the description to expand without breaking the grid.
+ parent.css('margin-bottom', isEnter ? '-=' + difference + 'px' : '');
+ description.removeData('hover-intent');
+ }
+
+ if (!isEnter && timer) {
+ // User has moused out in the time set so cancel the action.
+ description.removeData('hover-intent');
+ return clearTimeout(timer);
+ } else if (!isEnter && !timer) {
+ update();
+ } else {
+ // Delay the hover action slightly to wait to see if the user mouses
+ // out again. This prevents unwanted actions.
+ description.data('hover-intent', setTimeout(update, 200));
+ }
});
// Add a handler for the delete buttons.
================================================================
Compare: https://github.com/okfn/ckan/compare/289a367^...dcb2432
More information about the ckan-changes
mailing list