add custom button to show 1to1 image

themes/beauty/views/site/index.php

@@ -458,3 +458,7 @@ if ($total > $viewData['pageSize']) {
         id="pr-player">
     </video>
 </div>
+
+<script type="text/template" id="btn_show1to1_tmp">
+    <button title="Toggle zoom 1 to 1" class="f-button"><svg tabindex="-1" width="24" height="24" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="M3.51 3.07c5.74.02 11.48-.02 17.22.02 1.37.1 2.34 1.64 2.18 3.13 0 4.08.02 8.16 0 12.23-.1 1.54-1.47 2.64-2.79 2.46-5.61-.01-11.24.02-16.86-.01-1.36-.12-2.33-1.65-2.17-3.14 0-4.07-.02-8.16 0-12.23.1-1.36 1.22-2.48 2.42-2.46Z"></path><path d="M5.65 8.54h1.49v6.92m8.94-6.92h1.49v6.92M11.5 9.4v.02m0 5.18v0"></path></svg></button>
+</script>

www/js/beauty.js

@@ -1,9 +1,7 @@
 /*  
-******The author
+ * The author
-
+ * Tan
-******Tan
  */
-
 //关闭videojs的ga统计
 window.HELP_IMPROVE_VIDEOJS = false;
 
@@ -46,9 +44,11 @@ if ($('#image_site').get(0)) {
                 _slidesOfNextPage = data.imgs;
             }else if (typeof(data.videos) != 'undefined' && data.videos.length > 0) {
                 _slidesOfNextPage = data.videos;
-            }else {
+            }else if (typeof(data.msg) != 'undefined' && data.msg) {
                 _noMoreData = true;
                 console.warn('获取下一页json数据出错啦', data.msg);
+            }else {
+                _noMoreData = true;
             }
         }).fail(function(jqXHR, textStatus, errorThrown) {
             console.error('获取下一页json数据失败，错误信息：' + errorThrown);
@@ -85,29 +85,52 @@ if ($('#image_site').get(0)) {
         }, 1000);
     };
 
+    //自定义显示原图按钮
+    var customToolbar_show1to1 = {
+        tpl: $('#btn_show1to1_tmp').html(),
+        click: function() {
+            var btn = this, fancybox = this.instance;
+            var slide = fancybox.getSlide();
+            fancybox.showLoading(slide);
+            $(slide.imageEl).one('load', function() {
+                console.log('image loaded');
+                fancybox.hideLoading(slide);
+                slide.panzoom.toggleZoom();
+            });
+
+            slide.src = slide.downloadSrc;
+            slide.imageEl.src = slide.downloadSrc;
+        }
+    };
+
     // 图片浏览
     var fancyboxToolbar = {
+        items: {'show1to1': customToolbar_show1to1},
         display: {
             left: ["infobar"],
             middle: [
                 "zoomIn",
                 "zoomOut",
-                "toggle1to1",
+                "show1to1",
                 "rotateCCW",
                 "rotateCW",
                 "flipX",
-                "flipY"
+                "flipY",
+                "fitX",
+                "fitY",
+                "reset"
             ],
             right: ["slideshow", "fullscreen", "thumbs", "download", "close"],
         },
     };
     if ($(window).width() < 640) {  //小屏幕只显示部分按钮
         fancyboxToolbar = {
+            items: {'show1to1': customToolbar_show1to1},
             display: {
                 left: ["infobar"],
                 middle: [
-                    "zoomIn",
+                    "toggleZoom",
-                    "zoomOut",
+                    "show1to1",
                     "rotateCCW",
                     "rotateCW"
                 ],