growHeight.js 33 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965
  1. window.growHeightList = window.growHeightList || {};
  2. function getGrowHeight(id, maxHeight, buttons, type, acceptEnter) {
  3. var gh = growHeightList[id];
  4. if (!gh) {
  5. if (maxHeight != null) {
  6. gh = new GrowHeight(id, maxHeight, buttons, type, acceptEnter);
  7. } else {
  8. console.info("找不到GrowHeight:" + id);
  9. }
  10. }
  11. return gh;
  12. }
  13. var GrowHeight = GrowHeight = function (id, maxHeight, buttons, type, acceptEnter) {
  14. var ele = document.getElementById(id);
  15. if (ele) {
  16. this.showPadding = 0;
  17. this.name = id;
  18. this.id = id;
  19. this.maxHeight = parseFloat(maxHeight) || 300;
  20. this.type = type;
  21. this.acceptEnter = new Boolean(acceptEnter) == true;
  22. this.srcElement = ele;
  23. this.fj = buttons.fj;
  24. this.init();
  25. window.growHeightList[id] = this;
  26. } else {
  27. console.log("找不到元素:" + id);
  28. }
  29. }
  30. GrowHeight.prototype.getName = function () {
  31. return this.name;
  32. }
  33. GrowHeight.prototype.val = function (value) {
  34. if (this.container.tagName.toLowerCase() == "textarea") {
  35. if (arguments.length == 0) {
  36. value = this.input.value;
  37. } else {
  38. this.container.value = value;
  39. this.onInput();
  40. }
  41. } else {
  42. if (arguments.length == 0) {
  43. value = this.input.value;
  44. } else {
  45. this.container.innerHTML = value;
  46. this.onInput();
  47. }
  48. }
  49. if (this.isFocus != true) {
  50. this.container.initDot && this.container.initDot();
  51. }
  52. return value;
  53. }
  54. GrowHeight.prototype.setOnInput = function (callback) {
  55. this.onInputCallback = callback;
  56. }
  57. GrowHeight.prototype.setOnfocus = function (callback) {
  58. this.onFocusCallback = callback;
  59. }
  60. GrowHeight.prototype.setOnblur = function (callback) {
  61. this.onBlurCallback = callback;
  62. }
  63. GrowHeight.prototype.show = function () {
  64. if (this.shadow)
  65. return;
  66. //缓存旧数据
  67. var ori = this.oriInfo = {
  68. wrapper: this.wrapper.style.cssText,
  69. container: this.container.style.cssText,
  70. parent_: this.wrapper.parentNode.style.cssText
  71. };
  72. var e = $HIDDENOVERFLOW(this.wrapper);
  73. var eb = e.getBoundingClientRect();
  74. var pB = this.wrapper.parentNode.getBoundingClientRect();
  75. var bound = this.wrapper.getBoundingClientRect();
  76. //创建站位空格
  77. var shadow = this.shadow = this.wrapper.cloneNode();
  78. shadow.id = "shadow_" + (this.wrapper.name || this.wrapper.id || "");
  79. shadow.name = "";
  80. shadow.style.display="inline-block";
  81. shadow.style.overflowY = "hidden";
  82. shadow.style.visibility = "hidden";
  83. var csstxt = this.wrapper.style.cssText;
  84. var csss=csstxt.split(";");
  85. var hasCssWidth=false,hasCssHeight=false;
  86. for (var ci=0;ci<csss.length;ci++){
  87. if(csss[ci].startsWith("width:")){
  88. hasCssWidth=true;
  89. }else if(csss[ci].startsWith("height:")){
  90. hasCssHeight=true;
  91. }
  92. }
  93. if (!hasCssWidth) {
  94. $(shadow).css("width", $W(this.wrapper));
  95. }
  96. if (!hasCssHeight) {
  97. $(shadow).css("height", $H(this.wrapper));
  98. }
  99. // var w = this.wrapper.style.width,
  100. // h = this.wrapper.style.height;
  101. // if (w == "" || !w.startsWith("calc")) {
  102. // w = $W(this.wrapper) + "px";
  103. // }
  104. // if (h == "" || !h.startsWith("calc")) {
  105. // h = $H(this.wrapper) + "px";
  106. // }
  107. // console.log(w, h);
  108. // $(shadow).css({
  109. // width: w,
  110. // height: h
  111. // })
  112. // shadow.style.display = "inline-block";
  113. //先浮出来以免影响坐标计算
  114. this.wrapper.parentNode.style.position = "relative";
  115. this.wrapper.style.position = "absolute";
  116. this.wrapper.parentNode.insertBefore(shadow, this.wrapper.nextSibling);
  117. $(this.wrapper).addClass("input-div-selected");
  118. // this.wrapper.style.overflow = "hidden";
  119. this.wrapper.style.width = bound.width + "px";
  120. this.wrapper.style.height = "unset";
  121. // var height_ = $REALHEIGHT(this.wrapper);
  122. var marginTop=parseInt($(this.wrapper).css("margin-top"))||0;
  123. var marginBottom=parseInt($(this.wrapper).css("margin-bottom"))||0;
  124. this.wrapper.style.background = "white";
  125. this.wrapper.style.left = bound.left - pB.left - $ML(this.wrapper) - 1 + "px";
  126. this.wrapper.style.zIndex = 1;
  127. //判断够不够位置,调整最大高度
  128. var maxHeight_ = this.maxHeight;
  129. if (bound.top + maxHeight_ < eb.bottom) {
  130. this.wrapper.style.top = bound.top - pB.top - 1-marginTop + "px";
  131. this.wrapper.style.bottom = "";
  132. } else { //如果向下不够位置展开,尝试向上,并且判断尽可能的放大
  133. //如果向上高度大于向下高度
  134. var b_ = eb.bottom - bound.bottom; //底部距离
  135. var t_ = bound.top - eb.top; //顶部距离
  136. maxHeight_ = Math.min(Math.max(b_, t_) + bound.height - $PB(this.wrapper) - $PT(this.wrapper), maxHeight_);
  137. this.wrapper.style.bottom = pB.bottom - bound.bottom - $MB(this.wrapper)-marginBottom + "px";
  138. this.wrapper.style.top = "";
  139. }
  140. this.wrapper.style.maxHeight = maxHeight_ + "px";
  141. this.updateWrapperPosition();
  142. this.updateContainerHeight();
  143. if (this.cmsBtn) {
  144. this.cmsBtn.updateButtonSize();
  145. }
  146. loadSmallScorll($(this.wrapper).find(".smallScrollbar"));
  147. }
  148. GrowHeight.prototype.updateWrapperPosition = function () {
  149. if (this.shadow) {
  150. var s = this.shadow.getBoundingClientRect(),
  151. w = this.wrapper.getBoundingClientRect(),
  152. wb = parseFloat(this.wrapper.style.bottom),
  153. wt = parseFloat(this.wrapper.style.top),
  154. left = parseFloat(this.wrapper.style.left);
  155. this.wrapper.style.left = left + s.left - w.left + "px";
  156. }
  157. }
  158. GrowHeight.prototype.updateContainerHeight = function () {
  159. var h = $minHeight100(this.container);
  160. if (this.shadow) { //
  161. var pd = this.showPadding;
  162. if (pd > 0) {
  163. this.wrapper.style.left = parseFloat(this.wrapper.style.left) - pd + "px"; //x左移
  164. this.wrapper.style.width = $REALWIDTH(this.shadow) + pd * 2 + "px"; //y右移
  165. this.wrapper.style.padding = pd + "px";
  166. var b = this.wrapper.style.bottom;
  167. if (b != "") {
  168. this.wrapper.style.bottom = parseFloat(b) - pd + "px";
  169. } else {
  170. b = this.wrapper.style.top;
  171. this.wrapper.style.top = parseFloat(b) - pd + "px";
  172. }
  173. var maxH = $MAH(this.wrapper) /* this.maxHeight */ + pd;
  174. // var se=$HIDDENOVERFLOW(this.wrapper);
  175. //计算maxheight
  176. this.wrapper.style.maxHeight = maxH + "px";
  177. }
  178. this.container.style.height = h + "px";
  179. var sh = this.container.scrollHeight,
  180. mh = $MAH(this.wrapper) - ($ISBOX(this.wrapper) ? ($PT(this.wrapper) + $PB(this.wrapper)) : 0);
  181. h = Math.min(sh, mh);
  182. this.container.style.overflow = "hidden";
  183. this.container.scrollTop = this.lastScrollTop;
  184. } else {}
  185. this.container.style.height = h + "px";
  186. }
  187. GrowHeight.prototype.hide = function () {
  188. $(this.wrapper).removeClass("input-div-selected");
  189. $(this.wrapper).addClass("input-s");
  190. $(this.wrapper).find(".smallScrollbar").getNiceScroll().remove();
  191. if (this.shadow) {
  192. if (this.shadow.parentNode != this.wrapper.parentNode)
  193. this.shadow.parentNode.insertBefore(this.wrapper, this.shadow);
  194. this.shadow.parentNode.removeChild(this.shadow);
  195. this.shadow = null;
  196. }
  197. var ori = this.oriInfo;
  198. if (ori) {
  199. this.wrapper.style.cssText = ori.wrapper;
  200. this.container.style.cssText = ori.container;
  201. this.wrapper.parentNode.style.cssText = ori.parent_;
  202. this.oriInfo = null;
  203. }
  204. if (this.cmsBtn) {
  205. //更新CMS按钮的位置
  206. this.cmsBtn.updateButtonSize();
  207. }
  208. }
  209. GrowHeight.prototype.initAsDiv = function () {
  210. if (this.inited === true)
  211. return;
  212. function _focus() {
  213. this.GrowHeight.show();
  214. this.focus();
  215. this.addEventListener("blur", _blur);
  216. this.GrowHeight.onFocus();
  217. // this.innerHTML = this.GrowHeight.input.value;
  218. }
  219. function _blur() {
  220. this.GrowHeight.hide();
  221. this.removeEventListener("blur", _blur);
  222. this.GrowHeight.onBlur();
  223. this.GrowHeight.updateInputValue();
  224. }
  225. // this.onInputCallback = function (container) {
  226. // this.updateInputValue();
  227. // }
  228. var onDivInput = function (e) {
  229. if (!this.GrowHeight.acceptEnter) {
  230. var et = e || window.event;
  231. var keycode = et.charCode || et.keyCode;
  232. if (keycode == 13) {
  233. if (window.event) {
  234. window.event.returnValue = false;
  235. } else {
  236. e.preventDefault(); //for firefox
  237. }
  238. return;
  239. }
  240. }
  241. this.GrowHeight.onInput();
  242. }
  243. this.initDot = null;
  244. this.container = this.srcElement;
  245. this.container.style.height = $height100(this.container) + "px";
  246. this.container.style.overflow = "hidden";
  247. this.container.setAttribute("contenteditable", "true");
  248. this.container.addEventListener("focus", _focus);
  249. var inputEventNames = ["input", "propertychange", "keydown", "keyup", "DOMSubtreeModified"];
  250. for (var iiii = 0; iiii < inputEventNames.length; iiii++) {
  251. this.container.addEventListener(inputEventNames[iiii], onDivInput);
  252. }
  253. this.input = document.createElement("textarea");
  254. this.input.style.display = "none";
  255. this.input.name = this.id;
  256. this.container.parentNode.appendChild(this.input);
  257. }
  258. GrowHeight.prototype.initPlay = function () {
  259. if (this.inited === true)
  260. return;
  261. this.showPadding = 6;
  262. function onmouseenter() {
  263. this.GrowHeight.val(this.GrowHeight.srcText);
  264. this.GrowHeight.show();
  265. this.oriResize = this.style.resize;
  266. if (this.GrowHeight.cmsBtn)
  267. this.GrowHeight.cmsBtn.updateButtonSize();
  268. this.addEventListener("mouseleave", onmouseleave);
  269. }
  270. function onmouseleave(event) {
  271. if (this.clicked || (event.ctrlKey && event.altKey))
  272. return;
  273. this.style.resize = this.oriResize || "";
  274. this.GrowHeight.val(this.GrowHeight.viewText);
  275. this.removeEventListener("mouseleave", onmouseleave);
  276. this.GrowHeight.hide();
  277. }
  278. function onclick_() {
  279. this.clicked = !(this.clicked || false);
  280. if (this.clicked) {
  281. this.oriOutline = this.style.outline;
  282. this.oriResize = this.style.resize;
  283. this.style.outline = "1px blue auto";
  284. this.style.resize = "both";
  285. this.GrowHeight.onFocus();
  286. } else {
  287. this.style.outline = this.oriOutline;
  288. this.style.resize = this.oriResize;
  289. this.GrowHeight.onBlur();
  290. }
  291. }
  292. this.container = this.srcElement;
  293. // this.container.initDot = function () {
  294. // this.innerText = this.GrowHeight.srcText;
  295. // this.GrowHeight.viewText = wd.display.ellipsisContent(this, $maxHeight100(this));
  296. // }
  297. this.container.style.minHeight = this.minHeight + "px";
  298. //....
  299. this.srcText = this.container.innerText;
  300. // this.innerHTML = "";
  301. var ses = this.srcElement.style;
  302. var od = {
  303. wrapper: this.wrapper.style.cssText,
  304. container: this.container.style.cssText
  305. };
  306. var initHeight = $maxHeight100(this.container)
  307. //平铺开,强制换行
  308. // ses.visibility = "hidden";
  309. // ses.height = "";
  310. ses.wordBreak = "break-all";
  311. ses.wordWrap = "break-word";
  312. //弄成最大宽度,若么有,忽略
  313. this.wrapper.style.width = $MAWS(this.srcElement, 0) + "px";
  314. ses.width = $W(this.wrapper);
  315. var th = $MIH(this.container) || this.minHeight,
  316. h = $H(this.container);
  317. if (h > th) {
  318. var lh = $LH(this.container);
  319. if (lh > th) {
  320. console.info("注意,行高已经超过元素高度,导致元素被撑大")
  321. }
  322. // this.container.initDot();
  323. this.container.innerText = this.srcText;
  324. this.viewText = wd.display.ellipsisContent(this.container, initHeight);
  325. this.wrapper.addEventListener("mouseenter", onmouseenter);
  326. this.wrapper.addEventListener("dblclick", onclick_)
  327. }
  328. this.wrapper.style.cssText = od.wrapper;
  329. this.container.style.cssText = od.container;
  330. this.input = document.createElement("input");
  331. this.input.value = this.wrapper.innerHTML;
  332. this.input.type = "hidden";
  333. this.wrapper.parentNode.insertBefore(this.input, this.wrapper);
  334. }
  335. GrowHeight.prototype.onInput = function () {
  336. this.lastScrollTop = this.container.scrollTop;
  337. this.updateContainerHeight();
  338. if (this.cmsBtn) {
  339. //更新CMS按钮的位置
  340. this.cmsBtn.updateButtonSize();
  341. }
  342. this.updateInputValue && this.updateInputValue();
  343. this.onInputCallback && this.onInputCallback.call(this, this.container);
  344. }
  345. GrowHeight.prototype.onFocus = function () { //
  346. {
  347. var textDom = this.container;
  348. if (textDom.setSelectionRange) {
  349. // IE Support
  350. textDom.focus();
  351. textDom.setSelectionRange(this.cursorPos, this.cursorPos);
  352. } else if (textDom.createTextRange) {
  353. // Firefox support
  354. var range = textDom.createTextRange();
  355. range.collapse(true);
  356. range.moveEnd('character', this.cursorPos);
  357. range.moveStart('character', this.cursorPos);
  358. range.select();
  359. }
  360. this.isFocus = true;
  361. }
  362. if (this.cmsBtn) {
  363. //更新CMS按钮的位置
  364. this.cmsBtn.updateButtonSize();
  365. }
  366. this.onFocusCallback && this.onFocusCallback.call(this.GrowHeight, this);
  367. }
  368. GrowHeight.prototype.onBlur = function () { //
  369. {
  370. var textDom = this.container;
  371. if (document.selection) {
  372. // IE Support
  373. // 有bug,先注释了,IE会不断获取焦点
  374. // textDom.focus();
  375. var selectRange = document.selection.createRange();
  376. selectRange.moveStart('character', -textDom.value.length);
  377. this.cursorPos = selectRange.text.length;
  378. } else if (textDom.selectionStart || textDom.selectionStart == '0') {
  379. // Firefox support
  380. this.cursorPos = textDom.selectionStart;
  381. }
  382. this.isFocus = false;
  383. }
  384. if (this.cmsBtn) {
  385. //更新CMS按钮的位置
  386. this.cmsBtn.updateButtonSize();
  387. }
  388. this.onBlurCallback && this.onBlurCallback.call(this.GrowHeight, this);
  389. }
  390. GrowHeight.prototype.updateInputValue = function () {
  391. function getText() {
  392. var nn = this.nodeName;
  393. if (nn == "TEXTAREA" || nn == "INPUT") {
  394. return this.value;
  395. } else if (nn == "DIV") {
  396. return this.innerHTML;
  397. } else {
  398. return this.innerText;
  399. }
  400. }
  401. if (this.input && this.container) {
  402. var value = getText.call(this.container);
  403. if (this.acceptEnter || this.type > 1) { //接受回车,或者是播放
  404. this.input.value = value;
  405. } else {
  406. if (this.container.nodeName == 'DIV') {
  407. value = value.replace('<br>', "");
  408. }
  409. value = value.replace(/\n/g, '');
  410. this.input.value = value;
  411. }
  412. }
  413. }
  414. GrowHeight.prototype.initAsInput = function () {
  415. if (this.inited === true)
  416. return;
  417. var gh = this;
  418. var editorOninput = function (e) {
  419. if (!this.GrowHeight.acceptEnter) {
  420. var et = e || window.event;
  421. var keycode = et.charCode || et.keyCode;
  422. if (keycode == 13) {
  423. if (window.event) {
  424. window.event.returnValue = false;
  425. } else {
  426. e.preventDefault(); //for firefox
  427. }
  428. return;
  429. }
  430. }
  431. this.GrowHeight.onInput();
  432. this.GrowHeight.updateInputValue();
  433. }
  434. // this.onInputCallback = function (container) {
  435. // this.updateInputValue();
  436. // }
  437. function editorOnfocus() {
  438. this.isFocus = true;
  439. //浮出来
  440. this.value = this.GrowHeight.input.value;
  441. this.GrowHeight.show();
  442. this.focus();
  443. this.addEventListener("blur", editorOnblur);
  444. this.GrowHeight.onFocus();
  445. editorOninput.call(this);
  446. }
  447. function editorOnblur() {
  448. this.isFocus = false;
  449. //弄回去
  450. this.GrowHeight.updateInputValue();
  451. this.GrowHeight.hide();
  452. this.removeEventListener("blur", editorOnblur);
  453. this.GrowHeight.onBlur();
  454. this.initDot();
  455. }
  456. var container = this.container = document.createElement("textarea");
  457. this.wrapper.insertBefore(this.container, this.srcElement);
  458. //placeholder支持
  459. if (this.srcElement.getAttribute("placeholder"))
  460. container.setAttribute("placeholder", this.srcElement.getAttribute("placeholder"));
  461. container.GrowHeight = this;
  462. //克隆样式
  463. container.className = "form-text";
  464. container.style.width = "100%";
  465. container.style.paddingLeft = "5px";
  466. container.style.paddingTop = "5px";
  467. container.style.resize = "none";
  468. container.style.overflowY = "hidden";
  469. container.style.height = $minHeight100(this.container) + "px";
  470. container.style.minHeight = $minHeight100(this.container) + "px";
  471. var stn = []; //["border", "border-radius"];
  472. for (var i = 0; i < stn.length; i++) {
  473. container.style[stn[i]] = $CSS(this.srcElement, stn[i]);
  474. }
  475. if (this.srcElement.getAttribute("placeholder"))
  476. this.container.setAttribute("placeholder", this.srcElement.getAttribute("placeholder"));
  477. var inputEventNames = ["input", "propertychange", "keydown", "keyup"];
  478. for (var i = 0; i < inputEventNames.length; i++) {
  479. (function (evname) {
  480. container.addEventListener(evname, editorOninput);
  481. })(inputEventNames[i]);
  482. }
  483. container.addEventListener("focus", editorOnfocus);
  484. container.initDot = function () {
  485. wd.display.ellipsisContent(this, $maxHeight100(this));
  486. }
  487. this.input = document.createElement("textarea");
  488. this.input.name = this.id;
  489. // this.input.style.cssText = container.style.cssText;
  490. this.input.style.display = "none";
  491. this.input.GrowHeight = this;
  492. this.wrapper.insertBefore(this.input, this.container);
  493. this.val(this.srcElement.innerHTML);
  494. this.wrapper.removeChild(this.srcElement);
  495. this.updateContainerHeight();
  496. }
  497. GrowHeight.prototype.getInputElement = function () {
  498. return this.container;
  499. }
  500. GrowHeight.prototype.getInput = function () {
  501. return this.container;
  502. }
  503. GrowHeight.prototype.initPlayHtml = function () {
  504. if (this.inited === true)
  505. return;
  506. this.showPadding = 6;
  507. var container = this.container = this.srcElement,
  508. that = this;
  509. this.minHeight = $minHeight100(container);
  510. container.style.height = $maxHeight100(container) + "px";
  511. container.style.overflowY = "auto";
  512. function enter(event) {
  513. this.GrowHeight.show();
  514. this.GrowHeight.wrapper.style.overflow = "hidden";
  515. }
  516. function leave(event) {
  517. this.GrowHeight.hide();
  518. }
  519. this.wrapper.addEventListener("mouseenter", enter);
  520. this.wrapper.addEventListener("mouseleave", leave);
  521. }
  522. GrowHeight.prototype.getCmsBtn = function (mode) {
  523. if (this.fj == null || (mode == "play" && (this.fj.value == null || this.fj.value == "")))
  524. return;
  525. if(mode=="edit"&&this.fj.value == ""){
  526. this.fj.jlztm=1;
  527. }
  528. var fj = this.fj;
  529. var attachment = document.createElement("span");
  530. var attachmentText = document.createTextNode("附件");
  531. attachment.appendChild(attachmentText);
  532. this.wrapper.insertBefore(attachment, this.container.nextSibling);
  533. attachment.className = 'icon-attachment builtinButton';
  534. //上浮。找到目标的样式修改当前的样式名
  535. if ($(attachment).parents("abc").length > 0) {
  536. attachment.className = "123456789";
  537. }
  538. var fjidHidden = document.querySelector("[name='" + fj.key + "']");
  539. if (!fjidHidden) {
  540. fjidHidden = document.createElement("input");
  541. fjidHidden.type = "hidden";
  542. fjidHidden.name = fj.key;
  543. fjidHidden.value = fj.value;
  544. attachment.style.display = "none";
  545. attachment.parentNode.insertBefore(fjidHidden, attachment);
  546. }
  547. var editor = attachment.editor = this.container;
  548. var oriTop = $MT(attachment),
  549. oriBottom = $MB(attachment),
  550. oriLeft = $ML(attachment);
  551. attachment.updateButtonSize = function () {
  552. var editor = attachment.editor;
  553. editor.style.resize = "none";
  554. editor.style.width = $INNERWIDTH(editor.parentNode) - $ML(editor) - $MR(editor) - ($ISBOX(editor) ? 0 : ($BOXWIDTH(editor))) - $REALWIDTH(attachment) - $ML(attachment) - $MR(attachment) + "px";
  555. var editor = attachment.editor;
  556. attachment.style.display = "none";
  557. attachment.style.height = $INNERHEIGHT(attachment.parentNode) - oriTop - oriBottom + "px";
  558. attachment.style.verticalAlign = "top";
  559. attachment.style.lineHeight = $INNERHEIGHT(attachment.parentNode) - oriTop - oriBottom + 22 + "px";
  560. attachment.style.display = "inline-block";
  561. attachment.style.position = '';
  562. if ($DSP(editor).indexOf("inline") > -1) { //行内元素
  563. } else { //块元素,浮动在他身边
  564. editor.style.display = "inline-block";
  565. }
  566. }
  567. //编辑框去掉附件按钮的宽度
  568. function updateCount() {
  569. var fjidInput = document.getElementsByName(fj.key)[0];
  570. if (fjidInput == null)
  571. return;
  572. var fjid = fjidInput.value;
  573. if (fjid != null && fjid != "")
  574. $.ajax({
  575. type: "post",
  576. url: "/service?ssServ=wrCcmsList", // =getSubNrCount",。Lin
  577. data: {
  578. nrid: "T-" + fjid,
  579. jlztm: fj.jlztm
  580. },
  581. dataType: "json", // 增加,统一 Ajax 返回标准 -- .ssCode、.ssMsg、.ssData。Lin
  582. success: function (data) {
  583. /* 改,增加错误处理 -- 统一 Ajax 返回标准 -- .ssCode、.ssMsg、.ssData。Lin
  584. * 去掉 JSON.parse(,改为用 Map<String, Object> 传输
  585. var names = JSON.parse(data);
  586. */
  587. if (data.ssCode != 0) {
  588. alert(data.ssMsg);
  589. return;
  590. }
  591. var names = data.ssData;
  592. var count = names.length;
  593. //if (count > 0) {
  594. var num = attachment.querySelector(".icon-num");
  595. if (!num) {
  596. num = document.createElement("span");
  597. num.className = "icon-num";
  598. num.style.float = "right";
  599. num.style.position = "absolute";
  600. num.style.right = "2px";
  601. num.style.top = "2px";
  602. attachment.appendChild(num);
  603. }
  604. num.innerText = count;
  605. if (count == 0) {
  606. $(num).hide();
  607. } else {
  608. $(num).show();
  609. }
  610. var datas = [];
  611. for (var iii = 0; iii < names.length; iii++) {
  612. datas.push({
  613. name: iii,
  614. value: names[iii]
  615. })
  616. }
  617. $(attachment).off("mouseenter").on("mouseenter", function () {
  618. var menuelement = wd.display.initCmsMenu("cms" + fjid, fj.jlztm, datas);
  619. if (menuelement) {
  620. menuelement.showAt(attachment);
  621. $(attachment).off("mouseleave").on("mouseleave", function () {
  622. menuelement.hide();
  623. });
  624. }
  625. });
  626. },
  627. error: function (data) {
  628. console.log(data);
  629. }
  630. });
  631. };
  632. if ("play" == mode) {
  633. attachment.addEventListener("click", function (e) {
  634. var fn = window[fj.key + "fjPlay"];
  635. fn && fn.call(this);
  636. e.stopPropagation()
  637. });
  638. } else if ("edit" == mode) {
  639. var fnName = fj.key + "CallbackName";
  640. var fnName = window[fnName] = fj.key + "mouseover";
  641. window[fnName] = updateCount;
  642. attachment.addEventListener("mouseenter", window[fnName]);
  643. attachment.addEventListener("click", function (e) {
  644. var fn = window[fj.key + "fjEdit"];
  645. fn && fn.call(this);
  646. e.stopPropagation()
  647. });
  648. }
  649. attachment.updateButtonSize();
  650. editor.initDot && editor.initDot();
  651. updateCount();
  652. return attachment;
  653. }
  654. GrowHeight.prototype.getElement = function () {
  655. return this.wrapper;
  656. }
  657. GrowHeight.prototype.init = function () {
  658. if (!this.inited) {
  659. var styleAttrNames = {
  660. "width": "width",
  661. "height": "height"
  662. };
  663. for (var key in styleAttrNames) {
  664. var attrV = this.srcElement.getAttribute(key);
  665. if (attrV != null) {
  666. var styleName = styleAttrNames[key];
  667. this.srcElement.style[styleName] = attrV;
  668. }
  669. this.srcElement.removeAttribute(key);
  670. }
  671. var h = $REALHEIGHT(this.srcElement);
  672. var lh = $LH(this.srcElement);
  673. this.minHeight = Math.max(lh || 28, h);
  674. this.oriWidth = $REALWIDTH(this.srcElement);
  675. this.wrapper = document.createElement("div");
  676. this.wrapper.style.cssText = this.srcElement.style.cssText;
  677. this.wrapper.style.minHeight = this.minHeight + "px";
  678. this.wrapper.className = this.srcElement.className;
  679. this.srcElement.GrowHeight = this;
  680. this.srcElement.className = "";
  681. this.srcElement.style.width = "";
  682. this.srcElement.style.maxWidth = "";
  683. this.srcElement.style.cssText = "";
  684. this.srcElement.parentNode.insertBefore(this.wrapper, this.srcElement);
  685. this.wrapper.appendChild(this.srcElement);
  686. this.wrapper.GrowHeight = this;
  687. this.wrapper.setAttribute("growHeight", this.name);
  688. this.id = this.srcElement.id;
  689. switch (this.type) {
  690. case 0:
  691. this.wrapper.className += " input-div";
  692. this.initAsInput();
  693. this.cmsBtn = this.getCmsBtn("edit");
  694. break;
  695. case 1:
  696. this.wrapper.className += " input-div";
  697. this.initAsDiv();
  698. this.cmsBtn = this.getCmsBtn("edit");
  699. break;
  700. case 2:
  701. this.initPlayHtml();
  702. this.cmsBtn = this.getCmsBtn("play");
  703. break;
  704. case 3:
  705. default:
  706. this.initPlay();
  707. this.cmsBtn = this.getCmsBtn("play");
  708. break;
  709. }
  710. if (this.container) {
  711. var that = this;
  712. this.container.id = this.id;
  713. this.container.className += " smallScrollbar";
  714. var passiveSupported = false;
  715. try {
  716. var options = Object.defineProperty({}, "passive", {
  717. get: function () {
  718. passiveSupported = true;
  719. }
  720. });
  721. window.addEventListener("test", null, options);
  722. } catch (err) {}
  723. this.container.addEventListener("mousewheel", function (e) {
  724. that.lastScrollTop = that.container.scrollTop;
  725. }, passiveSupported ? {
  726. passive: true
  727. }
  728. : false);
  729. this.container.addEventListener('paste', function (e) {
  730. console.log("paste")
  731. if (!this.GrowHeight.acceptEnter) {
  732. var vvv = (e.clipboardData || window.clipboardData).getData('text/plain').replace(/\n/g, "");
  733. this.focus();
  734. if (document.all) {
  735. var r = document.selection.createRange();
  736. document.selection.empty();
  737. r.text = vvv;
  738. r.collapse();
  739. r.select();
  740. } else {
  741. var newstart = this.selectionStart + vvv.length;
  742. var pfx = this.value.substr(0, this.selectionStart);
  743. var sfx = this.value.substring(this.selectionEnd);
  744. this.value = pfx + vvv + sfx;
  745. this.selectionStart = newstart;
  746. this.selectionEnd = newstart;
  747. }
  748. e.preventDefault();
  749. e.stopPropagation();
  750. return false;
  751. this.GrowHeight.onInput();
  752. }
  753. });
  754. }
  755. this.inited = true;
  756. this.hide();
  757. }
  758. // loadSmallScorll($(this.wrapper).find(".smallScrollbar")); // 初始化伪滚动条
  759. }
  760. function $ISBOX(element) {
  761. return $CSS(element, "box-sizing") == "border-box";
  762. }
  763. //////////////////////////////////////////////////////////////////////////////////////////////////////////////
  764. function $PT(element) {
  765. $ISBOX(element);
  766. return $NUMOFCSS(element, "padding-top", 0);
  767. }
  768. function $PR(element) {
  769. return $NUMOFCSS(element, "padding-right", 0);
  770. }
  771. function $PB(element) {
  772. return $NUMOFCSS(element, "padding-bottom", 0);
  773. }
  774. function $PL(element) {
  775. return $NUMOFCSS(element, "padding-left", 0);
  776. }
  777. function $CSS(element, name) {
  778. if (typeof(window.getComputedStyle) == 'undefined') {
  779. return element.currentStyle[name];
  780. }
  781. return window.getComputedStyle(element)[name];
  782. }
  783. function $DSP(element) {
  784. return $CSS(element, "display");
  785. }
  786. function $NUMOFCSS(element, name, def) {
  787. var v = parseFloat($CSS(element, name));
  788. v = isNaN(v) ? def : v;
  789. return v;
  790. }
  791. function $W(element) {
  792. return $NUMOFCSS(element, "width");
  793. }
  794. function $H(element) {
  795. return $NUMOFCSS(element, "height");
  796. }
  797. function $R(element) {
  798. return $NUMOFCSS(element, "right");
  799. }
  800. function $MAH(element) {
  801. return $NUMOFCSS(element, "max-height");
  802. }
  803. function $MIH(element) {
  804. return $NUMOFCSS(element, "min-height");
  805. }
  806. function $MT(element) {
  807. return $NUMOFCSS(element, "margin-top", 0);
  808. }
  809. function $MB(element) {
  810. return $NUMOFCSS(element, "margin-bottom", 0);
  811. }
  812. function $ML(element) {
  813. return $NUMOFCSS(element, "margin-left", 0);
  814. }
  815. function $MR(element) {
  816. return $NUMOFCSS(element, "margin-right", 0);
  817. }
  818. function $BL(element) {
  819. return $NUMOFCSS(element, "border-left", 0);
  820. }
  821. function $BR(element) {
  822. return $NUMOFCSS(element, "border-right", 0);
  823. }
  824. function $BOXWIDTH(element) {
  825. return $PL(element) + $PR(element) + $BL(element) + $BR(element);
  826. }
  827. function $BOXHEIGHT(element) {
  828. return $PT(element) + $PB(element) + $BT(element) + $BB(element);
  829. }
  830. function $MAWS(element, def) {
  831. var va = $CSS(element, "max-width");
  832. va = isNaN(parseFloat(va)) ? $CSS(element, "width") : va;
  833. return isNaN(parseFloat(va)) ? def : va;
  834. }
  835. function $REALHEIGHT(element) {
  836. var b = $ISBOX(element);
  837. var height = $NUMOFCSS(element, "height");
  838. if (height == null || typeof(height) == 'undefined') {
  839. //兼容IE8
  840. console.log("兼容IE8");
  841. height = 35;
  842. }
  843. if (!b) {
  844. height += $BOXHEIGHT(element);
  845. }
  846. return height;
  847. }
  848. function $REALWIDTH(element) {
  849. var b = $ISBOX(element);
  850. var width = $NUMOFCSS(element, "width");
  851. if (!b) {
  852. width += $BOXWIDTH(element);
  853. }
  854. return width;
  855. }
  856. function $INNERWIDTH(element) {
  857. var b = $ISBOX(element),
  858. width = $NUMOFCSS(element, "width");
  859. if (b) {
  860. width -= $BOXWIDTH(element);
  861. }
  862. return width;
  863. }
  864. function $INNERHEIGHT(element) {
  865. var b = $ISBOX(element),
  866. height = $NUMOFCSS(element, "height");
  867. if (height == null || typeof(height) == 'undefined') {
  868. //兼容IE8
  869. height = 38
  870. }
  871. if (b) {
  872. height -= $BOXHEIGHT(element);
  873. }
  874. return height;
  875. }
  876. function $LH(element, default_) {
  877. return $NUMOFCSS(element, "line-height", default_);
  878. }
  879. function $HIDDENOVERFLOW(element) {
  880. var h = [];
  881. var a = [];
  882. var p = element;
  883. while (p.parentNode && p.parentNode.nodeType == 1) {
  884. p = p.parentNode;
  885. if (p.parentNode.nodeType != 1)
  886. break;
  887. var ofy = $CSS(p, "overflow-y");
  888. if ((ofy.indexOf("auto") > -1 || ofy.indexOf("scroll") > -1) && p.scrollHeight != p.clientHeight) {
  889. //滚动高度等于元素高度的就算了
  890. a.push(p);
  891. } else if (ofy == "hidden") {
  892. h.push(p);
  893. var eb = element.getBoundingClientRect();
  894. var pb = p.getBoundingClientRect();
  895. var ph = $height100(p),
  896. eh = $maxHeight100(element) - pb.top + eb.top;
  897. if (ph < eh) {
  898. return p;
  899. }
  900. }
  901. }
  902. p = h.length > 0 ? h[0] : (a.length > 0 ? a[0] : document.body.parentNode);
  903. return p;
  904. }
  905. function $BT(element) {
  906. return $NUMOFCSS(element, "border-top", 0);
  907. }
  908. function $BB(element) {
  909. return $NUMOFCSS(element, "border-bottom", 0);
  910. }
  911. function debugLog() {
  912. event && event.ctrlKey && console.trace.apply(this, arguments);
  913. }
  914. function $innerHeight(element, height) {
  915. var p = element.parentNode;
  916. if ($ISBOX(p)) { //父级是box,要减掉padding,border
  917. height -= $BOXHEIGHT(p);
  918. }
  919. return height;
  920. }
  921. function $height100(element) {
  922. return $innerHeight(element, $INNERHEIGHT(element.parentNode));
  923. }
  924. function $minHeight100(element) {
  925. return $innerHeight(element, element.GrowHeight.minHeight);
  926. }
  927. function $maxHeight100(element) {
  928. return $innerHeight(element, $INNERHEIGHT(element.parentNode));
  929. }
  930. function $scrollHeight100(element) {
  931. return $innerHeight(element, element.scrollHeight);
  932. }