diff --git a/App-debug-apikey.html b/App-debug-apikey.html index 42af898..2ea9141 100644 --- a/App-debug-apikey.html +++ b/App-debug-apikey.html @@ -3,10 +3,10 @@ PPM Timesheet - + @@ -211,108 +211,74 @@ Ext.define('Rally.apps.ppmtimesheet.PPMTimesheetApp', { mixins: ['Rally.clientmetrics.ClientMetricsRecordable'], - appName: 'PPM Timesheet Frame', + appName: 'PPM Timesheet App v2', config: { defaultSettings: { ppmHost: null, ppmPort: 443, - ppmRelativePathWithParams: null + relativePath: null } }, autoScroll: false, - timesheetSuffix: '/pm/integration.html#', - + timesheetSuffix: '/pm/integration.html#', //'/pm/#/timesheets', + loggedInMessage: "Connection to the Clarity timesheet has been launched in a separate tab.

Your browser pop-up blocker may interfere with this process.

Click here to access or re-launch Clarity.

If you will be accessing the Clarity timesheet regularly, you may wish to always allow popus from this site.", +//https://knowledge.broadcom.com/external/article?articleId=206489 launch: function() { var server = this.getPPMHost(), port = this.getPPMPort(); - + this.validateConfig(server, port).then({ - success: this.addFrame, + success: this.addLauncher, failure: this.showAppMessage, scope: this }); }, - addFrame: function(){ - this.logger.log('addFrame'); + addLauncher: function(){ var server = this.getPPMHost(), - port = this.getPPMPort(), - relativePath = this.getPPMRelativePath(), - url = this.buildPPMTimesheetURL(server, port, relativePath); - - try { - - this.add({ - xtype: 'container', - html: '
Login to PPM through Agile Central is recommended only when using a private computer' - }); + port = this.getPPMPort(), + relativePath = this.getPPMRelativePath(), + url = this.buildPPMTimesheetURL(server, port, relativePath), + height = this.getHeight() || 600; + this.logger.log("addLauncher",url); - var iframe = this.add({ - xtype: 'component', - itemId: 'ppmIframe', - autoEl: { - tag: 'iframe', - style: 'height: 100%; width: 100%; border: none;', - src: url - } - }); - - - var me = this; - iframe.getEl().dom.onload = function(e){ - me.logger.log('iframe loaded', e, iframe.getEl().dom); - }; - } - catch(e){ - Rally.ui.notify.Notifier.showError({message: Ext.String.format("Error loading {0} into iFrame.",url)}); + var msg = Ext.String.format(this.loggedInMessage, url, server); + this.add({ + xtype: 'container', + html: '
' + msg + }); + + this.launchWindow(url); + }, + launchWindow: function(url){ + if (!this.currentWindow || this.currentWindow.closed === true){ + this.currentWindow = window.open(url,'clarityWindow') //,'toolbar=0,location=0,directories=0,status=0,menubar=0,scrollbars=1,resizable=0,width=700,height=600'); + } else { + this.currentWindow.focus(); } - }, + validateConfig: function(server, port){ var deferred = Ext.create('Deft.Deferred'); if (!server){ - deferred.reject("No PPM Server and Port is configured. Please work with an administrator to configure your PPM https server."); + deferred.reject("No Clarity Server and Port is configured. Please work with an administrator to configure your Clarity https server."); } else { - //Commented this out due to the chrome issue, as this fails on it. - //var httpRequest = new XMLHttpRequest(), - // suffix = '/ppm/rest/v1/private/userContext', - //url = this.buildPPMTimesheetURL(server, port); - // - //url = url.replace(this.timesheetSuffix, suffix); - // - //httpRequest.withCredentials = true; - //httpRequest.cors = true; - //httpRequest.onreadystatechange = function() { - // console.log('ready', httpRequest.readyState, httpRequest.status); - // if (httpRequest.readyState === 4) { - // console.log('readystate', httpRequest); - // if (httpRequest.status !== 200) { - // console.log('Failed', httpRequest.status); - // var msg = Ext.String.format('The PPM Server and Port provided is not responding as expected. Please verify the configuration in the App Settings.'); - // deferred.reject(msg); - // } else { - deferred.resolve(); - // } - // } - //}; - //httpRequest.open('GET', url); - //httpRequest.send(); + deferred.resolve(); } return deferred; }, buildPPMTimesheetURL: function(server, port, relativePath){ - var url = server.startsWith( "https://" ) ? server : Ext.String.format("https://{0}",server); + var url = Ext.String.format("https://{0}",server); if (port){ url = Ext.String.format("{0}:{1}", url, port); } - // if relative path is given then either it's SSO environment or default timesheet suffix is not needed if( relativePath ) { - if( !url.endsWith("/") && !relativePath.startsWith("/") ) { - url = url + "/"; - } + if( !url.endsWith("/") && !relativePath.startsWith("/") ) { + url = url + "/"; + } return url + relativePath; } else { return url + this.timesheetSuffix; @@ -338,24 +304,24 @@ Ext.define('Rally.apps.ppmtimesheet.PPMTimesheetApp', { return [{ xtype: 'container', - html: '
NOTE: The PPM server must be version 15.2 or above.
' + html: '
NOTE: The Clarity server must be version 15.2 or above.
' },{ name: 'ppmHost', xtype: 'rallytextfield', - width: 400, - labelWidth: 150, + width: 600, + labelWidth: 225, labelAlign: 'right', - fieldLabel: 'PPM Host name', + fieldLabel: 'Clarity Host name
(for SSO the IdP URL)', margin: '10 0 10 0', maskRe: /[a-zA-Z0-9\.\-]/, emptyText: 'Please enter a Host name or IP Address...', - maxLength: 500 + maxLength: 255 },{ name: 'ppmPort', xtype:'rallynumberfield', labelAlign: 'right', fieldLabel: 'Port (HTTPS)', - labelWidth: 150, + labelWidth: 225, emptyText: 443, minValue: 0, maxValue: 65535, @@ -365,19 +331,19 @@ Ext.define('Rally.apps.ppmtimesheet.PPMTimesheetApp', { },{ name: 'ppmRelativePathWithParams', xtype: 'rallytextfield', - width: 605, - labelWidth: 150, + width: 600, + labelWidth: 225, labelAlign: 'right', - fieldLabel: 'PPM Host Relative Path (for SSO only)', + fieldLabel: 'Clarity Host Relative Path
(for SSO only)', margin: '10 0 10 0', //maskRe: /[a-zA-Z0-9\.\-]/, //emptyText: 'In SSO environment, enter relative path with any parameters of IdP initiated SSO PPM URL here and enter host address above ...', - emptyText: 'In SSO environment, enter relative path with any parameters of IdP initiated SSO PPM URL here...', + emptyText: 'In SSO environment, enter relative path with any parameters of IdP URL here...', maxLength: 500 }]; } }); - + Rally.launchApp('Rally.apps.ppmtimesheet.PPMTimesheetApp', { name: 'PPM Timesheet' }); @@ -407,6 +373,11 @@ Ext.define('Rally.apps.ppmtimesheet.PPMTimesheetApp', { .noScrolling { overflow: hidden; } + +.subtext { + color:dimgrey; + font-style: italic; +} diff --git a/images/ppmtimesheet-app-settings.png b/images/ppmtimesheet-app-settings.png index fc27b33..fe40452 100644 Binary files a/images/ppmtimesheet-app-settings.png and b/images/ppmtimesheet-app-settings.png differ diff --git a/package.json b/package.json index ee0c95f..308a445 100644 --- a/package.json +++ b/package.json @@ -7,11 +7,11 @@ "grunt": "~0.4.5", "grunt-cli": "0.1.6", "grunt-contrib-jasmine": "~0.5.2", + "grunt-contrib-uglify": "0.3.2", + "grunt-contrib-watch": "^1.1.0", "grunt-templater": "git://github.com/rockwood/grunt-templater.git", + "request": "2.67", "underscore": "1.4.4", - "grunt-contrib-uglify":"0.3.2", - "request":"2.67", - "grunt-contrib-watch":"1.0.0", - "username":"2.1.0" + "username": "2.1.0" } } diff --git a/src/javascript/app.js b/src/javascript/app.js index ba6cc86..3e5384d 100644 --- a/src/javascript/app.js +++ b/src/javascript/app.js @@ -6,102 +6,78 @@ Ext.define('Rally.apps.ppmtimesheet.PPMTimesheetApp', { mixins: ['Rally.clientmetrics.ClientMetricsRecordable'], - appName: 'PPM Timesheet Frame', + appName: 'PPM Timesheet App v2', config: { defaultSettings: { ppmHost: null, - ppmPort: 443 + ppmPort: 443, + relativePath: null } }, autoScroll: false, - timesheetSuffix: '/pm/integration.html#', - + timesheetSuffix: '/pm/integration.html#', //'/pm/#/timesheets', + loggedInMessage: "Connection to the Clarity timesheet has been launched in a separate tab.

Your browser pop-up blocker may interfere with this process.

Click here to access or re-launch Clarity.

If you will be accessing the Clarity timesheet regularly, you may wish to always allow popus from this site.", +//https://knowledge.broadcom.com/external/article?articleId=206489 launch: function() { var server = this.getPPMHost(), port = this.getPPMPort(); this.validateConfig(server, port).then({ - success: this.addFrame, + success: this.addLauncher, failure: this.showAppMessage, scope: this }); }, - addFrame: function(){ - this.logger.log('addFrame'); + addLauncher: function(){ var server = this.getPPMHost(), - port = this.getPPMPort(), - url = this.buildPPMTimesheetURL(server, port); - - try { - - this.add({ - xtype: 'container', - html: '
Login to PPM through Agile Central is recommended only when using a private computer' - }); - - var iframe = this.add({ - xtype: 'component', - itemId: 'ppmIframe', - autoEl: { - tag: 'iframe', - style: 'height: 100%; width: 100%; border: none;', - src: url - } - }); - + port = this.getPPMPort(), + relativePath = this.getPPMRelativePath(), + url = this.buildPPMTimesheetURL(server, port, relativePath), + height = this.getHeight() || 600; + this.logger.log("addLauncher",url); - var me = this; - iframe.getEl().dom.onload = function(e){ - me.logger.log('iframe loaded', e, iframe.getEl().dom); - }; - } - catch(e){ - Rally.ui.notify.Notifier.showError({message: Ext.String.format("Error loading {0} into iFrame.",url)}); + var msg = Ext.String.format(this.loggedInMessage, url, server); + this.add({ + xtype: 'container', + html: '
' + msg + }); + + this.launchWindow(url); + }, + launchWindow: function(url){ + if (!this.currentWindow || this.currentWindow.closed === true){ + this.currentWindow = window.open(url,'clarityWindow') //,'toolbar=0,location=0,directories=0,status=0,menubar=0,scrollbars=1,resizable=0,width=700,height=600'); + } else { + this.currentWindow.focus(); } - }, + validateConfig: function(server, port){ var deferred = Ext.create('Deft.Deferred'); if (!server){ - deferred.reject("No PPM Server and Port is configured. Please work with an administrator to configure your PPM https server."); + deferred.reject("No Clarity Server and Port is configured. Please work with an administrator to configure your Clarity https server."); } else { - //Commented this out due to the chrome issue, as this fails on it. - //var httpRequest = new XMLHttpRequest(), - // suffix = '/ppm/rest/v1/private/userContext', - //url = this.buildPPMTimesheetURL(server, port); - // - //url = url.replace(this.timesheetSuffix, suffix); - // - //httpRequest.withCredentials = true; - //httpRequest.cors = true; - //httpRequest.onreadystatechange = function() { - // console.log('ready', httpRequest.readyState, httpRequest.status); - // if (httpRequest.readyState === 4) { - // console.log('readystate', httpRequest); - // if (httpRequest.status !== 200) { - // console.log('Failed', httpRequest.status); - // var msg = Ext.String.format('The PPM Server and Port provided is not responding as expected. Please verify the configuration in the App Settings.'); - // deferred.reject(msg); - // } else { - deferred.resolve(); - // } - // } - //}; - //httpRequest.open('GET', url); - //httpRequest.send(); + deferred.resolve(); } return deferred; }, - buildPPMTimesheetURL: function(server, port){ + buildPPMTimesheetURL: function(server, port, relativePath){ var url = Ext.String.format("https://{0}",server); if (port){ url = Ext.String.format("{0}:{1}", url, port); } - return url + this.timesheetSuffix; + if( relativePath ) { + if( !url.endsWith("/") && !relativePath.startsWith("/") ) { + url = url + "/"; + } + return url + relativePath; + } else { + return url + this.timesheetSuffix; + } }, getPPMHost: function(){ return this.getSetting('ppmHost') || null; @@ -109,6 +85,9 @@ Ext.define('Rally.apps.ppmtimesheet.PPMTimesheetApp', { getPPMPort: function(){ return this.getSetting('ppmPort') || null; }, + getPPMRelativePath: function(){ + return this.getSetting('ppmRelativePathWithParams') || null; + }, showAppMessage: function(msg){ this.removeAll(); this.add({ @@ -120,14 +99,14 @@ Ext.define('Rally.apps.ppmtimesheet.PPMTimesheetApp', { return [{ xtype: 'container', - html: '
NOTE: The PPM server must be version 15.2 or above.
' + html: '
NOTE: The Clarity server must be version 15.2 or above.
' },{ name: 'ppmHost', xtype: 'rallytextfield', - width: 400, - labelWidth: 100, + width: 600, + labelWidth: 225, labelAlign: 'right', - fieldLabel: 'PPM Host name', + fieldLabel: 'Clarity Host name
(for SSO the IdP URL)', margin: '10 0 10 0', maskRe: /[a-zA-Z0-9\.\-]/, emptyText: 'Please enter a Host name or IP Address...', @@ -137,13 +116,25 @@ Ext.define('Rally.apps.ppmtimesheet.PPMTimesheetApp', { xtype:'rallynumberfield', labelAlign: 'right', fieldLabel: 'Port (HTTPS)', - labelWidth: 100, + labelWidth: 225, emptyText: 443, minValue: 0, maxValue: 65535, allowBlank: true, allowDecimals: false, allowExponential: false + },{ + name: 'ppmRelativePathWithParams', + xtype: 'rallytextfield', + width: 600, + labelWidth: 225, + labelAlign: 'right', + fieldLabel: 'Clarity Host Relative Path
(for SSO only)', + margin: '10 0 10 0', + //maskRe: /[a-zA-Z0-9\.\-]/, + //emptyText: 'In SSO environment, enter relative path with any parameters of IdP initiated SSO PPM URL here and enter host address above ...', + emptyText: 'In SSO environment, enter relative path with any parameters of IdP URL here...', + maxLength: 500 }]; } }); \ No newline at end of file diff --git a/src/style/app.css b/src/style/app.css index 16dfbb4..53c2374 100644 --- a/src/style/app.css +++ b/src/style/app.css @@ -18,4 +18,9 @@ .noScrolling { overflow: hidden; +} + +.subtext { + color:dimgrey; + font-style: italic; } \ No newline at end of file