docs: update links and code styles

fengyuanchen · fengyuanchen · commit c5e307709516 · 2018-06-30T16:28:15.000+08:00
diff --git a/docs/index.html b/docs/index.html
@@ -35,7 +35,7 @@
           <a class="nav-link" href="https://github.com/fengyuanchen/jquery-cropper" data-toggle="tooltip" title="View the GitHub project">GitHub</a>
           <a class="nav-link" href="https://fengyuanchen.github.io/cropperjs" data-toggle="tooltip" title="JavaScript image cropper">Cropper.js</a>
           <a class="nav-link" href="https://fengyuanchen.github.io" data-toggle="tooltip" title="More projects">More</a>
-          <a class="nav-link" href="http://chenfengyuan.com" data-toggle="tooltip" title="About the author">About</a>
+          <a class="nav-link" href="https://chenfengyuan.com" data-toggle="tooltip" title="About the author">About</a>
         </nav>
       </div>
     </div>
@@ -51,7 +51,7 @@ <h1>jquery-cropper <small class="h6">v1.0.0</small></h1>
         </div>
         <div class="col-md">
           <div class="carbonads">
-            <script id="_carbonads_js" src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=fengyuanchen" async></script>
+            <script id="_carbonads_js" src="//cdn.carbonads.com/carbon.js?serve=CKYI55Q7&placement=fengyuanchengithubio" async></script>
           </div>
         </div>
       </div>
@@ -559,7 +559,7 @@ <h5 class="modal-title" id="getCroppedCanvasTitle">Cropped</h5>
       <nav class="nav flex-wrap justify-content-center mb-3">
         <a class="nav-link" href="https://github.com/fengyuanchen/jquery-cropper">GitHub</a>
         <a class="nav-link" href="https://github.com/fengyuanchen/jquery-cropper/blob/master/LICENSE">License</a>
-        <a class="nav-link" href="http://chenfengyuan.com">About</a>
+        <a class="nav-link" href="https://chenfengyuan.com">About</a>
       </nav>
     </div>
   </footer>
diff --git a/docs/js/main.js b/docs/js/main.js
@@ -1,5 +1,4 @@
 $(function () {
-
   'use strict';
 
   var console = window.console || { log: function () {} };
@@ -14,28 +13,26 @@ $(function () {
   var $dataScaleX = $('#dataScaleX');
   var $dataScaleY = $('#dataScaleY');
   var options = {
-        aspectRatio: 16 / 9,
-        preview: '.img-preview',
-        crop: function (e) {
-          $dataX.val(Math.round(e.detail.x));
-          $dataY.val(Math.round(e.detail.y));
-          $dataHeight.val(Math.round(e.detail.height));
-          $dataWidth.val(Math.round(e.detail.width));
-          $dataRotate.val(e.detail.rotate);
-          $dataScaleX.val(e.detail.scaleX);
-          $dataScaleY.val(e.detail.scaleY);
-        }
-      };
+    aspectRatio: 16 / 9,
+    preview: '.img-preview',
+    crop: function (e) {
+      $dataX.val(Math.round(e.detail.x));
+      $dataY.val(Math.round(e.detail.y));
+      $dataHeight.val(Math.round(e.detail.height));
+      $dataWidth.val(Math.round(e.detail.width));
+      $dataRotate.val(e.detail.rotate);
+      $dataScaleX.val(e.detail.scaleX);
+      $dataScaleY.val(e.detail.scaleY);
+    }
+  };
   var originalImageURL = $image.attr('src');
   var uploadedImageName = 'cropped.jpg';
   var uploadedImageType = 'image/jpeg';
   var uploadedImageURL;
 
-
   // Tooltip
   $('[data-toggle="tooltip"]').tooltip();
 
-
   // Cropper
   $image.on({
     ready: function (e) {
@@ -58,7 +55,6 @@ $(function () {
     }
   }).cropper(options);
 
-
   // Buttons
   if (!$.isFunction(document.createElement('canvas').getContext)) {
     $('button[data-method="getCroppedCanvas"]').prop('disabled', true);
@@ -69,13 +65,11 @@ $(function () {
     $('button[data-method="scale"]').prop('disabled', true);
   }
 
-
   // Download
   if (typeof $download[0].download === 'undefined') {
     $download.addClass('disabled');
   }
 
-
   // Options
   $('.docs-toggles').on('change', 'input', function () {
     var $this = $(this);
@@ -104,7 +98,6 @@ $(function () {
     $image.cropper('destroy').cropper(options);
   });
 
-
   // Methods
   $('.docs-buttons').on('click', '[data-method]', function () {
     var $this = $(this);
@@ -204,11 +197,9 @@ $(function () {
     }
   });
 
-
   // Keyboard
   $(document.body).on('keydown', function (e) {
-
-    if (!$image.data('cropper') || this.scrollTop > 300) {
+    if (e.target !== this || !$image.data('cropper') || this.scrollTop > 300) {
       return;
     }
 
@@ -236,7 +227,6 @@ $(function () {
 
   });
 
-
   // Import image
   var $inputImage = $('#inputImage');
 
@@ -271,5 +261,4 @@ $(function () {
   } else {
     $inputImage.prop('disabled', true).parent().addClass('disabled');
   }
-
 });
