portal-common/src/main/webapp/common/js/moreOperation.js

   1 /*\r
   2  * Copyright 2016-2017, CMCC Technologies Co., Ltd.\r
   3  *\r
   4  * Licensed under the Apache License, Version 2.0 (the "License");\r
   5  * you may not use this file except in compliance with the License.\r
   6  * You may obtain a copy of the License at\r
   7  *\r
   8  *         http://www.apache.org/licenses/LICENSE-2.0\r
   9  *\r
  10  * Unless required by applicable law or agreed to in writing, software\r
  11  * distributed under the License is distributed on an "AS IS" BASIS,\r
  12  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\r
  13  * See the License for the specific language governing permissions and\r
  14  * limitations under the License.\r
  15  */\r
  16 var resetSelectedItem=function(menuAlink){\r
  17         if(menuAlink.children('div.boxOperation').length>0){\r
  18                 $(".box.boxOperation", $(".carousel-inner")).removeClass("moreButtonSelected");\r
  19                 menuAlink.children('div.boxOperation').addClass('moreButtonSelected');\r
  20         }else if(menuAlink.parents('div.boxOperation').length>0){\r
  21                 $(".box.boxOperation", $(".carousel-inner")).removeClass("moreButtonSelected");\r
  22                 menuAlink.parents('div.boxOperation').addClass('moreButtonSelected');\r
  23         }\r
  24 }\r
  25 var reSelected=function(){\r
  26         if(openoFrameWork){\r
  27                 var menuID = openoFrameWork.getLocationHash();\r
  28                 var menuAlink = $('#'+ menuID,$('#pageableDiv'));\r
  29                 if(menuAlink.length>0){\r
  30                         resetSelectedItem(menuAlink);\r
  31                 }else{\r
  32                         menuAlink = $('#'+ menuID,$('.hor-menu'));\r
  33                         if(!!menuAlink.attr("defaultchildmenuid")&&menuAlink.attr("defaultchildmenuid").length>0){\r
  34                                 menuAlink = $('#'+ menuAlink.attr("defaultchildmenuid"),$('#pageableDiv'));\r
  35                                 if(menuAlink.length>0){\r
  36                                         resetSelectedItem(menuAlink);\r
  37                                 }\r
  38                         }\r
  39                 }\r
  40         }\r
  41 }\r
  42 var inter=null;\r
  43         \r
  44 var clearMoreOperations=function(){\r
  45     $('#pageableDiv').removeClass("moreOpen");\r
  46         $('#pageableDiv').addClass("moreClose");\r
  47         $('.col-xs-12',$('#pageableDiv')).removeClass("moreOpen");\r
  48         $('.col-xs-12',$('#pageableDiv')).addClass("moreClose");        \r
  49     $(".carousel-inner").children().remove();\r
  50         if (inter) {\r
  51         clearInterval(inter);\r
  52     };\r
  53 }\r
  54 \r
  55 var moreOperations = function(html){\r
  56         $('#pageableDiv').removeClass("moreClose");\r
  57         $('#pageableDiv').addClass("moreOpen");\r
  58         $('.col-xs-12',$('#pageableDiv')).removeClass("moreClose");\r
  59         $('.col-xs-12',$('#pageableDiv')).addClass("moreOpen"); \r
  60         showArrow();\r
  61         $(".carousel-inner").children().remove();\r
  62     inter=setInterval(reSelected, 200);\r
  63         var moreViewData=[];    \r
  64         var div = document.createElement('div');\r
  65         //div.innerHTML = html;\r
  66         $(div).append(html);\r
  67         var liTages =$("ul:first",div).children(); //div.getElementsByTagName('li')\r
  68         for(var i=0;i<liTages.length;i++){\r
  69                 if(!$(liTages[i]).hasClass("divider")){\r
  70                         var aLink = {};\r
  71                         if($(liTages[i]).hasClass("dropdown")){//???????????\r
  72                             var _litages=$(liTages[i]);\r
  73                                 aLink.html='<div class="box boxOperation">'+_litages.prop("outerHTML")+"</div>";\r
  74                         }else{\r
  75                         var aLinkTag = $("a", liTages[i]);\r
  76                         aLink.id = aLinkTag.attr("id");\r
  77                         var aLinkContent = aLinkTag.html();\r
  78                         aLinkTag.empty().html('<div class="box boxOperation"></div>');\r
  79                         $(".box", aLinkTag).html(aLinkContent);\r
  80                         aLink.html = aLinkTag.prop("outerHTML");\r
  81                         }\r
  82                         moreViewData.push(aLink);\r
  83                 }\r
  84         }\r
  85 \r
  86         var transformQueryViewData = function(queryViewData, pageSize){\r
  87                 var newData = [];\r
  88                 var pageNo = Math.floor(queryViewData.length / pageSize) + 1;\r
  89                 if(queryViewData.length % pageSize == 0){\r
  90                         pageNo--;\r
  91                 }\r
  92                 for(var i=0;i<pageNo;i++){\r
  93                         newData.push({array:[]});\r
  94                 }\r
  95                 for(var j=0;j<queryViewData.length;j++){\r
  96                         newData[Math.floor(j/pageSize)].array.push(queryViewData[j]);  \r
  97                 }       \r
  98                 return newData;\r
  99         }\r
 100         \r
 101         var moreOperationItems = [];\r
 102         \r
 103         var generateOperationItems = function(){        \r
 104                 for(var i=0;i<moreOperationItems.length;i++){\r
 105                         var itemHtml = '<div id="page_' + i + '" class="item moreButtonsTag">' + \r
 106                                                                   '<div class="col-xs-12" style="padding-right: 20px;">' + \r
 107                                                                   "</div>" + \r
 108                                                            "</div>";      \r
 109                         $(".carousel-inner").append(itemHtml);\r
 110                 }\r
 111                 for(var i=0;i<moreOperationItems.length;i++){\r
 112                         for(var j=0;j<moreOperationItems[i].array.length;j++){\r
 113                                 var buttonHtml = '<div class="moreButton boxPadding">' + moreOperationItems[i].array[j].html + '</div>';\r
 114                                 $(".col-xs-12", $("#page_" + i + ".item")).append(buttonHtml);                          \r
 115                         }\r
 116                 }               \r
 117         }\r
 118 \r
 119         //moreOperationItems = transformQueryViewData(moreViewData, 14);\r
 120         \r
 121         var moreOperationPageSize = 14; \r
 122         var windowWidth = $(window).width();\r
 123         if(windowWidth >= 1367 && windowWidth < 1441){\r
 124                 moreOperationPageSize = 12;\r
 125         }else if(windowWidth >= 1281 && windowWidth < 1367){\r
 126                 moreOperationPageSize = 11;\r
 127         }else if(windowWidth >= 1025 && windowWidth < 1281){\r
 128                 moreOperationPageSize = 10;\r
 129         }else if(windowWidth >= 920 && windowWidth < 1281){\r
 130                 moreOperationPageSize = 9;\r
 131         }else if(windowWidth >= 820 && windowWidth < 920){\r
 132                 moreOperationPageSize = 8;\r
 133         }else if(windowWidth >= 680 && windowWidth < 820){\r
 134                 moreOperationPageSize = 7;\r
 135         }else if(windowWidth >= 540 && windowWidth < 680){\r
 136                 moreOperationPageSize = 4;\r
 137         }else if(windowWidth >= 390 && windowWidth < 540){\r
 138                 moreOperationPageSize = 3;\r
 139         }else if(windowWidth < 390){\r
 140                 moreOperationPageSize = 2;\r
 141         }\r
 142 \r
 143         moreOperationItems = transformQueryViewData(moreViewData, moreOperationPageSize);\r
 144         generateOperationItems();\r
 145         \r
 146         $(".box.boxOperation").click(function(){\r
 147                 $(".box.boxOperation", $(".carousel-inner")).removeClass("moreButtonSelected");\r
 148                 $(this).addClass("moreButtonSelected");\r
 149         });\r
 150 \r
 151         $($(".item", $(".carousel-inner"))[0]).addClass("active");      \r
 152         \r
 153         if($(".item.moreButtonsTag").length < 2){\r
 154                 hideArrow();\r
 155         } \r
 156 }\r
 157 \r
 158 var showArrow = function(){\r
 159         $(".carousel-control").show();\r
 160         $(".boxOperation").removeClass("boxOperationOnePage");\r
 161 }\r
 162         \r
 163 var hideArrow = function(){\r
 164         $(".carousel-control").hide();\r
 165         $(".boxOperation").addClass("boxOperationOnePage");\r
 166 }\r