index.html 21.9 KB
Newer Older
Sam Man's avatar
Sam Man committed
1 2 3 4 5 6
<!DOCTYPE html>
<html lang="en" ng-app="GitLabReportApp">
<head>
    <title>GitLab Project Reports, Milestone Reports, Time Tracking Reports</title>
    <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
    <meta name="viewport" content="width=device-width, initial-scale=1">
7
    <link rel="shortcut icon" href="favico.ico" type="image/vnd.microsoft.icon"/>
Sam Man's avatar
Sam Man committed
8 9 10
    <link rel="stylesheet" href="//ajax.googleapis.com/ajax/libs/angular_material/1.1.4/angular-material.min.css">
    <link rel='stylesheet'
          href='//fonts.googleapis.com/icon?family=Material+Icons|Roboto+Condensed:400,700|Source+Sans+Pro:300,400,600,700,900'>
11
    <link rel='stylesheet' href='//cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css'>
Sam Man's avatar
Sam Man committed
12 13 14 15 16 17 18
    <link rel='stylesheet' href='style.css'>
    <script src="//code.jquery.com/jquery-latest.min.js"></script>
    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>
    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular-animate.min.js"></script>
    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular-aria.min.js"></script>
    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular-messages.min.js"></script>
    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular-resource.min.js"></script>
19
    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular-sanitize.min.js"></script>
Sam Man's avatar
Sam Man committed
20
    <script src="//ajax.googleapis.com/ajax/libs/angular_material/1.1.4/angular-material.min.js"></script>
21 22
    <script src="//cdnjs.cloudflare.com/ajax/libs/showdown/1.8.6/showdown.min.js"></script>
    <script src="//cdnjs.cloudflare.com/ajax/libs/ng-showdown/1.1.0/ng-showdown.min.js"></script>
Sam Man's avatar
Sam Man committed
23 24 25 26 27 28 29
    <script src="app.js"></script>
    <script src="app.service.auth.js"></script>
    <script src="app.factory.gitlab.js"></script>
    <script src="app.controller.splash.js"></script>
    <script src="app.controller.toolbar.js"></script>
    <script src="app.controller.table.js"></script>
    <script src="app.controller.filter.js"></script>
30
</head>
Sam Man's avatar
Sam Man committed
31 32
<body>

33 34 35 36 37 38 39 40 41
<script>
  (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
  (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
  m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
  })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
  ga('create', 'UA-87773565-1', 'auto');
  ga('send', 'pageview');
</script>

Sam Man's avatar
Sam Man committed
42 43 44 45 46 47 48 49 50
<div ng-controller="SplashController" id="loader">
    <div class="loader">
        <img src="gr-loaders.gif">
        <p>
            GITLAB<b>REPORTS</b></br></br>
            <span ng-show="authRequired">You will be redirected to <b>GitLab Sign-in</b> page.</span>
        </p>
    </div>
</div>
51 52 53 54 55 56 57 58 59 60 61 62 63 64
<div class="darkbg overlaytour">
    <div role="dialog" class="gz tourtext">
    <div class="textdiv">
        Select a project and <strong>Apply Filters</strong> to generate report.
        For more filters, use dropdown to select Milestone, Labels or State.
        <button class="md-raised md-primary tourbtn md-button md-ink-ripple" type="button">
            <md-icon class="ng-scope material-icons" role="img" aria-hidden="true">checked</md-icon>
            GOT IT
            <div class="md-ripple-container"></div>
        </button>
    </div>
</div>
</div>
<div class="tourblank"></div>
Sam Man's avatar
Sam Man committed
65 66 67 68 69 70 71 72 73
<md-content ng-cloak class="gitlab-reports-container">
    <md-toolbar ng-controller="ToolbarController" layout="row"
                class="md-toolbar-tools md-scroll-shrink md-whiteframe-4dp gr-header hide-print">
        <h1 class="gr-logo">
            <div class="material-icons logoicon">beenhere</div>
            <a href="/" title="GitLab Reports Generator">GITLAB<em>REPORTS</em></a>
            <span><i>by</i> <a href="http://cosango.com" title="cosango.com">COSANGO.com</a></span>
        </h1>
        <div flex></div>
74
        <md-button class="md-icon-button printpdf" aria-label="Download" onclick="javascript:window.print()">
Sam Man's avatar
Sam Man committed
75 76 77 78 79
            <md-tooltip md-direction="bottom">Print</md-tooltip>
            <i class="material-icons">print</i>
        </md-button>
        <md-button class="md-icon-button downloadpdf" aria-label="Download">
            <md-tooltip md-direction="bottom">PDF Download</md-tooltip>
80 81
            <i class="material-icons">picture_as_pdf</i>
        </md-button>
82
        <md-button class="md-icon-button downloadsource" aria-label="Source" ng-click="downloadsource()">
83
            <md-tooltip md-direction="bottom">Download Source</md-tooltip>
Sam Man's avatar
Sam Man committed
84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100
            <i class="material-icons">file_download</i>
        </md-button>
        <md-button class="md-icon-button" aria-label="Logout" ng-click="logout()">
            <md-tooltip md-direction="bottom">Log Out</md-tooltip>
            <md-icon>exit_to_app</md-icon>
        </md-button>
        <md-button class="md-icon-button togglefilters" aria-label="Filters" ng-click="toggleRightSidenav()">
            <md-tooltip md-direction="bottom">Filters</md-tooltip>
            <md-icon>tune</md-icon>
        </md-button>
    </md-toolbar>
    <div class="hide-screen" ng-show="show_logo_print">
        <img src="img/logo.png" alt="Cosango" class="print_spacer">
    </div>

    <md-content flex layout="row" id="reportresult">
        <div class="tablecontent" ng-controller="TableController">
101 102 103 104 105 106 107
            <h1 ng-show="issues && $root.show_detailed_report" class="main-heading">Project Report</h1>
            <h2 ng-show="issues && $root.show_detailed_report && filter_milestone" class="milestone">
                Milestone: {{ filter_milestone }}
            </h2>
            <div ng-show="issues && $root.show_detailed_report" class="current_milestone orangetext">
                <i class="material-icons">flag</i> <span>{{milestone}}</span>
            </div>
Sam Man's avatar
Sam Man committed
108 109 110 111 112 113 114
            <div ng-show="issues" class="totaltimevalue">
                <md-content flex id="content" layout="column">
                    <ul>
                        <li ng-show="show_comulative_time_estimate" class="totaltimevaluetd">
                            Total Time Estimate
                        </li>
                        <li ng-show="show_comulative_time_estimate">
115
                            {{ comulative_time_estimate/3600 | number:2 }}h
Sam Man's avatar
Sam Man committed
116 117 118 119 120
                        </li>
                        <li ng-show="show_comulative_time_spent" class="totaltimevaluetd">
                            Total Time Spent
                        </li>
                        <li ng-show="show_comulative_time_spent">
121
                            {{ comulative_time_spent/3600 | number:2 }}h
Sam Man's avatar
Sam Man committed
122 123 124 125 126
                        </li>
                    </ul>
                </md-content>
            </div>
            <div ng-hide="issues" class="hide-print">
127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156
                <h2>Overview</h2>
                <p class="para-text">
                    GitLab Reports is a small utility web app built to help developers (using GitLab
                    for their projects) to generate time tracking reports for their GitLab projects. After being
                    authenticated by GitLab, developers are taken back to GitLab Reports app where can select desired
                    project from right sidebar to create quick project reports showing all issues logged in select
                    project.
                </p>
                <p class="para-text">
                    If a project has milestones, app will also load them in a new list from where you
                    can select desired one to create a milestone report as well.
                </p>
                <p class="para-text">GitLab Reports supports calculating Total Estimate Time and Total Time Spent of all
                    issues including in the project report. This helps developers analyzing that how much total time
                    they have spent on specific project milestones which helps tracking progress.
                </p>
                <p class="para-text">
                    In next releases, we will add support of exporting report to different formats
                    specially PDF along with other enhancements and bug fixes.
                </p>
                <a class="md-raised orangebtn md-button md-ink-ripple" href="https://gitlab.com/cosango/gitlabreports"
                   target="_blank" aria-label="Download from GitLab">
                    <md-icon class="fa fa-gitlab fa-2x"></md-icon>
                    Gitlab
                </a>
                <a class="md-raised orangebtn md-button md-ink-ripple" href="https://github.com/cosango/gitlabreports"
                   target="_blank" aria-label="Download from GitHub">
                    <md-icon class="fa fa-github fa-2x"></md-icon>
                    GitHub
                </a>
Sam Man's avatar
Sam Man committed
157 158
            </div>

159 160 161 162 163
            <h4 ng-show="issues && $root.show_detailed_report" class="printheading">
                <i class="material-icons">list</i>
                Issues List
            </h4>
            <table ng-show="issues" class="res-table issue-list" id="table">
Sam Man's avatar
Sam Man committed
164 165 166 167 168 169 170 171 172 173 174 175 176 177 178 179 180 181 182 183 184 185 186 187 188 189
                <thead>
                <tr>
                    <th ng-show="$root.table_columns.indexOf('srno') >= 0">No</th>
                    <th ng-show="$root.table_columns.indexOf('iid') >= 0">ID</th>
                    <th ng-show="$root.table_columns.indexOf('title') >= 0">
                        <i class="material-icons md-18">short_text</i>
                        Title
                    </th>
                    <th ng-show="$root.table_columns.indexOf('created_at') >= 0">
                        <i class="material-icons md-18">date_range</i>
                        Date
                    </th>
                    <th ng-show="$root.table_columns.indexOf('author') >= 0">
                        Author
                    </th>
                    <th ng-show="$root.table_columns.indexOf('assignee') >= 0">
                        Assignee
                    </th>
                    <th ng-show="$root.table_columns.indexOf('time_estimate') >= 0" class="timeestimtetd">
                        <i class="material-icons md-18">access_time</i>
                        Time Estimate
                    </th>
                    <th ng-show="$root.table_columns.indexOf('total_time_spent') >= 0">
                        <i class="material-icons md-18">slow_motion_video</i>
                        Time Spent
                    </th>
Rob Ribeiro's avatar
Rob Ribeiro committed
190 191 192
                    <th ng-show="$root.table_columns.indexOf('state') >= 0">
                        State
                    </th>
Sam Man's avatar
Sam Man committed
193 194 195 196 197 198 199 200
                </tr>
                </thead>
                <tbody>
                <tr ng-repeat="issue in issues">
                    <td data-th="No." ng-show="$root.table_columns.indexOf('srno') >= 0" data-title="serialno">
                        {{ $index + 1 }}
                    </td>
                    <td data-th="ID" ng-show="$root.table_columns.indexOf('iid') >= 0" data-title="useriid">
201 202 203
                        <a ng-show="$root.show_hyperlinks" href="{{ issue.web_url }}" target="_blank">{{ issue.iid
                            }}</a>
                        <span ng-hide="$root.show_hyperlinks">{{ issue.iid }}</span>
Sam Man's avatar
Sam Man committed
204 205 206 207 208 209 210 211 212 213 214 215 216 217
                    </td>
                    <td data-th="Title" ng-show="$root.table_columns.indexOf('title') >= 0" data-title="tasktitle">
                        {{ issue.title }}
                    </td>
                    <td data-th="Date" ng-show="$root.table_columns.indexOf('created_at') >= 0"
                        data-title="taskcreated">
                        {{ issue.created_at | date:'yyyy-MM-dd' }}
                    </td>
                    <td data-th="Author" ng-show="$root.table_columns.indexOf('author') >= 0">
                        {{ issue.author.name }}
                    </td>
                    <td data-th="Assignee" ng-show="$root.table_columns.indexOf('assignee') >= 0">
                        {{ issue.assignee.name }}
                    </td>
218 219 220
                    <td data-th="Time Estimate" ng-show="$root.table_columns.indexOf('time_estimate') >= 0" data-title="taskestimate">
                        <span ng-hide="issue.time_stats.human_time_estimate">Unspecified</span>
                        <span ng-show="issue.time_stats.human_time_estimate">{{ issue.time_stats.human_time_estimate }}</span>
Sam Man's avatar
Sam Man committed
221 222 223
                    </td>
                    <td data-th="Time Spent" ng-show="$root.table_columns.indexOf('total_time_spent') >= 0"
                        date-title="timespent">
224 225
                        <span ng-hide="issue.time_stats.total_time_spent">Unspecified</span>
                        <span ng-show="issue.time_stats.total_time_spent">{{ issue.time_stats.human_total_time_spent }}</span>
Sam Man's avatar
Sam Man committed
226
                    </td>
227
                    <td data-th="State" class="state" ng-show="$root.table_columns.indexOf('state') >= 0">
Rob Ribeiro's avatar
Rob Ribeiro committed
228 229
                        {{ issue.state }}
                    </td>
Sam Man's avatar
Sam Man committed
230 231 232 233
                </tr>
                </tbody>
            </table>

234 235 236 237 238 239 240 241 242 243 244 245 246 247 248 249 250 251 252 253 254 255 256 257 258 259 260 261 262 263 264 265
            <h4 ng-show="issues && $root.show_detailed_report" class="printheading mt-5">
                <i class="material-icons">library_books</i>
                Issues Details
            </h4>
            <div class="issue-details-wrapper " ng-show="issues && $root.show_detailed_report">
                <div ng-repeat="issue in issues" class="issuedetail_box">
                    <div class="issuedetail_title">{{ issue.title }}</div>
                    <div class="issuedetail_description" markdown-to-html="issue.description"></div>
                    <div class="issuedetail_url" ng-show="$root.show_hyperlinks">
                        URL:
                        <span><a href="{{ issue.web_url }}">{{ issue.web_url }}</a></span>
                    </div>
                    <div classs="issuedetail_bottom">
                        <div class="issuedetail_id">
                            ID:
                            <span>{{ issue.iid }}</span>
                        </div>
                        <div class="issuedetail_rdate">
                            Reporting Date:
                            <span>{{ issue.created_at | date:'yyyy-MM-dd' }}</span>
                        </div>
                        <div class="issuedetail_cdate">
                            Closing Date:
                            <span>{{ issue.closed_at | date:'yyyy-MM-dd' }}</span>
                        </div>
                        <div class="issuedetail_status">
                            State:
                            <span>{{ issue.state }}</span>
                        </div>
                    </div>
                </div>
            </div>
Sam Man's avatar
Sam Man committed
266
        </div>
267 268
        <md-sidenav class="md-whiteframe-1dp sidenavfilter hide-print"
                    md-is-locked-open="true" md-component-id="right">
Sam Man's avatar
Sam Man committed
269 270 271 272 273 274 275 276 277 278 279 280 281 282 283 284 285 286

            <div class="sidespacer">
                <h4 class="orangetext">Filters</h4>
                <section class="ac-container">
                    <div class="ac-head">
                        <input id="ac-1" name="accordion-1" type="checkbox" checked/>
                        <label for="ac-1">
                            <h3>Generate Reports <span class="fr"><md-icon>arrow_down</md-icon></span></h3>
                        </label>
                        <div class="ac-small">

                            <div layout="column">
                                <div ng-controller="FilterController">
                                    <div flex>
                                        <md-select ng-model="project" placeholder="Project" requried>
                                            <md-option ng-value="p" ng-repeat="p in projects">{{ p.name }}</md-option>
                                        </md-select>
                                    </div>
287 288
                                    <div flex>
                                        <md-select ng-model="milestone" placeholder="Milestone" ng-disabled="!project_milestones">
Sam Man's avatar
Sam Man committed
289 290 291 292
                                            <md-option ng-value="m" ng-repeat="m in project_milestones">{{ m.title }}
                                            </md-option>
                                        </md-select>
                                    </div>
293 294
                                    <div flex>
                                        <md-select ng-model="labels" placeholder="Labels" multiple ng-disabled="!project_labels">
Sam Man's avatar
Sam Man committed
295 296 297 298
                                            <md-option ng-value="l" ng-repeat="l in project_labels">{{ l.name }}
                                            </md-option>
                                        </md-select>
                                    </div>
299
                                    <div flex>
Sam Man's avatar
Sam Man committed
300
                                        <md-select ng-model="state" placeholder="State">
301
                                            <md-option value="all">All</md-option>
Sam Man's avatar
Sam Man committed
302 303 304 305
                                            <md-option value="opened">Opened</md-option>
                                            <md-option value="closed">Closed</md-option>
                                        </md-select>
                                    </div>
306 307
                                    <md-button class="md-raised md-primary filterbtn" ng-click="applyFilter()"
                                               aria-label="Apply Filters" ng-disabled="!project">
Sam Man's avatar
Sam Man committed
308 309 310
                                        <md-icon>filter_list</md-icon>
                                        Apply Filters
                                    </md-button>
311 312 313 314
                                    <md-button class="md-raised md-primary filterbtn" ng-click="resetFilter()" aria-label="Reset">
                                        <md-icon>clear_all</md-icon>
                                        Reset
                                    </md-button>
Sam Man's avatar
Sam Man committed
315 316 317 318 319 320 321 322 323 324 325 326
                                    <div flex>
                                        <div class="clearfix">&nbsp;</div>
                                        <h3>Columns</h3>
                                        <md-select ng-model="$root.table_columns" placeholder="Columns" multiple>
                                            <md-option ng-value="'srno'">Sr. No.</md-option>
                                            <md-option ng-value="'iid'">ID</md-option>
                                            <md-option ng-value="'title'">Title</md-option>
                                            <md-option ng-value="'created_at'">Date</md-option>
                                            <md-option ng-value="'author'">Author</md-option>
                                            <md-option ng-value="'assignee'">Assignee</md-option>
                                            <md-option ng-value="'time_estimate'">Time Estimate</md-option>
                                            <md-option ng-value="'total_time_spent'">Time Spent</md-option>
327
                                            <md-option ng-value="'state'">State</md-option>
Sam Man's avatar
Sam Man committed
328 329 330
                                        </md-select>
                                    </div>

331 332 333
                                    <md-switch ng-model="$root.show_detailed_report" aria-label="Show detailed report">
                                        Detailed report
                                    </md-switch>
Sam Man's avatar
Sam Man committed
334 335 336 337 338 339 340
                                    <md-switch ng-model="$root.show_comulative_time_estimate"
                                               aria-label="Show total time estimate">
                                        Total Estimate Time
                                    </md-switch>
                                    <md-switch ng-model="$root.show_comulative_time_spent"
                                               aria-label="Show total time spent">
                                        Total Time Spent
341
                                    </md-switch>
Sam Man's avatar
Sam Man committed
342
                                    <md-switch ng-model="$root.show_logo_print"
343 344 345 346 347 348
                                               aria-label="Show logo on Print">
                                        Show Logo on Print
                                    </md-switch>
                                    <md-switch ng-model="$root.show_hyperlinks" aria-label="Show hyperlinks">
                                        Show hyperlinks
                                    </md-switch>
Sam Man's avatar
Sam Man committed
349 350 351 352 353 354 355 356 357 358 359 360 361 362
                                </div>
                            </div>
                        </div>
                    </div>
                </section>
            </div>
        </md-sidenav>
    </md-content>
</md-content>


<footer class="footer hide-print" id="colophon" role="contentinfo">
    <div class="footercontent">
        <div class="tl fl footerlogo">
363 364 365
            <a href="http://cosango.com/">
                <img class="footer-logo" src="img/logo_dark.png" alt="Cosango">
            </a>
Sam Man's avatar
Sam Man committed
366 367 368
        </div>
        <div class="social-icons fr">
            <ul>
369 370 371 372 373 374 375 376 377 378 379 380 381 382 383 384 385 386 387 388 389 390 391 392 393
                <li>
                    <a class="animate" href="https://www.facebook.com/cosango">
                        <i class="fa fa-facebook"></i>
                    </a>
                </li>
                <li>
                    <a class="animate" href="https://twitter.com/cosangodotcom">
                        <i class="fa fa-twitter"></i>
                    </a>
                </li>
                <li>
                    <a class="animate" href="https://www.pinterest.com/cosangodotcom">
                        <i class="fa fa-pinterest"></i>
                    </a>
                </li>
                <li>
                    <a class="animate" href="https://www.linkedin.com/company/cosango">
                        <i class="fa fa-linkedin"></i>
                    </a>
                </li>
                <li>
                    <a class="animate" href="https://plus.google.com/104221792987400160410">
                        <i class="fa fa-google-plus"></i>
                    </a>
                </li>
Sam Man's avatar
Sam Man committed
394 395 396
            </ul>
        </div>
        <p class="uppercase semibold copyright">
397
            Copyright &copy; 2018
Sam Man's avatar
Sam Man committed
398 399 400 401 402 403 404
            <a href="http://cosango.com/">COSANGO.com</a>
        </p>
    </div>
</footer>
<script src="custom.js"></script>
</body>
</html>