Skip to content

Instantly share code, notes, and snippets.

@6qat
Created September 5, 2014 18:01
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save 6qat/fc52654556fca3831743 to your computer and use it in GitHub Desktop.
Save 6qat/fc52654556fca3831743 to your computer and use it in GitHub Desktop.
Creating Reusable Social Share Buttons // source http://jsbin.com/OMOgUzo/1
<!DOCTYPE html>
<html>
<head>
<meta name="description" content="Creating Reusable Social Share Buttons" />
<script src="http://code.jquery.com/jquery.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/handlebars.js/1.0.0/handlebars.js"></script>
<script src="http://builds.emberjs.com/ember-latest.js"></script>
<meta charset=utf-8 />
<title>JS Bin</title>
</head>
<body>
<script type="text/x-handlebars">
{{share-twitter data-url=url
data-text=text
data-size="large"
data-hashtags="emberjs"}}
</script>
<!-- Necessary for components -->
<script type="text/x-handlebars"
id="components/share-twitter"></script>
<script id="jsbin-javascript">
App = Ember.Application.create();
App.ApplicationController = Ember.Controller.extend({
url: 'http://emberjs.com/guides/cookbook',
text: 'The EmberJS Cookbook is amazing!'
});
App.ShareTwitterComponent = Ember.Component.extend({
tagName: 'a',
classNames: 'twitter-share-button',
attributeBindings: [
'data-size', 'data-url',
'data-text', 'data-hashtags'
],
displayButton: function() {
// Extracted from twitter share js
!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');
}.on('didInsertElement')
});
</script>
<script id="jsbin-source-html" type="text/html"><!DOCTYPE html>
<html>
<head>
<meta name="description" content="Creating Reusable Social Share Buttons" />
<script src="http://code.jquery.com/jquery.js"><\/script>
<script src="//cdnjs.cloudflare.com/ajax/libs/handlebars.js/1.0.0/handlebars.js"><\/script>
<script src="http://builds.emberjs.com/ember-latest.js"><\/script>
<meta charset=utf-8 />
<title>JS Bin</title>
</head>
<body>
<script type="text/x-handlebars">
{{share-twitter data-url=url
data-text=text
data-size="large"
data-hashtags="emberjs"}}
<\/script>
<\!-- Necessary for components -->
<script type="text/x-handlebars"
id="components/share-twitter"><\/script>
</body>
</html></script>
<script id="jsbin-source-javascript" type="text/javascript">App = Ember.Application.create();
App.ApplicationController = Ember.Controller.extend({
url: 'http://emberjs.com/guides/cookbook',
text: 'The EmberJS Cookbook is amazing!'
});
App.ShareTwitterComponent = Ember.Component.extend({
tagName: 'a',
classNames: 'twitter-share-button',
attributeBindings: [
'data-size', 'data-url',
'data-text', 'data-hashtags'
],
displayButton: function() {
// Extracted from twitter share js
!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');
}.on('didInsertElement')
});</script></body>
</html>
App = Ember.Application.create();
App.ApplicationController = Ember.Controller.extend({
url: 'http://emberjs.com/guides/cookbook',
text: 'The EmberJS Cookbook is amazing!'
});
App.ShareTwitterComponent = Ember.Component.extend({
tagName: 'a',
classNames: 'twitter-share-button',
attributeBindings: [
'data-size', 'data-url',
'data-text', 'data-hashtags'
],
displayButton: function() {
// Extracted from twitter share js
!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');
}.on('didInsertElement')
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment