You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

dom.js 6.9 KiB

14 years ago
13 years ago
13 years ago
13 years ago
13 years ago
14 years ago
13 years ago
13 years ago
13 years ago
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250
  1. // Copyright (c) 2013, Web Notes Technologies Pvt. Ltd.
  2. // MIT License. See license.txt
  3. // add a new dom element
  4. wn.provide('wn.dom');
  5. wn.dom = {
  6. id_count: 0,
  7. freeze_count: 0,
  8. by_id: function(id) {
  9. return document.getElementById(id);
  10. },
  11. set_unique_id: function(ele) {
  12. var id = 'unique-' + wn.dom.id_count;
  13. if(ele)
  14. ele.setAttribute('id', id);
  15. wn.dom.id_count++;
  16. return id;
  17. },
  18. eval: function(txt) {
  19. if(!txt) return;
  20. var el = document.createElement('script');
  21. el.appendChild(document.createTextNode(txt));
  22. // execute the script globally
  23. document.getElementsByTagName('head')[0].appendChild(el);
  24. },
  25. set_style: function(txt) {
  26. if(!txt) return;
  27. var se = document.createElement('style');
  28. se.type = "text/css";
  29. if (se.styleSheet) {
  30. se.styleSheet.cssText = txt;
  31. } else {
  32. se.appendChild(document.createTextNode(txt));
  33. }
  34. document.getElementsByTagName('head')[0].appendChild(se);
  35. },
  36. add: function(parent, newtag, className, cs, innerHTML, onclick) {
  37. if(parent && parent.substr)parent = wn.dom.by_id(parent);
  38. var c = document.createElement(newtag);
  39. if(parent)
  40. parent.appendChild(c);
  41. // if image, 3rd parameter is source
  42. if(className) {
  43. if(newtag.toLowerCase()=='img')
  44. c.src = className
  45. else
  46. c.className = className;
  47. }
  48. if(cs) wn.dom.css(c,cs);
  49. if(innerHTML) c.innerHTML = innerHTML;
  50. if(onclick) c.onclick = onclick;
  51. return c;
  52. },
  53. css: function(ele, s) {
  54. if(ele && s) {
  55. for(var i in s) ele.style[i]=s[i];
  56. };
  57. return ele;
  58. },
  59. freeze: function() {
  60. // blur
  61. if(!$('#freeze').length) {
  62. $("<div id='freeze'>").appendTo("#body_div").css('opacity', 0.6);
  63. }
  64. $('#freeze').toggle(true);
  65. wn.dom.freeze_count++;
  66. },
  67. unfreeze: function() {
  68. if(!wn.dom.freeze_count)return; // anything open?
  69. wn.dom.freeze_count--;
  70. if(!wn.dom.freeze_count) {
  71. $('#freeze').toggle(false);
  72. }
  73. },
  74. save_selection: function() {
  75. // via http://stackoverflow.com/questions/5605401/insert-link-in-contenteditable-element
  76. if (window.getSelection) {
  77. sel = window.getSelection();
  78. if (sel.getRangeAt && sel.rangeCount) {
  79. var ranges = [];
  80. for (var i = 0, len = sel.rangeCount; i < len; ++i) {
  81. ranges.push(sel.getRangeAt(i));
  82. }
  83. return ranges;
  84. }
  85. } else if (document.selection && document.selection.createRange) {
  86. return document.selection.createRange();
  87. }
  88. return null;
  89. },
  90. restore_selection: function(savedSel) {
  91. if (savedSel) {
  92. if (window.getSelection) {
  93. sel = window.getSelection();
  94. sel.removeAllRanges();
  95. for (var i = 0, len = savedSel.length; i < len; ++i) {
  96. sel.addRange(savedSel[i]);
  97. }
  98. } else if (document.selection && savedSel.select) {
  99. savedSel.select();
  100. }
  101. }
  102. }
  103. }
  104. var pending_req = 0
  105. wn.set_loading = function() {
  106. pending_req++;
  107. //$('#spinner').css('visibility', 'visible');
  108. $('body').css('cursor', 'progress');
  109. NProgress.start();
  110. }
  111. wn.done_loading = function() {
  112. pending_req--;
  113. if(!pending_req){
  114. $('body').css('cursor', 'default');
  115. //$('#spinner').css('visibility', 'hidden');
  116. NProgress.done();
  117. } else {
  118. NProgress.inc();
  119. }
  120. }
  121. var get_hex = function(i) {
  122. i = Math.round(i);
  123. if(i>255) return 'ff';
  124. if(i<0) return '00';
  125. i =i .toString(16);
  126. if(i.length==1) i = '0'+i;
  127. return i;
  128. }
  129. wn.get_shade = function(color, factor) {
  130. if(color.substr(0,3)=="rgb") {
  131. var rgb = function(r,g,b) {
  132. return get_hex(r) + get_hex(g) + get_hex(b);
  133. }
  134. color = eval(color);
  135. }
  136. if(color.substr(0,1)=="#") {
  137. var color = color.substr(1);
  138. }
  139. var get_int = function(hex) {
  140. return parseInt(hex,16);
  141. }
  142. return get_hex(get_int(color.substr(0,2)) + factor)
  143. + get_hex(get_int(color.substr(2,2)) + factor)
  144. + get_hex(get_int(color.substr(4,2)) + factor)
  145. }
  146. wn.get_gradient_css = function(col, diff) {
  147. if(!diff) diff = 10
  148. var col1 = wn.get_shade(col, diff);
  149. var col2 = wn.get_shade(col, -diff);
  150. return "\nbackground-color: " + col + " !important;"
  151. +"\nbackground: -moz-linear-gradient(top, #"+col1+" 0%, #"+col2+" 99%) !important;"
  152. +"\nbackground:-webkit-gradient(linear, left top, left bottom, color-stop(0%,#"+col1+"), color-stop(99%,#"+col2+")) !important;"
  153. +"\nbackground:-webkit-linear-gradient(top, #"+col1+" 0%,#"+col2+" 99%) !important;"
  154. +"\nbackground:-o-linear-gradient(top, #"+col1+" 0%,#"+col2+" 99%) !important;"
  155. +"\nbackground:-ms-linear-gradient(top, #"+col1+" 0%,#"+col2+" 99%) !important;"
  156. +"\nbackground:-o-linear-gradient(top, #"+col1+" 0%,#"+col2+" 99%) !important;"
  157. +"\nbackground:linear-gradient(top, #"+col1+" 0%,#%"+col2+" 99%) !important;"
  158. +"\nfilter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#"+col1+"', endColorstr='#"+col1+"',GradientType=0 ) !important;"
  159. }
  160. $.fn.gradientify = function(col) {
  161. if(!col) col = this.css("background-color");
  162. var col1 = wn.get_shade(col, 1.05);
  163. var col2 = wn.get_shade(col, 0.95);
  164. this.css({
  165. "background": "-moz-linear-gradient(top, #"+col1+" 0%, #"+col2+" 99%)"
  166. });
  167. this.css({
  168. "background": "-webkit-gradient(linear, left top, left bottom, color-stop(0%,#"+col1+"), color-stop(99%,#"+col2+"))"
  169. });
  170. this.css({
  171. "background": "-webkit-linear-gradient(top, #"+col1+" 0%,#"+col2+" 99%)"
  172. });
  173. this.css({
  174. "background": "-o-linear-gradient(top, #"+col1+" 0%,#"+col2+" 99%);"
  175. });
  176. this.css({
  177. "background": "-ms-linear-gradient(top, #"+col1+" 0%,#"+col2+" 99%);"
  178. });
  179. this.css({
  180. "background": "-o-linear-gradient(top, #"+col1+" 0%,#"+col2+" 99%);"
  181. });
  182. this.css({
  183. "background": "linear-gradient(top, #"+col1+" 0%,#%"+col2+" 99%);"
  184. });
  185. this.css({
  186. "filter": "progid:DXImageTransform.Microsoft.gradient( startColorstr='#"+col1+"', endColorstr='#"+col1+"',GradientType=0 )"
  187. });
  188. }
  189. wn.get_cookie = function(c) {
  190. var clist = (document.cookie+'').split(';');
  191. var cookies = {};
  192. for(var i=0;i<clist.length;i++) {
  193. var tmp = clist[i].split('=');
  194. cookies[strip(tmp[0])] = strip(tmp[1]);
  195. }
  196. return cookies[c];
  197. }
  198. wn.dom.set_box_shadow = function(ele, spread) {
  199. $(ele).css('-moz-box-shadow', '0px 0px '+ spread +'px rgba(0,0,0,0.3);')
  200. $(ele).css('-webkit-box-shadow', '0px 0px '+ spread +'px rgba(0,0,0,0.3);')
  201. $(ele).css('-box-shadow', '0px 0px '+ spread +'px rgba(0,0,0,0.3);')
  202. };
  203. // add <option> list to <select>
  204. (function($) {
  205. $.fn.add_options = function(options_list) {
  206. // create options
  207. for(var i=0; i<options_list.length; i++) {
  208. var v = options_list[i];
  209. value = v.value || v;
  210. label = wn._(v.label || v);
  211. $('<option>').html(label).attr('value', value).appendTo(this);
  212. }
  213. // select the first option
  214. this.selectedIndex = 0;
  215. return $(this);
  216. }
  217. $.fn.set_working = function() {
  218. var ele = this.get(0);
  219. $(ele).prop('disabled', true);
  220. if(ele.loading_img) {
  221. $(ele.loading_img).toggle(true);
  222. } else {
  223. ele.loading_img = $('<img src="lib/images/ui/button-load.gif" \
  224. style="margin-left: 4px; margin-bottom: -2px; display: inline;" />')
  225. .insertAfter(ele);
  226. }
  227. }
  228. $.fn.done_working = function() {
  229. var ele = this.get(0);
  230. $(ele).prop('disabled', false);
  231. if(ele.loading_img) {
  232. $(ele.loading_img).toggle(false);
  233. };
  234. }
  235. })(jQuery);