# Genome

Create the new Bizagi world. Better interfaces for better products.

## macOS step by step

Please remember to have installed Xcode app from the App Store. If you have trouble with **EACCES**, please execute ```sudo npm -g config set user root```

1. Ask for permissions to access and clone the code of [genome](https://bizagidev.visualstudio.com/Research/_git/genome)
2. Open new Terminal at folder code:
  ```System Preferences > Keyboard > Shortcuts > Services```
  Enable **New Terminal at Folder**
3. Install [Node.js](https://nodejs.org/en/)
4. Install Grunt's command line interface (CLI)
    ```sudo npm install -g grunt-cli```
5. Install Angular CLI
    ```sudo npm install -g @angular/cli```
6. Install Compass
    ```sudo gem install sass```
7. Install npm packages
    ```sudo npm install```
8. Run ```sudo npm start``` and in another tab ```sudo grunt``` to get Genome running

## How to create a new page

1. Duplicate **page-base** folder
2. Go to **page-base.component.ts** and rename ```PageBaseComponent ``` (component name),  ```page-base.component``` (component path) accordingly to your component name and path
3. Go to **page-base.component.spec.ts** and replicate the rename process of component name and path
4. Rename folder and files accordingly to your component name
5. Go to **app-routing.module.ts** and import the new component, adittionaly add the menu path in routes  ```{ path: 'base', component: PageBaseComponent}```
6. Go to **app.module.ts** and import the new component
7. Go to **genome.d.ts** and declare the component module
8. Go to **menu.component.html** and add the path menu item of the component


Ejecucion paralela para hacer debug y ver los cambios en un proyecto que usa la libreria

1. En la carpeta node_modules del proyecto principal (Ej. customer portal) elimine la carpeta correspondiente a bz-genome-styles

2. Cree un link simbolico 
```
 mklink /J "C:\dv\customer-portal\CustomerPortal.Web\WebContent\node_modules\bz-genome-styles" "C:\dv\GenomeAngular\dist\bz-genome-angular"
```
3. instale grunt de manera global 
```
npm install -g grunt-cli
```
4. Ejecute grunt desde una consola sobre la raiz del proyecto de genome
```
cd C:\Users\Julian\Documents\bizagi\genome grunt
```
5. en el proyecto principal en la hoja styles.css importe el genome que se encuentra en el link simbolico 
```
@import '~bz-genome-styles/themes/cloud/main.scss';
```