TT#7600 Fix ngcp-csc breaking localStorage errors

Upon inital load of app (with no previous localStorage stored), app
can not load due to missing languageSelected value. Fix this by
checking for and setting the localStorage value earlier in the load
sequence, inside a new initiLocalStorage.js file that is loaded
before main app.js file.  Also move conflicting html objects to
renderers to prevent native JS methods from being operated on them
before they are defined.

Change-Id: I36766685e55dc69af3b7917ddedd5df10718d907

app.js

@@ -15,4 +15,5 @@ Ext.application({
     requires: [
         'NgcpCsc.*'
     ]
+
 });

app.json

@@ -187,6 +187,9 @@
      *
      */
     "js": [{
+        "path": "initLocalStorage.js",
+        "bundle": true
+    },{
         "path": "app.js",
         "bundle": true
     }],

classic/src/view/login/Login.js

@@ -29,13 +29,13 @@ Ext.define('NgcpCsc.view.login.Login', {
         items: [{
                 id: 'title',
                 panel: 'label',
-                title: Ngcp.csc.locales.login.title[localStorage.getItem('languageSelected') || 'en']
+                title: Ngcp.csc.locales.login.title[localStorage.getItem('languageSelected')]
             }, {
                 xtype: 'textfield',
                 name: 'username',
                 id: 'login-username',
                 cls: 'auth-textbox',
-                emptyText: Ngcp.csc.locales.common.username[localStorage.getItem('languageSelected') || 'en'],
+                emptyText: Ngcp.csc.locales.common.username[localStorage.getItem('languageSelected')],
                 padding: '10 0 0 15',
                 minLength: 1,
                 listeners: {
@@ -55,7 +55,7 @@ Ext.define('NgcpCsc.view.login.Login', {
                 cls: 'auth-textbox',
                 inputType: 'password',
                 minLength: 1,
-                emptyText: Ngcp.csc.locales.common.password[localStorage.getItem('languageSelected') || 'en'],
+                emptyText: Ngcp.csc.locales.common.password[localStorage.getItem('languageSelected')],
                 padding: '0 0 0 15',
                 listeners: {
                     specialKey: 'onPressEnter',
@@ -69,7 +69,7 @@ Ext.define('NgcpCsc.view.login.Login', {
                 }
             }, {
                 xtype: 'combo',
-                emptyText: Ngcp.csc.locales.login.choose_language[localStorage.getItem('languageSelected') || 'en'],
+                emptyText: Ngcp.csc.locales.login.choose_language[localStorage.getItem('languageSelected')],
                 padding: '0 0 0 15',
                 store: 'Languages',
                 queryMode: 'local',
@@ -77,7 +77,7 @@ Ext.define('NgcpCsc.view.login.Login', {
                 valueField: 'id',
                 displayField: 'language',
                 editable: false,
-                value: localStorage.getItem('languageSelected') || 'en',
+                value: localStorage.getItem('languageSelected'),
                 listeners: {
                     'select': 'languageSelection'
                 }
@@ -101,7 +101,7 @@ Ext.define('NgcpCsc.view.login.Login', {
                     html: '<a href="#" class="link-forgot-password"> ' + Ngcp.csc.locales.login.forgot_password[localStorage.getItem('languageSelected')] + '</a>'
                 }]
             }, {
-                text: Ngcp.csc.locales.login.button_text[localStorage.getItem('languageSelected') || 'en'],
+                text: Ngcp.csc.locales.login.button_text[localStorage.getItem('languageSelected')],
                 id: 'login-button',
                 xtype: 'button',
                 width: '100%',
@@ -117,4 +117,5 @@ Ext.define('NgcpCsc.view.login.Login', {
             }
         ]
     }
+
 });

classic/src/view/login/LoginController.js

@@ -19,8 +19,8 @@ Ext.define('NgcpCsc.view.login.LoginController', {
     languageSelection: function(cmp, rec) {
         var selectedLang = rec.get('id');
         this.getView().down('#title').setTitle(Ngcp.csc.locales.login.title[selectedLang]);
-        this.getView().down('#login-username').setEmptyText(Ngcp.csc.locales.login.username[selectedLang]);
-        this.getView().down('#login-password').setEmptyText(Ngcp.csc.locales.login.password[selectedLang]);
+        this.getView().down('#login-username').setEmptyText(Ngcp.csc.locales.common.username[selectedLang]);
+        this.getView().down('#login-password').setEmptyText(Ngcp.csc.locales.common.password[selectedLang]);
         this.getView().down('#login-language').setEmptyText(Ngcp.csc.locales.login.choose_language[selectedLang]);
         this.getView().down('#login-button').setText(Ngcp.csc.locales.login.button_text[selectedLang]);
         localStorage.setItem('languageSelected', selectedLang);

classic/src/view/login/LoginModel.js

@@ -12,6 +12,7 @@ Ext.define('NgcpCsc.view.login.LoginModel', {
         defaultCredentials: ['administrator', 'restricted', 'host'],
         remember_me: false
     },
+
     formulas: {
         authValid: function(get) {
             return (get('username') == get('password') &&
@@ -19,4 +20,5 @@ Ext.define('NgcpCsc.view.login.LoginModel', {
                 get('defaultCredentials').indexOf(get('password')) > -1);
         }
     }
+
 });

classic/src/view/pages/addressbook/AddressbookController.js

@@ -48,6 +48,10 @@ Ext.define('NgcpCsc.view.pages.addressbook.AddressbookController', {
         return '<div class="fa fa-arrow-circle-down"></div>';
     },
 
+    renderCompanyGroupText: function(value, metaData) {
+        return Ngcp.csc.locales.addressbook.company[localStorage.getItem('languageSelected')].toLowerCase();
+    },
+
     removeContact: function(grid, rowIndex, colIndex) {
         var store = grid.getStore();
         var rec = grid.getStore().getAt(rowIndex);

classic/src/view/pages/addressbook/AddressbookGrid.js

@@ -45,7 +45,7 @@ Ext.define('NgcpCsc.view.pages.addressbook.AddressbookGrid', {
             xtype: 'container',
             id: 'group-company',
             padding: '0 10 0 0',
-            html: Ngcp.csc.locales.addressbook.company[localStorage.getItem('languageSelected')].toLowerCase(),
+            renderer: 'renderCompanyGroupText',
             cls: 'link no-underline',
             listeners: {
                 click: {

classic/src/view/pages/callbarring/CallBarringController.js

@@ -28,6 +28,10 @@ Ext.define('NgcpCsc.view.pages.callbarring.CallBarringController', {
         this.fireEvent('showmessage', true, Ngcp.csc.locales.common.remove_success[localStorage.getItem('languageSelected')]);
     },
 
+    renderDeleteIconTooltip: function(value, metaData) {
+        return Ngcp.csc.locales.common.delete[localStorage.getItem('languageSelected')].toUpperCase();
+    },
+
     toggleEnabled: function(grid, rowIndex, colIndex, item, event, record, row) {
         record.set('enabled', !record.get('enabled'));
         this.fireEvent('showmessage', true, Ngcp.csc.locales.callbarring.enabled_success[localStorage.getItem('languageSelected')]);

classic/src/view/pages/callbarring/CallBarringIncomingGrid.js

@@ -40,7 +40,9 @@ Ext.define('NgcpCsc.view.pages.callbarring.CallBarringIncomingGrid', {
             align: 'right',
             items: [{
                 glyph: 'xf00d@FontAwesome',
-                tooltip: Ngcp.csc.locales.common.delete[localStorage.getItem('languageSelected')].toUpperCase(),
+                tooltip: {
+                    renderer: 'renderDeleteIconTooltip'
+                },
                 handler: 'removeBarrNumber'
             }]
         }]

classic/src/view/pages/callbarring/CallBarringOutgoingGrid.js

@@ -40,7 +40,9 @@ Ext.define('NgcpCsc.view.pages.callbarring.CallBarringOutgoingGrid', {
             align: 'right',
             items: [{
                 glyph: 'xf00d@FontAwesome',
-                tooltip: Ngcp.csc.locales.common.delete[localStorage.getItem('languageSelected')].toUpperCase(),
+                tooltip: {
+                    renderer: 'renderDeleteIconTooltip'
+                },
                 handler: 'removeBarrNumber'
             }]
         }]

initLocalStorage.js

@@ -0,0 +1,3 @@
+if (!localStorage.getItem('languageSelected')) {
+    localStorage.setItem('languageSelected', 'en');
+};