From 0e776a88b0ee377905501fb5f521aa987f3ca412 Mon Sep 17 00:00:00 2001 From: Thomas Flemmer Date: Fri, 5 Jun 2015 12:29:26 +0200 Subject: [PATCH] delete bug while loading a view --- src/main/webapp/app/view/home/MotdPanel.js | 12 +- src/main/webapp/app/view/home/NewMotdPanel.js | 231 +++++++++++++++++- 2 files changed, 236 insertions(+), 7 deletions(-) diff --git a/src/main/webapp/app/view/home/MotdPanel.js b/src/main/webapp/app/view/home/MotdPanel.js index 1bf9b781..675441cb 100644 --- a/src/main/webapp/app/view/home/MotdPanel.js +++ b/src/main/webapp/app/view/home/MotdPanel.js @@ -60,12 +60,11 @@ Ext.define('ARSnova.view.home.motdPanel', { }); this.backButton = Ext.create('Ext.Button', { - text: Messages.HOME, - align: 'left', + text: Messages.SESSIONS, ui: 'back', handler: function () { var hTP = ARSnova.app.mainTabPanel.tabPanel.homeTabPanel; - hTP.animateActiveItem(hTP.homePanel, { + hTP.animateActiveItem(hTP.mySessionsPanel, { type: 'slide', direction: 'right', duration: 700 @@ -73,6 +72,7 @@ Ext.define('ARSnova.view.home.motdPanel', { } }); + this.roleIcon = Ext.create('Ext.Component', { cls: 'roleIcon speakerRole', hidden: (screenWidth < 370), @@ -142,7 +142,7 @@ Ext.define('ARSnova.view.home.motdPanel', { handler: function () { this.newMotdPanel = Ext.create('ARSnova.view.home.NewMotdPanel'); var hTP = ARSnova.app.mainTabPanel.tabPanel.homeTabPanel; - hTP.animateActiveItem(hTP.NewMotdPanel, 'slide'); + hTP.animateActiveItem(hTP.newMotdPanel, 'slide'); console.log("kommt"); } }) @@ -383,8 +383,8 @@ Ext.define('ARSnova.view.home.motdPanel', { onActivate: function () { var me = this; if (ARSnova.app.userRole === ARSnova.app.USER_ROLE_SPEAKER) { - this.backButton.hide(); - this.logoutButton.show(); + this.backButton.show(); + //this.logoutButton.show(); if (ARSnova.app.loginMode === ARSnova.app.LOGIN_THM) { this.logoutButton.addCls('thm'); diff --git a/src/main/webapp/app/view/home/NewMotdPanel.js b/src/main/webapp/app/view/home/NewMotdPanel.js index ecb9fda1..637cd1e1 100644 --- a/src/main/webapp/app/view/home/NewMotdPanel.js +++ b/src/main/webapp/app/view/home/NewMotdPanel.js @@ -19,6 +19,235 @@ Ext.define('ARSnova.view.home.NewMotdPanel', { extend: 'Ext.Panel', - + config: { + fullscreen: true, + scrollable: null, + scroll: 'vertical' + }, + sessionKey: null, + + /* items */ + sessionIdField: null, + unavailableSessionIds: [], + mycourses: [], + mycoursesStore: null, + + /* toolbar items */ + toolbar: null, + backButton: null, + + constructor: function (args) { + this.callParent(arguments); + + this.mycoursesStore = new Ext.data.JsonStore({ + model: 'ARSnova.model.Course' + }); + + var htmlEncode = window.innerWidth > 321 ? "{fullname:htmlEncode}" : "{shortname:htmlEncode}"; + + this.coursesFieldset = Ext.create('Ext.form.FieldSet', { + xtype: 'fieldset', + title: Messages.YOUR_COURSE_SESSIONS + }); + + this.mycourses = Ext.create('Ext.List', { + cls: 'myCoursesList', + store: this.mycoursesStore, + disableSelection: true, + hidden: true, + style: { + backgroundColor: 'transparent' + }, + itemTpl: + '
' + + '' + + '' + htmlEncode + '
', + listeners: { + scope: this, + + hide: function () { + this.coursesFieldset.hide(); + }, + + show: function () { + this.coursesFieldset.show(); + }, + + /** + * The following event is used to get the computed height of all list items and + * finally to set this value to the list DataView. In order to ensure correct rendering + * it is also necessary to get the properties "padding-top" and "padding-bottom" and + * add them to the height of the list DataView. + */ + resize: function (list, eOpts) { + var listItemsDom = list.select(".x-list .x-inner .x-inner").elements[0]; + + this.mycourses.setHeight( + parseInt(window.getComputedStyle(listItemsDom, "").getPropertyValue("height")) + + parseInt(window.getComputedStyle(list.dom, "").getPropertyValue("padding-top")) + + parseInt(window.getComputedStyle(list.dom, "").getPropertyValue("padding-bottom")) + ); + } + } + }); + + this.coursesFieldset.add(this.mycourses); + + this.backButton = Ext.create('Ext.Button', { + text: Messages.SESSIONS, + ui: 'back', + handler: function () { + var hTP = ARSnova.app.mainTabPanel.tabPanel.homeTabPanel; + hTP.animateActiveItem(hTP.mySessionsPanel, { + type: 'slide', + direction: 'right', + duration: 700 + }); + } + }); + + this.submitButton = Ext.create('Ext.Button', { + id: 'create-session-button', + cls: 'centerButton', + ui: 'confirm', + text: Messages.SESSION_SAVE, + handler: this.onSubmit + }); + + this.toolbar = Ext.create('Ext.Toolbar', { + title: Messages.NEW_SESSION, + cls: 'titlePaddingLeft', + docked: 'top', + ui: 'light', + items: [ + this.backButton + ] + }); + + this.add([this.toolbar, { + title: 'createSession', + style: { + marginTop: '15px' + }, + xtype: 'formpanel', + scrollable: null, + id: 'createSession', + submitOnAction: false, + + items: [{ + xtype: 'fieldset', + items: [{ + xtype: 'textfield', + name: 'name', + label: Messages.SESSION_NAME, + placeHolder: Messages.SESSION_NAME_PLACEHOLDER, + maxLength: 50, + clearIcon: true + }, { + xtype: 'textfield', + name: 'shortName', + label: Messages.SESSION_SHORT_NAME, + placeHolder: Messages.SESSION_SHORT_NAME_PLACEHOLDER, + maxLength: 8, + clearIcon: true + }] + }, this.submitButton, this.coursesFieldset] + }]); + + this.onBefore('activate', function () { + this.getMyCourses(); + this.setScrollable(true); + }, this); + }, + + enableInputElements: function () { + this.submitButton.enable(); + this.mycourses.addListener('itemtap', this.onCourseSubmit); + }, + + disableInputElements: function () { + this.submitButton.disable(); + this.mycourses.removeListener('itemtap', this.onCourseSubmit); + }, + + onSubmit: function (button) { + var panel = ARSnova.app.mainTabPanel.tabPanel.homeTabPanel.newSessionPanel, + values = this.up('panel').getValues(); + + panel.disableInputElements(); + + ARSnova.app.getController('Sessions').create({ + name: values.name, + shortName: values.shortName, + newSessionPanel: panel, + creationTime: Date.now() + }); + }, + + onCourseSubmit: function (list, index, element, e) { + var panel = ARSnova.app.mainTabPanel.tabPanel.homeTabPanel.newSessionPanel; + panel.disableInputElements(); + + var course = list.getStore().getAt(index); + + var shortName = course.get('shortname'); + + if (course.get('shortname').length > 12) { + shortName = course.get('shortname'); + shortName = shortName.substr(0, 7); + } + + ARSnova.app.getController('Sessions').create({ + name: course.get('fullname'), + shortName: shortName, + courseId: course.get('id'), + courseType: course.get('type'), + newSessionPanel: panel + }); + }, + + getMyCourses: function () { + this.mycourses.addListener('itemtap', this.onCourseSubmit); + + /* only allow auth services with fixed user names */ + var allowedAuthServices = [ + ARSnova.app.LOGIN_LDAP, + ARSnova.app.LOGIN_CAS + ]; + if (-1 === allowedAuthServices.indexOf(ARSnova.app.loginMode)) { + return; + } + var newSessionPanel = this; + ARSnova.app.courseModel.getMyCourses({ + success: Ext.bind(function (response) { + if (response.responseText === "[]") { + newSessionPanel.mycourses.hide(); + newSessionPanel.setScrollable(null); + } else { + newSessionPanel.mycourses.show(); + newSessionPanel.setScrollable(true); + this.mycoursesStore.removeAll(); + this.mycoursesStore.add(Ext.decode(response.responseText)); + if (window.innerWidth > 321) { + this.mycoursesStore.sort('fullname'); + } else { + this.mycoursesStore.sort('shortname'); + } + } + }, this), + empty: Ext.bind(function () { + newSessionPanel.mycourses.hide(); + newSessionPanel.setScrollable(null); + }, this), + unauthenticated: function () { + ARSnova.app.getController('Auth').login({ + mode: ARSnova.app.loginMode + }); + }, + failure: function () { + console.log("my courses request failure"); + } + }, (window.innerWidth > 321 ? 'name' : 'shortname')); + } }); -- GitLab