UNPKG

prodio

Version:

Simplified project management

230 lines (222 loc) 9.66 kB
<!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width,initial-scale=1.0"> <title>Prodio</title> <link rel="stylesheet" href="/vendor/alertify/alertify.core.css"> <link rel="stylesheet" href="/vendor/alertify/alertify.default.css"> <link rel="stylesheet" href="/vendor/ink/css/ink.css"> <link rel="stylesheet" href="/vendor/font-awesome/css/font-awesome.min.css"> <link rel="stylesheet" href="/style/style.css"> </head> <body> <nav class="ink-navigation"> <ul class="menu horizontal blue"> <li><a class="logoPlaceholder" href="#home" id="header_logo_text">Prodio</a></li> <li><a href="#projects">Projects</a></li> <li><a href="#reports">Reports</a></li> <li><a href="#status">Server Status</a></li> </ul> </nav> <div> <div style="clear: both; height: 40px;"></div> <div id="outlet"></div> <div style="clear: both; height: 2em;"></div> </div> <footer> Another take on Project Management. </footer> <script type="text/x-template" id="loading"> <div style="text-align: center"> <div>Loading...</div> <div class="loading"></div> </div> </script> <script type="text/x-template" id="home"><div class="ink-grid vertical-space"> <p>Welcome to Prodio, a different take on Project Management.</p> <p>Prodio takes a different approach to Project Management. Instead of forcing you into a standard or process Prodio lets you define the process and helps you automate your way to completion.</p> <p>Under the hood Prodio is nothing more than a simple Graph Database holding your projects tasks (as nodes) and reference data (as edges). This means that Prodio can model any popular Project Management Process (like Kanban, Scrum, Waterfall, etc) or can be used with its own different approach.</p> <p>Prodio&apos;s default behavior is to utilize a simple to navigate and manage Mindmap to display, edit, and track your progress. Adding a new task, feature, story, or whatever you want to call it is simple. Open the project and add in a new node. Then go to reports to view how the new node affects the project as a whole.</p> </div> </script> <script type="text/x-template" id="projects" data-api="/api/v1/projects" nav="projects"><div class="ink-grid vertical-space"> <div class="column-group"> <h1>Projects</h1> <div class="all-100"><a class="ink-button blue small" href="#project/new"><i class="fa fa-plus-circle"></i> Create New</a></div> <div class="all-100 vertical-space"> {{#each items}} <div class="all-25 medium-50 small-100 tiny-100"> <div class="column-group"> <div class="all-80"><h3><a href="#project/{{_id}}">{{name}}</a></h3></div> <div class="all-20"><span class="ink-badge grey">v{{version}}</span></div> </div> <p class="all-100">{{description}}</p> </div> {{else}} <div class="all-100">No projects currently available, why not <a href="#project/new">create one</a>?</div> {{/each}} </div> </div> </div> </script> <script type="text/x-template" id="newproject" nav="project/new"><div class="ink-grid vertical-space"> <h1>New Project</h1> <form class="ink-form" data-controller="FormSubmitter" action="/api/v1/project" data-target="#project/{_id}"> <div class="control-group required"> <label>Project Name:</label> <div class="control"> <input name="name" placeholder="Project name..."> </div> </div> <div class="control-group"> <label>Description</label> <div class="control"> <input name="description" placeholder="Description..."> </div> <label>Version:</label> <div class="control"> <input name="version" placeholder="0.0.1"> </div> </div> <div class="control-group"> <button class="ink-button blue">Create</button> </div> </form> </div> </script> <script type="text/x-template" id="editproject" data-api="/api/v1/project/{id}" nav="project/edit/{id}"><div class="ink-grid vertical-space"> <h1>View project</h1> <a href="#project/{{_id}}">&lt; overview</a> <form class="ink-form" data-controller="FormSubmitter" action="/api/v1/project/{{_id}}" data-target="#project/edit/{_id}" data-message="Saved"> <div class="control-group required"> <label>Project Name:</label> <div class="control"> <input name="name" placeholder="Project name..." value="{{name}}"> </div> </div> <div class="control-group"> <label>Description</label> <div class="control"> <input name="description" placeholder="Description..." value="{{description}}"> </div> <label>Version:</label> <div class="control"> <input name="version" placeholder="0.0.1" value="{{version}}"> </div> </div> <div class="control-group"> <button class="ink-button blue">Update</button> <button class="ink-button red" data-method="DELETE" data-confirm="Are you sure you want to delete this project?" data-target="#projects">Delete</button> </div> </form> </div> </script> <script type="text/x-template" id="viewproject" data-api="/api/v1/project/{id}/tree" nav="project/{id}"><h1>{{root.name}} <sup>v{{root.version}}</sup><sub><a href="#project/edit/{{root._id}}">details</a><sub></sub></sub></h1> <div data-controller="MindMap"></div> </script> <script type="text/x-template" id="edititem" data-api="/api/v1/project/{project_id}/item/{item_id}" nav="project/{project_id}/item/{item_id}"><div class="ink-grid vertical-space"> <h1>Edit Item Details</h1> <a href="#project/{{project_id}}">&lt; overview</a> <form class="ink-form" data-controller="FormSubmitter" action="/api/v1/project/{{project_id}}/item/{{_id}}" data-target="#project/{project_id}" data-message="Saved"> <input type="hidden" name="parent_id" value="{{parent_id}}"> <div class="control-group required"> <label>Name:</label> <div class="control"> <input name="name" placeholder="Item name..." value="{{name}}"> </div> </div> <div class="control-group"> <label>Description</label> <div class="control"> <input name="description" placeholder="Description..." value="{{description}}"> </div> <label>Type:</label> <div class="control"> <input name="type" placeholder="Type..." value="{{type}}"> </div> <label>Status:</label> <div class="control"> <input name="status" placeholder="Status..." value="{{status}}"> </div> <label>Target Version:</label> <div class="control"> <input name="version" placeholder="0.0.1" value="{{version}}"> </div> </div> <div class="control-group"> <button class="ink-button blue">Update</button> <button class="ink-button red" data-method="DELETE" data-confirm="Are you sure you want to delete this project?" data-target="#project/{project_id}">Delete</button> </div> </form> </div> </script> <script type="text/x-template" id="reports" nav="reports" data-api="/api/v1/projects"><h1>Reports</h1> <form data-controller="ReportSelector"> Select a project: <select name="id"> {{#each items}} <option value="{{_id}}">{{name}}</option> {{/each}} </select> Select a report: <select name="report"> <option value="#reports/overview/{id}">Status Overview</option> </select> <button class="ink-button blue">Display</button> </form> </script> <script type="text/x-template" id="status" data-api="/api/v1/status" nav="status"><div class="ink-grid vertical-space"> <div class="column-group"> <div><strong>UI Version:</strong> v0.0.1</div> <div data-controller="SocketListener" data-message="system::status"> <div><strong>Server Version:</strong> v\{{version}}</div> <div><strong>Memory:</strong> \{{mem.heapUsed}} of \{{mem.heapTotal}}</div> <progress class="all-100" value="\{{mem.heapUsed}}" max="\{{mem.heapTotal}}"></progress> <div><strong>Uptime:</strong> \{{uptime}}s</div> </div> </div> </div> </script> <script type="text/x-template" id="reports_overview" nav="reports/overview/{id}" data-api="/api/v1/project/{id}/items"><h1>Status Overview</h1> {{log items}} <table data-controller="TableView" data-table-cols="[ { title: &apos;Name&apos;, value: &apos;name&apos; }, { title: &apos;Version&apos;, value: &apos;version&apos; }, { title: &apos;Type&apos;, value: &apos;type&apos; }, { title: &apos;Status&apos;, value: &apos;status&apos; }, ]"></table> </script> <script type="text/javascript" src="/vendor/handlebars/handlebars.js"></script> <script type="text/javascript" src="/vendor/satnav/dist/satnav.js"></script> <script type="text/javascript" src="/vendor/async/async.js"></script> <script type="text/javascript" src="/vendor/moment/moment.min.js"></script> <script type="text/javascript" src="/vendor/markdown/markdown.js"></script> <script type="text/javascript" src="/vendor/alertify/alertify.min.js"></script> <script type="text/javascript" src="/vendor/d3/d3.min.js"></script> <script type="text/javascript" src="/vendor/mousetrap/mousetrap.js"></script> <script type="text/javascript" src="/socket.io/socket.io.js"></script> <script type="text/javascript" src="/js/app.js"></script> </body> </html>