vew.common.js 6.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216
  1. $(function () {
  2. $(window).resize(refHeight);
  3. refHeight();
  4. // 切换选项卡
  5. $(".mp_tab_tit li").click(function () {
  6. if ($(this).hasClass("cur") || $(this).hasClass("disabled")) {
  7. return false;
  8. } else {
  9. var that = $(this),
  10. index = that.index();
  11. that.addClass("cur").siblings("li").removeClass("cur");
  12. that.parent().siblings(".mp_tab_con").children().eq(index).addClass("cur").siblings().removeClass("cur");
  13. var _id = $(this).attr("id");
  14. localforage.setItem(storageName, _id)
  15. }
  16. });
  17. // mp_tree
  18. $(".open").click(changeOpenShowHide);
  19. });
  20. // function tab2plot() {
  21. // $("#tab_attr").addClass('disabled');
  22. // $("#tab_latlng").addClass('disabled');
  23. // $("#tab_plot").click();
  24. // }
  25. var storageName = "mars3d_plotAttr";
  26. function tab2attr() {
  27. // $("#tab_attr").removeClass('disabled');
  28. // $("#tab_latlng").removeClass('disabled');
  29. // if ($("#tab_plot").hasClass('cur'))
  30. //读取localStorage值
  31. localforage.getItem(storageName).then(function (last_attr_tab) {
  32. if (last_attr_tab != null) {
  33. $("#" + last_attr_tab).click();
  34. } else {
  35. $("#tab_attr").click();
  36. }
  37. })
  38. }
  39. function changeOpenShowHide() {
  40. var openlis = $(this).siblings();
  41. var opent = $(this).children(".tree_icon");
  42. openlis.toggle();
  43. if (openlis.is(":hidden")) {
  44. opent.html("+");
  45. } else {
  46. opent.html("-");
  47. }
  48. }
  49. function refHeight() {
  50. $(".mp_tab_card").height($(".mp_box").height() - $(".mp_head").height() - 1);
  51. $(".mp_tree").height($(".mp_tab_card").height() - 32);
  52. $(".mp_mark").height($(".mp_tab_card").height() - 80);
  53. }
  54. (function ($) {
  55. //下拉菜单默认参数
  56. var defaluts = {
  57. select: "mp_select",
  58. select_text: "mp_select_text",
  59. select_ul: "mp_select_ul",
  60. };
  61. $.fn.extend({
  62. // 下拉菜单
  63. select: function (options) {
  64. var opts = $.extend({}, defaluts, options);
  65. return this.each(function () {
  66. var that = $(this);
  67. //模拟下拉列表
  68. if (that.data("value") !== undefined && that.data("value") !== "") {
  69. that.val(that.data("value"));
  70. }
  71. var _html = [];
  72. _html.push('<div class="' + that.attr("class") + '">');
  73. _html.push('<div class="' + opts.select_text + '">' + that.find(":selected").text() + "</div>");
  74. _html.push('<ul class="' + opts.select_ul + '">');
  75. that.children("option").each(function () {
  76. var option = $(this);
  77. if (that.data("value") == option.val()) {
  78. _html.push('<li data-value="' + option.val() + '">' + option.text() + "</li>");
  79. } else {
  80. _html.push('<li data-value="' + option.val() + '">' + option.text() + "</li>");
  81. }
  82. });
  83. _html.push("</ul>");
  84. _html.push("</div>");
  85. var select = $(_html.join(""));
  86. var select_text = select.find("." + opts.select_text);
  87. var select_ul = select.find("." + opts.select_ul);
  88. that.after(select);
  89. that.hide();
  90. //下拉列表操作
  91. select.click(function (event) {
  92. $(this).toggleClass("mp_selected");
  93. $(this)
  94. .find("." + opts.select_ul)
  95. .slideToggle()
  96. .end()
  97. .siblings("div." + opts.select)
  98. .find("." + opts.select_ul)
  99. .slideUp();
  100. event.stopPropagation();
  101. });
  102. $("body").click(function () {
  103. select_ul.slideUp();
  104. });
  105. select_ul.on("click", "li", function () {
  106. var li = $(this);
  107. var val = li.addClass("selecton").siblings("li").removeClass("selecton").end().data("value").toString();
  108. if (val !== that.attr("data-value")) {
  109. select_text.text(li.text());
  110. that.attr("data-value", val);
  111. that.change();
  112. }
  113. });
  114. });
  115. },
  116. //滑动条
  117. progress: function (max) {
  118. var opts = {
  119. progress: "puiprogress",
  120. progress_bg: "puiprogress_bg",
  121. progress_btn: "puiprogress_btn",
  122. progress_bar: "puiprogress_bar",
  123. progress_text: "puiprogress_text",
  124. };
  125. return this.each(function () {
  126. var that = $(this);
  127. //模拟进度条
  128. var _html = [];
  129. _html.push('<div class="' + opts.progress + '">');
  130. _html.push('<div class="' + opts.progress_bg + '">');
  131. _html.push('<div class="' + opts.progress_bar + '">' + "</div>");
  132. _html.push("</div>");
  133. _html.push('<div class="' + opts.progress_btn + '">' + "</div>");
  134. _html.push('<div class="' + opts.progress_text + '">' + that.val() + "%</div>");
  135. _html.push("</div>");
  136. var pro = $(_html.join(""));
  137. var progress_bg = pro.find("." + opts.progress_bg);
  138. var progress_btn = pro.find("." + opts.progress_btn);
  139. var progress_bar = pro.find("." + opts.progress_bar);
  140. var progress_text = pro.find("." + opts.progress_text);
  141. that.after(pro);
  142. that.hide();
  143. //进度条操作
  144. var tag = false,
  145. ox = 0,
  146. left = 0,
  147. bgleft = 0;
  148. pro.css("width", max);
  149. var _val = Number(that.val());
  150. left = (max * _val) / 100;
  151. progress_btn.css("left", left);
  152. progress_bar.width(left);
  153. progress_text.html(parseInt(_val) + "%");
  154. progress_btn.mousedown(function (e) {
  155. ox = e.pageX - left;
  156. tag = true;
  157. });
  158. $(document).mouseup(function () {
  159. tag = false;
  160. });
  161. pro.mousemove(function (e) {
  162. //鼠标移动
  163. if (tag) {
  164. left = e.pageX - ox;
  165. if (left <= 0) {
  166. left = 0;
  167. } else if (left > max) {
  168. left = max;
  169. }
  170. progress_btn.css("left", left);
  171. progress_bar.width(left);
  172. var _val = parseInt((left / max) * 100);
  173. progress_text.html(_val + "%");
  174. that.val(_val);
  175. that.change();
  176. }
  177. });
  178. progress_bg.click(function (e) {
  179. //鼠标点击
  180. if (!tag) {
  181. bgleft = progress_bg.offset().left;
  182. left = e.pageX - bgleft;
  183. if (left <= 0) {
  184. left = 0;
  185. } else if (left > max) {
  186. left = max;
  187. }
  188. progress_btn.css("left", left);
  189. progress_bar.animate({ width: left }, max);
  190. var _val = parseInt((left / max) * 100);
  191. progress_text.html(_val + "%");
  192. that.val(_val);
  193. that.change();
  194. }
  195. });
  196. });
  197. },
  198. });
  199. })(window.jQuery);