diff options
Diffstat (limited to 'src/main/webapp/js/diagramly/App.js')
| -rw-r--r-- | src/main/webapp/js/diagramly/App.js | 1166 |
1 files changed, 587 insertions, 579 deletions
diff --git a/src/main/webapp/js/diagramly/App.js b/src/main/webapp/js/diagramly/App.js index 13436ac4..69fc7eb8 100644 --- a/src/main/webapp/js/diagramly/App.js +++ b/src/main/webapp/js/diagramly/App.js @@ -3098,6 +3098,12 @@ App.prototype.start = function() })); } + if (urlParams['live-ui'] == '1' && Editor.currentTheme == 'sketch') + { + Editor.currentTheme = ''; + this.doSetCurrentTheme('sketch', 0); + } + // Descriptor for CSV import if ((window.location.hash == null || window.location.hash.length <= 1) && urlParams['desc'] != null) { @@ -6713,13 +6719,13 @@ App.prototype.updateHeader = function() this.appIconClicked(evt); })); - var updateBackgorund = mxUtils.bind(this, function() + var updateBackground = mxUtils.bind(this, function() { this.appIcon.style.backgroundColor = (!Editor.isDarkMode()) ? '#f08705' : ''; }); - this.addListener('darkModeChanged', updateBackgorund); - updateBackgorund(); + this.addListener('darkModeChanged', updateBackground); + updateBackground(); mxUtils.setPrefixedStyle(this.appIcon.style, 'transition', 'all 125ms linear'); @@ -6835,7 +6841,7 @@ App.prototype.updateHeader = function() */ var right = (uiTheme != 'atlas' && urlParams['embed'] != '1') ? 30 : 10; this.toggleFormatElement = document.createElement('a'); - this.toggleFormatElement.setAttribute('title', mxResources.get('formatPanel') + ' (' + Editor.ctrlKey + '+Shift+P)'); + this.toggleFormatElement.setAttribute('title', mxResources.get('format') + ' (' + Editor.ctrlKey + '+Shift+P)'); this.toggleFormatElement.style.position = 'absolute'; this.toggleFormatElement.style.display = 'inline-block'; this.toggleFormatElement.style.top = (uiTheme == 'atlas') ? '8px' : '6px'; @@ -6861,9 +6867,9 @@ App.prototype.updateHeader = function() mxEvent.addListener(this.toggleFormatElement, 'click', mxUtils.bind(this, function(evt) { EditorUi.logEvent({category: 'TOOLBAR-ACTION-', - action: 'formatPanel'}); + action: 'format'}); - this.actions.get('formatPanel').funct(); + this.actions.get('format').funct(); mxEvent.consume(evt); })); @@ -7063,6 +7069,12 @@ App.prototype.toggleCompactMode = function(visible) */ App.prototype.updateUserElement = function() { + if (this.userElement == null) + { + this.userElement = this.createUserElement(); + this.menubarContainer.appendChild(this.userElement); + } + if ((this.drive == null || this.drive.getUser() == null) && (this.oneDrive == null || this.oneDrive.getUser() == null) && (this.dropbox == null || this.dropbox.getUser() == null) && @@ -7070,536 +7082,11 @@ App.prototype.updateUserElement = function() (this.gitLab == null || this.gitLab.getUser() == null) && (this.trello == null || !this.trello.isAuthorized())) //TODO Trello no user issue { - if (this.userElement != null) - { - this.userElement.parentNode.removeChild(this.userElement); - this.userElement = null; - } + this.userElement.style.display = 'none'; } else { - if (this.userElement == null) - { - this.userElement = this.createUserElement(); - this.menubarContainer.appendChild(this.userElement); - - // Prevents focus - mxEvent.addListener(this.userElement, (mxClient.IS_POINTER) ? 'pointerdown' : 'mousedown', - mxUtils.bind(this, function(evt) - { - evt.preventDefault(); - })); - - mxEvent.addListener(this.userElement, 'click', mxUtils.bind(this, function(evt) - { - if (this.userPanel == null) - { - var div = document.createElement('div'); - div.className = 'geDialog'; - div.style.position = 'absolute'; - div.style.top = (this.userElement.clientTop + - this.userElement.clientHeight + 6) + 'px'; - div.style.zIndex = 5; - div.style.right = '36px'; - div.style.padding = '0px'; - div.style.cursor = 'default'; - div.style.minWidth = '300px'; - - this.userPanel = div; - } - - if (this.userPanel.parentNode != null) - { - this.userPanel.parentNode.removeChild(this.userPanel); - } - else - { - var connected = false; - this.userPanel.innerText = ''; - - var img = document.createElement('img'); - - img.setAttribute('src', Dialog.prototype.closeImage); - img.setAttribute('title', mxResources.get('close')); - img.className = 'geDialogClose'; - img.style.top = '8px'; - img.style.right = '8px'; - - mxEvent.addListener(img, 'click', mxUtils.bind(this, function() - { - if (this.userPanel.parentNode != null) - { - this.userPanel.parentNode.removeChild(this.userPanel); - } - })); - - this.userPanel.appendChild(img); - - if (this.drive != null) - { - var driveUsers = this.drive.getUsersList(); - - if (driveUsers.length > 0) - { - // LATER: Cannot change user while file is open since close will not work with new - // credentials and closing the file using fileLoaded(null) will show splash dialog. - var closeFile = mxUtils.bind(this, function(callback, spinnerMsg) - { - var file = this.getCurrentFile(); - - if (file != null && file.constructor == DriveFile) - { - this.spinner.spin(document.body, spinnerMsg); - -// file.close(); - this.fileLoaded(null); - - // LATER: Use callback to wait for thumbnail update - window.setTimeout(mxUtils.bind(this, function() - { - this.spinner.stop(); - callback(); - }), 2000); - } - else - { - callback(); - } - }); - - var createUserRow = mxUtils.bind(this, function (user) - { - var tr = document.createElement('tr'); - tr.setAttribute('title', 'User ID: ' + user.id); - - var td = document.createElement('td'); - td.setAttribute('valig', 'middle'); - td.style.height = '59px'; - td.style.width = '66px'; - - var img = document.createElement('img'); - img.setAttribute('width', '50'); - img.setAttribute('height', '50'); - img.setAttribute('border', '0'); - img.setAttribute('src', (user.pictureUrl != null) ? user.pictureUrl : this.defaultUserPicture); - img.style.borderRadius = '50%'; - img.style.margin = '4px 8px 0 8px'; - td.appendChild(img); - tr.appendChild(td); - - var td = document.createElement('td'); - td.setAttribute('valign', 'middle'); - td.style.whiteSpace = 'nowrap'; - td.style.paddingTop = '4px'; - td.style.maxWidth = '0'; - td.style.overflow = 'hidden'; - td.style.textOverflow = 'ellipsis'; - mxUtils.write(td, user.displayName + - ((user.isCurrent && driveUsers.length > 1) ? - ' (' + mxResources.get('default') + ')' : '')); - - if (user.email != null) - { - mxUtils.br(td); - - var small = document.createElement('small'); - small.style.color = 'gray'; - mxUtils.write(small, user.email); - td.appendChild(small); - } - - var div = document.createElement('div'); - div.style.marginTop = '4px'; - - var i = document.createElement('i'); - mxUtils.write(i, mxResources.get('googleDrive')); - div.appendChild(i); - td.appendChild(div); - tr.appendChild(td); - - if (!user.isCurrent) - { - tr.style.cursor = 'pointer'; - tr.style.opacity = '0.3'; - - mxEvent.addListener(tr, 'click', mxUtils.bind(this, function(evt) - { - closeFile(mxUtils.bind(this, function() - { - this.stateArg = null; - this.drive.setUser(user); - - this.drive.authorize(true, mxUtils.bind(this, function() - { - this.setMode(App.MODE_GOOGLE); - this.hideDialog(); - this.showSplash(); - }), mxUtils.bind(this, function(resp) - { - this.handleError(resp); - }), true); //Remember is true since add account imply keeping that account - }), mxResources.get('closingFile') + '...'); - - mxEvent.consume(evt); - })); - } - - return tr; - }); - - connected = true; - - var driveUserTable = document.createElement('table'); - driveUserTable.style.borderSpacing = '0'; - driveUserTable.style.fontSize = '10pt'; - driveUserTable.style.width = '100%'; - driveUserTable.style.padding = '10px'; - - for (var i = 0; i < driveUsers.length; i++) - { - driveUserTable.appendChild(createUserRow(driveUsers[i])); - } - - this.userPanel.appendChild(driveUserTable); - - var div = document.createElement('div'); - div.style.textAlign = 'left'; - div.style.padding = '10px'; - div.style.whiteSpace = 'nowrap'; - div.style.borderTop = '1px solid rgb(224, 224, 224)'; - - var btn = mxUtils.button(mxResources.get('signOut'), mxUtils.bind(this, function() - { - this.confirm(mxResources.get('areYouSure'), mxUtils.bind(this, function() - { - closeFile(mxUtils.bind(this, function() - { - this.stateArg = null; - this.drive.logout(); - this.setMode(App.MODE_GOOGLE); - this.hideDialog(); - this.showSplash(); - }), mxResources.get('signOut')); - })); - })); - btn.className = 'geBtn'; - btn.style.float = 'right'; - div.appendChild(btn); - - var btn = mxUtils.button(mxResources.get('addAccount'), mxUtils.bind(this, function() - { - var authWin = this.drive.createAuthWin(); - //FIXME This doean't work to set focus back to main window until closing the file is done - authWin.blur(); - window.focus(); - - closeFile(mxUtils.bind(this, function() - { - this.stateArg = null; - - this.drive.authorize(false, mxUtils.bind(this, function() - { - this.setMode(App.MODE_GOOGLE); - this.hideDialog(); - this.showSplash(); - }), mxUtils.bind(this, function(resp) - { - this.handleError(resp); - }), true, authWin); //Remember is true since add account imply keeping that account - }), mxResources.get('closingFile') + '...'); - })); - btn.className = 'geBtn'; - btn.style.margin = '0px'; - div.appendChild(btn); - this.userPanel.appendChild(div); - } - } - - var addUser = mxUtils.bind(this, function(user, logo, logout, label) - { - if (user != null) - { - if (connected) - { - this.userPanel.appendChild(document.createElement('hr')); - } - - connected = true; - var userTable = document.createElement('table'); - userTable.style.borderSpacing = '0'; - userTable.style.fontSize = '10pt'; - userTable.style.width = '100%'; - userTable.style.padding = '10px'; - - var tbody = document.createElement('tbody'); - var row = document.createElement('tr'); - var td = document.createElement('td'); - td.setAttribute('valig', 'top'); - td.style.width = '40px'; - - if (logo != null) - { - var img = document.createElement('img'); - img.setAttribute('width', '40'); - img.setAttribute('height', '40'); - img.setAttribute('border', '0'); - img.setAttribute('src', logo); - img.style.marginRight = '6px'; - - td.appendChild(img); - } - - row.appendChild(td); - - var td = document.createElement('td'); - td.setAttribute('valign', 'middle'); - td.style.whiteSpace = 'nowrap'; - td.style.maxWidth = '0'; - td.style.overflow = 'hidden'; - td.style.textOverflow = 'ellipsis'; - - mxUtils.write(td, user.displayName); - - if (user.email != null) - { - mxUtils.br(td); - - var small = document.createElement('small'); - small.style.color = 'gray'; - mxUtils.write(small, user.email); - td.appendChild(small); - } - - if (label != null) - { - var div = document.createElement('div'); - div.style.marginTop = '4px'; - - var i = document.createElement('i'); - mxUtils.write(i, label); - div.appendChild(i); - td.appendChild(div); - } - - row.appendChild(td); - tbody.appendChild(row); - userTable.appendChild(tbody); - - this.userPanel.appendChild(userTable); - var div = document.createElement('div'); - div.style.textAlign = 'center'; - div.style.padding = '10px'; - div.style.whiteSpace = 'nowrap'; - - if (logout != null) - { - var btn = mxUtils.button(mxResources.get('signOut'), logout); - btn.className = 'geBtn'; - div.appendChild(btn); - } - - this.userPanel.appendChild(div); - } - }); - - if (this.dropbox != null) - { - addUser(this.dropbox.getUser(), IMAGE_PATH + '/dropbox-logo.svg', mxUtils.bind(this, function() - { - var file = this.getCurrentFile(); - - if (file != null && file.constructor == DropboxFile) - { - var doLogout = mxUtils.bind(this, function() - { - this.dropbox.logout(); - window.location.hash = ''; - }); - - if (!file.isModified()) - { - doLogout(); - } - else - { - this.confirm(mxResources.get('allChangesLost'), null, doLogout, - mxResources.get('cancel'), mxResources.get('discardChanges')); - } - } - else - { - this.dropbox.logout(); - } - }), mxResources.get('dropbox')); - } - - if (this.oneDrive != null) - { - addUser(this.oneDrive.getUser(), IMAGE_PATH + '/onedrive-logo.svg', this.oneDrive.noLogout? null : mxUtils.bind(this, function() - { - var file = this.getCurrentFile(); - - if (file != null && file.constructor == OneDriveFile) - { - var doLogout = mxUtils.bind(this, function() - { - this.oneDrive.logout(); - window.location.hash = ''; - }); - - if (!file.isModified()) - { - doLogout(); - } - else - { - this.confirm(mxResources.get('allChangesLost'), null, doLogout, - mxResources.get('cancel'), mxResources.get('discardChanges')); - } - } - else - { - this.oneDrive.logout(); - } - }), mxResources.get('oneDrive')); - } - - if (this.gitHub != null) - { - addUser(this.gitHub.getUser(), IMAGE_PATH + '/github-logo.svg', mxUtils.bind(this, function() - { - var file = this.getCurrentFile(); - - if (file != null && file.constructor == GitHubFile) - { - var doLogout = mxUtils.bind(this, function() - { - this.gitHub.logout(); - window.location.hash = ''; - }); - - if (!file.isModified()) - { - doLogout(); - } - else - { - this.confirm(mxResources.get('allChangesLost'), null, doLogout, - mxResources.get('cancel'), mxResources.get('discardChanges')); - } - } - else - { - this.gitHub.logout(); - } - }), mxResources.get('github')); - } - - if (this.gitLab != null) - { - addUser(this.gitLab.getUser(), IMAGE_PATH + '/gitlab-logo.svg', mxUtils.bind(this, function() - { - var file = this.getCurrentFile(); - - if (file != null && file.constructor == GitLabFile) - { - var doLogout = mxUtils.bind(this, function() - { - this.gitLab.logout(); - window.location.hash = ''; - }); - - if (!file.isModified()) - { - doLogout(); - } - else - { - this.confirm(mxResources.get('allChangesLost'), null, doLogout, - mxResources.get('cancel'), mxResources.get('discardChanges')); - } - } - else - { - this.gitLab.logout(); - } - }), mxResources.get('gitlab')); - } - - //TODO We have no user info from Trello, how we can create a user? - if (this.trello != null) - { - addUser(this.trello.getUser(), IMAGE_PATH + '/trello-logo.svg', mxUtils.bind(this, function() - { - var file = this.getCurrentFile(); - - if (file != null && file.constructor == TrelloFile) - { - var doLogout = mxUtils.bind(this, function() - { - this.trello.logout(); - window.location.hash = ''; - }); - - if (!file.isModified()) - { - doLogout(); - } - else - { - this.confirm(mxResources.get('allChangesLost'), null, doLogout, - mxResources.get('cancel'), mxResources.get('discardChanges')); - } - } - else - { - this.trello.logout(); - } - }), mxResources.get('trello')); - } - - if (uiTheme == 'min') - { - var file = this.getCurrentFile(); - - if (file != null && file.isRealtimeEnabled() && file.isRealtimeSupported()) - { - var div = document.createElement('div'); - div.style.padding = '10px'; - div.style.whiteSpace = 'nowrap'; - div.style.borderTop = '1px solid rgb(224, 224, 224)'; - div.style.marginTop = '4px'; - div.style.textAlign = 'center'; - div.style.padding = '10px'; - div.style.fontSize = '9pt'; - var err = file.getRealtimeError(); - var state = file.getRealtimeState(); - - if (state != 1) - { - mxUtils.write(div, mxResources.get('realtimeCollaboration') + ': ' + - ((err != null && err.message != null) ? - err.message : mxResources.get('disconnected'))); - this.userPanel.appendChild(div); - } - } - } - - document.body.appendChild(this.userPanel); - } - - mxEvent.consume(evt); - })); - - mxEvent.addListener(document.body, 'click', mxUtils.bind(this, function(evt) - { - if (!mxEvent.isConsumed(evt) && this.userPanel != null && this.userPanel.parentNode != null) - { - this.userPanel.parentNode.removeChild(this.userPanel); - } - })); - } - + this.userElement.style.display = 'inline-block'; var user = null; if (this.drive != null && this.drive.getUser() != null) @@ -7645,7 +7132,53 @@ App.prototype.updateUserElement = function() this.updateUserElementIcon(); }; -//TODO Use this function to get the currently logged in user +/** + * + */ +App.prototype.updateUserElementStyle = function() +{ + var elt = this.userElement; + + if (elt != null) + { + if (Editor.currentTheme == 'sketch') + { + elt.className = 'geToolbarButton'; + elt.style.backgroundImage = 'url(' + Editor.userImage + ')'; + elt.style.backgroundPosition = 'center center'; + elt.style.backgroundRepeat = 'no-repeat'; + elt.style.backgroundSize = '100% 100%'; + elt.style.position = 'relative'; + elt.style.margin = '0px'; + elt.style.padding = '0px'; + elt.style.height = '24px'; + elt.style.width = '24px'; + elt.style.top = '3px'; + elt.style.right = ''; + } + else + { + elt.className = 'geItem'; + elt.style.backgroundImage = 'url(' + IMAGE_PATH + '/expanded.gif)'; + elt.style.backgroundPosition = '100% 60%'; + elt.style.backgroundRepeat = 'no-repeat'; + elt.style.backgroundSize = ''; + elt.style.position = 'absolute'; + elt.style.margin = '4px'; + elt.style.padding = '2px'; + elt.style.paddingRight = '16px'; + elt.style.width = ''; + elt.style.height = ''; + elt.style.right = (Editor.currentTheme == 'atlas' || + urlParams['live-ui'] != '1') ? '8px' : '30px'; + elt.style.top = (Editor.currentTheme == 'atlas') ? '8px' : '2px'; + } + } +}; + +/** + * + */ App.prototype.updateUserElementIcon = function() { var elt = this.userElement; @@ -7670,7 +7203,7 @@ App.prototype.updateUserElementIcon = function() var err = file.getRealtimeError(); var state = file.getRealtimeState(); - title += ' (' + mxResources.get('realtimeCollaboration') + ': '; + title += ' ('; if (state == 1) { @@ -7705,48 +7238,6 @@ App.prototype.updateUserElementIcon = function() } }; -//TODO Use this function to get the currently logged in user -App.prototype.updateUserElementStyle = function() -{ - var elt = this.userElement; - - if (elt != null) - { - if (Editor.currentTheme == 'sketch') - { - elt.className = 'geToolbarButton'; - elt.style.backgroundImage = 'url(' + Editor.userImage + ')'; - elt.style.backgroundPosition = 'center center'; - elt.style.backgroundRepeat = 'no-repeat'; - elt.style.backgroundSize = '100% 100%'; - elt.style.position = 'relative'; - elt.style.margin = '0px'; - elt.style.padding = '0px'; - elt.style.height = '24px'; - elt.style.width = '24px'; - elt.style.top = '3px'; - elt.style.right = ''; - } - else - { - elt.className = 'geItem'; - elt.style.backgroundImage = 'url(' + IMAGE_PATH + '/expanded.gif)'; - elt.style.backgroundPosition = '100% 60%'; - elt.style.backgroundRepeat = 'no-repeat'; - elt.style.backgroundSize = ''; - elt.style.position = 'absolute'; - elt.style.margin = '4px'; - elt.style.padding = '2px'; - elt.style.paddingRight = '16px'; - elt.style.width = ''; - elt.style.height = ''; - elt.style.right = (Editor.currentTheme == 'atlas' || - urlParams['live-ui'] != '1') ? '8px' : '30px'; - elt.style.top = (Editor.currentTheme == 'atlas') ? '8px' : '2px'; - } - } -}; - /** * Adds the listener for automatically saving the diagram for local changes. */ @@ -7757,10 +7248,526 @@ App.prototype.createUserElement = function() elt.style.display = 'inline-block'; elt.style.cursor = 'pointer'; elt.style.fontSize = '8pt'; + + // Prevents focus + mxEvent.addListener(elt, (mxClient.IS_POINTER) ? 'pointerdown' : 'mousedown', + mxUtils.bind(this, function(evt) + { + evt.preventDefault(); + })); + + mxEvent.addListener(elt, 'click', mxUtils.bind(this, function(evt) + { + if (this.userPanel == null) + { + var div = document.createElement('div'); + div.className = 'geDialog'; + div.style.position = 'absolute'; + div.style.top = (elt.clientTop + elt.clientHeight + 6) + 'px'; + div.style.zIndex = 5; + div.style.right = '36px'; + div.style.padding = '0px'; + div.style.cursor = 'default'; + div.style.minWidth = '300px'; + + this.userPanel = div; + } + + if (this.userPanel.parentNode != null) + { + this.userPanel.parentNode.removeChild(this.userPanel); + } + else + { + var connected = false; + this.userPanel.innerText = ''; + + var img = document.createElement('img'); + + img.setAttribute('src', Dialog.prototype.closeImage); + img.setAttribute('title', mxResources.get('close')); + img.className = 'geDialogClose'; + img.style.top = '8px'; + img.style.right = '8px'; + + mxEvent.addListener(img, 'click', mxUtils.bind(this, function() + { + if (this.userPanel.parentNode != null) + { + this.userPanel.parentNode.removeChild(this.userPanel); + } + })); + + this.userPanel.appendChild(img); + + if (this.drive != null) + { + var driveUsers = this.drive.getUsersList(); + + if (driveUsers.length > 0) + { + // LATER: Cannot change user while file is open since close will not work with new + // credentials and closing the file using fileLoaded(null) will show splash dialog. + var closeFile = mxUtils.bind(this, function(callback, spinnerMsg) + { + var file = this.getCurrentFile(); + + if (file != null && file.constructor == DriveFile) + { + this.spinner.spin(document.body, spinnerMsg); + +// file.close(); + this.fileLoaded(null); + + // LATER: Use callback to wait for thumbnail update + window.setTimeout(mxUtils.bind(this, function() + { + this.spinner.stop(); + callback(); + }), 2000); + } + else + { + callback(); + } + }); + + var createUserRow = mxUtils.bind(this, function (user) + { + var tr = document.createElement('tr'); + tr.setAttribute('title', 'User ID: ' + user.id); + + var td = document.createElement('td'); + td.setAttribute('valig', 'middle'); + td.style.height = '59px'; + td.style.width = '66px'; + + var img = document.createElement('img'); + img.setAttribute('width', '50'); + img.setAttribute('height', '50'); + img.setAttribute('border', '0'); + img.setAttribute('src', (user.pictureUrl != null) ? user.pictureUrl : this.defaultUserPicture); + img.style.borderRadius = '50%'; + img.style.margin = '4px 8px 0 8px'; + td.appendChild(img); + tr.appendChild(td); + + var td = document.createElement('td'); + td.setAttribute('valign', 'middle'); + td.style.whiteSpace = 'nowrap'; + td.style.paddingTop = '4px'; + td.style.maxWidth = '0'; + td.style.overflow = 'hidden'; + td.style.textOverflow = 'ellipsis'; + mxUtils.write(td, user.displayName + + ((user.isCurrent && driveUsers.length > 1) ? + ' (' + mxResources.get('default') + ')' : '')); + + if (user.email != null) + { + mxUtils.br(td); + + var small = document.createElement('small'); + small.style.color = 'gray'; + mxUtils.write(small, user.email); + td.appendChild(small); + } + + var div = document.createElement('div'); + div.style.marginTop = '4px'; + + var i = document.createElement('i'); + mxUtils.write(i, mxResources.get('googleDrive')); + div.appendChild(i); + td.appendChild(div); + tr.appendChild(td); + + if (!user.isCurrent) + { + tr.style.cursor = 'pointer'; + tr.style.opacity = '0.3'; + + mxEvent.addListener(tr, 'click', mxUtils.bind(this, function(evt) + { + closeFile(mxUtils.bind(this, function() + { + this.stateArg = null; + this.drive.setUser(user); + + this.drive.authorize(true, mxUtils.bind(this, function() + { + this.setMode(App.MODE_GOOGLE); + this.hideDialog(); + this.showSplash(); + }), mxUtils.bind(this, function(resp) + { + this.handleError(resp); + }), true); //Remember is true since add account imply keeping that account + }), mxResources.get('closingFile') + '...'); + + mxEvent.consume(evt); + })); + } + + return tr; + }); + + connected = true; + + var driveUserTable = document.createElement('table'); + driveUserTable.style.borderSpacing = '0'; + driveUserTable.style.fontSize = '10pt'; + driveUserTable.style.width = '100%'; + driveUserTable.style.padding = '10px'; + + for (var i = 0; i < driveUsers.length; i++) + { + driveUserTable.appendChild(createUserRow(driveUsers[i])); + } + + this.userPanel.appendChild(driveUserTable); + + var div = document.createElement('div'); + div.style.textAlign = 'left'; + div.style.padding = '10px'; + div.style.whiteSpace = 'nowrap'; + div.style.borderTop = '1px solid rgb(224, 224, 224)'; + + var btn = mxUtils.button(mxResources.get('signOut'), mxUtils.bind(this, function() + { + this.confirm(mxResources.get('areYouSure'), mxUtils.bind(this, function() + { + closeFile(mxUtils.bind(this, function() + { + this.stateArg = null; + this.drive.logout(); + this.setMode(App.MODE_GOOGLE); + this.hideDialog(); + this.showSplash(); + }), mxResources.get('signOut')); + })); + })); + btn.className = 'geBtn'; + btn.style.float = 'right'; + div.appendChild(btn); + + var btn = mxUtils.button(mxResources.get('addAccount'), mxUtils.bind(this, function() + { + var authWin = this.drive.createAuthWin(); + //FIXME This doean't work to set focus back to main window until closing the file is done + authWin.blur(); + window.focus(); + + closeFile(mxUtils.bind(this, function() + { + this.stateArg = null; + + this.drive.authorize(false, mxUtils.bind(this, function() + { + this.setMode(App.MODE_GOOGLE); + this.hideDialog(); + this.showSplash(); + }), mxUtils.bind(this, function(resp) + { + this.handleError(resp); + }), true, authWin); //Remember is true since add account imply keeping that account + }), mxResources.get('closingFile') + '...'); + })); + btn.className = 'geBtn'; + btn.style.margin = '0px'; + div.appendChild(btn); + this.userPanel.appendChild(div); + } + } + + var addUser = mxUtils.bind(this, function(user, logo, logout, label) + { + if (user != null) + { + if (connected) + { + this.userPanel.appendChild(document.createElement('hr')); + } + + connected = true; + var userTable = document.createElement('table'); + userTable.style.borderSpacing = '0'; + userTable.style.fontSize = '10pt'; + userTable.style.width = '100%'; + userTable.style.padding = '10px'; + + var tbody = document.createElement('tbody'); + var row = document.createElement('tr'); + var td = document.createElement('td'); + td.setAttribute('valig', 'top'); + td.style.width = '40px'; + + if (logo != null) + { + var img = document.createElement('img'); + img.setAttribute('width', '40'); + img.setAttribute('height', '40'); + img.setAttribute('border', '0'); + img.setAttribute('src', logo); + img.style.marginRight = '6px'; + + td.appendChild(img); + } + + row.appendChild(td); + + var td = document.createElement('td'); + td.setAttribute('valign', 'middle'); + td.style.whiteSpace = 'nowrap'; + td.style.maxWidth = '0'; + td.style.overflow = 'hidden'; + td.style.textOverflow = 'ellipsis'; + + mxUtils.write(td, user.displayName); + + if (user.email != null) + { + mxUtils.br(td); + + var small = document.createElement('small'); + small.style.color = 'gray'; + mxUtils.write(small, user.email); + td.appendChild(small); + } + + if (label != null) + { + var div = document.createElement('div'); + div.style.marginTop = '4px'; + + var i = document.createElement('i'); + mxUtils.write(i, label); + div.appendChild(i); + td.appendChild(div); + } + + row.appendChild(td); + tbody.appendChild(row); + userTable.appendChild(tbody); + + this.userPanel.appendChild(userTable); + var div = document.createElement('div'); + div.style.textAlign = 'center'; + div.style.padding = '10px'; + div.style.whiteSpace = 'nowrap'; + + if (logout != null) + { + var btn = mxUtils.button(mxResources.get('signOut'), logout); + btn.className = 'geBtn'; + div.appendChild(btn); + } + + this.userPanel.appendChild(div); + } + }); + + if (this.dropbox != null) + { + addUser(this.dropbox.getUser(), IMAGE_PATH + '/dropbox-logo.svg', mxUtils.bind(this, function() + { + var file = this.getCurrentFile(); + + if (file != null && file.constructor == DropboxFile) + { + var doLogout = mxUtils.bind(this, function() + { + this.dropbox.logout(); + window.location.hash = ''; + }); + + if (!file.isModified()) + { + doLogout(); + } + else + { + this.confirm(mxResources.get('allChangesLost'), null, doLogout, + mxResources.get('cancel'), mxResources.get('discardChanges')); + } + } + else + { + this.dropbox.logout(); + } + }), mxResources.get('dropbox')); + } + + if (this.oneDrive != null) + { + addUser(this.oneDrive.getUser(), IMAGE_PATH + '/onedrive-logo.svg', this.oneDrive.noLogout? null : mxUtils.bind(this, function() + { + var file = this.getCurrentFile(); + + if (file != null && file.constructor == OneDriveFile) + { + var doLogout = mxUtils.bind(this, function() + { + this.oneDrive.logout(); + window.location.hash = ''; + }); + + if (!file.isModified()) + { + doLogout(); + } + else + { + this.confirm(mxResources.get('allChangesLost'), null, doLogout, + mxResources.get('cancel'), mxResources.get('discardChanges')); + } + } + else + { + this.oneDrive.logout(); + } + }), mxResources.get('oneDrive')); + } + + if (this.gitHub != null) + { + addUser(this.gitHub.getUser(), IMAGE_PATH + '/github-logo.svg', mxUtils.bind(this, function() + { + var file = this.getCurrentFile(); + + if (file != null && file.constructor == GitHubFile) + { + var doLogout = mxUtils.bind(this, function() + { + this.gitHub.logout(); + window.location.hash = ''; + }); + + if (!file.isModified()) + { + doLogout(); + } + else + { + this.confirm(mxResources.get('allChangesLost'), null, doLogout, + mxResources.get('cancel'), mxResources.get('discardChanges')); + } + } + else + { + this.gitHub.logout(); + } + }), mxResources.get('github')); + } + + if (this.gitLab != null) + { + addUser(this.gitLab.getUser(), IMAGE_PATH + '/gitlab-logo.svg', mxUtils.bind(this, function() + { + var file = this.getCurrentFile(); + + if (file != null && file.constructor == GitLabFile) + { + var doLogout = mxUtils.bind(this, function() + { + this.gitLab.logout(); + window.location.hash = ''; + }); + + if (!file.isModified()) + { + doLogout(); + } + else + { + this.confirm(mxResources.get('allChangesLost'), null, doLogout, + mxResources.get('cancel'), mxResources.get('discardChanges')); + } + } + else + { + this.gitLab.logout(); + } + }), mxResources.get('gitlab')); + } + + //TODO We have no user info from Trello, how we can create a user? + if (this.trello != null) + { + addUser(this.trello.getUser(), IMAGE_PATH + '/trello-logo.svg', mxUtils.bind(this, function() + { + var file = this.getCurrentFile(); + + if (file != null && file.constructor == TrelloFile) + { + var doLogout = mxUtils.bind(this, function() + { + this.trello.logout(); + window.location.hash = ''; + }); + + if (!file.isModified()) + { + doLogout(); + } + else + { + this.confirm(mxResources.get('allChangesLost'), null, doLogout, + mxResources.get('cancel'), mxResources.get('discardChanges')); + } + } + else + { + this.trello.logout(); + } + }), mxResources.get('trello')); + } + + if (uiTheme == 'min') + { + var file = this.getCurrentFile(); + + if (file != null && file.isRealtimeEnabled() && file.isRealtimeSupported()) + { + var div = document.createElement('div'); + div.style.padding = '10px'; + div.style.whiteSpace = 'nowrap'; + div.style.borderTop = '1px solid rgb(224, 224, 224)'; + div.style.marginTop = '4px'; + div.style.textAlign = 'center'; + div.style.padding = '10px'; + div.style.fontSize = '9pt'; + var err = file.getRealtimeError(); + var state = file.getRealtimeState(); + + if (state != 1) + { + mxUtils.write(div, mxResources.get('realtimeCollaboration') + ': ' + + ((err != null && err.message != null) ? + err.message : mxResources.get('disconnected'))); + this.userPanel.appendChild(div); + } + } + } + + document.body.appendChild(this.userPanel); + } + + mxEvent.consume(evt); + })); + + mxEvent.addListener(document.body, 'click', mxUtils.bind(this, function(evt) + { + if (!mxEvent.isConsumed(evt) && this.userPanel != null && this.userPanel.parentNode != null) + { + this.userPanel.parentNode.removeChild(this.userPanel); + } + })); + return elt; }; - + //TODO Use this function to get the currently logged in user App.prototype.getCurrentUser = function() { @@ -7785,7 +7792,8 @@ App.prototype.getCurrentUser = function() //TODO Trello no user issue return user; -} +}; + /** * Override depends on mxSettings which is not defined in the minified viewer. */ |