sampotts / shr Goto Github PK

I thought changing the config to share_count would do the trick but it does not. I can see that local storage is storing this: (a snippit)

"facebook":{"share":{"comment_count":0,"share_count":3},

but your app never gets that share count of 3, instead it sees the count as zero.

Can you fix this?

Facebook counter doesn't display anymore.

this block of code here should be removed from the local storage test:

if ('localStorage' in window && window.localStorage !== null) {
        return false;
}

that is going to return false if something else already is using local storage, even thought it still is available for use. Remove that block and all will be fine.

Problem

YouTube subscribe is not supported.

Rationale

Adding a YouTube subscribe button would be awesome and allow users to see how many
people are subscribed to the channel, but also subscribe easily themselves. This would
work great for embedded videos.

Solution

I'll implement the YouTube subscribe button using the YouTube API. This will be dependent
upon expanding the config to allow for API keys and usernames.

Pros of Solution:

• Shr will have a button that will allow users to subscribe on YouTube. This is helpful for embedded videos.

Cons of Solution:

• Shr will handle more features, but is this something you want?

If you'd like to move forward, let me know and I'll submit a PR!

Demo doesnt work, neither does the package itself, needs polyfill for Object.assign etc but still fails to work.

prefixData function is called here but no longer exists.

Hi,

Thanks for this lib and the others, your work is very appreciated!
I was wonder, did you plan to publish shr on npm?

Bests 👍

Problem

When expanding to multiple networks, having values and prefixes in the default
config gets harder to read.

Rationale

Currently in the default config, there is an object named count, that has two keys (value, prefix).
These objects contain the keys in the JSON returned from the APIs to get the counts we are looking
for. As we expand social networks, some counts are not in the first or second hierarchy of the JSON
returned so we end up prefixing some of the prefixes. To structure it modularly and into separate methods,
will make it easier to scope the issue and expand. Also, if we are grabbing different counts from the
same source, this will allow us to access this data independently.

Solution

I will go through the code, take each social network, and make a method that calculates what is returned
for the screen data.

...
var defaults = {
    count: {
        ...
        value: {
            facebook: 'share_count',
            github: 'stargazers_count'
        },
        prefix: {
            github: 'data'
        },
    },
...

Will get removed and merged into separate methods scoped for the network.

Pros of Solution:

• Easier to add networks in the future
• Scope of the methods makes diagnosing problems much quicker
• Easier to find out what the code is doing.

Cons of Solution

• Minimal increase in code base size

If you have any questions, let me know. If you'd like to move forward, let me know
and I'll submit a PR!

Problem

We have a flag for incrementing the count on click. This doesn't update the storage so if I refresh the page my click isn't stored.

Rationale

It can be kind of misleading when I see an increment, refresh the page and it isn't there.

Solution

Update the storage if increment is set.

Pros of Solution:

Refreshing the page will show the new share.

Cons of Solution:

If I click and didn't share, then the number will be wrong and won't correct itself until the cache expires.

Let me know your thoughts on this and we can find a way to resolve this issue!

Problem

Shr has lots of cool buttons, I'll update the docs on how to use them all!

Rationale

Shr is beautiful and should be used more. Re-writing the docs and giving an example
for each element and how to initialize it will help adoption of Shr. Every new network
we add will have an example and allow other devs to implement with ease.

Solution

I'll write a whole bunch of documentation for implementing Shr

Pros of Solution:

• Developers will be able to integrate Shr easily and comfortably.

If you'd like to move forward, let me know and I'll submit a PR!

Problem

Shr only supports LESS, I'll write SASS to be used along with LESS.

Rationale

Really just another option for compilation. I happen to know SASS and can structure
it the same way that you have your LESS structured so other devs can contribute as
well or use in the situation they have their application written in.

Solution

I'll write the SASS code for Shr.

Pros of Solution:

• Another option for users who may be using SASS instead of LESS

If you'd like to move forward, let me know and I'll submit a PR!

Problem

When using Shr in a framework such as Foundation or Bootstrap, the .button CSS class
used to render Shr is bombarded with unwanted class styles that overwrite the Shr
styles.

Rationale

Frameworks such as Bootstrap and Foundation are very common and utilize the .button
class to style HTML elements. Shr uses this too. The problem is that the two classes
conflict with each other allowing the Shr buttons not to render correctly.

Solution

I'll re-scope the .button class to be .shr-button.

Pros of Solution:

• Can make Shr framework agnostic and be able to be used in all frameworks.

Cons of Solution

• Breaking change that would require the user to update CSS classes to be .shr-button

If you'd like to move forward, let me know and I'll submit a PR!

Problem

Code needs JSDoc comments for easy reading and documentation

Rationale

Utilizing JSDoc makes it easier to bring other developers on board and keeps
a standard for documenting code. This will help other contributors pick up the code and dive
right in. It also provides a baseline for how other contributors comment their features. The
standard is here: http://usejsdoc.org/

Solution

I will go through the existing Shr code, and comment all of the features and methods
using JSDoc.

Pros of Solution:

• Code gets commented and easy for contributors to pick up.

Cons of Solution

• Can take a little time to get used to the standards

Let me know if JSDoc is something you are interested in and I'll get it added and submit a PR

WhatsApp and Telegram (for groups and channels)

Hi Sam,

Your share buttons are the most beautiful social sharing buttons I have seen on the web. Job well done!

I apologize for my lack of knowledge when it comes to HTML/CSS, but I am having trouble getting started. I followed your instructions to the best of my knowledge, but I still cannot seem to get it to work. I get things to appear without any console errors, but from this point I'm not sure where to go:

How to reproduce my issue

• Here is a test URL if you want to see it on your end: http://toolshop.521hosting.net/shr/
• Here is a zip file of my code too.

I guess the good thing is that once I can figure it out, I am pretty sure anyone else can figure it out :-) Once I figure it out, I would love to submit a pull request with clear documentation on how to get started for newbies.

I know this is open source work too, so no rush! Whenever you have a free moment. Thanks again!

Problem

As we integrate more social networks, such as subscribe on Youtube, we might need
to account for public facing API keys or username data.

Rationale

As we expand more buttons, and use Shr for more features, just allowing the user
to pass in the proper API keys/username data will be extremely helpful.

Solution

I'll expand the config to allow for more buttons to be added by handling API keys,
user names, or other config options.

Pros of Solution:

• Shr will allow for more buttons to be added.

Cons of Solution:

• Shr will handle more featurs, but is this something you want?

If you'd like to move forward, let me know and I'll submit a PR!