scripts.js 11 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467
  1. function supportstorage() {
  2. if (typeof window.localStorage=='object')
  3. return true;
  4. else
  5. return false;
  6. }
  7. function handleSaveLayout() {
  8. var e = $(".demo").html();
  9. if (!stopsave && e != window.demoHtml) {
  10. stopsave++;
  11. window.demoHtml = e;
  12. saveLayout();
  13. stopsave--;
  14. }
  15. }
  16. var layouthistory;
  17. function saveLayout(){
  18. var data = layouthistory;
  19. if (!data) {
  20. data={};
  21. data.count = 0;
  22. data.list = [];
  23. }
  24. if (data.list.length>data.count) {
  25. for (i=data.count;i<data.list.length;i++)
  26. data.list[i]=null;
  27. }
  28. data.list[data.count] = window.demoHtml;
  29. data.count++;
  30. if (supportstorage()) {
  31. localStorage.setItem("layoutdata",JSON.stringify(data));
  32. }
  33. layouthistory = data;
  34. //myconsole.log(data);
  35. /*$.ajax({
  36. type: "POST",
  37. url: "/build/saveLayout",
  38. data: { layout: $('.demo').html() },
  39. success: function(data) {
  40. //updateButtonsVisibility();
  41. }
  42. });*/
  43. }
  44. function downloadLayout(){
  45. $.ajax({
  46. type: "POST",
  47. url: "/build/downloadLayout",
  48. data: { layout: $('#download-layout').html() },
  49. success: function(data) { window.location.href = 'download-2.html'; }
  50. });
  51. }
  52. function downloadHtmlLayout(){
  53. $.ajax({
  54. type: "POST",
  55. url: "/build/downloadLayout",
  56. data: { layout: $('#download-layout').html() },
  57. success: function(data) { window.location.href = 'downloadhtml-2.html'; }
  58. });
  59. }
  60. function undoLayout() {
  61. var data = layouthistory;
  62. //myconsole.log(data);
  63. if (data) {
  64. if (data.count<2) return false;
  65. window.demoHtml = data.list[data.count-2];
  66. data.count--;
  67. $('.demo').html(window.demoHtml);
  68. if (supportstorage()) {
  69. localStorage.setItem("layoutdata",JSON.stringify(data));
  70. }
  71. return true;
  72. }
  73. return false;
  74. /*$.ajax({
  75. type: "POST",
  76. url: "/build/getPreviousLayout",
  77. data: { },
  78. success: function(data) {
  79. undoOperation(data);
  80. }
  81. });*/
  82. }
  83. function redoLayout() {
  84. var data = layouthistory;
  85. if (data) {
  86. if (data.list[data.count]) {
  87. window.demoHtml = data.list[data.count];
  88. data.count++;
  89. $('.demo').html(window.demoHtml);
  90. if (supportstorage()) {
  91. localStorage.setItem("layoutdata",JSON.stringify(data));
  92. }
  93. return true;
  94. }
  95. }
  96. return false;
  97. /*
  98. $.ajax({
  99. type: "POST",
  100. url: "/build/getPreviousLayout",
  101. data: { },
  102. success: function(data) {
  103. redoOperation(data);
  104. }
  105. });*/
  106. }
  107. function handleJsIds() {
  108. handleModalIds();
  109. handleAccordionIds();
  110. handleCarouselIds();
  111. handleTabsIds()
  112. }
  113. function handleAccordionIds() {
  114. var e = $(".demo #myAccordion");
  115. var t = randomNumber();
  116. var n = "accordion-" + t;
  117. var r;
  118. e.attr("id", n);
  119. e.find(".accordion-group").each(function(e, t) {
  120. r = "accordion-element-" + randomNumber();
  121. $(t).find(".accordion-toggle").each(function(e, t) {
  122. $(t).attr("data-parent", "#" + n);
  123. $(t).attr("href", "#" + r)
  124. });
  125. $(t).find(".accordion-body").each(function(e, t) {
  126. $(t).attr("id", r)
  127. })
  128. })
  129. }
  130. function handleCarouselIds() {
  131. var e = $(".demo #myCarousel");
  132. var t = randomNumber();
  133. var n = "carousel-" + t;
  134. e.attr("id", n);
  135. e.find(".carousel-indicators li").each(function(e, t) {
  136. $(t).attr("data-target", "#" + n)
  137. });
  138. e.find(".left").attr("href", "#" + n);
  139. e.find(".right").attr("href", "#" + n)
  140. }
  141. function handleModalIds() {
  142. var e = $(".demo #myModalLink");
  143. var t = randomNumber();
  144. var n = "modal-container-" + t;
  145. var r = "modal-" + t;
  146. e.attr("id", r);
  147. e.attr("href", "#" + n);
  148. e.next().attr("id", n)
  149. }
  150. function handleTabsIds() {
  151. var e = $(".demo #myTabs");
  152. var t = randomNumber();
  153. var n = "tabs-" + t;
  154. e.attr("id", n);
  155. e.find(".tab-pane").each(function(e, t) {
  156. var n = $(t).attr("id");
  157. var r = "panel-" + randomNumber();
  158. $(t).attr("id", r);
  159. $(t).parent().parent().find("a[href=#" + n + "]").attr("href", "#" + r)
  160. })
  161. }
  162. function randomNumber() {
  163. return randomFromInterval(1, 1e6)
  164. }
  165. function randomFromInterval(e, t) {
  166. return Math.floor(Math.random() * (t - e + 1) + e)
  167. }
  168. function gridSystemGenerator() {
  169. $(".lyrow .preview input").bind("keyup", function() {
  170. var e = 0;
  171. var t = "";
  172. var n = $(this).val().split(" ", 12);
  173. $.each(n, function(n, r) {
  174. e = e + parseInt(r);
  175. t += '<div class="span' + r + ' column"></div>'
  176. });
  177. if (e == 12) {
  178. $(this).parent().next().children().html(t);
  179. $(this).parent().prev().show()
  180. } else {
  181. $(this).parent().prev().hide()
  182. }
  183. })
  184. }
  185. function configurationElm(e, t) {
  186. $(".demo").delegate(".configuration > a", "click", function(e) {
  187. e.preventDefault();
  188. var t = $(this).parent().next().next().children();
  189. $(this).toggleClass("active");
  190. t.toggleClass($(this).attr("rel"))
  191. });
  192. $(".demo").delegate(".configuration .dropdown-menu a", "click", function(e) {
  193. e.preventDefault();
  194. var t = $(this).parent().parent();
  195. var n = t.parent().parent().next().next().children();
  196. t.find("li").removeClass("active");
  197. $(this).parent().addClass("active");
  198. var r = "";
  199. t.find("a").each(function() {
  200. r += $(this).attr("rel") + " "
  201. });
  202. t.parent().removeClass("open");
  203. n.removeClass(r);
  204. n.addClass($(this).attr("rel"))
  205. })
  206. }
  207. function removeElm() {
  208. $(".demo").delegate(".remove", "click", function(e) {
  209. e.preventDefault();
  210. $(this).parent().remove();
  211. if (!$(".demo .lyrow").length > 0) {
  212. clearDemo()
  213. }
  214. })
  215. }
  216. function clearDemo() {
  217. $(".demo").empty();
  218. layouthistory = null;
  219. if (supportstorage())
  220. localStorage.removeItem("layoutdata");
  221. }
  222. function removeMenuClasses() {
  223. $("#menu-layoutit li button").removeClass("active")
  224. }
  225. function changeStructure(e, t) {
  226. $("#download-layout ." + e).removeClass(e).addClass(t)
  227. }
  228. function cleanHtml(e) {
  229. $(e).parent().append($(e).children().html())
  230. }
  231. function downloadLayoutSrc() {
  232. var e = "";
  233. $("#download-layout").children().html($(".demo").html());
  234. var t = $("#download-layout").children();
  235. t.find(".preview, .configuration, .drag, .remove").remove();
  236. t.find(".lyrow").addClass("removeClean");
  237. t.find(".box-element").addClass("removeClean");
  238. t.find(".lyrow .lyrow .lyrow .lyrow .lyrow .removeClean").each(function() {
  239. cleanHtml(this)
  240. });
  241. t.find(".lyrow .lyrow .lyrow .lyrow .removeClean").each(function() {
  242. cleanHtml(this)
  243. });
  244. t.find(".lyrow .lyrow .lyrow .removeClean").each(function() {
  245. cleanHtml(this)
  246. });
  247. t.find(".lyrow .lyrow .removeClean").each(function() {
  248. cleanHtml(this)
  249. });
  250. t.find(".lyrow .removeClean").each(function() {
  251. cleanHtml(this)
  252. });
  253. t.find(".removeClean").each(function() {
  254. cleanHtml(this)
  255. });
  256. t.find(".removeClean").remove();
  257. $("#download-layout .column").removeClass("ui-sortable");
  258. $("#download-layout .row-fluid").removeClass("clearfix").children().removeClass("column");
  259. if ($("#download-layout .container").length > 0) {
  260. changeStructure("row-fluid", "row")
  261. }
  262. formatSrc = $.htmlClean($("#download-layout").html(), {
  263. format: true,
  264. allowedAttributes: [
  265. ["id"],
  266. ["class"],
  267. ["data-toggle"],
  268. ["data-target"],
  269. ["data-parent"],
  270. ["role"],
  271. ["data-dismiss"],
  272. ["aria-labelledby"],
  273. ["aria-hidden"],
  274. ["data-slide-to"],
  275. ["data-slide"]
  276. ]
  277. });
  278. $("#download-layout").html(formatSrc);
  279. $("#downloadModal textarea").empty();
  280. $("#downloadModal textarea").val(formatSrc)
  281. }
  282. var currentDocument = null;
  283. var timerSave = 1000;
  284. var stopsave = 0;
  285. var startdrag = 0;
  286. var demoHtml = $(".demo").html();
  287. var currenteditor = null;
  288. $(window).resize(function() {
  289. $("body").css("min-height", $(window).height() - 90);
  290. $(".demo").css("min-height", $(window).height() - 160)
  291. });
  292. function restoreData(){
  293. if (supportstorage()) {
  294. layouthistory = JSON.parse(localStorage.getItem("layoutdata"));
  295. if (!layouthistory) return false;
  296. window.demoHtml = layouthistory.list[layouthistory.count-1];
  297. if (window.demoHtml) $(".demo").html(window.demoHtml);
  298. }
  299. }
  300. function initContainer(){
  301. $(".demo, .demo .column").sortable({
  302. connectWith: ".column",
  303. opacity: .35,
  304. handle: ".drag",
  305. start: function(e,t) {
  306. if (!startdrag) stopsave++;
  307. startdrag = 1;
  308. },
  309. stop: function(e,t) {
  310. if(stopsave>0) stopsave--;
  311. startdrag = 0;
  312. }
  313. });
  314. configurationElm();
  315. }
  316. $(document).ready(function() {
  317. CKEDITOR.disableAutoInline = true;
  318. restoreData();
  319. var contenthandle = CKEDITOR.replace( 'contenteditor' ,{
  320. language: 'zh-cn',
  321. contentsCss: ['css/bootstrap-combined.min.css'],
  322. allowedContent: true
  323. });
  324. $("body").css("min-height", $(window).height() - 90);
  325. $(".demo").css("min-height", $(window).height() - 160);
  326. $(".sidebar-nav .lyrow").draggable({
  327. connectToSortable: ".demo",
  328. helper: "clone",
  329. handle: ".drag",
  330. start: function(e,t) {
  331. if (!startdrag) stopsave++;
  332. startdrag = 1;
  333. },
  334. drag: function(e, t) {
  335. t.helper.width(400)
  336. },
  337. stop: function(e, t) {
  338. $(".demo .column").sortable({
  339. opacity: .35,
  340. connectWith: ".column",
  341. start: function(e,t) {
  342. if (!startdrag) stopsave++;
  343. startdrag = 1;
  344. },
  345. stop: function(e,t) {
  346. if(stopsave>0) stopsave--;
  347. startdrag = 0;
  348. }
  349. });
  350. if(stopsave>0) stopsave--;
  351. startdrag = 0;
  352. }
  353. });
  354. $(".sidebar-nav .box").draggable({
  355. connectToSortable: ".column",
  356. helper: "clone",
  357. handle: ".drag",
  358. start: function(e,t) {
  359. if (!startdrag) stopsave++;
  360. startdrag = 1;
  361. },
  362. drag: function(e, t) {
  363. t.helper.width(400)
  364. },
  365. stop: function() {
  366. handleJsIds();
  367. if(stopsave>0) stopsave--;
  368. startdrag = 0;
  369. }
  370. });
  371. initContainer();
  372. $('body.edit .demo').on("click","[data-target=#editorModal]",function(e) {
  373. e.preventDefault();
  374. currenteditor = $(this).parent().parent().find('.view');
  375. var eText = currenteditor.html();
  376. contenthandle.setData(eText);
  377. });
  378. $("#savecontent").click(function(e) {
  379. e.preventDefault();
  380. currenteditor.html(contenthandle.getData());
  381. });
  382. $("[data-target=#downloadModal]").click(function(e) {
  383. e.preventDefault();
  384. downloadLayoutSrc();
  385. });
  386. $("[data-target=#shareModal]").click(function(e) {
  387. e.preventDefault();
  388. handleSaveLayout();
  389. });
  390. $("#download").click(function() {
  391. downloadLayout();
  392. return false
  393. });
  394. $("#downloadhtml").click(function() {
  395. downloadHtmlLayout();
  396. return false
  397. });
  398. $("#edit").click(function() {
  399. $("body").removeClass("devpreview sourcepreview");
  400. $("body").addClass("edit");
  401. removeMenuClasses();
  402. $(this).addClass("active");
  403. return false
  404. });
  405. $("#clear").click(function(e) {
  406. e.preventDefault();
  407. clearDemo()
  408. });
  409. $("#devpreview").click(function() {
  410. $("body").removeClass("edit sourcepreview");
  411. $("body").addClass("devpreview");
  412. removeMenuClasses();
  413. $(this).addClass("active");
  414. return false
  415. });
  416. $("#sourcepreview").click(function() {
  417. $("body").removeClass("edit");
  418. $("body").addClass("devpreview sourcepreview");
  419. removeMenuClasses();
  420. $(this).addClass("active");
  421. return false
  422. });
  423. $("#fluidPage").click(function(e) {
  424. e.preventDefault();
  425. changeStructure("container", "container-fluid");
  426. $("#fixedPage").removeClass("active");
  427. $(this).addClass("active");
  428. downloadLayoutSrc()
  429. });
  430. $("#fixedPage").click(function(e) {
  431. e.preventDefault();
  432. changeStructure("container-fluid", "container");
  433. $("#fluidPage").removeClass("active");
  434. $(this).addClass("active");
  435. downloadLayoutSrc()
  436. });
  437. $(".nav-header").click(function() {
  438. $(".sidebar-nav .boxes, .sidebar-nav .rows").hide();
  439. $(this).next().slideDown()
  440. });
  441. $('#undo').click(function(){
  442. stopsave++;
  443. if (undoLayout()) initContainer();
  444. stopsave--;
  445. });
  446. $('#redo').click(function(){
  447. stopsave++;
  448. if (redoLayout()) initContainer();
  449. stopsave--;
  450. });
  451. removeElm();
  452. gridSystemGenerator();
  453. setInterval(function() {
  454. handleSaveLayout()
  455. }, timerSave)
  456. })