Merge pull request #8777 from edx/asadiqbal08/SOL-767_twitter_sharing

asadiqbal08/SOL-767: Students can share their certificate view on Twitter

common/test/acceptance/pages/lms/certificate_page.py

@@ -56,4 +56,4 @@ class CertificatePage(PageObject):
         """
         returns Facebook share button
         """
-        return self.q(css='a.action-share-facebook')
+        return self.q(css='button.action-share-facebook')

lms/envs/common.py

@@ -390,6 +390,8 @@ FEATURES = {
         'DASHBOARD_FACEBOOK': False,
         'CERTIFICATE_FACEBOOK': False,
         'CERTIFICATE_FACEBOOK_TEXT': None,
+        'CERTIFICATE_TWITTER': False,
+        'CERTIFICATE_TWITTER_TEXT': None,
         'DASHBOARD_TWITTER': False,
         'DASHBOARD_TWITTER_TEXT': None
     },

lms/templates/certificates/_accomplishment-banner.html

@@ -32,6 +32,13 @@ from django.core.urlresolvers import reverse
               Logger.log('edx.certificate.shared', data);
           });
       });
+
+      function popupWindow(url, title, width, height) {
+          // popup a window at center of the screen.
+          var left = (screen.width/2)-(width/2);
+          var top = (screen.height/2)-(height/2);
+          return window.open(url, title, 'toolbar=no, location=no, directories=no, status=no, menubar=no, scrollbars=yes, resizable=yes, width='+width+', height='+height+', top='+top+', left='+left);
+      }
   </script>
 </%block>
 <div id="fb-root"></div>
@@ -46,21 +53,34 @@ from django.core.urlresolvers import reverse
                     % if share_settings:
                       <%
                        facebook_share_text = _("I completed the {course_title} course on {platform_name}.").format(course_title=accomplishment_course_title, platform_name=platform_name)
+                       twitter_share_text = _("I completed a course on {platform_name}. Take a look at my certificate.").format(platform_name=platform_name)
+                       share_url = request.build_absolute_uri(reverse('cert_html_view', kwargs=dict(user_id=str(user.id),course_id=unicode(course_id))))
                        if share_settings.get('CERTIFICATE_FACEBOOK_TEXT', None):
                             facebook_share_text = share_settings.get('CERTIFICATE_FACEBOOK_TEXT')
+                       if share_settings.get('CERTIFICATE_TWITTER_TEXT', None):
+                            twitter_share_text = share_settings.get('CERTIFICATE_TWITTER_TEXT')
                       %>
                       % if share_settings.get('CERTIFICATE_FACEBOOK', False):
-                        <a href="javascript:void(0)"
+                        <button class="action action-share-facebook btn btn-overlay btn-small icon-only" id="action-share-facebook"
                            onclick="FaceBook.share({
                             share_text: '${facebook_share_text}',
-                            share_link: '${request.build_absolute_uri(reverse('cert_html_view', kwargs=dict(user_id=str(user.id),course_id=unicode(course_id))))}',
+                            share_link: '${share_url}',
                             picture_link: '${request.build_absolute_uri(course_image_url)}',
                             description: '${_('Click the link to see my certificate.')}'
-                            });"
+                            });">
-                           class="action action-share-facebook btn btn-overlay btn-small icon-only" id="action-share-facebook">
                             <i class="icon fa fa-facebook-official" aria-hidden="true"></i>
                             <span class="action-label">${_("Post on Facebook")}</span>
-                        </a>
+                        </button>
+                      %endif
+                      % if share_settings.get('CERTIFICATE_TWITTER', False):
+                      <% twitter_url = 'https://twitter.com/intent/tweet?text=' + twitter_share_text + '&url='+ share_url%>
+                        <button data-tooltip="${_('Share on Twitter')}"
+                          class="action action-share-twitter btn btn-overlay btn-small icon-only"
+                          title="${_('Share on Twitter')}"
+                          onclick="popupWindow('${twitter_url}', 'tweetWindow', 640, 480); return false;">
+                            <i class="icon fa fa-twitter" aria-hidden="true"></i>
+                            <span class="action-label">${_("Tweet this Accomplishment. Pop up window.")}</span>
+                        </button>
                       %endif
                     %endif