Skip to content

Commit

Permalink
first commit
Browse files Browse the repository at this point in the history
  • Loading branch information
@tlgevers
tlgevers committed Apr 10, 2017
0 parents commit 89d9557
Show file tree
Hide file tree
Showing 13 changed files with 661 additions and 0 deletions.
12 changes: 12 additions & 0 deletions .gitignore
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
# Node build artifacts
node_modules
npm-debug.log

# Local development
*.env
*.dev
.DS_Store

# Docker
Dockerfile
docker-compose.yml
9 changes: 9 additions & 0 deletions client/css/bootstrap-responsive.min.css

Large diffs are not rendered by default.

9 changes: 9 additions & 0 deletions client/css/bootstrap.min.css

Large diffs are not rendered by default.

Binary file added client/img/FC_logo.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added client/img/fc.PNG
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added client/img/glyphicons-halflings-white.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added client/img/glyphicons-halflings.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
320 changes: 320 additions & 0 deletions client/index.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,320 @@
<!doctype html>
<html lang="en" ng-app>
<head>
<title>Stores Call Log</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.0/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<style>
body {
padding-top: 60px;
}
.true {
background-color: #dff0d8;
}
#add_comment {
border-radius: 10px;
background-color: #93bcff;
position: fixed;
height: 100px;
width: 60%;
top: 50%;
left: 20%;
}
input[type=text] {
width: 30%;
padding: 12px 20px;
box-sizing: border-box;
}
select {
height: 47px;
}
.container {
margin-left: 50px;
}
</style>
<script>
function ChatController($scope) {
var socket = io.connect();

$scope.messages = [];
$scope.roster = '';
$scope.name = '';
$scope.text = '';
$scope.stores = [];
$scope.st = {};

$scope.to_csv = function to_csv(){
var date = new Date();
JSONToCSVConvertor($scope.stores, "stores_called " + date, true);
}

function JSONToCSVConvertor(JSONData, ReportTitle, ShowLabel) {
//If JSONData is not an object then JSON.parse will parse the JSON string in an Object
var arrData = typeof JSONData != 'object' ? JSON.parse(JSONData) : JSONData;

var CSV = '';
//Set Report title in first row or line

CSV += ReportTitle + '\r\n\n';

//This condition will generate the Label/Header
if (ShowLabel) {
var row = "";

//This loop will extract the label from 1st index of on array
for (var index in arrData[0]) {

//Now convert each value to string and comma-seprated
row += index + ',';
}

row = row.slice(0, -1);

//append Label row with line break
CSV += row + '\r\n';
}

//1st loop is to extract each row
for (var i = 0; i < arrData.length; i++) {
var row = "";

//2nd loop will extract each column and convert it in string comma-seprated
for (var index in arrData[i]) {
row += '"' + arrData[i][index] + '",';
}

row.slice(0, row.length - 1);

//add a line break after each row
CSV += row + '\r\n';
}

if (CSV == '') {
alert("Invalid data");
return;
}

//Generate a file name
var fileName = "";
//this will remove the blank-spaces from the title and replace it with an underscore
fileName += ReportTitle.replace(/ /g,"_");

//Initialize file format you want csv or xls
var uri = 'data:text/csv;charset=utf-8,' + escape(CSV);

// Now the little tricky part.
// you can use either>> window.open(uri);
// but this will not work in some browsers
// or you will not get the correct file extension

//this trick will generate a temp <a /> tag
var link = document.createElement("a");
link.href = uri;

//set the visibility hidden so it will not effect on your web-layout
link.style = "visibility:hidden";
link.download = fileName + ".csv";

//this part will append the anchor tag and remove it after automatic click
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
}


socket.on('reload', function() {
console.log("reload");
location.reload();
})
socket.on('connect', function () {
$scope.setName();
});

socket.on('stores', function (store) {
$scope.stores.push(store);
$scope.$apply();
});

socket.on('roster', function (active_users) {
$scope.roster = active_users;
$scope.$apply();
});

$scope.send = function send() {
console.log('Sending message:', $scope.text);
socket.emit('message', $scope.text);
$scope.text = '';
};

$scope.submitComment = function submitComment() {
socket.emit('adding', $scope.st);
$scope.st = {};
$("#add_comment").hide();
}

$scope.reset = function reset() {
var answer = confirm("All data will be lost")
if (answer){
socket.emit('reset');
}
else {

}
}

socket.on('status', function(data) {
var check = $scope.stores[data.index].check;
if (check == true) {
$scope.stores[data.index].check = false;
} else {
$scope.stores[data.index].check = true;
}
var color = $scope.stores[data.index].color;
if (color == "danger") {
$scope.stores[data.index].color = "success";
} else {
$scope.stores[data.index].color = "danger";
}

$scope.stores[data.index].contact_date = data.contact_date;
$scope.$apply();
});

socket.on('contacted', function(data) {
console.log("data comment", data);
var person = String(data.contacted_by);
if (person == "choose") {
$scope.stores[data.index].contacted_by = "anonymous";
} else {
$scope.stores[data.index].contacted_by = person;
}
$scope.stores[data.index].comment = data.comment;

$scope.$apply();
})

$scope.checked = function checked(i) {
socket.emit('checked', i);
}

$scope.setName = function setName() {
socket.emit('identify', $scope.name);
};

$scope.toggleComments = function toggleComments(i) {
$scope.st.index = i;
$scope.st.store = $scope.stores[i].store;
$scope.st.city = $scope.stores[i].city;
$scope.st.comment = $scope.stores[i].comment;
if ($scope.stores[i].comment == "")
{
$scope.st.contacted_by = "choose";
} else {
$scope.st.contacted_by = $scope.stores[i].contacted_by;
}

$("#add_comment").toggle();
}
$("#add_comment").toggle();
$scope.cancel_add = function cancel_add() {
$("#add_comment").hide();
$scope.st = {};
}
$(document).keyup(function(e) {
if (e.keyCode == 27) {
$scope.st = {};
$("#add_comment").hide();
}
})

}
</script>
</head>
<body ng-controller="ChatController">
<div id="add_comment" class="row controls">
<div id="exit_add_commands" style="position:relative;float:right;" ng-click="cancel_add()">
<button type="button" name="exit_add">CANCEL</button>
</div>
<h4>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;{{st.store}} {{st.city}}</h4>
<form class="" ng-submit="submitComment()">
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<input type="number" class="span6" ng-model="st.index" hidden>
<input type="text" class="span6" ng-model="st.comment" placeholder="comment...">
<select name="contacted_by" ng-model="st.contacted_by">
<option value="choose" selected="selected">Choose...</option>
<option value="CHRIS KNIGHT">CHRIS</option>
<option value="DAVID KELLISON">DAVID K</option>
<option value="DAVID HANCOCK">DAVID H</option>
<option value="JANA PONDER">JANA</option>
<option value="JUSTIN RAINS">JUSTIN</option>
<option value="KEVIN HAWK">KEVIN</option>
<option value="MORTON HODGES">MORTON</option>
<option value="RICK MARINI">RICK</option>
<option value="SARAH STANFORD">SARAH</option>
<option value="STEVE WILLIAMS">STEVE</option>
</select>
<input type="submit" class="span1 btn btn-primary" value="submit">
</form>
</div>
<div class="span3" style="position:fixed;right:5%;">
<ul class="nav nav-list well">
<li class="nav-header">Active Users</li>
<li ng-model="roster" ng-bind="roster">
</li>
</ul>
</div>
<div class="container">
<div class="navbar navbar-fixed-top navbar-inverse">
<div class="navbar-inner">
<div style="left:10px;color:white;weight:bold;vertical-align:middle;text-align:center;">
<img style="position:fixed;top:10px;left:10px;" src="img/FC_logo.png" alt="fc" height="40px" width="auto">
<h3>STORE CONTACT LOG</h3>
<div style="position:fixed;color:black;right:10px;top:10px;">
<button ng-click="to_csv()" type="button" name="csv">CSV</button>
<button ng-click="reset()" type="button" name="reset">RESET</button>
</div>
</div>
</div>
</div>
<!-- <div class="page-header"> -->
<!-- <h1>Store Contact Log</h1> -->
<!-- </div> -->
<div class="row">
<div>
<table class="table table-striped table-bordered" style="left:10%;width:1600px">
<thead>
<tr style="background-color:black;color:white;">
<th class="span1"><p style="width:3em;">Called</p></th>
<th class="span1"><p style="width10em;">Store</p></th>
<th class="span3"><p style="width10em;">City</p></th>
<th class="span4"><p style="width10em;">State</p></th>
<th class="span7"><p style="width20em;">Date Contacted</p></th>
<th class="span2"><p style="width:30em;">Contacted By</p></th>
<th class="span20"><p style="width:40em;">Comments</p></th>
<th><p></p></th>
</tr>
</thead>
<tbody>
<tr ng-repeat="store in stores" ng-class="store.color">
<td class="span1" ><input type="checkbox" ng-click="checked($index)" ng-checked="store.check"></td>
<td class="span1" ng-bind="store.store"></td>
<td class="span3" ng-bind="store.city"></td>
<td class="span4" ng-bind="store.state"></td>
<td class="span7" ng-bind="store.contact_date | date:'medium'"></td>
<td class="span2" ng-bind="store.contacted_by"></td>
<td class="span20" ng-bind="store.comment"></td>
<td class="span3"><button type="button" name="add_comment" ng-click="toggleComments($index);">ADD</button></td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
<script src="/socket.io/socket.io.js"></script>
<script src="/js/jquery.min.js"></script>
<script src="/js/bootstrap.min.js"></script>
<script src="/js/angular.min.js"></script>
</body>
</html>
Loading

0 comments on commit 89d9557

Please sign in to comment.