From bf21305c68e847e2de6ccf89b1830e1a49bba757 Mon Sep 17 00:00:00 2001 From: James Allen Date: Wed, 5 Mar 2014 17:55:47 +0000 Subject: [PATCH] Add in basic list of changes in track changes view --- services/web/app/views/templates.jade | 22 +++- .../web/public/coffee/editor/Editor.coffee | 6 ++ services/web/public/coffee/ide.coffee | 5 +- .../track-changes/ChangeListView.coffee | 101 ++++++++++++++++++ .../track-changes/TrackChangesManager.coffee | 35 ++++++ .../coffee/track-changes/models/Change.coffee | 10 ++ .../track-changes/models/ChangeList.coffee | 26 +++++ .../web/public/stylesheets/less/editor.less | 4 + .../public/stylesheets/less/trackchanges.less | 30 ++++++ .../web/public/stylesheets/mainStyle.less | 1 + 10 files changed, 234 insertions(+), 6 deletions(-) create mode 100644 services/web/public/coffee/track-changes/ChangeListView.coffee create mode 100644 services/web/public/coffee/track-changes/TrackChangesManager.coffee create mode 100644 services/web/public/coffee/track-changes/models/Change.coffee create mode 100644 services/web/public/coffee/track-changes/models/ChangeList.coffee create mode 100644 services/web/public/stylesheets/less/trackchanges.less diff --git a/services/web/app/views/templates.jade b/services/web/app/views/templates.jade index c9e6c0a8cb..e692d86b42 100644 --- a/services/web/app/views/templates.jade +++ b/services/web/app/views/templates.jade @@ -404,11 +404,6 @@ div(class='version-message') {{message}} div(class='version-date') {{date}} - script(type='text/template')#autoCompleteSuggestionTemplate - li - strong {{base}} - | {{completion}} - script(type='text/template')#versionListTemplate ul#version-list.nav.nav-pills.nav-stacked li.loading Loading... @@ -428,6 +423,23 @@ div a(href="#", title='Show Hot Keys List') Hot keys + script(type='text/template')#trackChangesPanelTemplate + #trackChangesPanel + .track-changes-side-bar + .change-list-area + .track-changes-diff + + script(type='text/template')#changeListItemTemplate + a(href="#") + div(class='change-message') {{user_id}} + div(class='change-date') {{end_ts}} + div(class='change-date') {{start_ts}} + + script(type='text/template')#changeListTemplate + ul.change-list.nav.nav-pills.nav-stacked + li.loading-changes Loading... + li.empty-message You haven't made any changes yet! + script(type='text/template')#hotKeysListTemplate .hotkeys h3 Common diff --git a/services/web/public/coffee/editor/Editor.coffee b/services/web/public/coffee/editor/Editor.coffee index d0894ddc8f..7c86598ad6 100644 --- a/services/web/public/coffee/editor/Editor.coffee +++ b/services/web/public/coffee/editor/Editor.coffee @@ -352,3 +352,9 @@ define [ getCurrentDocId: () -> @current_doc_id + show: () -> + $("#editor").show() + + hide: () -> + $("#editor").hide() + diff --git a/services/web/public/coffee/ide.coffee b/services/web/public/coffee/ide.coffee index d15252d32c..5db490d2f3 100644 --- a/services/web/public/coffee/ide.coffee +++ b/services/web/public/coffee/ide.coffee @@ -25,6 +25,7 @@ define [ "file-view/FileViewManager" "tour/IdeTour" "analytics/AnalyticsManager" + "track-changes/TrackChangesManager" "ace/ace" "libs/jquery.color" "libs/jquery-layout" @@ -56,7 +57,8 @@ define [ BackspaceHighjack, FileViewManager, IdeTour, - AnalyticsManager + AnalyticsManager, + TrackChangesManager ) -> @@ -117,6 +119,7 @@ define [ @cursorManager = new CursorManager(@) @fileViewManager = new FileViewManager(@) @analyticsManager = new AnalyticsManager(@) + @trackChangesManager = new TrackChangesManager(@) @setLoadingMessage("Connecting") firstConnect = true diff --git a/services/web/public/coffee/track-changes/ChangeListView.coffee b/services/web/public/coffee/track-changes/ChangeListView.coffee new file mode 100644 index 0000000000..579d4cf13c --- /dev/null +++ b/services/web/public/coffee/track-changes/ChangeListView.coffee @@ -0,0 +1,101 @@ +define [ + "history/util" + "libs/mustache" + "libs/backbone" +], (util)-> + ChangeListView = Backbone.View.extend + template: $("#changeListTemplate").html() + + events: + "scroll" : "loadUntilFull" + + initialize: -> + @itemViews = [] + @atEndOfCollection = false + + self = this + @collection.on "add", (model) -> + self.addItem model + @collection.on "reset", (collection) -> + self.addItem model for model in collection.models + + @render() + @hideLoading() + + render: -> + @$el.html Mustache.to_html @template + @$el.css + overflow: "scroll" + this + + addItem: (model) -> + view = new ChangeListItemView(model : model) + @itemViews.push view + index = @collection.indexOf(model) + elementAtIndex = @$(".change-list").children()[index] + view.$el.insertBefore(elementAtIndex) + + listShorterThanContainer: -> + @$el.height() > @$(".change-list").height() + + atEndOfListView: -> + @$el.scrollTop() + @$el.height() >= @$(".change-list").height() - 30 + + loadUntilFull: (e, callback) -> + if (@listShorterThanContainer() or @atEndOfListView()) and not @atEndOfCollection and not @loading + @showLoading() + @hideEmptyMessage() + @collection.fetchNextBatch + error: => + @hideLoading() + @showEmptyMessageIfCollectionEmpty() + callback() if callback? + success: (collection, response) => + @hideLoading() + if response.updates.length == @collection.batchSize + @loadUntilFull(e, callback) + else + @atEndOfCollection = true + @showEmptyMessageIfCollectionEmpty() + callback() if callback? + + else + callback() if callback? + + showEmptyMessageIfCollectionEmpty: ()-> + if @collection.isEmpty() + @$(".empty-message").show() + else + @$(".empty-message").hide() + + hideEmptyMessage: () -> + @$(".empty-message").hide() + + showLoading: -> + @loading = true + @$(".loading-changes").show() + + hideLoading: -> + @loading = false + @$(".loading-changes").hide() + + ChangeListItemView = Backbone.View.extend + tagName: "li" + + template : $("#changeListItemTemplate").html() + + initialize: -> + @render() + + render: -> + @$el.html Mustache.to_html(@template, @modelView()) + return this + + modelView: -> + modelView = @model.toJSON() + # modelView.start_ts = util.formatDate(modelView.start_ts) + # modelView.end_ts = util.formatDate(modelView.end_ts) + return modelView + + return ChangeListView + diff --git a/services/web/public/coffee/track-changes/TrackChangesManager.coffee b/services/web/public/coffee/track-changes/TrackChangesManager.coffee new file mode 100644 index 0000000000..15d44e299b --- /dev/null +++ b/services/web/public/coffee/track-changes/TrackChangesManager.coffee @@ -0,0 +1,35 @@ +define [ + "track-changes/models/ChangeList" + "track-changes/ChangeListView" +], (ChangeList, ChangeListView) -> + class TrackChangesManager + template: $("#trackChangesPanelTemplate").html() + + constructor: (@ide) -> + @$el = $(@template) + $("#editorWrapper").append(@$el) + @hideEl() + + show: () -> + project_id = window.userSettings.project_id + doc_id = @ide.editor.current_doc_id + @changes = new ChangeList([], doc_id: doc_id, project_id: project_id) + + @changeListView = new ChangeListView( + collection : @changes, + el : @$el.find(".change-list-area") + ) + @changeListView.render() + @changeListView.loadUntilFull() + + @showEl() + + showEl: -> + @ide.editor.hide() + @$el.show() + + hideEl: () -> + @ide.editor.show() + @$el.hide() + + return TrackChangesManager diff --git a/services/web/public/coffee/track-changes/models/Change.coffee b/services/web/public/coffee/track-changes/models/Change.coffee new file mode 100644 index 0000000000..749e8def82 --- /dev/null +++ b/services/web/public/coffee/track-changes/models/Change.coffee @@ -0,0 +1,10 @@ +define [ + "libs/backbone" +], ()-> + Change = Backbone.Model.extend + parse: (change) -> + return { + start_ts: change.meta.start_ts + end_ts: change.meta.end_ts + user_id: change.meta.user_id + } \ No newline at end of file diff --git a/services/web/public/coffee/track-changes/models/ChangeList.coffee b/services/web/public/coffee/track-changes/models/ChangeList.coffee new file mode 100644 index 0000000000..da392d24d8 --- /dev/null +++ b/services/web/public/coffee/track-changes/models/ChangeList.coffee @@ -0,0 +1,26 @@ +define [ + "track-changes/models/Change" + "libs/backbone" +], (Change)-> + ChangeList = Backbone.Collection.extend + model: Change + batchSize: 3 + + initialize: (models, @options) -> + console.log arguments + + url: () -> + url = "/project/#{@options.project_id}/doc/#{@options.doc_id}/updates?limit=#{@batchSize}" + if @models.length > 0 + last = @models[@models.length - 1] + url += "&to=#{last.get("start_ts") - 1}" + return url + + parse: (json) -> + return json.updates + + fetchNextBatch: (options = {}) -> + options.add = true + @fetch options + + diff --git a/services/web/public/stylesheets/less/editor.less b/services/web/public/stylesheets/less/editor.less index 7d3fedda03..c1b93552aa 100644 --- a/services/web/public/stylesheets/less/editor.less +++ b/services/web/public/stylesheets/less/editor.less @@ -200,6 +200,10 @@ body.editor { bottom: 0; z-index: 100; } + #trackChangesPanel { + width: 100%; + height: 100%; + } } #undoConflictWarning { diff --git a/services/web/public/stylesheets/less/trackchanges.less b/services/web/public/stylesheets/less/trackchanges.less new file mode 100644 index 0000000000..94250847e0 --- /dev/null +++ b/services/web/public/stylesheets/less/trackchanges.less @@ -0,0 +1,30 @@ +@changesListWidth: 200px; +@versionsListPadding: 10px; + +#trackChangesPanel { + .track-changes-diff { + position: absolute; + right: @versionsListWidth + 1px; + right: 0; + padding: 0px 12px; + overflow: scroll; + height: 100%; + } + + .track-changes-side-bar { + border-left: 1px solid #999; + height: 100%; + width: @versionsListWidth; + position: absolute; + right: 0; + } + + .change-list-area { + overflow: scroll; + position: absolute; + left: 0px; + right: 0px; + top: 0px; + bottom: 0px; + } +} \ No newline at end of file diff --git a/services/web/public/stylesheets/mainStyle.less b/services/web/public/stylesheets/mainStyle.less index 3a3f3f7115..b3578e7134 100644 --- a/services/web/public/stylesheets/mainStyle.less +++ b/services/web/public/stylesheets/mainStyle.less @@ -49,6 +49,7 @@ @import "public/stylesheets/less/navbar.less"; @import "public/stylesheets/less/footer.less"; @import "public/stylesheets/less/list.less"; +@import "public/stylesheets/less/trackchanges.less"; @import "public/stylesheets/less/fileuploader.less";