SDKs:NickCenter:Cordova:index

CÓMO AGREGAR EL PLUGIN NICKCENTER EN CORDOVA

VERSIONES DE iOs SOPORTADAS

Este framework soporta todas las versiones de iOs superiores a las 10.0, en caso de que detecte una versión inferior no se lanzará.

PASOS A REALIZAR EN EL PANEL MOBELEADER

Una vez nuestra aplicación esté registrada en el Panel Mobeleader, [1](http://panel.mobeleader.com/index.php), iremos a la sección de de Desarrolladores y hacemos click en NickCenter —> Añadir app a NickCenter.

Para añadir nuestra aplicación a NickCenter deberemos seguir cinco sencillos pasos:

1.- Selección de app: En este apartado tendremos que elegír la aplicación que queremos añadir a NickCenter y decidir si la librería estará activa o no al lanzar la aplicación seleccionada. Esto se podrá activar y desactivar siempre que se desee.

2.- Pantalla de registro: En este paso configuraremos lo referente a la vista de registro para los usuarios. Podremos elegir entre varios campos de los cuales, como se indica, el email y password siempre serán obligatorios, el resto, será al gusto del desarrollador; pudiendo elegir que el usuario PUEDA introducir su nombre, pero no siendo obligatorio para el registro.

3.- Pantalla de inicio de sesión: Como en el anterior paso, aquí, configuraremos lo referente a la pantalla de inicio de sesión para los usuarios. En este caso, como se indica, solo será obligatorio el campo password.

4.- Pantalla de recuperación de contraseña: En este caso, para la pantalla de recuperación de contraseña tan solo se pedira el email del usuario y por tanto, dicho email sera un campo obligatorio.

5.- Traducción: Este será el último paso para configurar nuestra aplicación, aquí deberemos seleccionar tanto los idiomas a los que estarán traducidos todos los campos que hemos configurado previamente; como su propia traducción a dichos idiomas. Una vez seleccionado el primer idioma, se pondrá como idioma por defecto de dicha aplicación. Para cambiar el idioma por defecto no tendremos más que generar las traducciones en más idiomas y modificar el campo "Traducción por defecto".

5.1.- Cabeceras y botones: En este primer paso generaremos las traducciones de las cabeceras de las pantallas y de sus botones.

5.2.- Configuración de campos: En el segúndo paso generaremos las traducciones de los campos seleccionados previamente para cada pantalla y de sus posibles errores.

5.3.- Traducciones generales: En el tercer y último paso generaremos las traducciones generales, traducciones que van asociadas a todas las pantallas y no a una/s en concreto como en los anteriores pasos.

Una vez finalizadas las traducciones, como se ha indicado previamente, aparecerá el idioma al que se han realizado las traducciones y se pondrá por defecto.

Si al finalizar dicha configuración no hemos quedado satisfechos con los campos seleccionados en alguna de sus pantallas, cuando procedamos a editar dicha pantalla y añadamos un nuevo campo que previamente no ha sido traducido, automáticamente se abrirá una pantalla para generar las traducciones para el IDIOMA POR DEFECTO. Si queremos generar la traducción para el resto de idiomas hemos de volver a realizar lo especificado en el paso 5.-Traducción.

PASOS A REALIZAR PARA LA INTALACIÓN DEL FRAMEWORK EN LA APLICACIÓN

INSTALACIÓN:

Existen dos maneras de instalar el FrameWork NickCenter: a través de CocoaPods o descargándolo directamente. Recomendamos hacerlo a través de la primera opción. NickCenter incorpora dos frameworks auxiliares, RegisterLib y UtilsLib.

INSTALACIÓN CON COCOAPODS:

En caso de que su proyecto no incluya el archivo Podfile, incorpórelo. Si nunca ha trabajado con CocoaPods consulte la [documentación ofrecida en su web oficial](https://guides.cocoapods.org/using/using-cocoapods.html), en la que se explica paso a paso cómo instalar CocoaPods y cómo crear, actualizar y trabajar con los archivos Podfile.

   target 'NameTarget' do
      use_frameworks!
       pod 'MobeleaderNC'
       pod 'MobeleaderUtils'
       pod 'MobeleaderRegister'
   end

Cabe destacar que NameTarget deberá ser reemplazado por el nombre real del target de la aplicación en la que se quiere añadir el framework.

Una vez creado y configurado el archivo haremos uso del siguiente comando desde el terminal sobre la ruta en la que se encuentra dicho archivo.

   $ pod install --repo-update

Y veremos como se crea un proyecto tal que el siguiente:

Deberemos abrir el proyecto desde dicho archivo para que pueda usar el framework correctamente.

INSTALACIÓN MANUAL:

Descargue el framework NickCenter:

• Desde la [página principal de las librerías](http://panel.mobeleader.com/index.php?sec=82):

• Desde la página de información de la libreria(http://panel.mobeleader.com/index.php?sec=85&id=45&tipo=3):

• Directamente desde [aquí](https://repos.mobeleader.com/MobeleaderNC/1.0.23/MobeleaderNC.zip).

Una vez descargado el framework, descomprímalo e instálelo en su proyecto.

LANZAMIENTO:

Una vez configurada la instalación, crearemos un objeto de la clase NickCenter en donde vayamos a usarla, en el ejemplo se hace en la implementacion de la clase ( DatosIniciales ):

   @implementation DatosIniciales{

NickCenter *nickCenter; }

Para su lanzamiento se insertarán las siguientes lineas de código.

   nickCenter = [[NickCenter alloc] init];
   [nickCenter setDelegate:self];
   [nickCenter setRootViewController:self];
   [nickCenter setAppHash:@"Hash de la APP en el Panel de Mobeleader"];
   [nickCenter checkAndLaunch];

• appHash: Será el hash dado por el Panel Mobeleader al dar de alta la aplicación en éste. Para acceder a el deberemos ir a la sección Desarrolladores --> Mis Apps y hacer click sobre la columna Hash de nuestra aplicación.

• setRootViewController: Ésta función será opcional, con ella le diremos al framework desde que ViewController se lanzará y se recogerán las respuestas en los delegates.

Por defecto las pantallas de NickCenter presentan el siguiente formato:

Si desea modificar las pantallas para que sean lo más parecidas a su aplicación el framework de NickCenter esta dotado de una serie de funciones que le permitirán maquetarlas a su gusto:

• setViewsBackgroundColor:(UIColor \*): Determina el color de fondo de las pantallas.

• setViewsBackgroundImage:(UIImage \*): Determina la imagen de fondo de cada pantalla.

• setHeaderBackgroundColor:(UIColor \*): Determina el color de fondo de la cabecera de las pantallas.

• setHeaderBackgroundImage:(UIImage \*): Determina la imagen de fondo de la cabecera de cada pantalla.

• setHeaderBottomLineColor:(UIColor \*): Determina el color de la linea que separa la cabecera con el resto de la pantalla.

• setHeaderTextColor:(UIColor \*): Determina el color del texto de la cabecera de las pantallas.

• setHeaderFont:(UIFont \*): Determina la fuente de los textos de las cabeceras.

• setTextFieldsBackgroundColor:(UIColor \*): Determina el color de fondo de los textfields donde se ubican los campos de cada pantalla.

• setTextFieldsPlaceholderColor:(UIColor \*): Determina el color del texto descriptivo de cada textfield.

• setTextFieldsTextColor:(UIColor \*): Determina el color del texto de los textfields donde se ubican los campos de cada pantalla.

• setTextFieldsFont:(UIFont \*): Determina la fuente del texto de los textfields.

• setButtonsNormalBackgroundColor:(UIColor \*): Determina el color de fondo de los botones de cada pantalla.

• setButtonsHighlightedBackgroundColor:(UIColor \*): Determina el color de fondo de los botones de cada pantalla cuando se ha hecho click en éstos.

• setButtonsNormalTextColor:(UIColor \*): Determina el color del texto de cada boton cuando no se ha hecho click en éstos.

• setButtonsHighlightedTextColor:(UIColor \*): Determina el color del texto de cada boton cuando se ha hecho click en éstos.

• setButtonsBorderColor:(UIColor \*): Determina el color del borde de los botones.

• setButtonsFont:(UIFont \*): Determina la fuente de los textos de los botones.

• setTermsFontColor:(UIColor \*): Determina el color de la fuente de los textos de los terminos y condiciones.

• setTermsSwitchActiveColor:(UIColor \*): Determina el color de los botones activos en los terminos y condiciones.

• setTermsSwitchInactiveColor:(UIColor \*): Determina el color de los botones inactivos en los terminos y condiciones.

A continuación se expone un ejemplo en el que se maqueta a gusto del desarrollador las pantallas de NickCenter.

   nickCenter = [[NickCenter alloc] init];
   [nickCenter setDelegate:self];
   [nickCenter setRootViewController:self];
   [nickCenter setAppHash:@"Hash de la APP en el Panel de Mobeleader"];
   [nickCenter setViewsBackgroundColor:[UIColor whiteColor]];
   [nickCenter setViewsBackgroundImage:[UIImage imageNamed:@"logo"]];
   [nickCenter setHeaderBackgroundColor:[UIColor orangeColor]];
   [nickCenter setHeaderBottomLineColor:[UIColor orangeColor]];
   [nickCenter setHeaderTextColor:[UIColor whiteColor]];
   [nickCenter setTextFieldsBackgroundColor:[UIColor colorWithRed:217.0/255 green:217.0/255 blue:217.0/255 alpha:1]];
   [nickCenter setTextFieldsPlaceholderColor:[UIColor grayColor]];
   [nickCenter setTextFieldsTextColor:[UIColor blackColor]];
   [nickCenter setButtonsNormalBackgroundColor:[UIColor orangeColor]];
   [nickCenter setButtonsHighlightedBackgroundColor:[UIColor orangeColor]];
   [nickCenter setButtonsNormalTextColor:[UIColor whiteColor]];
   [nickCenter setButtonsHighlightedTextColor:[UIColor colorWithRed:249.0/255 green:203.0/255 blue:156.0/255 alpha:1]];
   [nickCenter setTermsFontColor:[UIColor orangeColor]];
   [nickCenter checkAndLaunch];

COMPLETAR REGISTRO:

Una vez un usuario haya sido registrado en una de nuestras aplicaciones, cuando otra lance NickCenter, dicho usuario tan soló debera logearse sin necesidad de tener que registrarse otra vez para ésta última aplicación. Se puede dar el caso de que al registrarte en la primera aplicación tán solo fuera necesario email y contraseña, y que para la segunda aplicación fuera necesario registrarse con el telefono, cuando este tipo de casos se den, al logearte en la segunda aplicación se abrirá una nueva vista para completar el registro. Una vez completado dicho registro se tratará como un login normal.

FUNCIONES UTILES:

NickCenter está dotada de una función que permite al desarrollador cerrar la sesión ya iniciada por el usuario de manera que la siguiente vez que abra la aplicación y pase por donde se lanza la librería, el usuario deba volver a loguearse. Dicha funcion es :

• closeSession: ( [nickCenter closeSession]; )

DELEGATES:

NickCenter cuenta con una serie de delegates que permiten al desarrollador saber que parte del framework se esta ejecutando y cual es su resultado. A continuación se expondrán éstos y para que sirven.

• registerViewOpened: Notifica cuando la vista de registro se ha lanzado.

• loginViewOpened: Notifica cuando la vista del login se ha lanzado.

• rescueViewOpened: Notifica cuando la vista de recuperación de contraseña se ha lanzado.

• onError:(NSString \*)error: Notificará cuando haya habido un error, normalmente se lanzará cuando el registro o el login hayan sido incorrectos, o cuando al recuperar la contraseña el email sea incorrecto. Se puede dar el caso de que de otro tipo de error como bien puede ser al conectarnos al sevidor.

• onWarning:(NSString \*)warning: Notificará de alguna advertencia al desarrollador.

• finished: Notificará cuando la librería haya finalizado algun proceso. Inicio de sesión, registro o recuperación de contraseña correcto.

• sessionClosed: Notificará cuando se haya cerrado la sesión de NickCenter.

• onActive: Notificará cuando detecte que NickCenter esta activa para la aplicación.

• onInactive: Notificará cuando detecte que NickCenter esta inactiva para la aplicación.

• registerRegisterButtonClicked: Notificará cuando se haga click en el botón de registarse en la vista de registro de usuario.

• registerLoginButtonClicked: Notificará cuando se haga click en el botón de inicio de sesión en la vista de registro de usuario.

• registerCloseButtonClicked: Notificará cuando se haga click en el botón de cerrar en la vista de registro de usuario.

• loginPerformed:(NCUser \) user dictionary:(NSMutableDictionary \) userDictionary: Notificará cuando haya habido un registro o un login correcto. Se mandará la información recogida del usuario tanto en formato NCUser como en formato NSMutableDictionary.

• loginLoginButtonClicked: Notificará cuando se haga click en el botón de inicio de sesión en la vista de inicio de sesión.

• loginRegisterButtonClicked: Notificará cuando se haga click en el botón de registrarse en la vista de inicio de sesión.

• loginRescueButtonClicked: Notificará cuando se haga click en el botón de recuperar contraseña en la vista de inicio de sesión.

• loginCloseButtonClicked: Notificará cuando se haga click en el botón de cerrar en la vista de inicio de sesión.

• rescueRescueButtonClicked: Notificará cuando se haga click en el botón de recuperar contraseña en la vista de recuperar contraseña.

- rescueCloseButtonClicked: Notificará cuando se haga click en el botón de cerrar en la vista de recuperar contraseña.