PageRenderTime 47ms CodeModel.GetById 21ms RepoModel.GetById 0ms app.codeStats 0ms

/wp-content/plugins/siteorigin-panels/js/siteorigin-panels-history.js

https://gitlab.com/haque.mdmanzurul/wp-harpar-carolyn
JavaScript | 315 lines | 185 code | 63 blank | 67 comment | 22 complexity | 7ab71dcc3b41ede2d7ad41578b5344c1 MD5 | raw file
  1. /**
  2. * History browser for Page Builder.
  3. *
  4. * @copyright Greg Priday 2014 - <https://siteorigin.com/>
  5. * @license GPL 3.0 http://www.gnu.org/licenses/gpl.html
  6. */
  7. ( function( $, _, panelsOptions ){
  8. var panels = window.siteoriginPanels;
  9. /**
  10. *
  11. */
  12. panels.model.historyEntry = Backbone.Model.extend( {
  13. defaults: {
  14. text : '',
  15. data : '',
  16. time: null,
  17. count: 1
  18. }
  19. } );
  20. /**
  21. *
  22. */
  23. panels.collection.historyEntries = Backbone.Collection.extend( {
  24. model: panels.model.historyEntry,
  25. /**
  26. * The builder model
  27. */
  28. builder: null,
  29. /**
  30. * The maximum number of items in the history
  31. */
  32. maxSize: 12,
  33. initialize: function(){
  34. this.on( 'add', this.onAddEntry, this );
  35. },
  36. /**
  37. * Add an entry to the collection.
  38. *
  39. * @param text The text that defines the action taken to get to this
  40. * @param data
  41. */
  42. addEntry: function(text, data) {
  43. if(typeof data === 'undefined' || data === null) {
  44. data = this.builder.getPanelsData();
  45. }
  46. var entry = new panels.model.historyEntry( {
  47. text: text,
  48. data: JSON.stringify( data ),
  49. time: parseInt( new Date().getTime() / 1000 ),
  50. collection: this
  51. } );
  52. this.add( entry );
  53. },
  54. /**
  55. * Resize the collection so it's not bigger than this.maxSize
  56. */
  57. onAddEntry: function(entry){
  58. if(this.models.length > 1) {
  59. var lastEntry = this.at(this.models.length - 2);
  60. if(
  61. ( entry.get('text') === lastEntry.get('text') && entry.get('time') - lastEntry.get('time') < 15 ) ||
  62. ( entry.get('data') === lastEntry.get('data') )
  63. ) {
  64. // If both entries have the same text and are within 20 seconds of each other, or have the same data, then remove most recent
  65. this.remove( entry );
  66. lastEntry.set( 'count', lastEntry.get('count') + 1 );
  67. }
  68. }
  69. // Make sure that there are not to many entries in this collection
  70. while( this.models.length > this.maxSize ) {
  71. this.shift();
  72. }
  73. }
  74. } );
  75. /**
  76. * The history manager is
  77. */
  78. panels.dialog.history = panels.view.dialog.extend( {
  79. historyEntryTemplate: _.template( $('#siteorigin-panels-dialog-history-entry').html().panelsProcessTemplate() ),
  80. entries: {},
  81. currentEntry: null,
  82. revertEntry: null,
  83. selectedEntry: null,
  84. dialogClass: 'so-panels-dialog-history',
  85. events: {
  86. 'click .so-close': 'closeDialog',
  87. 'click .so-restore': 'restoreSelectedEntry'
  88. },
  89. initializeDialog: function(){
  90. this.entries = new panels.collection.historyEntries();
  91. this.on('open_dialog', this.setCurrentEntry, this);
  92. this.on('open_dialog', this.renderHistoryEntries, this);
  93. },
  94. render: function(){
  95. // Render the dialog and attach it to the builder interface
  96. this.renderDialog( this.parseDialogContent( $('#siteorigin-panels-dialog-history').html(), {} ) );
  97. this.$('iframe.siteorigin-panels-history-iframe').load(function(){
  98. $(this).show();
  99. });
  100. },
  101. /**
  102. * Set the origianl entry. This should be set when creating the dialog.
  103. *
  104. * @param {panels.model.builder} builder
  105. */
  106. setRevertEntry: function(builder){
  107. this.revertEntry = new panels.model.historyEntry( {
  108. data: JSON.stringify( builder.getPanelsData() ),
  109. time: parseInt( new Date().getTime() / 1000 )
  110. } );
  111. },
  112. /**
  113. * This is triggered when the dialog is opened.
  114. */
  115. setCurrentEntry: function(){
  116. this.currentEntry = new panels.model.historyEntry( {
  117. data: JSON.stringify( this.builder.model.getPanelsData() ),
  118. time: parseInt( new Date().getTime() / 1000 )
  119. } );
  120. this.selectedEntry = this.currentEntry;
  121. this.previewEntry( this.currentEntry );
  122. this.$('.so-buttons .so-restore').addClass('disabled');
  123. },
  124. /**
  125. * Render the history entries
  126. */
  127. renderHistoryEntries: function(){
  128. var c = this.$('.history-entries');
  129. // Set up an interval that will display the time since every 10 seconds
  130. var thisView = this;
  131. c.empty();
  132. if( this.currentEntry.get('data') !== this.revertEntry.get('data') || this.entries.models.length > 0 ) {
  133. $(this.historyEntryTemplate({title: panelsOptions.loc.history.revert, count: 1}))
  134. .data('historyEntry', this.revertEntry)
  135. .prependTo(c);
  136. }
  137. // Now load all the entries in this.entries
  138. this.entries.each(function(entry){
  139. var html = thisView.historyEntryTemplate( {
  140. title: panelsOptions.loc.history[ entry.get('text') ],
  141. count: entry.get('count')
  142. } );
  143. $( html )
  144. .data('historyEntry', entry)
  145. .prependTo(c);
  146. });
  147. $(this.historyEntryTemplate({title: panelsOptions.loc.history['current'], count: 1}))
  148. .data('historyEntry', this.currentEntry)
  149. .addClass('so-selected')
  150. .prependTo(c);
  151. // Handle loading and selecting
  152. c.find('.history-entry').click(function(){
  153. var $$ = $(this);
  154. c.find('.history-entry').not($$).removeClass('so-selected');
  155. $$.addClass('so-selected');
  156. var entry = $$.data('historyEntry');
  157. thisView.selectedEntry = entry;
  158. if( thisView.selectedEntry.cid != thisView.currentEntry.cid ) {
  159. thisView.$('.so-buttons .so-restore').removeClass('disabled');
  160. }
  161. else {
  162. thisView.$('.so-buttons .so-restore').addClass('disabled');
  163. }
  164. thisView.previewEntry( entry );
  165. });
  166. this.updateEntryTimes();
  167. },
  168. /**
  169. * Preview an entry
  170. *
  171. * @param entry
  172. */
  173. previewEntry: function(entry){
  174. this.$('iframe.siteorigin-panels-history-iframe').hide();
  175. this.$('form.history-form input[name="siteorigin_panels_data"]').val( entry.get('data') );
  176. this.$('form.history-form').submit();
  177. },
  178. /**
  179. * Restore the current entry
  180. */
  181. restoreSelectedEntry: function(){
  182. if( this.$('.so-buttons .so-restore').hasClass('disabled') ) {
  183. return false;
  184. }
  185. if( this.currentEntry.get('data') === this.selectedEntry.get('data') ) {
  186. this.closeDialog();
  187. return false;
  188. }
  189. // Add an entry for this restore event
  190. if( this.selectedEntry.get('text') !== 'restore' ) {
  191. this.entries.addEntry( 'restore', this.builder.model.getPanelsData() );
  192. }
  193. this.builder.model.loadPanelsData( JSON.parse( this.selectedEntry.get('data') ) );
  194. this.closeDialog();
  195. return false;
  196. },
  197. /**
  198. * Update the entry times for the list of entries down the side
  199. */
  200. updateEntryTimes: function(){
  201. var thisView = this;
  202. this.$('.history-entries .history-entry').each(function(){
  203. var $$ = $(this);
  204. var time = $$.find('.timesince');
  205. var entry = $$.data('historyEntry');
  206. time.html( thisView.timeSince( entry.get('time') ) );
  207. });
  208. },
  209. /**
  210. * Gets the time since as a nice string.
  211. *
  212. * @param date
  213. */
  214. timeSince: function(time){
  215. var diff = parseInt( new Date().getTime() / 1000 ) - time;
  216. var parts = [];
  217. var interval;
  218. // There are 3600 seconds in an hour
  219. if( diff > 3600 ) {
  220. interval = Math.floor( diff / 3600 );
  221. if(interval === 1) {
  222. parts.push(panelsOptions.loc.time.hour.replace('%d', interval ));
  223. }
  224. else {
  225. parts.push(panelsOptions.loc.time.hours.replace('%d', interval ));
  226. }
  227. diff -= interval * 3600;
  228. }
  229. // There are 60 seconds in a minute
  230. if( diff > 60 ) {
  231. interval = Math.floor( diff / 60 );
  232. if(interval === 1) {
  233. parts.push(panelsOptions.loc.time.minute.replace('%d', interval ));
  234. }
  235. else {
  236. parts.push(panelsOptions.loc.time.minutes.replace('%d', interval ));
  237. }
  238. diff -= interval * 60;
  239. }
  240. if( diff > 0 ) {
  241. if(diff === 1) {
  242. parts.push(panelsOptions.loc.time.second.replace('%d', diff ));
  243. }
  244. else {
  245. parts.push(panelsOptions.loc.time.seconds.replace('%d', diff ));
  246. }
  247. }
  248. // Return the amount of time ago
  249. return parts.length === 0 ? panelsOptions.loc.time.now : panelsOptions.loc.time.ago.replace('%s', parts.slice(0,2).join(', ') );
  250. }
  251. } );
  252. } )( jQuery, _, soPanelsOptions );