overleaf/services/web/frontend/js/ide/file-tree/controllers/FileTreeController.js
Alf Eaton 2ff1cf43d6 Merge pull request #3470 from overleaf/eslint
Upgrade and configure ESLint

GitOrigin-RevId: ad5aeaf85e72c847a125ff3a9db99a12855e38aa
2020-12-16 03:08:28 +00:00

678 lines
18 KiB
JavaScript

import _ from 'lodash'
/* eslint-disable
camelcase,
node/handle-callback-err,
max-len,
no-return-assign,
no-unused-vars,
*/
// TODO: This file was created by bulk-decaffeinate.
// Fix any style issues and re-enable lint.
/*
* decaffeinate suggestions:
* DS102: Remove unnecessary code created because of implicit returns
* DS103: Rewrite code to no longer use __guard__
* DS207: Consider shorter variations of null checks
* Full docs: https://github.com/decaffeinate/decaffeinate/blob/master/docs/suggestions.md
*/
import App from '../../../base'
App.controller('FileTreeController', function($scope, $modal, ide, $rootScope) {
$scope.openNewDocModal = reactBridgeParentFolderId =>
$modal.open({
templateUrl: 'newFileModalTemplate',
controller: 'NewFileModalController',
size: 'lg',
resolve: {
parent_folder() {
if (reactBridgeParentFolderId) {
return { id: reactBridgeParentFolderId }
}
return ide.fileTreeManager.getCurrentFolder()
},
projectFeatures() {
return ide.$scope.project.features
},
type() {
return 'doc'
},
userFeatures() {
return ide.$scope.user.features
}
}
})
$scope.openNewFolderModal = () =>
$modal.open({
templateUrl: 'newFolderModalTemplate',
controller: 'NewFolderModalController',
resolve: {
parent_folder() {
return ide.fileTreeManager.getCurrentFolder()
}
}
})
$scope.openUploadFileModal = reactBridgeParentFolderId =>
$modal.open({
templateUrl: 'newFileModalTemplate',
controller: 'NewFileModalController',
size: 'lg',
resolve: {
projectFeatures() {
return ide.$scope.project.features
},
parent_folder() {
if (reactBridgeParentFolderId) {
return { id: reactBridgeParentFolderId }
}
return ide.fileTreeManager.getCurrentFolder()
},
type() {
return 'upload'
},
userFeatures() {
return ide.$scope.user.features
}
}
})
if (window.showReactFileTree) {
window.addEventListener(
'FileTreeReactBridge.openNewDocModal',
({ detail }) => {
if (detail.mode === 'upload') {
$scope.openUploadFileModal(detail.parentFolderId)
} else {
$scope.openNewDocModal(detail.parentFolderId)
}
}
)
}
$scope.orderByFoldersFirst = function(entity) {
if ((entity != null ? entity.type : undefined) === 'folder') {
return '0'
}
return '1'
}
$scope.startRenamingSelected = () => $scope.$broadcast('rename:selected')
return ($scope.openDeleteModalForSelected = () =>
$scope.$broadcast('delete:selected'))
})
App.controller('NewFolderModalController', function(
$scope,
ide,
$modalInstance,
$timeout,
parent_folder
) {
$scope.inputs = { name: 'name' }
$scope.state = { inflight: false }
$modalInstance.opened.then(() =>
$timeout(() => $scope.$broadcast('open'), 200)
)
$scope.create = function() {
const { name } = $scope.inputs
if (name == null || name.length === 0) {
return
}
$scope.state.inflight = true
return ide.fileTreeManager
.createFolder(name, $scope.parent_folder)
.then(function() {
$scope.state.inflight = false
return $modalInstance.dismiss('done')
})
.catch(function(response) {
const { data } = response
$scope.error = data
return ($scope.state.inflight = false)
})
}
return ($scope.cancel = () => $modalInstance.dismiss('cancel'))
})
App.controller('DuplicateFileModalController', function(
$scope,
$modalInstance,
fileName
) {
$scope.fileName = fileName
$scope.cancel = () => $modalInstance.dismiss('cancel')
})
App.controller('NewFileModalController', function(
$scope,
ide,
type,
parent_folder,
$modalInstance,
eventTracking,
projectFeatures,
userFeatures
) {
$scope.file_count = ide.fileTreeManager.getFullCount()
$scope.type = type
$scope.parent_folder = parent_folder
$scope.state = {
inflight: false,
valid: true
}
$scope.cancel = () => $modalInstance.dismiss('cancel')
$scope.create = () => $scope.$broadcast('create')
const hasMendeleyFeature =
(projectFeatures && projectFeatures.references) ||
(projectFeatures && projectFeatures.mendeley) ||
(userFeatures && userFeatures.references) ||
(userFeatures && userFeatures.mendeley)
const hasZoteroFeature =
(projectFeatures && projectFeatures.references) ||
(projectFeatures && projectFeatures.zotero) ||
(userFeatures && userFeatures.references) ||
(userFeatures && userFeatures.zotero)
$scope.$watch('type', function() {
if ($scope.type === 'mendeley' && !hasMendeleyFeature) {
eventTracking.send(
'subscription-funnel',
'editor-click-feature',
$scope.type
)
}
if ($scope.type === 'zotero' && !hasZoteroFeature) {
eventTracking.send(
'subscription-funnel',
'editor-click-feature',
$scope.type
)
}
})
$scope.$on('done', (e, opts = {}) => {
const isBibFile = opts.name && /^.*\.bib$/.test(opts.name)
if (opts.shouldReindexReferences || isBibFile) {
ide.$scope.$emit('references:should-reindex', {})
}
$modalInstance.dismiss('done')
})
if (window.showReactFileTree) {
window.addEventListener(
'FileTreeReactBridge.openNewFileModal',
({ detail }) => {
if (detail.done) {
ide.$scope.FileTreeReactBridgePromise.resolve()
}
if (detail.error) {
ide.$scope.FileTreeReactBridgePromise.reject(detail)
}
}
)
}
})
App.controller('NewDocModalController', function($scope, ide, $timeout) {
$scope.inputs = { name: 'name.tex' }
$timeout(() => $scope.$broadcast('open'), 200)
return $scope.$on('create', function() {
const { name } = $scope.inputs
if (name == null || name.length === 0) {
return
}
$scope.state.inflight = true
return ide.fileTreeManager
.createDoc(name, $scope.parent_folder)
.then(function() {
$scope.state.inflight = false
return $scope.$emit('done')
})
.catch(function(response) {
const { data } = response
$scope.error = data
$scope.state.inflight = false
})
.finally(function() {
if (!$scope.$$phase) {
$scope.$apply()
}
})
})
})
App.controller('UploadFileModalController', function(
$scope,
$rootScope,
ide,
$timeout,
$window
) {
$scope.parent_folder_id =
$scope.parent_folder != null ? $scope.parent_folder.id : undefined
$scope.project_id = ide.project_id
$scope.tooManyFiles = false
$scope.rateLimitHit = false
$scope.secondsToRedirect = 10
$scope.notLoggedIn = false
$scope.conflicts = []
$scope.control = {}
const needToLogBackIn = function() {
$scope.notLoggedIn = true
var decreseTimeout = () =>
$timeout(function() {
if ($scope.secondsToRedirect === 0) {
return ($window.location.href = `/login?redir=/project/${ide.project_id}`)
} else {
decreseTimeout()
return ($scope.secondsToRedirect = $scope.secondsToRedirect - 1)
}
}, 1000)
return decreseTimeout()
}
$scope.max_files = 40
$scope.onComplete = (error, name, response) =>
$timeout(function() {
uploadCount--
if (response.success) {
$rootScope.$broadcast('file:upload:complete', response)
}
if (uploadCount === 0 && response != null && response.success) {
return $scope.$emit('done', { name: name })
}
}, 250)
$scope.onValidateBatch = function(files) {
if (files.length > $scope.max_files) {
$timeout(() => ($scope.tooManyFiles = true), 1)
return false
} else {
return true
}
}
$scope.onError = function(id, name, reason) {
console.log(id, name, reason)
if (reason.indexOf('429') !== -1) {
return ($scope.rateLimitHit = true)
} else if (reason.indexOf('403') !== -1) {
return needToLogBackIn()
}
}
let _uploadTimer = null
const uploadIfNoConflicts = function() {
if ($scope.conflicts.length === 0) {
return $scope.doUpload()
}
}
var uploadCount = 0
$scope.onSubmit = function(id, name) {
uploadCount++
if (ide.fileTreeManager.existsInFolder($scope.parent_folder_id, name)) {
$scope.conflicts.push(name)
$scope.$apply()
}
if (_uploadTimer == null) {
_uploadTimer = setTimeout(function() {
_uploadTimer = null
return uploadIfNoConflicts()
}, 0)
}
return true
}
$scope.onCancel = function(id, name) {
uploadCount--
const index = $scope.conflicts.indexOf(name)
if (index > -1) {
$scope.conflicts.splice(index, 1)
}
$scope.$apply()
return uploadIfNoConflicts()
}
return ($scope.doUpload = () =>
__guard__($scope.control != null ? $scope.control.q : undefined, x =>
x.uploadStoredFiles()
))
})
App.controller('ProjectLinkedFileModalController', function(
$scope,
ide,
$timeout
) {
$scope.data = {
projects: null, // or []
selectedProjectId: null,
projectEntities: null, // or []
projectOutputFiles: null, // or []
selectedProjectEntity: null,
selectedProjectOutputFile: null,
buildId: null,
name: null
}
$scope.state.inFlight = {
projects: false,
entities: false,
compile: false
}
$scope.state.isOutputFilesMode = false
$scope.state.error = false
$scope.$watch('data.selectedProjectId', function(newVal, oldVal) {
if (!newVal) {
return
}
$scope.data.selectedProjectEntity = null
$scope.data.selectedProjectOutputFile = null
if ($scope.state.isOutputFilesMode) {
return $scope.compileProjectAndGetOutputFiles(
$scope.data.selectedProjectId
)
} else {
return $scope.getProjectEntities($scope.data.selectedProjectId)
}
})
$scope.$watch('state.isOutputFilesMode', function(newVal, oldVal) {
if (!newVal && !oldVal) {
return
}
$scope.data.selectedProjectOutputFile = null
if (newVal === true) {
return $scope.compileProjectAndGetOutputFiles(
$scope.data.selectedProjectId
)
} else {
return $scope.getProjectEntities($scope.data.selectedProjectId)
}
})
// auto-set filename based on selected file
$scope.$watch('data.selectedProjectEntity', function(newVal, oldVal) {
if (!newVal) {
return
}
const fileName = newVal.split('/').reverse()[0]
if (fileName) {
$scope.data.name = fileName
}
})
// auto-set filename based on selected file
$scope.$watch('data.selectedProjectOutputFile', function(newVal, oldVal) {
if (!newVal) {
return
}
if (newVal === 'output.pdf') {
const project = _.find(
$scope.data.projects,
p => p._id === $scope.data.selectedProjectId
)
$scope.data.name =
(project != null ? project.name : undefined) != null
? `${project.name}.pdf`
: 'output.pdf'
} else {
const fileName = newVal.split('/').reverse()[0]
if (fileName) {
$scope.data.name = fileName
}
}
})
const _setInFlight = type => ($scope.state.inFlight[type] = true)
const _reset = function(opts) {
const isError = opts.err === true
const { inFlight } = $scope.state
inFlight.projects = inFlight.entities = inFlight.compile = false
$scope.state.inflight = false
return ($scope.state.error = isError)
}
$scope.toggleOutputFilesMode = function() {
if (!$scope.data.selectedProjectId) {
return
}
return ($scope.state.isOutputFilesMode = !$scope.state.isOutputFilesMode)
}
$scope.shouldEnableProjectSelect = function() {
const { state, data } = $scope
return !state.inFlight.projects && data.projects
}
$scope.hasNoProjects = function() {
const { state, data } = $scope
return (
!state.inFlight.projects &&
(data.projects == null || data.projects.length === 0)
)
}
$scope.shouldEnableProjectEntitySelect = function() {
const { state, data } = $scope
return (
!state.inFlight.projects &&
!state.inFlight.entities &&
data.projects &&
data.selectedProjectId
)
}
$scope.shouldEnableProjectOutputFileSelect = function() {
const { state, data } = $scope
return (
!state.inFlight.projects &&
!state.inFlight.compile &&
data.projects &&
data.selectedProjectId
)
}
const validate = function() {
const { state } = $scope
const { data } = $scope
$scope.state.valid =
!state.inFlight.projects &&
!state.inFlight.entities &&
data.projects &&
data.selectedProjectId &&
((!$scope.state.isOutputFilesMode &&
data.projectEntities &&
data.selectedProjectEntity) ||
($scope.state.isOutputFilesMode &&
data.projectOutputFiles &&
data.selectedProjectOutputFile)) &&
data.name
}
$scope.$watch('state', validate, true)
$scope.$watch('data', validate, true)
$scope.getUserProjects = function() {
_setInFlight('projects')
return ide.$http
.get('/user/projects', {
_csrf: window.csrfToken
})
.then(function(resp) {
$scope.data.projectEntities = null
$scope.data.projects = resp.data.projects.filter(
p => p._id !== ide.project_id
)
return _reset({ err: false })
})
.catch(err => _reset({ err: true }))
}
$scope.getProjectEntities = project_id => {
_setInFlight('entities')
return ide.$http
.get(`/project/${project_id}/entities`, {
_csrf: window.csrfToken
})
.then(function(resp) {
if ($scope.data.selectedProjectId === resp.data.project_id) {
$scope.data.projectEntities = resp.data.entities
return _reset({ err: false })
}
})
.catch(err => _reset({ err: true }))
}
$scope.compileProjectAndGetOutputFiles = project_id => {
_setInFlight('compile')
return ide.$http
.post(`/project/${project_id}/compile`, {
check: 'silent',
draft: false,
incrementalCompilesEnabled: false,
_csrf: window.csrfToken
})
.then(function(resp) {
if (resp.data.status === 'success') {
const filteredFiles = resp.data.outputFiles.filter(f =>
f.path.match(/.*\.(pdf|png|jpeg|jpg|gif)/)
)
$scope.data.projectOutputFiles = filteredFiles
$scope.data.buildId = __guard__(
filteredFiles != null ? filteredFiles[0] : undefined,
x => x.build
)
console.log('>> build_id', $scope.data.buildId)
return _reset({ err: false })
} else {
$scope.data.projectOutputFiles = null
return _reset({ err: true })
}
})
.catch(function(err) {
console.error(err)
return _reset({ err: true })
})
}
$scope.init = () => $scope.getUserProjects()
$timeout($scope.init, 0)
return $scope.$on('create', function() {
let payload, provider
const projectId = $scope.data.selectedProjectId
const { name } = $scope.data
if ($scope.state.isOutputFilesMode) {
provider = 'project_output_file'
payload = {
source_project_id: projectId,
source_output_file_path: $scope.data.selectedProjectOutputFile,
build_id: $scope.data.buildId
}
} else {
provider = 'project_file'
payload = {
source_project_id: projectId,
source_entity_path: $scope.data.selectedProjectEntity
}
}
_setInFlight('create')
ide.fileTreeManager
.createLinkedFile(name, $scope.parent_folder, provider, payload)
.then(function() {
_reset({ err: false })
return $scope.$emit('done', { name: name })
})
.catch(function(response) {
const { data } = response
$scope.error = data
})
.finally(function() {
if (!$scope.$$phase) {
$scope.$apply()
}
})
})
})
export default App.controller('UrlLinkedFileModalController', function(
$scope,
ide,
$timeout
) {
$scope.inputs = {
name: '',
url: ''
}
$scope.nameChangedByUser = false
$timeout(() => $scope.$broadcast('open'), 200)
const validate = function() {
const { name, url } = $scope.inputs
if (name == null || name.length === 0) {
return ($scope.state.valid = false)
} else if (url == null || url.length === 0) {
return ($scope.state.valid = false)
} else {
return ($scope.state.valid = true)
}
}
$scope.$watch('inputs.name', validate)
$scope.$watch('inputs.url', validate)
$scope.$watch('inputs.url', function(url) {
if (url != null && url !== '' && !$scope.nameChangedByUser) {
url = url.replace('://', '') // Ignore http:// etc
const parts = url.split('/').reverse()
if (parts.length > 1) {
// Wait for at one /
return ($scope.inputs.name = parts[0])
}
}
})
return $scope.$on('create', function() {
const { name, url } = $scope.inputs
if (name == null || name.length === 0) {
return
}
if (url == null || url.length === 0) {
return
}
$scope.state.inflight = true
return ide.fileTreeManager
.createLinkedFile(name, $scope.parent_folder, 'url', { url })
.then(function() {
$scope.state.inflight = false
return $scope.$emit('done', { name: name })
})
.catch(function(response) {
const { data } = response
$scope.error = data
return ($scope.state.inflight = false)
})
.finally(function() {
if (!$scope.$$phase) {
$scope.$apply()
}
})
})
})
function __guard__(value, transform) {
return typeof value !== 'undefined' && value !== null
? transform(value)
: undefined
}