Skip to content
This repository has been archived by the owner on Dec 1, 2018. It is now read-only.

Commit

Permalink
Merge branch 'master' of github.com:filamentgroup/SocialCount
Browse files Browse the repository at this point in the history
  • Loading branch information
@zachleat
zachleat committed Aug 26, 2014
2 parents 18acc20 + f00db3f commit fc652fa
Show file tree
Hide file tree
Showing 14 changed files with 661 additions and 102 deletions.
2 changes: 2 additions & 0 deletions .jenkins
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,2 @@
subdir: .
user: NONE
1 change: 0 additions & 1 deletion .travis.yml
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,3 @@
language: node_js
node_js:
- 0.8
- 0.10
1 change: 1 addition & 0 deletions Gruntfile.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -120,5 +120,6 @@ module.exports = function(grunt) {

// Default task.
grunt.registerTask( 'default', [ 'jshint', 'qunit' ] );
grunt.registerTask( 'stage', [ 'default' ]);
grunt.registerTask( 'release', [ 'clean', 'jshint', 'qunit', 'concat', 'uglify', 'cssmin', 'usebanner', 'copy', 'compress' ] );
};
8 changes: 4 additions & 4 deletions README.md
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
# SocialCount
# SocialCount [![Build Status](https://travis-ci.org/filamentgroup/SocialCount.png?branch=master)](https://travis-ci.org/filamentgroup/SocialCount)

[![Build Status](https://travis-ci.org/filamentgroup/SocialCount.png?branch=master)](https://travis-ci.org/filamentgroup/SocialCount)
[![Filament Group](http://filamentgroup.com/images/fg-logo-positive-sm-crop.png) ](http://www.filamentgroup.com/)

*Copyright (c) 2012 Filament Group, developed by [@zachleat](https://github.com/zachleat). MIT licensed.*

Expand All @@ -27,7 +27,7 @@ SocialCount is a small jQuery plugin for progressively enhanced, lazy loaded, mo

## [SocialCount Demo][demourl]

[demourl]: http://fgte.st/SocialCount/examples/index.html
[demourl]: http://master.origin.socialcount.fgtest.com/examples/

## Getting Started

Expand All @@ -45,7 +45,7 @@ The archive also contains the **optional** PHP service files for the AJAX reques

Customize the sample markup below or use the provided [markup generator][generator].

[generator]: http://fgte.st/SocialCount/examples/index.html#generator
[generator]: http://master.origin.socialcount.fgtest.com/examples/index.html#generator

<!-- Replace YOUR_CUSTOM_URL with the URL you're sharing -->

Expand Down
22 changes: 21 additions & 1 deletion examples/blog.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,13 +13,33 @@
html {
font: 100% Helvetica, sans-serif;
}
/* Logo */
.header {
background: #247201 url(/examples/headerbg-new.jpg) no-repeat bottom left;
}
#fg-logo {
text-indent: -9999px;
margin: 0 auto;
width: 287px;
height: 52px;
background-image: url(/examples/fg-logo-icon.png);
}
@media (-webkit-min-device-pixel-ratio: 1.5), (min-device-pixel-ratio: 1.5){
#fg-logo {
background-size: 287px 52px;
background-image: url(/examples/fg-logo-icon-lrg.png);
}
}
</style>
</head>
<body>
<div class="header">
<a href="http://filamentgroup.com/"><h1 id="fg-logo">Filament Group</h1></a>
</div>
<ul class="socialcount" data-url="http://www.filamentgroup.com/">
<li class="facebook"><a href="https://www.facebook.com/sharer/sharer.php?u=http://www.filamentgroup.com/" title="Share on Facebook"><span class="social-icon icon-facebook"></span><span class="count">Like</span></a></li>
<li class="twitter"><a href="https://twitter.com/intent/tweet?text=http://www.filamentgroup.com/" title="Share on Twitter"><span class="social-icon icon-twitter"></span><span class="count">Tweet</span></a></li>
<li class="googleplus"><a href="https://plus.google.com/share?url=http://www.filamentgroup.com/" title="Share on Google Plus"><span class="social-icon icon-googleplus"></span><span class="count">+1</span></a></li>
</ul>
</body>
</html>
</html>
41 changes: 35 additions & 6 deletions examples/control-test.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,7 @@
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>Social Count Default Buttons (Control Test)</title>
<link href="http://filamentgroup.github.io/demo-head/demohead.css" rel="stylesheet">
<style>
html {
font: 100% Helvetica, sans-serif;
Expand All @@ -14,14 +15,42 @@
box-sizing: border-box;
}
</style>
<script src="http://filamentgroup.github.io/demo-head/loadfont.js"></script>
</head>
<body>
<h2><a href="index.html">Back to Examples</a></h2>
<h2>Default Buttons (Control Test)</h2>
<iframe src="//www.facebook.com/plugins/like.php?href=http://www.google.com/&amp;send=false&amp;layout=button_count&amp;width=100&amp;show_faces=true&amp;action=like&amp;colorscheme=light&amp;font=arial&amp;height=21" style="width: 100px; height: 21px" scrolling="no" frameborder="0" style="border:none; overflow:hidden;" allowTransparency="true"></iframe>
<a href="https://twitter.com/share" class="twitter-share-button" data-url="http://www.google.com/" data-count="none" data-dnt="true">Tweet</a>
<div class="g-plusone" data-size="medium" data-annotation="none"></div>
<div class="demo-header">
<div class="company">
<img src="http://filamentgroup.com/images/fg-logo-positive-sm-crop.png">
</div>
<div class="details">
<h1 class="description-container">Demo of <span class="repo-name">SocialCount</span>
<span class="description">Simple barebones project to show share counts from various social networks.</span>
</h1>
<ul class="outbound-links">
<li><a href="https://github.com/filamentgroup/SocialCount">Code</a></li>
<li><a href="http://filamentgroup.com/lab/socialcount.html">Article</a></li>
<li><a href="https://github.com/filamentgroup/SocialCount/issues">Issues</a></li>
</ul>
</div>
</div>
<div class="nav-container">
<div class="docs-globalnav">
<nav class="docs-nav">
<a href="index.html">Medium (Default)</a>
<a href="small.html">Small</a>
<a href="large.html">Large</a>
<a href="markup-generator.html">Markup Generator</a>
<a href="control-test.html" class="current">Default Buttons (Control Test for comparison)</a>
</nav>
</div>
</div>
<div class="docs-main">
<h2>Default Buttons (Control Test)</h2>
<iframe src="//www.facebook.com/plugins/like.php?href=http://www.google.com/&amp;send=false&amp;layout=button_count&amp;width=100&amp;show_faces=true&amp;action=like&amp;colorscheme=light&amp;font=arial&amp;height=21" style="width: 100px; height: 21px" scrolling="no" frameborder="0" style="border:none; overflow:hidden;" allowTransparency="true"></iframe>
<a href="https://twitter.com/share" class="twitter-share-button" data-url="http://www.google.com/" data-count="none" data-dnt="true">Tweet</a>
<div class="g-plusone" data-size="medium" data-annotation="none"></div>
</div>
<script src="//platform.twitter.com/widgets.js"></script>
<script src="//apis.google.com/js/plusone.js"></script>
</body>
</html>
</html>
Binary file added examples/fg-logo-icon-lrg.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added examples/fg-logo-icon.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added examples/headerbg-new.jpg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
144 changes: 56 additions & 88 deletions examples/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,7 @@
<link rel="stylesheet" href="../src/socialcount.css">
<link rel="stylesheet" href="../src/socialcount-icons.css">
<link rel="stylesheet" href="../src/socialcount.pinterest.css">
<link rel="stylesheet" href="http://filamentgroup.github.io/demo-head/demohead.css">
<!-- scripts would be better placed below near the </body> -->
<script src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
<script src="../src/socialcount.js"></script>
Expand Down Expand Up @@ -61,6 +62,9 @@
height: 200px;
tab-size: 2;
}
h4 {
margin-bottom: .66em;
}
</style>
<script>
$(function() {
Expand Down Expand Up @@ -116,101 +120,65 @@
});
});
</script>
<script src="http://filamentgroup.github.io/demo-head/loadfont.js"></script>
</head>
<body>
<h1>SocialCount Examples</h1>
Did you follow a direct link to this example? You may want to return to <a href="http://github.com/filamentgroup/SocialCount/">SocialCount's GitHub page</a>.
<ul>
<li><a href="#default">Medium (Default)</a></li>
<li><a href="#small">Small</a></li>
<li><a href="#large">Large</a></li>
<li><a href="#generator">Markup Generator</a></li>
<li><a href="control-test.html">Default Buttons (Control Test for comparison)</a></li>
</ul>
<h2 id="default">Medium (Default)</h2>
<ul class="socialcount" data-url="http://www.google.com/" data-share-text="My Custom Share Text">
<li class="facebook"><a href="https://www.facebook.com/sharer/sharer.php?u=http://www.google.com/" title="Share on Facebook"><span class="social-icon icon-facebook"></span><span class="count">Like</span></a></li>
<li class="twitter"><a href="https://twitter.com/intent/tweet?text=http://www.google.com/" title="Share on Twitter"><span class="social-icon icon-twitter"></span><span class="count">Tweet</span></a></li>
<li class="googleplus"><a href="https://plus.google.com/share?url=http://www.google.com/" title="Share on Google Plus"><span class="social-icon icon-googleplus"></span><span class="count">+1</span></a></li>
</ul>

<h4>with Facebook Recommend</h4>
<ul class="socialcount" data-url="http://www.google.com/" data-facebook-action="recommend">
<li class="facebook"><a href="https://www.facebook.com/sharer/sharer.php?u=http://www.google.com/" title="Share on Facebook"><span class="social-icon icon-facebook"></span><span class="count">Recommend</span></a></li>
<li class="twitter"><a href="https://twitter.com/intent/tweet?text=http://www.google.com/" title="Share on Twitter"><span class="social-icon icon-twitter"></span><span class="count">Tweet</span></a></li>
<li class="googleplus"><a href="https://plus.google.com/share?url=http://www.google.com/" title="Share on Google Plus"><span class="social-icon icon-googleplus"></span><span class="count">+1</span></a></li>
</ul>

<h4>with Counts</h4>
<ul class="socialcount" data-url="http://www.google.com/" data-counts="true">
<li class="facebook"><a href="https://www.facebook.com/sharer/sharer.php?u=http://www.google.com/" title="Share on Facebook"><span class="social-icon icon-facebook"></span><span class="count">Like</span></a></li>
<li class="twitter"><a href="https://twitter.com/intent/tweet?text=http://www.google.com/" title="Share on Twitter"><span class="social-icon icon-twitter"></span><span class="count">Tweet</span></a></li>
<li class="googleplus"><a href="https://plus.google.com/share?url=http://www.google.com/" title="Share on Google Plus"><span class="social-icon icon-googleplus"></span><span class="count">+1</span></a></li>
</ul>

<h2>with Pinterest</h2>
<ul class="socialcount" data-url="http://www.google.com/" data-share-text="My Custom Share Text" data-media="http://upload.wikimedia.org/wikipedia/commons/3/30/Googlelogo.png" data-description="Google Logo">
<li class="facebook"><a href="https://www.facebook.com/sharer/sharer.php?u=http://www.google.com/" title="Share on Facebook"><span class="social-icon icon-facebook"></span><span class="count">Like</span></a></li>
<li class="twitter"><a href="https://twitter.com/intent/tweet?text=http://www.google.com/" title="Share on Twitter"><span class="social-icon icon-twitter"></span><span class="count">Tweet</span></a></li>
<li class="googleplus"><a href="https://plus.google.com/share?url=http://www.google.com/" title="Share on Google Plus"><span class="social-icon icon-googleplus"></span><span class="count">+1</span></a></li>
<li class="pinterest"><a title="Pin It"><span class="social-icon icon-pinterest"></span><span class="count">Pin It</span></a></li>
</ul>
<div class="demo-header">
<div class="company">
<img src="http://filamentgroup.com/images/fg-logo-positive-sm-crop.png">
</div>
<div class="details">
<h1 class="description-container">Demo of <span class="repo-name">SocialCount</span>
<span class="description">Simple barebones project to show share counts from various social networks.</span>
</h1>
<ul class="outbound-links">
<li><a href="https://github.com/filamentgroup/SocialCount">Code</a></li>
<li><a href="http://filamentgroup.com/lab/socialcount.html">Article</a></li>
<li><a href="https://github.com/filamentgroup/SocialCount/issues">Issues</a></li>
</ul>
</div>
</div>
<div class="nav-container">
<div class="docs-globalnav">
<nav class="docs-nav">
<a href="index.html" class="current">Medium (Default)</a>
<a href="small.html">Small</a>
<a href="large.html">Large</a>
<a href="markup-generator.html">Markup Generator</a>
<a href="control-test.html">Default Buttons (Control Test for comparison)</a>
</nav>
</div>
</div>
<div class="docs-main">
<h2 id="default">Medium (Default)</h2>
<ul class="socialcount" data-url="http://www.google.com/" data-share-text="My Custom Share Text">
<li class="facebook"><a href="https://www.facebook.com/sharer/sharer.php?u=http://www.google.com/" title="Share on Facebook"><span class="social-icon icon-facebook"></span><span class="count">Like</span></a></li>
<li class="twitter"><a href="https://twitter.com/intent/tweet?text=http://www.google.com/" title="Share on Twitter"><span class="social-icon icon-twitter"></span><span class="count">Tweet</span></a></li>
<li class="googleplus"><a href="https://plus.google.com/share?url=http://www.google.com/" title="Share on Google Plus"><span class="social-icon icon-googleplus"></span><span class="count">+1</span></a></li>
</ul>

<h2 id="small">Small</h2>
<ul class="socialcount socialcount-small" data-url="http://www.google.com/" data-facebook-action="recommend">
<li class="facebook"><a href="https://www.facebook.com/sharer/sharer.php?u=http://www.google.com/" title="Share on Facebook"><span class="social-icon icon-facebook"></span><span class="count"></span></a></li>
<li class="twitter"><a href="https://twitter.com/intent/tweet?text=http://www.google.com/" title="Share on Twitter"><span class="social-icon icon-twitter"></span><span class="count"></span></a></li>
<li class="googleplus"><a href="https://plus.google.com/share?url=http://www.google.com/" title="Share on Google Plus"><span class="social-icon icon-googleplus"></span><span class="count"></span></a></li>
</ul>
<h4>with Facebook Recommend</h4>
<ul class="socialcount" data-url="http://www.google.com/" data-facebook-action="recommend">
<li class="facebook"><a href="https://www.facebook.com/sharer/sharer.php?u=http://www.google.com/" title="Share on Facebook"><span class="social-icon icon-facebook"></span><span class="count">Recommend</span></a></li>
<li class="twitter"><a href="https://twitter.com/intent/tweet?text=http://www.google.com/" title="Share on Twitter"><span class="social-icon icon-twitter"></span><span class="count">Tweet</span></a></li>
<li class="googleplus"><a href="https://plus.google.com/share?url=http://www.google.com/" title="Share on Google Plus"><span class="social-icon icon-googleplus"></span><span class="count">+1</span></a></li>
</ul>

<h2 id="large">Large</h2>
<h4>with Facebook Recommend</h4>
<ul class="socialcount socialcount-large" data-url="http://www.google.com/" data-facebook-action="recommend">
<li class="facebook"><a href="https://www.facebook.com/sharer/sharer.php?u=http://www.google.com/" title="Share on Facebook"><span class="social-icon icon-facebook"></span><span class="count">Like</span></a></li>
<li class="twitter"><a href="https://twitter.com/intent/tweet?text=http://www.google.com/" title="Share on Twitter"><span class="social-icon icon-twitter"></span><span class="count">Tweet</span></a></li>
<li class="googleplus"><a href="https://plus.google.com/share?url=http://www.google.com/" title="Share on Google Plus"><span class="social-icon icon-googleplus"></span><span class="count">+1</span></a></li>
</ul>
<h4>with Counts</h4>
<ul class="socialcount" data-url="http://www.google.com/" data-counts="true">
<li class="facebook"><a href="https://www.facebook.com/sharer/sharer.php?u=http://www.google.com/" title="Share on Facebook"><span class="social-icon icon-facebook"></span><span class="count">Like</span></a></li>
<li class="twitter"><a href="https://twitter.com/intent/tweet?text=http://www.google.com/" title="Share on Twitter"><span class="social-icon icon-twitter"></span><span class="count">Tweet</span></a></li>
<li class="googleplus"><a href="https://plus.google.com/share?url=http://www.google.com/" title="Share on Google Plus"><span class="social-icon icon-googleplus"></span><span class="count">+1</span></a></li>
</ul>

<h4>with Narrow Container Width and Counts</h4>
<div style="width: 105px">
<ul class="socialcount socialcount-large" data-url="http://www.google.com/" data-counts="true">
<li class="facebook"><a href="https://www.facebook.com/sharer/sharer.php?u=http://www.google.com/" title="Share on Facebook"><span class="social-icon icon-facebook"></span><span class="count">Recommend</span></a></li>
<h4>with Pinterest</h4>
<ul class="socialcount" data-url="http://www.google.com/" data-share-text="My Custom Share Text" data-media="http://upload.wikimedia.org/wikipedia/commons/3/30/Googlelogo.png" data-description="Google Logo">
<li class="facebook"><a href="https://www.facebook.com/sharer/sharer.php?u=http://www.google.com/" title="Share on Facebook"><span class="social-icon icon-facebook"></span><span class="count">Like</span></a></li>
<li class="twitter"><a href="https://twitter.com/intent/tweet?text=http://www.google.com/" title="Share on Twitter"><span class="social-icon icon-twitter"></span><span class="count">Tweet</span></a></li>
<li class="googleplus"><a href="https://plus.google.com/share?url=http://www.google.com/" title="Share on Google Plus"><span class="social-icon icon-googleplus"></span><span class="count">+1</span></a></li>
<li class="pinterest"><a title="Pin It"><span class="social-icon icon-pinterest"></span><span class="count">Pin It</span></a></li>
</ul>
</div>

<form>
<h2 id="generator">Markup Generator</h2>
<fieldset>
<label>URL <input type="text" id="url" value="http://www.google.com/"></label>
</fieldset>
<fieldset>
<legend>Size</legend>
<label><input type="radio" name="size" id="size-small"> Small</label>
<label><input type="radio" name="size" checked> Default</label>
<label><input type="radio" name="size" id="size-large"> Large</label>
</fieldset>
<fieldset>
<legend>Facebook</legend>
<label><input type="radio" name="facebook" checked> Like</label>
<label><input type="radio" name="facebook" id="fb-recommend"> Recommend</label>
</fieldset>
<fieldset>
<label>Twitter Share Text <input type="text" id="sharetext" value="Google is a search engine"></label>
</fieldset>
<fieldset>
<label><input type="checkbox" name="size" id="counts-show"> Fetch Share Counts</label>
</fieldset>
<fieldset>
<label><input type="checkbox" name="size" id="icons"> Include Icons</label>
</fieldset>
<fieldset>
<input type="submit" value="Generate Markup">
</fieldset>
<fieldset>
<textarea id="markup"></textarea>
</fieldset>
</form>
</div>
</body>
</html>
</html>
Loading

0 comments on commit fc652fa

Please sign in to comment.