Organza is an employee directory web app generated by Soo Park in four weeks as a final project of a bootcamp.
This project is built to accommodate needs of global companies that may want to have their own employee roster.
Along with the basic features of segregated login, employee list view, and employee info detail features, users can
- search employees and filter with multiple conditions
- add employees/companies/departments/titles/office and upload employee photos
- view organizational chart and office location map dynamically updated by DB
The login feature has three credentials - admin, employee, a user. Bootstrap nav var changes according to the credential. With test seed data, try
admin: ID: usera, Password: aaa123 Employee1: ID: userb, Password: bbb123 Employee2: ID: userc, Password: ccc123 User: ID: userd, Password: ddd123
- The password is saved as clear text for now, to be later on hashed.
Layout dynamically changes according to the window size.
Server side controls search and pagination. The four-filter search use only one query by utilizing lazy-query of SQLAlchemy to save a number of queries.
Features include employee photo upload, UTF-8 form and database to accommodate Asian and other characters, an instant update on all relational tables on submit, and much more.
The markers in Google Map, the info modal window, and the information below all are dynamically generated from DB for scalability.
JS plug-in generates the chart structure. A table of hierarchy exists in the data model to accommodate complicated organizational structural needs.
The data for these ChartJS data visualizations are generated in server side with a full format of color schemes. If columns added, appropriate color schemes will apply automatically. *** Better compatibility with Chrome than Safari
The model for this project is built to accommodate company with subsidiaries that share certain properties, employees working for multiple subsidiaries at the same point of time, and many other many-to-many relationships.
Python, JavaScript, SQL, HTML, CSS
Flask, PostgreSQL, SQLAlchemy JQuery, AJAX, Jinja Bootstrap, openpyxl, virtualenv
Git, GitHub, Jira Ponyorm online editor Photoshop, Illustrator Noun Project, Subtle Patterns
In terminal window in the folder downloaded, run the following command
source roster_bash.sh
Copy the entire paragraph of the following inside the forked folder to run the web app
virtualenv env; source env/bin/activate; dropdb intranet; createdb intranet; pip install -r requirements.txt; echo export secret_key='abc' > secret.sh; source secret.sh; python model.py; python seed.py; open 'http://localhost:5000'; python server.py;
Command: echo "export secret_key='abc'" >> secret.sh Reason: you want web frame "Flask" and other requirements to run in your computer to test the code, but you do not want to install everything needed to your global environment. Secret.sh file will contain the key for the app to run.
Command: virtualenv env; source env/bin/activate; source secret.sh Reason: to make the installation run in a limited space
Command: pip install -r requirements.txt Reason: all needed installations are saved in requirements.txt. pip is a command for Python to pick up necessary packages and install them.
Command: dropdb intranet; createdb intranet Reason: createdb command will generate the database that will store the data. The database is named "intranet" inside the model.py file. (if ERROR "Database "intranet" already exists" raised: dropdb intranet is needed. Just to make sure that there is no pre-existing DB, you can always go with dropdb intranet) Caution: this will delete the existing data from your DB. If you want to "add" data, and not start a new, do not do this.
Command: python model.py Reason: the model will be a base template for your DB
Command: python seed.py Reason: generate starting point for your DB for testing The test seed will fill data tables with 17000 employees with full data.
Command: psql intranet \dt Reason: you want to see if the tables are generated. If the are generated, a chart containing the list of them will show.
Command: python server.py Reason: have your server running, so that what you interact with server-client will be viewable on your browser
Command: localhost:5000 on your browser address bar Reason: Because your server is running, you can see the site
The MIT License (MIT) Copyright (c) 2017 Soo Park
Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.