Have ideas to improve npm?Join in the discussion! »

    @codemotion/angular-disqus

    1.0.0 • Public • Published

    angular-disqus Build Status

    Getting started


    (1) Add angular-disqus to required modules list:

    const myApp = angular.module('myApp', [require(`@codemotion/angular-disqus`)]);

    (2) Register your shortname:

    This is the unique identifier assigned to your Disqus app, can be found on disqus.com > Admin. https://shortname.disqus.com

    myApp.config(function($disqusProvider){
        $disqusProvider.setShortname(shortname);
    });

    (3) Add comments to threads by using the disqus directive:

    <!-- directive can be used as an attribute -->
    <div disqus="id" title="title"></div>
     
    <!-- directive can be used as a class attribute -->
    <div class="disqus: id, title: title"></div>

    Additional Changes


    (1) Change hashPrefix: Disqus will only work on sites which use hashbang ( #! ). A valid url looks like this, http://localhost:8000/#!/home/comments/10

    Update config block liks this:

    myApp.config(function($disqusProvider, $locationProvider){
        $locationProvider.hashPrefix('!');
    })

    This changes your link from http://localhost:8000/#/home/comments/10 to the valid form above.

    (2) Register your user with SSO(Single Sign-On):

    Single sign-on (SSO) allows users to sign into a site and fully use Disqus Comments without again authenticating with Disqus. SSO will create a site-specific user profile on Disqus so as not to clash with existing users of Disqus. See more: https://help.disqus.com/customer/portal/articles/236206-single-sign-on

    myApp.run(function(disqusService){
        disqusService.setSso({
            remote_auth_s3: 'YOUR REMOTE AUTH',
            api_key: 'YOUR PUBLIC KEY'
        });
    });

    Disqus identifiers


    Disqus identifiers must be passed to the directive as as expressions. If the plan is to pass a variable then one must make sure that the variable is wrapped in ' apostrophes (disqus="'id'")

    Comment count


    Angular-disqus will display comment using the data-disqus-identifier attribute.

    Normal Link:

    <a href="#!/home/comments/10" data-disqus-identifier="randomString"></a>

    UI-Router:

    <a data-ui-sref="home.comments.view({id: video.id})" data-disqus-identifier="randomString"></a>

    This will replace the content of the anchor tag with given comment count.

    There is some talk of this in the disqus spec

    API


    1. $disqus#getShortname getter for the current shortname
    2. $disqus#comment will reset comments (or generate comments if needed)
    3. $disqusProvider#setShortname setter for shortname
    4. $loadCount initiates the thread comment count loading (generally should not be used)
    5. disqusService#setSso authenticate your user in the Disqus platform

    Keywords

    none

    Install

    npm i @codemotion/angular-disqus

    DownloadsWeekly Downloads

    2

    Version

    1.0.0

    License

    MIT

    Last publish

    Collaborators

    • avatar
    • avatar