index.js 3.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156
  1. // TODO - Add initial page loading and handlers
  2. (function($,History){
  3. var State = History.getState(),
  4. Key = null,
  5. flag = false,
  6. exists = function(v){
  7. return typeof v != 'undefined';
  8. },
  9. setKey = window.setKey = function(key){
  10. if(key !== null){
  11. console.log('Key change to '+key);
  12. Key = key;
  13. var d = new Date();
  14. d.setTime(d.getTime()+3600);
  15. $.cookie('key',key,{
  16. expires: d
  17. });
  18. }else{
  19. console.log('Key deleted');
  20. Key = null;
  21. $.removeCookie('key');
  22. }
  23. },
  24. getKey = window.getKey = function(){
  25. return Key;
  26. },
  27. api = window.apiCall = function(data,callback){
  28. data.get = 'api';
  29. data.timestamp = +new Date;
  30. if(exists(State.data.key)){
  31. data.key = State.data.key;
  32. }
  33. $.get(location.href,data,function(d){
  34. if(exists(d['error'])){
  35. alert(d.error);
  36. }else{
  37. if(location.href.substr(location.href.lastIndexOf('/')+1) != d.state.url){
  38. History.pushState(d.state.data,d.state.title,d.state.url);
  39. }
  40. if(exists(callback)){
  41. callback(d);
  42. }
  43. }
  44. },'json');
  45. },
  46. loadState = window.loadState = function(href,callback){
  47. var data = {get:'state',timestamp:+new Date};
  48. if(Key !== null){
  49. data.key = Key;
  50. }
  51. $.get(href,data,function(d){
  52. History.pushState(d.state.data,document.title,href);
  53. State = History.getState();
  54. if(exists(callback)){
  55. callback();
  56. }
  57. },'json');
  58. },
  59. apiState = window.apiState = function(href,callback){
  60. var data = {get:'state',timestamp:+new Date};
  61. if(Key !== null){
  62. data.key = Key;
  63. }
  64. $.get(href,data,function(d){
  65. History.replaceState(d.state.data,document.title,href);
  66. State = History.getState();
  67. if(exists(callback)){
  68. callback();
  69. }
  70. },'json');
  71. };
  72. if(exists($.cookie('key'))){
  73. setKey($.cookie('key'));
  74. }else{
  75. setKey(null);
  76. }
  77. $(document).ready(function(){
  78. $(window).on('statechange',function(){
  79. var Old = State;
  80. State = History.getState();
  81. if(Key !== null){
  82. State.key = Key;
  83. State.data.key = Key;
  84. }else{
  85. if(exists(State.data['key'])){
  86. Key = State.data.key;
  87. }else if(exists(State['key'])){
  88. Key = State.key;
  89. }
  90. }
  91. if(State.data.type != Old.data.type || State.data.id != Old.data.id){
  92. console.log("State change. "+JSON.stringify(State));
  93. switch(State.data.type){
  94. case 'template':
  95. api(State.data,function(d){
  96. if(Key !== null){
  97. d.context.key = Key
  98. }
  99. $('#content').html(Handlebars.compile(d.template)(d.context)).mCustomScrollbar('destroy');
  100. $('#content,.scroll').mCustomScrollbar({
  101. theme: 'dark-2',
  102. scrollInertia: 0
  103. });
  104. $('#content').find('a').each(function(){
  105. var href = this.href;
  106. if(href.indexOf(location.origin) != -1 && href.indexOf('#') != -1){
  107. href = href.substr(href.indexOf('#')+1);
  108. console.log('Setting up link to '+href);
  109. $(this).click(function(){
  110. loadState(href);
  111. return false;
  112. });
  113. }
  114. });
  115. });
  116. break;
  117. default:
  118. alert("Something went wrong!\nYour current state:\n"+JSON.stringify(State));
  119. }
  120. }
  121. });
  122. if($.isEmptyObject(State.data)){
  123. History.replaceState({
  124. type: 'template',
  125. id: 'index'
  126. },'Bugs','page-index');
  127. console.log('Forcing default state.');
  128. }else{
  129. flag = true;
  130. }
  131. apiState(location.href,function(){
  132. if(flag){
  133. State.data = {
  134. type: '',
  135. data: ''
  136. };
  137. }
  138. $(window).trigger('statechange');
  139. });
  140. });
  141. $.fn.serializeObject = function(){
  142. var o = {},
  143. a = this.serializeArray();
  144. $.each(a,function(){
  145. if(o[this.name] !== undefined){
  146. if(!o[this.name].push){
  147. o[this.name] = [o[this.name]];
  148. }
  149. o[this.name].push(this.value || '');
  150. }else{
  151. o[this.name] = this.value || '';
  152. }
  153. });
  154. return o;
  155. };
  156. })(jQuery,History);