vbatts/quay
Archived
1
0
Fork 0
Code Issues Pull requests Releases Wiki Activity

Add handling of twitter avatars: if they do not load, then a default image will be used

Browse source
This commit is contained in:
Joseph Schorr 2014-05-08 19:52:21 -04:00
parent f20e1d9c54
commit 78f6523068
4 changed files with 77 additions and 60 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

14
static/directives/twitter-view.html Normal file
View file

@ -0,0 +1,14 @@
<blockquote class="twitter-tweet" data-conversation="none" lang="en">
<p>
<span ng-transclude></span>
</p>
<div class="attribute">
<span class="info-wrap">
<span class="avatar"><img ng-src="{{ avatarUrl }}" fallback-src="/static/img/default-twitter.png"></span>
<span class="info">
<span class="author">{{ authorName }} (@{{authorUser}})</span>
<a class="reference" ng-href="{{ messageUrl }}">{{ messageDate }}</a>
</span>
</span>
</div>
</blockquote>

BIN
static/img/default-twitter.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 4.6 KiB

33
static/js/app.js
View file

@ -4352,6 +4352,27 @@ quayApp.directive('buildProgress', function () {
});
quayApp.directive('twitterView', function () {
var directiveDefinitionObject = {
priority: 0,
templateUrl: '/static/directives/twitter-view.html',
replace: false,
transclude: true,
restrict: 'C',
scope: {
'avatarUrl': '@avatarUrl',
'authorName': '@authorName',
'authorUser': '@authorUser',
'messageUrl': '@messageUrl',
'messageDate': '@messageDate'
},
controller: function($scope, $element) {
}
};
return directiveDefinitionObject;
});
quayApp.directive('notificationView', function () {
var directiveDefinitionObject = {
priority: 0,
@ -4747,6 +4768,18 @@ quayApp.directive('tagSpecificImagesView', function () {
});
quayApp.directive('fallbackSrc', function () {
return {
restrict: 'A',
link: function postLink(scope, element, attributes) {
element.bind('error', function() {
angular.element(this).attr("src", attributes.fallbackSrc);
});
}
};
});
// Note: ngBlur is not yet in Angular stable, so we add it manaully here.
quayApp.directive('ngBlur', function() {
return function( scope, elem, attrs ) {

90
static/partials/landing-normal.html
View file

@ -170,78 +170,48 @@
<div class="jcarousel">
<ul>
<li>
<blockquote class="twitter-tweet" data-conversation="none" lang="en">
<p>Pushing Dockerfile changes to Github and having <a href="https://twitter.com/quayio">@quayio</a> build the <a href="https://twitter.com/docker">@docker</a> image/container for you is extremely awesome.</p>
<div class="attribute">
<span class="info-wrap">
<span class="avatar"><img src="https://pbs.twimg.com/profile_images/3320588708/9237d8d056e9ce2fa737ea7ab2de345b_bigger.jpeg"></span>
<span class="info">
<span class="author">Ross Timson (@rosstimson)</span>
<a class="reference" href="https://twitter.com/rosstimson/statuses/451052618685882368">April 1, 2014</a>
</span>
</span>
</div>
</blockquote>
<div class="twitter-view" avatar-url="https://pbs.twimg.com/profile_images/3320588708/9237d8d056e9ce2fa737ea7ab2de345b_bigger.jpeg"
author-name="Ross Timson" author-user="rosstimson" message-url="https://twitter.com/rosstimson/statuses/451052618685882368"
message-date="April 1, 2014">
Pushing Dockerfile changes to Github and having <a href="https://twitter.com/quayio">@quayio</a> build the
<a href="https://twitter.com/docker">@docker</a> image/container for you is extremely awesome.
</div>
</li>
<li>
<blockquote class="twitter-tweet" data-conversation="none" lang="en">
<p><a href="https://twitter.com/quayio">@quayio</a> releases Docker build flair! <a href="http://t.co/72ULgveLj4">pic.twitter.com/72ULgveLj4</a></p>
<div class="attribute">
<span class="info-wrap">
<span class="avatar"><img src="https://pbs.twimg.com/profile_images/2578175278/ykn3l9ktfdy1hia5odij_bigger.jpeg"></span>
<span class="info">
<span class="author">Frank Macreery (@fancyremarker)</span>
<a href="https://twitter.com/fancyremarker/statuses/448528623692025857">March 25, 2014</a>
</span>
</span>
</div>
</blockquote>
<div class="twitter-view" avatar-url="https://pbs.twimg.com/profile_images/2578175278/ykn3l9ktfdy1hia5odij_bigger.jpeg"
author-name="Frank Macreery" author-user="fancyremarker" message-url="https://twitter.com/fancyremarker/statuses/448528623692025857"
message-date="March 25, 2014">
<a href="https://twitter.com/quayio">@quayio</a> releases Docker build flair! <a href="http://t.co/72ULgveLj4">pic.twitter.com/72ULgveLj4</a>
</div>
</li>
<li>
<blockquote class="twitter-tweet" data-conversation="none" lang="en">
<div class="attribute">
<p>Just started playing with <a href="https://twitter.com/quayio">@quayio</a> builds tied to <a href="https://twitter.com/search?q=%23github&amp;src=hash">#github</a> repo. Really liking it. My first experiment: <a href="https://t.co/2LgyagwTEq">https://t.co/2LgyagwTEq</a></p>
<span class="info-wrap">
<span class="avatar"><img src="https://pbs.twimg.com/profile_images/438406731660394496/UKGDY6xB_bigger.jpeg"></span>
<span class="info">
<span class="author">Joshua Goldie (@jdgoldie)</span>
<a href="https://twitter.com/jdgoldie/statuses/446622958040408064">March 20, 2014</a>
</span>
</span>
</div>
</blockquote>
<div class="twitter-view" avatar-url="https://pbs.twimg.com/profile_images/438406731660394496/UKGDY6xB_bigger.jpeg"
author-name="Joshua Goldie" author-user="jdgoldie" message-url="https://twitter.com/jdgoldie/statuses/446622958040408064"
message-date="March 20, 2014">
Just started playing with <a href="https://twitter.com/quayio">@quayio</a> builds tied to
<a href="https://twitter.com/search?q=%23github&amp;src=hash">#github</a> repo. Really liking it. My first experiment:
<a href="https://t.co/2LgyagwTEq">https://t.co/2LgyagwTEq</a>
</div>
</li>
<li>
<blockquote class="twitter-tweet" data-conversation="none" lang="en">
<div class="attribute">
<p>Great guys <a href="https://twitter.com/quayio">@quayio</a>. If you haven’t tried it, do.</p>
<span class="info-wrap">
<span class="avatar"><img src="https://pbs.twimg.com/profile_images/378800000731516813/e70eae6c4a2c25ae516660e958b3d36b_bigger.jpeg"></span>
<span class="info">
<span class="author">Evan Hazlett (@ehazlett)</span>
<a href="https://twitter.com/ehazlett/statuses/442351806161510400">March 8, 2014</a>
</span>
</span>
</div>
</blockquote>
<div class="twitter-view" avatar-url="https://pbs.twimg.com/profile_images/378800000731516813/e70eae6c4a2c25ae516660e958b3d36b_bigger.jpeg"
author-name="Evan Hazlett" author-user="ehazlett" message-url="https://twitter.com/ehazlett/statuses/442351806161510400"
message-date="March 8, 2014">
Great guys <a href="https://twitter.com/quayio">@quayio</a>. If you haven’t tried it, do.
</div>
</li>
<li>
<blockquote class="twitter-tweet" data-conversation="none" lang="en">
<div class="attribute">
<p><a href="https://twitter.com/quayio">@quayio</a> has awesome support. <a href="https://twitter.com/search?q=%23awesomeTool&amp;src=hash">#awesomeTool</a> <a href="https://twitter.com/search?q=%23awesomeTeam&amp;src=hash">#awesomeTeam</a></p>
<span class="info-wrap">
<span class="avatar"><img src="https://pbs.twimg.com/profile_images/463168904320122880/lQG69Wqk_bigger.jpeg"></span>
<span class="info">
<span class="author">Jon Morehouse (@JonMorehouse)</span>
<a href="https://twitter.com/JonMorehouse/statuses/441719785055739904">March 6, 2014</a>
</span>
</span>
</div>
</blockquote>
<div class="twitter-view" avatar-url="https://pbs.twimg.com/profile_images/463168904320122880/lQG69Wqk_bigger.jpeg"
author-name="Jon Morehouse" author-user="JonMorehouse" message-url="https://twitter.com/JonMorehouse/statuses/441719785055739904"
message-date="March 6, 2014">
<a href="https://twitter.com/quayio">@quayio</a> has awesome support.
<a href="https://twitter.com/search?q=%23awesomeTool&amp;src=hash">#awesomeTool</a>
<a href="https://twitter.com/search?q=%23awesomeTeam&amp;src=hash">#awesomeTeam</a>
</div>
</li>
</ul>
</div>