Merge pull request #39 from leonhartX/support-bitbucket

add bitbucket login support

options/options.css

@@ -61,7 +61,7 @@
 .form .logout-container {
   display: none;
 }
-.form .ghe-login-container {
+.form .ghe-login-container, .form .bitbucket-login-container {
   display: none;
 }
 .form .error {

options/options.html

@@ -13,7 +13,7 @@ <h2>Logged in as: <a target="_blank" id="login-user">XXX</a></h2>
           <button id="logout">logout</button>
           <p class="warning">After logout, remember to delete the <a id="token" href="#">access token</a></p>
         </div>
-        <div class="login-container">
+        <div class="login-container github-login-container">
           <div class="login-item login-item-basic">
             <input id="username" type="text" placeholder="username"/>
             <p class="label">login with password:</p>
@@ -26,7 +26,7 @@ <h2>Logged in as: <a target="_blank" id="login-user">XXX</a></h2>
           </div>
           <button id="login">github login</button>
           <p class="label"><input type="checkbox" name="star" id="star">Star this extension on Github for support</p>
-          <p class="message">Using Github Enterprise? <a href="#">Login to Github Enterprise</a></p>
+          <p class="message">Switch to <a name="ghe" href="#">Github Enterprise</a> or <a name="bitbucket" href="#">Bitbucket</a></p>
           <p class="error" style="display: none">Can not create access token, please check your username and password.</p>
         </div>
         <div class="login-container ghe-login-container">
@@ -43,9 +43,20 @@ <h2>Logged in as: <a target="_blank" id="login-user">XXX</a></h2>
           </div>
           <button id="ghe-login">github enterprise login</button>
           <p class="message">Please star this extension on <a href="https://github.com/leonhartX/gas-github">Github</a> for support</p>
-          <p class="message">Using Github.com? <a href="#">Login to Github.com</a></p>
+          <p class="message">Switch to <a name="github" href="#">Github</a> or <a name="bitbucket" href="#">Bitbucket</a></p>
           <p class="error" style="display: none">Can not create access token, please check your GHE domain, username and password.</p>
         </div>
+
+        <div class="login-container bitbucket-login-container">
+          <div class="login-item login-item-basic">
+            <input id="bitbucket-username" type="text" placeholder="username"/>
+            <input id="bitbucket-email" type="email" placeholder="email"/>
+            <input id="bitbucket-password" type="password" placeholder="password"/>
+          </div>
+          <button id="bitbucket-login">bitbucket login</button>
+          <p class="message">Please star this extension on <a href="https://github.com/leonhartX/gas-github">Github</a> for support</p>
+          <p class="message">Switch to <a name="github" href="#">Github</a> or <a name="ghe" href="#">Github Enterprise</a></p>
+          <p class="error" style="display: none">Can not login, please check your username and password.</p>
       </div>
     </div>
   </body>

options/options.js

@@ -1,40 +1,52 @@
 "use strict";
 
 $(() => {
-  $('.message a').click(function(){
+  $('.message a').click(function(e){
     $('.error').hide();
-    $('.login-container').animate({height: 'toggle', opacity: 'toggle'}, 'slow');
+    $('.login-container').animate({height: 'hide', opacity: 'hide'}, 'slow');
+    $(`.${e.target.name}-login-container`).animate({height: 'show', opacity: 'show'}, 'slow');
   });
   $('#login').click((e) => {
     addCred(getGithubParam());
   });
   $('#ghe-login').click((e) => {
     addCred(getGHEParam());
   });
+  $('#bitbucket-login').click((e) => {
+    addCred(getBitbucketParam());
+  });
   $('#logout').click((e) => {
-    logoutGithub();
+    logout();
   });
 
   checkToken()
   .then((item) => {
     $('.login-container').hide();
     $('.logout-container').show();
-    let domain = '@Github.com';
-    let userLink = `https://github.com/${item.user}`;
-    let tokenLink = 'https://github.com/settings/tokens';
-    if (item.baseUrl !== 'https://api.github.com') {
-      let match = item.baseUrl.match(/:\/\/(.*)\/api\/v3/);
-      if (!match || !match[1]) {
-        domain = '';
-        userLink = '';
-        tokenLink = '';
-      } else {
-        domain = `@${match[1]}`;
-        userLink = `https://${match[1]}/${item.user}`;
-        tokenLink = `https://${match[1]}/settings/tokens`;
+    let user = item.user, domain, userLink, tokenLink;
+    if(item.scm !== 'bitbucket') {
+      domain = '@Github.com';
+      userLink = `https://github.com/${item.user}`;
+      tokenLink = 'https://github.com/settings/tokens';
+      if (item.baseUrl !== 'https://api.github.com') {
+        let match = item.baseUrl.match(/:\/\/(.*)\/api\/v3/);
+        if (!match || !match[1]) {
+          domain = '';
+          userLink = '';
+          tokenLink = '';
+        } else {
+          domain = `@${match[1]}`;
+          userLink = `https://${match[1]}/${item.user}`;
+          tokenLink = `https://${match[1]}/settings/tokens`;
+        }
       }
+    } else {
+      domain = '@Bitbucket.org';
+      userLink = `https://bitbucket.org/${user}`;
+      tokenLink = `https://bitbucket.org/account/user/${user}/api`;
     }
-    $('#login-user').text(`${item.user}${domain}`).attr('href', userLink);
+
+    $('#login-user').text(`${user}${domain}`).attr('href', userLink);
     $('#token').attr('href', tokenLink);
   })
   .catch((err) => {
@@ -43,12 +55,14 @@ $(() => {
 })
 
 function getGithubParam() {
+  const scm = 'github';
   const username = $('#username').val();
   const password = $('#password').val();
   const token = $('#accesstoken').val();
   const baseUrl = `https://api.github.com`;
   const otp = $('#otp').val();
   return {
+    scm,
     username,
     password,
     token,
@@ -58,12 +72,14 @@ function getGithubParam() {
 }
 
 function getGHEParam() {
+  const scm = 'github';
   const username = $('#ghe-username').val();
   const password = $('#ghe-password').val();
   const token = $('#ghe-accesstoken').val();
   const baseUrl = $('#ghe-url').val() + '/api/v3';
   const otp = $('#ghe-otp').val();
   return {
+    scm,
     username,
     password,
     token,
@@ -72,6 +88,21 @@ function getGHEParam() {
   };
 }
 
+function getBitbucketParam() {
+  const scm = 'bitbucket';
+  const username = $('#bitbucket-username').val();
+  const email = $('#bitbucket-email').val();
+  const password = $('#bitbucket-password').val();
+  const baseUrl = `https://api.bitbucket.org/2.0`;
+  return {
+    scm,
+    username,
+    email,
+    password,
+    baseUrl
+  }
+}
+
 function addCred(param) {
   if (param.username === '') {
     return;
@@ -80,11 +111,12 @@ function addCred(param) {
     return;
   }
 
-  if (param.password !== '') return loginGithub(param);
+  if (param.scm == 'bitbucket') return loginBitbucket(param);
+  if (param.password !== '' && param.scm == 'github') return loginGithub(param);
 
   addStar(param.token)
   .then(() => {
-    chrome.storage.sync.set({ user: param.username, token: param.token, baseUrl: param.baseUrl}, () => {
+    chrome.storage.sync.set({scm: param.scm, user: param.username, token: param.token, baseUrl: param.baseUrl}, () => {
       location.reload();
     });
     chrome.storage.local.get('tab', (item) => {
@@ -124,7 +156,7 @@ function loginGithub(param) {
   .done((response) => {
     addStar(response.token)
     .then(() => {
-      chrome.storage.sync.set({ scm: 'github', user: username, token: response.token, baseUrl: baseUrl}, () => {
+      chrome.storage.sync.set({scm: param.scm, user: username, token: response.token, baseUrl: baseUrl}, () => {
         location.reload();
       });
       chrome.storage.local.get('tab', (item) => {
@@ -145,7 +177,42 @@ function loginGithub(param) {
   })
 }
 
-function logoutGithub() {
+function loginBitbucket(param) {
+  const username = param.username;
+  const email = param.email;
+  const password = param.password;
+  const baseUrl = param.baseUrl;
+  const headers = {
+    Authorization: `Basic RmZIVE02ZnN5NDJQQlJDRjRQOmVDZDN0TTh5TUpUeTJSMld4bTJWUzZoYWVKdnpuNzdw`
+  }  
+  $.ajax({
+    url: 'https://bitbucket.org/site/oauth2/access_token',
+    headers: headers,
+    method: 'POST',
+    dataType: 'json',
+    contentType: 'application/x-www-form-urlencoded',
+    data: {
+      grant_type: 'password',
+      username: email,
+      password: password
+    }
+  })
+  .done((response) => {
+    chrome.storage.sync.set({scm: param.scm, user: username, token: response.refresh_token, baseUrl: baseUrl}, () => {
+      location.reload();
+    });
+    chrome.storage.local.get('tab', (item) => {
+      if(item.tab) {
+        chrome.tabs.reload(item.tab);
+      }
+    });
+  })
+  .fail(() => {
+    $('.error').show();
+  })
+}
+
+function logout() {
   chrome.storage.sync.remove(['scm', 'token', 'user', 'baseUrl'], () => {
     location.reload();
   });
@@ -158,7 +225,7 @@ function logoutGithub() {
 
 function checkToken() {
   return new Promise((resolve, reject) => {
-    chrome.storage.sync.get(['token', 'user', 'baseUrl'], (item) => {
+    chrome.storage.sync.get(['scm', 'token', 'user', 'baseUrl'], (item) => {
       if (item.token && item.token !== ''){
         resolve(item);
       }

src/gas-api.js

@@ -3,7 +3,7 @@
 class Gas {
   pull(code) {
     const changed = $('.diff-file:checked').toArray().map(e => e.value);
-    const update_promises = changed.filter(f => code.github[f])
+    const updatePromises = changed.filter(f => code.github[f])
     .map((file) => {
       const match = file.match(/(.*?)\.(gs|html)$/);
       if (!match || !match[1] || !match[2]) {
@@ -24,7 +24,7 @@ class Gas {
     })
     .filter(n => n != undefined);
 
-    const delete_promises = changed.filter(f => !code.github[f])
+    const deletePromises = changed.filter(f => !code.github[f])
     .map((file) => {
       const match = file.match(/(.*?)\.(gs|html)$/);
       if (!match || !match[1] || !match[2]) {
@@ -35,16 +35,16 @@ class Gas {
       return () => this.gasDeleteFile(name);
     });
 
-    if (update_promises.length === 0 && delete_promises.length === 0) {
+    if (updatePromises.length === 0 && deletePromises.length === 0) {
       showAlert('Nothing to do', LEVEL_WARN);
       return;
     }
 
     this.getGasContext()
     .then(() => {
-      return Promise.all(update_promises.map(f => f()))
+      return Promise.all(updatePromises.map(f => f()))
       .then(() => {
-        return Promise.all(delete_promises.map(f => f()));
+        return Promise.all(deletePromises.map(f => f()));
       })
     })
     .then(() => {

src/gas-hub.js

@@ -185,17 +185,15 @@ function initPageEvent() {
     let label;
     switch (type) {
       case 'repo' :
-        if (context.repo && target.text() === context.repo.name) return;
+        if (context.repo && target.text() === context.repo.fullName) return;
         //update context.repo with name and fullName
-        const name = target.text();
         const fullName = target.attr('data');
         content = {
-          name: name,
           fullName : fullName,
           gist: fullName === 'gist'
         }
-        label = name;
-        context.gist = content.gist
+        label = fullName;
+        context.gist = content.gist;
         break;
       case 'branch' :
         if (context[type] && target.text() === context[type]) return;
@@ -335,15 +333,15 @@ function showDiff(code, type) {
 
 function updateRepo(repos) {
   $('.repo-menu').empty().append('<div class="scm-new-repo scm-item goog-menuitem"><div class="goog-menuitem-content">Create new repo</div></div>');
-  $('.repo-menu').append('<div class="scm-use-gist scm-item goog-menuitem"><div class="goog-menuitem-content" scm-content="repo" data="gist">Using Gist</div></div>');
+  $('.repo-menu').append('<div class="scm-use-gist scm-item goog-menuitem"><div class="goog-menuitem-content" scm-content="repo" data="gist">gist</div></div>');
 
   repos.forEach((repo) => {
-    let content = `<div class="scm-item goog-menuitem"><div class="goog-menuitem-content" scm-content="repo" data="${repo.fullName}">${repo.name}</div></div>`
+    let content = `<div class="scm-item goog-menuitem"><div class="goog-menuitem-content" scm-content="repo" data="${repo}">${repo}</div></div>`
     $('.repo-menu').append(content);
   });
   if (context.repo) {
-    $('#scm-bind-repo').text(`Repo: ${context.repo.name}`);
-    return context.repo.name;
+    $('#scm-bind-repo').text(`Repo: ${context.repo.fullName}`);
+    return context.repo.fullName;
   }
   return null;
 }