Skip to content

Commit 2536313

Browse files
MLBernsMLBerns
committed
genericizing file/folder tree to refer to treeItems
fixes CNVS-9047 test plan: - enable better file browsing feature flag - go to files page and navigate folders, all expected behaviors should occur - click 'move folder' and navigate the folder tree, all expected behaviors should occur, including files moving properly - go to edit addignment, edit outcome, or edit discusson and click 'embed image' on toolbar - go to 'Canvas' tab on modal window and navigate tree, all expected behaviors should occur, including images properly attaching Change-Id: I703f0db5a096d49d648fab8377001b5fd610a620 Reviewed-on: https://gerrit.instructure.com/43883 Reviewed-by: Simon Williams <simon@instructure.com> Tested-by: Jenkins <jenkins@instructure.com> QA-Review: Nathan Rogowski <nathan@instructure.com> Product-Review: Simon Williams <simon@instructure.com>
1 parent ff26faa commit 2536313

13 files changed

Lines changed: 100 additions & 66 deletions

‎app/coffeescripts/react_files/components/FolderTree.coffee‎

Lines changed: 8 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,10 @@
11
define [
22
'react'
33
'react-router'
4-
'compiled/views/FileBrowserView'
4+
'compiled/views/TreeBrowserView'
5+
'compiled/views/RootFoldersFinder'
56
'../modules/customPropTypes'
6-
], (React, Router, FileBrowserView, customPropTypes) ->
7+
], (React, Router, TreeBrowserView, RootFoldersFinder, customPropTypes) ->
78

89
FolderTree = React.createClass
910
displayName: 'FolderTree'
@@ -15,9 +16,12 @@ define [
1516
mixins: [Router.Navigation, Router.ActiveState]
1617

1718
componentDidMount: ->
18-
new FileBrowserView({
19-
onlyShowFolders: true,
19+
rootFoldersFinder = new RootFoldersFinder({
2020
rootFoldersToShow: @props.rootFoldersToShow
21+
})
22+
new TreeBrowserView({
23+
onlyShowFolders: true,
24+
rootModelsFinder: rootFoldersFinder
2125
onClick: @onClick
2226
dndOptions: @props.dndOptions
2327
href: @hrefFor

‎app/coffeescripts/react_files/components/MoveDialog.coffee‎

Lines changed: 9 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -4,10 +4,11 @@ define [
44
'react'
55
'compiled/react/shared/utils/withReactDOM'
66
'compiled/fn/preventDefault'
7-
'compiled/views/FileBrowserView'
7+
'compiled/views/TreeBrowserView'
8+
'compiled/views/RootFoldersFinder'
89
'../modules/customPropTypes'
910
'../utils/moveStuff'
10-
], (I18n, $, React, withReactDOM, preventDefault, FileBrowserView, customPropTypes, moveStuff) ->
11+
], (I18n, $, React, withReactDOM, preventDefault, TreeBrowserView, RootFoldersFinder, customPropTypes, moveStuff) ->
1112

1213
MoveDialog = React.createClass
1314
displayName: 'MoveDialog'
@@ -29,8 +30,13 @@ define [
2930
item: @props.thingsToMove[0]?.displayName()
3031
})
3132

32-
new FileBrowserView({
33+
rootFoldersFinder = new RootFoldersFinder({
34+
rootFoldersToShow: @props.rootFoldersToShow
35+
})
36+
37+
new TreeBrowserView({
3338
onlyShowFolders: true,
39+
rootModelsFinder: rootFoldersFinder
3440
rootFoldersToShow: @props.rootFoldersToShow
3541
onClick: @onSelectFolder
3642
focusStyleClass: 'MoveDialog__folderItem--focused'

‎app/coffeescripts/views/RootFoldersFinder.coffee‎

Lines changed: 33 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,33 @@
1+
define [
2+
'i18n!rootFoldersFinder'
3+
'compiled/models/Folder'
4+
'compiled/str/splitAssetString'
5+
], (I18n, Folder, splitAssetString) ->
6+
7+
class RootFoldersFinder
8+
constructor: (opts) ->
9+
@rootFoldersToShow = opts.rootFoldersToShow
10+
@contentTypes = opts.contentTypes
11+
12+
find: ->
13+
return @rootFoldersToShow if @rootFoldersToShow
14+
# purposely sharing these across instances of RootFoldersFinder
15+
# use a 'custom_name' to set I18n'd names for the root folders (the actual names are hard-coded)
16+
RootFoldersFinder.rootFolders ||= do =>
17+
contextFiles = null
18+
contextTypeAndId = splitAssetString(ENV.context_asset_string || '')
19+
if contextTypeAndId && contextTypeAndId.length == 2 && (contextTypeAndId[0] == 'courses' || contextTypeAndId[0] == 'groups')
20+
contextFiles = new Folder({contentTypes: @contentTypes})
21+
contextFiles.set 'custom_name', if contextTypeAndId[0] is 'courses' then I18n.t('course_files', 'Course files') else I18n.t('group_files', 'Group files')
22+
contextFiles.url = "/api/v1/#{contextTypeAndId[0]}/#{contextTypeAndId[1]}/folders/root"
23+
contextFiles.fetch()
24+
25+
myFiles = new Folder({contentTypes: @contentTypes})
26+
myFiles.set 'custom_name', I18n.t('my_files', 'My files')
27+
myFiles.url = '/api/v1/users/self/folders/root'
28+
myFiles.fetch()
29+
30+
result = []
31+
result.push contextFiles if contextFiles
32+
result.push myFiles
33+
result

‎app/coffeescripts/views/RootOutcomesFinder.coffee‎

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
define [
2+
'i18n!rootOutcomesFinder'
3+
'compiled/models/OutcomeGroup'
4+
'compiled/str/splitAssetString'
5+
], (I18n, OutcomeGroup, splitAssetString) ->
6+
7+
class RootOutcomesFinder
8+
9+
find: ->
10+
# purposely sharing these across instances of RootOutcomesFinder
11+
RootOutcomesFinder.rootFolders ||= do =>
12+
contextOutcomeGroups = null
13+
contextTypeAndId = splitAssetString(ENV.context_asset_string || '')
14+
15+
contextOutcomeGroups = new OutcomeGroup
16+
contextOutcomeGroups.url = "/api/v1/#{contextTypeAndId[0]}/#{contextTypeAndId[1]}/root_outcome_group"
17+
contextOutcomeGroups.fetch()
18+
19+
[contextOutcomeGroups]

app/coffeescripts/views/FileBrowserView.coffee renamed to app/coffeescripts/views/TreeBrowserView.coffee

Lines changed: 8 additions & 36 deletions
Original file line numberDiff line numberDiff line change
@@ -1,20 +1,15 @@
11
define [
2-
'i18n!filebrowserview'
32
'Backbone'
43
'underscore'
5-
'jst/FileBrowserView'
6-
'compiled/views/FolderTreeView'
7-
'compiled/models/Folder'
8-
'compiled/str/splitAssetString'
9-
], (I18n, Backbone, _, template, FolderTreeView, Folder, splitAssetString) ->
4+
'jst/TreeBrowser'
5+
'compiled/views/TreeView'
6+
], (Backbone, _, template, TreeView) ->
107

11-
class FileBrowserView extends Backbone.View
8+
class TreeBrowserView extends Backbone.View
129

1310
template: template
14-
15-
@optionProperty 'contentTypes'
11+
@optionProperty 'rootModelsFinder'
1612
@optionProperty 'onlyShowFolders'
17-
@optionProperty 'rootFoldersToShow'
1813
@optionProperty 'onClick'
1914
@optionProperty 'dndOptions'
2015
@optionProperty 'href'
@@ -51,34 +46,11 @@ define [
5146
when 'end' then @focusLast $focused
5247
when 'enter' then @activateCurrent $focused
5348

54-
rootFolders: ->
55-
return @rootFoldersToShow if @rootFoldersToShow
56-
# purposely sharing these across instances of FileBrowserView
57-
# use a 'custom_name' to set I18n'd names for the root folders (the actual names are hard-coded)
58-
FileBrowserView.rootFolders ||= do =>
59-
contextFiles = null
60-
contextTypeAndId = splitAssetString(ENV.context_asset_string || '')
61-
if contextTypeAndId && contextTypeAndId.length == 2 && (contextTypeAndId[0] == 'courses' || contextTypeAndId[0] == 'groups')
62-
contextFiles = new Folder({contentTypes: @contentTypes})
63-
contextFiles.set 'custom_name', if contextTypeAndId[0] is 'courses' then I18n.t('course_files', 'Course files') else I18n.t('group_files', 'Group files')
64-
contextFiles.url = "/api/v1/#{contextTypeAndId[0]}/#{contextTypeAndId[1]}/folders/root"
65-
contextFiles.fetch()
66-
67-
myFiles = new Folder({contentTypes: @contentTypes})
68-
myFiles.set 'custom_name', I18n.t('my_files', 'My files')
69-
myFiles.url = '/api/v1/users/self/folders/root'
70-
myFiles.fetch()
71-
72-
result = []
73-
result.push contextFiles if contextFiles
74-
result.push myFiles
75-
result
76-
7749
afterRender: ->
7850
@$folderTree = @$el.children('.folderTree')
79-
for folder in @rootFolders()
80-
new FolderTreeView({
81-
model: folder,
51+
for rootModel in @rootModelsFinder.find()
52+
new TreeView({
53+
model: rootModel,
8254
onlyShowFolders: @onlyShowFolders
8355
onClick: @onClick
8456
dndOptions: @dndOptions

app/coffeescripts/views/FileItemView.coffee renamed to app/coffeescripts/views/TreeItemView.coffee

Lines changed: 4 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -2,18 +2,17 @@ define [
22
'Backbone'
33
'underscore'
44
'compiled/fn/preventDefault'
5-
'compiled/models/Folder'
6-
'jst/FolderTreeItem'
7-
], (Backbone, _, preventDefault, Folder, template) ->
5+
'jst/TreeItem'
6+
], (Backbone, _, preventDefault, template) ->
87

9-
class FileItemView extends Backbone.View
8+
class TreeItemView extends Backbone.View
109
tagName: 'li'
1110
template: template
1211
@optionProperty 'nestingLevel'
1312
attributes: ->
1413
role: 'treeitem'
1514
id: _.uniqueId 'treenode-'
16-
15+
1716
afterRender: ->
1817
# We have to do this here, because @nestingLevel isn't available when attributes is run.
1918
@$el.attr 'aria-level', @nestingLevel

app/coffeescripts/views/FolderTreeView.coffee renamed to app/coffeescripts/views/TreeView.coffee

Lines changed: 10 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -3,13 +3,12 @@ define [
33
'jquery'
44
'underscore'
55
'compiled/fn/preventDefault'
6-
'compiled/models/Folder'
76
'compiled/views/PaginatedCollectionView'
8-
'compiled/views/FileItemView'
9-
'jst/FolderTreeCollection'
10-
], (Backbone, $, _, preventDefault, Folder, PaginatedCollectionView, FileItemView, collectionTemplate) ->
7+
'compiled/views/TreeItemView'
8+
'jst/TreeCollection'
9+
], (Backbone, $, _, preventDefault, PaginatedCollectionView, TreeItemView, collectionTemplate) ->
1110

12-
class FolderTreeView extends Backbone.View
11+
class TreeView extends Backbone.View
1312

1413
tagName: 'li'
1514

@@ -110,9 +109,9 @@ define [
110109
if @model.isExpanded
111110
unless @$folderContents
112111
@$folderContents = $("<ul role='group' class='folderContents'/>").appendTo(@$el)
113-
foldersView = new PaginatedCollectionView(
112+
subtreesView = new PaginatedCollectionView(
114113
collection: @model.folders
115-
itemView: FolderTreeView
114+
itemView: TreeView
116115
itemViewOptions:
117116
nestingLevel: @nestingLevel+1
118117
onlyShowFolders: @onlyShowFolders
@@ -126,18 +125,18 @@ define [
126125
template: collectionTemplate
127126
scrollContainer: @$folderContents.closest('ul[role=tabpanel]')
128127
)
129-
@$folderContents.append(foldersView.render().el)
128+
@$folderContents.append(subtreesView.render().el)
130129
unless @onlyShowFolders
131-
filesView = new PaginatedCollectionView(
130+
itemsView = new PaginatedCollectionView(
132131
collection: @model.files
133-
itemView: FileItemView
132+
itemView: TreeItemView
134133
itemViewOptions: {nestingLevel: @nestingLevel+1}
135134
tagName: 'li'
136135
className: 'files'
137136
template: collectionTemplate
138137
scrollContainer: @$folderContents.closest('ul[role=tabpanel]')
139138
)
140-
@$folderContents.append(filesView.render().el)
139+
@$folderContents.append(itemsView.render().el)
141140
@$('> .folderContents').removeClass('hidden')
142141
else
143142
@$('> .folderContents').addClass('hidden')

‎app/coffeescripts/views/tinymce/InsertUpdateImageView.coffee‎

Lines changed: 7 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -52,9 +52,13 @@ define [
5252
when 'tabUploaded'
5353
loadTab (done) =>
5454
require [
55-
'compiled/views/FileBrowserView'
56-
], (FileBrowserView) =>
57-
new FileBrowserView(contentTypes: 'image').render().$el.appendTo(ui.panel)
55+
'compiled/views/TreeBrowserView'
56+
'compiled/views/RootFoldersFinder'
57+
], (TreeBrowserView, RootFoldersFinder) =>
58+
rootFoldersFinder = new RootFoldersFinder({
59+
contentTypes: 'image'
60+
})
61+
new TreeBrowserView(rootModelsFinder: rootFoldersFinder).render().$el.appendTo(ui.panel)
5862
done()
5963
when 'tabFlickr'
6064
loadTab (done) =>

app/stylesheets/jst/FileBrowserView.scss renamed to app/stylesheets/jst/TreeBrowser.scss

File renamed without changes.

app/views/jst/FileBrowserView.handlebars renamed to app/views/jst/TreeBrowser.handlebars

File renamed without changes.

0 commit comments

Comments
 (0)