Add Google Api URL shortener to share dialogue

assets/pwny.js

@@ -4,6 +4,7 @@
 
   var Pwny = function() {
     var self = this,
+        googleapikeys = {},
         getWidth = function(){return window.innerWidth;},
         window_min_width = 1000,
         LOCAL_STORAGE_TEMPLATE_NAME = 'codetest_templates',
@@ -27,6 +28,18 @@
 
     this.version = 3;
 
+    this.getGoogleApiKey = function(k) {
+      return googleapikeys[k];
+    };
+
+    this.getGoogleApiKeys = function() {
+      return googleapikeys;
+    };
+
+    this.setGoogleApiKeys = function(apikeys) {
+      googleapikeys = apikeys;
+    };
+
     this.append = function(element, target) {
       target = target || document.body;
       if (typeof target === 'string') target = document.querySelector(target);
@@ -440,6 +453,40 @@
         return input && typeof input === "object" && (input instanceof Array || (input.buffer && input.buffer instanceof ArrayBuffer));
     };
 
+    this.initGoogleApiKeys = function(cb) {
+      $.ajax({
+        url: 'googleapikeys.json',
+        method: "GET",
+      }).done(function(data){
+        self.setGoogleApiKeys(data);
+        if (cb) {
+          cb();
+        }
+      });
+    };
+
+    this.shortenUrl = function(longUrl, cb) {
+      var apikey = self.getGoogleApiKey('urlshortener');
+      if (!apikey) {
+        self.initGoogleApiKeys(function(){
+          self.shortenUrl(longUrl, cb);
+        });
+      } else {
+        $.ajax({
+          url: 'https://www.googleapis.com/urlshortener/v1/url?key=' + apikey,
+          method: "POST",
+          processData: false,
+          dataType: "json",
+          contentType: "application/json",
+          data: JSON.stringify({
+            "longUrl": longUrl
+          })
+        }).done(function(data){
+          cb(data);
+        });
+      }
+    };
+
     this.showShareWindow = function(link) {
       var $shareDialogue = $('#shareDialogue');
       var shareUrlBox = $shareDialogue.find('#shareUrlBox');
@@ -603,6 +650,21 @@
       btn_file.onclick = function(){
         file.click();
       };
+      $('#shortenUrlCheckbox').on('change', function(){
+        if (this.checked === true) {
+          self.shortenUrl($('#shareUrlBox').val(), function(data) {
+            if (data.kind === 'urlshortener#url') {
+              $('#shareUrlBox').val(data.id);
+            }
+          });
+        } else {
+          getShareableLink({}, function(err, link){
+            if (err === false) {
+              $('#shareUrlBox').val(link);
+            }
+          });
+        }
+      });
       $(window).on('hashchange', function(){window.location.reload();});
       self.loadFromHash();
     };

googleapikeys.json

+{
+  "urlshortener": ""
+}

index.html

@@ -242,6 +242,11 @@ html,body,#app{margin:0;padding:0;width:100%;height:100%;}
                 <button id="copyShareUrlButton" data-dismiss="modal" data-clipboard-target="#shareUrlBox" class="btn btn-success" type="button">Copy &amp; Close</button>
               </span>
             </div>
+            <div class="checkbox">
+              <label>
+               <input type="checkbox" id="shortenUrlCheckbox"> Shorten URL
+              </label>
+            </div>
           </div>
           <div class="modal-footer">
             <button type="button" class="btn btn-primary" data-dismiss="modal">Close</button>
@@ -258,5 +263,6 @@ html,body,#app{margin:0;padding:0;width:100%;height:100%;}
     <script src="assets/jquery/jquery-3.2.1.min.js"></script>
     <script src="assets/bootstrap/bootstrap.min.js"></script>
     <script src="assets/clipboard.min.js"></script>
+    <script src="https://apis.google.com/js/client.js?onload=googleApiLoaded"></script>
   </body>
 </html>