You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

177 lines
8.4 KiB

8 years ago
8 years ago
8 years ago
8 years ago
8 years ago
8 years ago
8 years ago
8 years ago
8 years ago
  1. <!DOCTYPE html>
  2. <html ng-app="workApp">
  3. <head>
  4. <!--Import Google Icon Font-->
  5. <link href="fonts/icons.css" rel="stylesheet">
  6. <!--Import materialize.css-->
  7. <link type="text/css" rel="stylesheet" href="css/materialize.min.css" media="screen,projection"/>
  8. <link type="text/css" rel="stylesheet" href="own.css"/>
  9. <!--Let browser know website is optimized for mobile-->
  10. <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
  11. <title>Open Work Time - local version</title>
  12. </head>
  13. <body ng-controller="workController as work">
  14. <nav>
  15. <div class="nav-wrapper blue-grey darken-1">
  16. <a href="#" class="brand-logo">Open Work Time <small>- v0.1</small></a>
  17. <ul id="nav-mobile" class="right">
  18. <li>
  19. <a ng-click="openCode()" target="_blank">
  20. <i class="large material-icons" title="Visit code">code</i>
  21. </a>
  22. </li>
  23. <li>
  24. <a ng-click="deleteStorage()">
  25. <i class="large material-icons" title="Delete storage">info_outline</i>
  26. </a>
  27. </li>
  28. <li>
  29. <a ng-click="saveStorage()" title="Save all to storage">
  30. <i class="large material-icons">perm_identity</i>
  31. </a>
  32. </li>
  33. </ul>
  34. </div>
  35. </nav>
  36. <div class="row">
  37. <div class="col s12 m4 l3 blue-grey lighten-2">
  38. <!-- Grey navigation panel -->
  39. <div class="o_user_title center-align">
  40. <img ng-src="img/avatars/{{user.avatar}}.png" alt="" class="circle responsive-img blue-grey lighten-4">
  41. <h3>{{user.username}}</h3>
  42. </div>
  43. <p>
  44. Users's github: <a ng-href="{{user.github}}">{{user.github}}</a>
  45. </p>
  46. <p>
  47. Total worked time: {{user.totalWorkedTime | secondsToDateTime | date:'HH:mm'}}h
  48. </p>
  49. </div>
  50. <div class="col s12 m8 l9">
  51. <div class="row">
  52. <div class="card blue-grey lighten-4 col s12 m12 l5">
  53. <div class="card-content">
  54. <span class="card-title">Projects</span>
  55. <div class="collection">
  56. <a href="#!" ng-click="projectSelect($index)" ng-repeat="project in projects" class="collection-item avatar blue-grey lighten-4">
  57. <div class="right">
  58. <div class="waves-effect waves-light btn-floating blue-grey lighten-2" ng-click="editProject($index)">
  59. <i class="material-icons"><img src="img/edit.png" class="o_trash_icon" /></i>
  60. </div>
  61. <div class="waves-effect waves-light btn-floating blue-grey lighten-2" ng-click="removeProject($index)">
  62. <i class="material-icons"><img src="img/trash.png" class="o_trash_icon" /></i>
  63. </div>
  64. </div>
  65. <img ng-src="img/{{project.icon}}.png" class="circle"/>
  66. <span class="title">{{project.title}}</span>
  67. <p class="grey-text">{{project.totaltime | secondsToDateTime | date:'HH:mm:ss'}}</p>
  68. </a>
  69. </div>
  70. </div>
  71. <div class="card-action" ng-show="!editingProject">
  72. <div class="input-field col s6">
  73. <input ng-model="newproject.title" id="newprojectname" type="text" class="validate">
  74. <label for="newprojectname">New project name</label>
  75. </div>
  76. <div class="input-field col s6">
  77. <input ng-model="newproject.icon" id="icon" type="text" class="validate">
  78. <label for="icon">icon</label>
  79. </div>
  80. <a ng-click="addNewProject()" class="waves-effect waves-light btn blue-grey lighten-1 right">Add new project</a>
  81. </div>
  82. <div class="card-action" ng-show="editingProject">
  83. <div class="input-field col s6">
  84. <input ng-model="editingProject.title" id="newprojectname" value=" " type="text" class="validate">
  85. <label for="newprojectname">New project name</label>
  86. </div>
  87. <div class="input-field col s6">
  88. <input ng-model="editingProject.icon" id="icon" value=" " type="text" class="validate">
  89. <label for="icon">icon</label>
  90. </div>
  91. <a ng-click="cancelEditProject()" class="waves-effect waves-light btn red lighten-2">Cancel</a>
  92. <a ng-click="updateProject()" class="waves-effect waves-light btn blue lighten-2 right">Update project</a>
  93. </div>
  94. </div>
  95. <div ng-show="currentproject.title" class="card blue-grey lighten-4 col s12 m12 l7">
  96. <div class="card-content">
  97. <span class="card-title">
  98. <img ng-src="img/{{currentproject.icon}}.png" class="o_project_title_img"/>
  99. {{currentproject.title}}
  100. </span>
  101. <p>
  102. Total time: {{currentproject.totaltime | secondsToDateTime | date:'HH:mm:ss'}}
  103. </p>
  104. <p>
  105. Current strike time: <b>{{currentStrike | secondsToDateTime | date:'HH:mm:ss'}}</b>
  106. </p>
  107. </div>
  108. <div class="card-action">
  109. <a ng-click="btnWork()" ng-show="!working" class="waves-effect waves-light btn green lighten-2">Work!</a>
  110. <a ng-click="btnStop()" ng-show="working" class="waves-effect waves-light btn red lighten-2">Stop!</a>
  111. <!--<a class="waves-effect waves-light btn deep-orange lighten-2">Stop working!</a>-->
  112. </div>
  113. <div class="divider"></div>
  114. <div class="card-content">
  115. <!-- here the charts -->
  116. <canvas id="bar" class="chart chart-bar"
  117. chart-data="currentproject.chart.data" chart-labels="currentproject.chart.labels" chart-series="currentproject.chart.series">
  118. </canvas>
  119. </div>
  120. </div>
  121. <div ng-show="!currentproject.title" class="card blue-grey lighten-4 col s12 m12 l7" style="height: 200px;">
  122. <span class="card-title">
  123. Select a project
  124. </span>
  125. </div>
  126. </div>
  127. </div>
  128. </div>
  129. <!-- ELECTRON
  130. Insert this line above script imports
  131. Works for both browser and electron with the same code -->
  132. <script>if (typeof module === 'object') {window.module = module; module = undefined;}</script>
  133. <!-- ANGULAR -->
  134. <script src="libraries/angular.min.js"></script>
  135. <!-- ANGULAR CHART JS -->
  136. <script src="node_modules/chart.js/dist/Chart.min.js"></script>
  137. <script src="node_modules/angular-chart.js/dist/angular-chart.min.js"></script>
  138. <!--Import jQuery before materialize.js-->
  139. <script type="text/javascript" src="js/jquery-2.1.1.min.js"></script>
  140. <script type="text/javascript" src="js/materialize.min.js"></script>
  141. <script src="controllers.js"></script>
  142. <script src="libraries/toastr.js"></script>
  143. <link type="text/css" rel="stylesheet" href="libraries/toastr.css"/>
  144. <!-- ELECTRON
  145. Insert this line after script imports -->
  146. <script>if (window.module) module = window.module;</script>
  147. </body>
  148. </html>