add social referral link

html/index.html

@@ -20,6 +20,7 @@
     <link rel="stylesheet" href="static/owl.theme.default.min.css">
     <link rel="stylesheet" href="static/scss/style.css">
     <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
+    <div id="fb-root"></div>
     <title>AI Spokesgirl</title>
 </head>
 

html/script_profiles.js

@@ -276,4 +276,12 @@ function deleteDraft(id) {
   }).catch(err => {
     console.log(err);
   });
-}
+}
+
+$('.share-email').click(function() {
+  var link = `mailto:me@example.com?subject=
+  ${encodeURIComponent("Check out Ai Spokesgirl")}
+  &body=${encodeURIComponent('I just created a video in 5 mniutes, check out this amazing video making tool. https://video.choozmo.com/')}`;
+    
+    window.location.href = link;
+})

html/user_profile2.html

@@ -20,6 +20,7 @@
     <link rel="stylesheet" href="static/owl.theme.default.min.css">
     <link rel="stylesheet" href="static/scss/style.css">
     <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
+    <script async defer crossorigin="anonymous" src="https://connect.facebook.net/zh_TW/sdk.js#xfbml=1&version=v12.0&appId=831591714123614&autoLogAppEvents=1" nonce="lDAd6vGz"></script>
     <title>AI Spokesgirl</title>
 </head>
 
@@ -231,10 +232,9 @@
                                        <p>signs up from your referral, we'll give you 3 more minutes free!</p>
                                        <div>
                                            <p style="color:#183790; font-size: 20px;" class="d-inline fw-bold">Share:</p>
-                                         
-                                           <a class="mx-4" href=""><img width="28" class="me-2" src="./static/img/userprofile/Icon awesome-facebook-square.png" alt="">Facebook</a>
-                                            <a class="mx-4" href=""><img width="28" class="me-2" src="./static/img/userprofile/Icon awesome-twitter-square.png" alt="">Twitter</a>
-                                            <a class="mx-4" href=""><img width="28" class="me-2" src="./static/img/userprofile/Icon material-email.png" alt="">Email</a>                                         
+                                           <div class="fb-share-button" data-href="https://video.choozmo.com/" data-layout="button" data-size="large"><a target="_blank" href="https://www.facebook.com/sharer/sharer.php?u=http%3A%2F%2Flocalhost%3A8080%2Fhtml%2Findex.html&amp;src=sdkpreparse" class="fb-xfbml-parse-ignore">分享</a></div>
+                                            <a class="mx-4" href="https://twitter.com/intent/tweet?text=I%20just%20created%20a%20video%20in%205%20minutes.%20Check%20it%20out%20%F0%9F%91%89%20https%3A%2F%2Fvideo.choozmo.com/&related=ai_cmm" target="_blank"><img width="28" class="me-2" src="./static/img/userprofile/Icon awesome-twitter-square.png" alt="">Twitter</a>
+                                            <a class="mx-4 share-email"><img width="28" class="me-2" src="./static/img/userprofile/Icon material-email.png" alt="">Email</a>                                         
                                        </div>
                                      
                                     </div>