├── .gitignore ├── LICENSE ├── README.MD ├── __init__.py ├── app.py ├── bower.json ├── dist ├── css │ ├── sb-admin-2.css │ └── timeline.css └── js │ └── sb-admin-2.js ├── js ├── flot-data.js └── morris-data.js ├── loginform.py ├── requirements.txt ├── stub.py ├── templates └── sb-admin │ ├── base.html │ ├── loginbase.html │ ├── macros │ ├── dashboard │ │ ├── areachart.html │ │ ├── barchart.html │ │ ├── chat.html │ │ ├── counticon.html │ │ ├── donut.html │ │ ├── notification.html │ │ └── timeline.html │ ├── flot │ │ ├── barchart.html │ │ ├── linechart.html │ │ ├── movinglinechart.html │ │ ├── multiaxeschart.html │ │ └── piechart.html │ ├── morris │ │ ├── areachart.html │ │ ├── barchart.html │ │ ├── donutchart.html │ │ └── linechart.html │ ├── navlink.html │ ├── tables │ │ ├── advtable.html │ │ └── table.html │ ├── topnav │ │ ├── alert.html │ │ ├── messagesummary.html │ │ └── tasksummary.html │ └── ui │ │ ├── notifications │ │ ├── alert.html │ │ └── dismissablealert.html │ │ └── panels │ │ ├── accordion.html │ │ ├── panel.html │ │ ├── tab.html │ │ └── well.html │ ├── master.html │ ├── nav.html │ ├── pages │ ├── blank.html │ ├── dashboard.html │ ├── flot.html │ ├── forms.html │ ├── login.html │ ├── morris.html │ ├── tables.html │ └── ui │ │ ├── buttons.html │ │ ├── grid.html │ │ ├── icons.html │ │ ├── notifications.html │ │ ├── panels-wells.html │ │ └── typography.html │ └── redirect.html ├── user.py └── views.py /.gitignore: -------------------------------------------------------------------------------- 1 | env 2 | *.pyc 3 | *.swp 4 | .DS_Store 5 | .vscode 6 | bower_components/ 7 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | The MIT License (MIT) 2 | 3 | Copyright (c) 2015 Kaushik Raj 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | 23 | -------------------------------------------------------------------------------- /README.MD: -------------------------------------------------------------------------------- 1 | For details see [http://kaushikraj.com/2015/09/18/sb-admin-2-admin-flask/](http://kaushikraj.com/2015/09/18/sb-admin-2-admin-flask/) 2 | 3 | ## Copyright and License 4 | Copyright 2015 Kaushik Raj. Code released under MIT license. 5 | 6 | Copyright 2013-2015 Iron Summit Media Strategies, LLC. Code released under the [Apache 2.0](https://github.com/IronSummitMedia/startbootstrap-sb-admin-2/blob/gh-pages/LICENSE) license. 7 | -------------------------------------------------------------------------------- /__init__.py: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/kaushikraj/sb-admin-2-flask-admin/f2ad45372b1c106125007aae23cb03c18c96c61d/__init__.py -------------------------------------------------------------------------------- /app.py: -------------------------------------------------------------------------------- 1 | import os 2 | from flask import Flask, url_for, redirect, render_template, request, send_from_directory 3 | 4 | import flask_admin as admin 5 | import flask_login as login 6 | 7 | from views import AdminIndexView, BlankView 8 | from user import User 9 | 10 | # Create Flask application 11 | app = Flask(__name__) 12 | 13 | # bower_components 14 | @app.route('/bower_components/') 15 | def send_bower(path): 16 | return send_from_directory(os.path.join(app.root_path, 'bower_components'), path) 17 | 18 | @app.route('/dist/') 19 | def send_dist(path): 20 | return send_from_directory(os.path.join(app.root_path, 'dist'), path) 21 | 22 | @app.route('/js/') 23 | def send_js(path): 24 | return send_from_directory(os.path.join(app.root_path, 'js'), path) 25 | 26 | # Create dummy secrey key so we can use sessions 27 | app.config['SECRET_KEY'] = '123456790' 28 | 29 | # Initialize flask-login 30 | def init_login(): 31 | login_manager = login.LoginManager() 32 | login_manager.init_app(app) 33 | 34 | # Create user loader function 35 | @login_manager.user_loader 36 | def load_user(user_id): 37 | return User.get(user_id) 38 | 39 | # Flask views 40 | @app.route('/') 41 | def index(): 42 | return render_template("sb-admin/redirect.html") 43 | 44 | # Initialize flask-login 45 | init_login() 46 | 47 | # Create admin 48 | admin = admin.Admin(app, 49 | 'SB-Admin-2', 50 | index_view=AdminIndexView()) 51 | #admin.add_view(BlankView(name='Blank', url='blank', endpoint='blank')) 52 | 53 | if __name__ == '__main__': 54 | app.run(debug=True) -------------------------------------------------------------------------------- /bower.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "startbootstrap-sb-admin-2", 3 | "version": "1.0.7", 4 | "homepage": "http://startbootstrap.com/template-overviews/sb-admin-2/", 5 | "authors": [ 6 | "David Miller" 7 | ], 8 | "description": "A free, open source, Bootstrap admin theme created by Start Bootstrap", 9 | "keywords": [ 10 | "bootstrap", 11 | "theme" 12 | ], 13 | "license": "Apache", 14 | "ignore": [ 15 | "**/.*", 16 | "node_modules", 17 | "bower_components", 18 | "test", 19 | "tests", 20 | "pages", 21 | "index.html", 22 | "/js" 23 | ], 24 | "main": [ 25 | "dist/css/sb-admin-2.css", 26 | "dist/js/sb-admin-2.js" 27 | ], 28 | "dependencies": { 29 | "bootstrap": "~3.3.1", 30 | "datatables": "~1.10.4", 31 | "datatables-plugins": "~1.0.1", 32 | "flot": "~0.8.3", 33 | "font-awesome": "~4.2.0", 34 | "holderjs": "~2.4.1", 35 | "metisMenu": "~1.1.3", 36 | "morrisjs": "~0.5.1", 37 | "datatables-responsive": "~1.0.3", 38 | "bootstrap-social": "~4.8.0", 39 | "flot.tooltip": "~0.8.4" 40 | } 41 | } -------------------------------------------------------------------------------- /dist/css/sb-admin-2.css: -------------------------------------------------------------------------------- 1 | /*! 2 | * Start Bootstrap - SB Admin 2 Bootstrap Admin Theme (http://startbootstrap.com) 3 | * Code licensed under the Apache License v2.0. 4 | * For details, see http://www.apache.org/licenses/LICENSE-2.0. 5 | */ 6 | 7 | body { 8 | background-color: #f8f8f8; 9 | } 10 | 11 | #wrapper { 12 | width: 100%; 13 | } 14 | 15 | #page-wrapper { 16 | padding: 0 15px; 17 | min-height: 568px; 18 | background-color: #fff; 19 | } 20 | 21 | @media(min-width:768px) { 22 | #page-wrapper { 23 | position: inherit; 24 | margin: 0 0 0 250px; 25 | padding: 0 30px; 26 | border-left: 1px solid #e7e7e7; 27 | } 28 | } 29 | 30 | .navbar-top-links { 31 | margin-right: 0; 32 | } 33 | 34 | .navbar-top-links li { 35 | display: inline-block; 36 | } 37 | 38 | .navbar-top-links li:last-child { 39 | margin-right: 15px; 40 | } 41 | 42 | .navbar-top-links li a { 43 | padding: 15px; 44 | min-height: 50px; 45 | } 46 | 47 | .navbar-top-links .dropdown-menu li { 48 | display: block; 49 | } 50 | 51 | .navbar-top-links .dropdown-menu li:last-child { 52 | margin-right: 0; 53 | } 54 | 55 | .navbar-top-links .dropdown-menu li a { 56 | padding: 3px 20px; 57 | min-height: 0; 58 | } 59 | 60 | .navbar-top-links .dropdown-menu li a div { 61 | white-space: normal; 62 | } 63 | 64 | .navbar-top-links .dropdown-messages, 65 | .navbar-top-links .dropdown-tasks, 66 | .navbar-top-links .dropdown-alerts { 67 | width: 310px; 68 | min-width: 0; 69 | } 70 | 71 | .navbar-top-links .dropdown-messages { 72 | margin-left: 5px; 73 | } 74 | 75 | .navbar-top-links .dropdown-tasks { 76 | margin-left: -59px; 77 | } 78 | 79 | .navbar-top-links .dropdown-alerts { 80 | margin-left: -123px; 81 | } 82 | 83 | .navbar-top-links .dropdown-user { 84 | right: 0; 85 | left: auto; 86 | } 87 | 88 | .sidebar .sidebar-nav.navbar-collapse { 89 | padding-right: 0; 90 | padding-left: 0; 91 | } 92 | 93 | .sidebar .sidebar-search { 94 | padding: 15px; 95 | } 96 | 97 | .sidebar ul li { 98 | border-bottom: 1px solid #e7e7e7; 99 | } 100 | 101 | .sidebar ul li a.active { 102 | background-color: #eee; 103 | } 104 | 105 | .sidebar .arrow { 106 | float: right; 107 | } 108 | 109 | .sidebar .fa.arrow:before { 110 | content: "\f104"; 111 | } 112 | 113 | .sidebar .active>a>.fa.arrow:before { 114 | content: "\f107"; 115 | } 116 | 117 | .sidebar .nav-second-level li, 118 | .sidebar .nav-third-level li { 119 | border-bottom: 0!important; 120 | } 121 | 122 | .sidebar .nav-second-level li a { 123 | padding-left: 37px; 124 | } 125 | 126 | .sidebar .nav-third-level li a { 127 | padding-left: 52px; 128 | } 129 | 130 | @media(min-width:768px) { 131 | .sidebar { 132 | z-index: 1; 133 | position: absolute; 134 | width: 250px; 135 | margin-top: 51px; 136 | } 137 | 138 | .navbar-top-links .dropdown-messages, 139 | .navbar-top-links .dropdown-tasks, 140 | .navbar-top-links .dropdown-alerts { 141 | margin-left: auto; 142 | } 143 | } 144 | 145 | .btn-outline { 146 | color: inherit; 147 | background-color: transparent; 148 | transition: all .5s; 149 | } 150 | 151 | .btn-primary.btn-outline { 152 | color: #428bca; 153 | } 154 | 155 | .btn-success.btn-outline { 156 | color: #5cb85c; 157 | } 158 | 159 | .btn-info.btn-outline { 160 | color: #5bc0de; 161 | } 162 | 163 | .btn-warning.btn-outline { 164 | color: #f0ad4e; 165 | } 166 | 167 | .btn-danger.btn-outline { 168 | color: #d9534f; 169 | } 170 | 171 | .btn-primary.btn-outline:hover, 172 | .btn-success.btn-outline:hover, 173 | .btn-info.btn-outline:hover, 174 | .btn-warning.btn-outline:hover, 175 | .btn-danger.btn-outline:hover { 176 | color: #fff; 177 | } 178 | 179 | .chat { 180 | margin: 0; 181 | padding: 0; 182 | list-style: none; 183 | } 184 | 185 | .chat li { 186 | margin-bottom: 10px; 187 | padding-bottom: 5px; 188 | border-bottom: 1px dotted #999; 189 | } 190 | 191 | .chat li.left .chat-body { 192 | margin-left: 60px; 193 | } 194 | 195 | .chat li.right .chat-body { 196 | margin-right: 60px; 197 | } 198 | 199 | .chat li .chat-body p { 200 | margin: 0; 201 | } 202 | 203 | .panel .slidedown .glyphicon, 204 | .chat .glyphicon { 205 | margin-right: 5px; 206 | } 207 | 208 | .chat-panel .panel-body { 209 | height: 350px; 210 | overflow-y: scroll; 211 | } 212 | 213 | .login-panel { 214 | margin-top: 25%; 215 | } 216 | 217 | .flot-chart { 218 | display: block; 219 | height: 400px; 220 | } 221 | 222 | .flot-chart-content { 223 | width: 100%; 224 | height: 100%; 225 | } 226 | 227 | .dataTables_wrapper { 228 | position: relative; 229 | clear: both; 230 | } 231 | 232 | table.dataTable thead .sorting, 233 | table.dataTable thead .sorting_asc, 234 | table.dataTable thead .sorting_desc, 235 | table.dataTable thead .sorting_asc_disabled, 236 | table.dataTable thead .sorting_desc_disabled { 237 | background: 0 0; 238 | } 239 | 240 | table.dataTable thead .sorting_asc:after { 241 | content: "\f0de"; 242 | float: right; 243 | font-family: fontawesome; 244 | } 245 | 246 | table.dataTable thead .sorting_desc:after { 247 | content: "\f0dd"; 248 | float: right; 249 | font-family: fontawesome; 250 | } 251 | 252 | table.dataTable thead .sorting:after { 253 | content: "\f0dc"; 254 | float: right; 255 | font-family: fontawesome; 256 | color: rgba(50,50,50,.5); 257 | } 258 | 259 | .btn-circle { 260 | width: 30px; 261 | height: 30px; 262 | padding: 6px 0; 263 | border-radius: 15px; 264 | text-align: center; 265 | font-size: 12px; 266 | line-height: 1.428571429; 267 | } 268 | 269 | .btn-circle.btn-lg { 270 | width: 50px; 271 | height: 50px; 272 | padding: 10px 16px; 273 | border-radius: 25px; 274 | font-size: 18px; 275 | line-height: 1.33; 276 | } 277 | 278 | .btn-circle.btn-xl { 279 | width: 70px; 280 | height: 70px; 281 | padding: 10px 16px; 282 | border-radius: 35px; 283 | font-size: 24px; 284 | line-height: 1.33; 285 | } 286 | 287 | .show-grid [class^=col-] { 288 | padding-top: 10px; 289 | padding-bottom: 10px; 290 | border: 1px solid #ddd; 291 | background-color: #eee!important; 292 | } 293 | 294 | .show-grid { 295 | margin: 15px 0; 296 | } 297 | 298 | .huge { 299 | font-size: 40px; 300 | } 301 | 302 | .panel-green { 303 | border-color: #5cb85c; 304 | } 305 | 306 | .panel-green .panel-heading { 307 | border-color: #5cb85c; 308 | color: #fff; 309 | background-color: #5cb85c; 310 | } 311 | 312 | .panel-green a { 313 | color: #5cb85c; 314 | } 315 | 316 | .panel-green a:hover { 317 | color: #3d8b3d; 318 | } 319 | 320 | .panel-red { 321 | border-color: #d9534f; 322 | } 323 | 324 | .panel-red .panel-heading { 325 | border-color: #d9534f; 326 | color: #fff; 327 | background-color: #d9534f; 328 | } 329 | 330 | .panel-red a { 331 | color: #d9534f; 332 | } 333 | 334 | .panel-red a:hover { 335 | color: #b52b27; 336 | } 337 | 338 | .panel-yellow { 339 | border-color: #f0ad4e; 340 | } 341 | 342 | .panel-yellow .panel-heading { 343 | border-color: #f0ad4e; 344 | color: #fff; 345 | background-color: #f0ad4e; 346 | } 347 | 348 | .panel-yellow a { 349 | color: #f0ad4e; 350 | } 351 | 352 | .panel-yellow a:hover { 353 | color: #df8a13; 354 | } -------------------------------------------------------------------------------- /dist/css/timeline.css: -------------------------------------------------------------------------------- 1 | .timeline { 2 | position: relative; 3 | padding: 20px 0 20px; 4 | list-style: none; 5 | } 6 | 7 | .timeline:before { 8 | content: " "; 9 | position: absolute; 10 | top: 0; 11 | bottom: 0; 12 | left: 50%; 13 | width: 3px; 14 | margin-left: -1.5px; 15 | background-color: #eeeeee; 16 | } 17 | 18 | .timeline > li { 19 | position: relative; 20 | margin-bottom: 20px; 21 | } 22 | 23 | .timeline > li:before, 24 | .timeline > li:after { 25 | content: " "; 26 | display: table; 27 | } 28 | 29 | .timeline > li:after { 30 | clear: both; 31 | } 32 | 33 | .timeline > li:before, 34 | .timeline > li:after { 35 | content: " "; 36 | display: table; 37 | } 38 | 39 | .timeline > li:after { 40 | clear: both; 41 | } 42 | 43 | .timeline > li > .timeline-panel { 44 | float: left; 45 | position: relative; 46 | width: 46%; 47 | padding: 20px; 48 | border: 1px solid #d4d4d4; 49 | border-radius: 2px; 50 | -webkit-box-shadow: 0 1px 6px rgba(0,0,0,0.175); 51 | box-shadow: 0 1px 6px rgba(0,0,0,0.175); 52 | } 53 | 54 | .timeline > li > .timeline-panel:before { 55 | content: " "; 56 | display: inline-block; 57 | position: absolute; 58 | top: 26px; 59 | right: -15px; 60 | border-top: 15px solid transparent; 61 | border-right: 0 solid #ccc; 62 | border-bottom: 15px solid transparent; 63 | border-left: 15px solid #ccc; 64 | } 65 | 66 | .timeline > li > .timeline-panel:after { 67 | content: " "; 68 | display: inline-block; 69 | position: absolute; 70 | top: 27px; 71 | right: -14px; 72 | border-top: 14px solid transparent; 73 | border-right: 0 solid #fff; 74 | border-bottom: 14px solid transparent; 75 | border-left: 14px solid #fff; 76 | } 77 | 78 | .timeline > li > .timeline-badge { 79 | z-index: 100; 80 | position: absolute; 81 | top: 16px; 82 | left: 50%; 83 | width: 50px; 84 | height: 50px; 85 | margin-left: -25px; 86 | border-radius: 50% 50% 50% 50%; 87 | text-align: center; 88 | font-size: 1.4em; 89 | line-height: 50px; 90 | color: #fff; 91 | background-color: #999999; 92 | } 93 | 94 | .timeline > li.timeline-inverted > .timeline-panel { 95 | float: right; 96 | } 97 | 98 | .timeline > li.timeline-inverted > .timeline-panel:before { 99 | right: auto; 100 | left: -15px; 101 | border-right-width: 15px; 102 | border-left-width: 0; 103 | } 104 | 105 | .timeline > li.timeline-inverted > .timeline-panel:after { 106 | right: auto; 107 | left: -14px; 108 | border-right-width: 14px; 109 | border-left-width: 0; 110 | } 111 | 112 | .timeline-badge.primary { 113 | background-color: #2e6da4 !important; 114 | } 115 | 116 | .timeline-badge.success { 117 | background-color: #3f903f !important; 118 | } 119 | 120 | .timeline-badge.warning { 121 | background-color: #f0ad4e !important; 122 | } 123 | 124 | .timeline-badge.danger { 125 | background-color: #d9534f !important; 126 | } 127 | 128 | .timeline-badge.info { 129 | background-color: #5bc0de !important; 130 | } 131 | 132 | .timeline-title { 133 | margin-top: 0; 134 | color: inherit; 135 | } 136 | 137 | .timeline-body > p, 138 | .timeline-body > ul { 139 | margin-bottom: 0; 140 | } 141 | 142 | .timeline-body > p + p { 143 | margin-top: 5px; 144 | } 145 | 146 | @media(max-width:767px) { 147 | ul.timeline:before { 148 | left: 40px; 149 | } 150 | 151 | ul.timeline > li > .timeline-panel { 152 | width: calc(100% - 90px); 153 | width: -moz-calc(100% - 90px); 154 | width: -webkit-calc(100% - 90px); 155 | } 156 | 157 | ul.timeline > li > .timeline-badge { 158 | top: 16px; 159 | left: 15px; 160 | margin-left: 0; 161 | } 162 | 163 | ul.timeline > li > .timeline-panel { 164 | float: right; 165 | } 166 | 167 | ul.timeline > li > .timeline-panel:before { 168 | right: auto; 169 | left: -15px; 170 | border-right-width: 15px; 171 | border-left-width: 0; 172 | } 173 | 174 | ul.timeline > li > .timeline-panel:after { 175 | right: auto; 176 | left: -14px; 177 | border-right-width: 14px; 178 | border-left-width: 0; 179 | } 180 | } -------------------------------------------------------------------------------- /dist/js/sb-admin-2.js: -------------------------------------------------------------------------------- 1 | $(function() { 2 | 3 | $('#side-menu').metisMenu(); 4 | 5 | }); 6 | 7 | //Loads the correct sidebar on window load, 8 | //collapses the sidebar on window resize. 9 | // Sets the min-height of #page-wrapper to window size 10 | $(function() { 11 | $(window).bind("load resize", function() { 12 | topOffset = 50; 13 | width = (this.window.innerWidth > 0) ? this.window.innerWidth : this.screen.width; 14 | if (width < 768) { 15 | $('div.navbar-collapse').addClass('collapse'); 16 | topOffset = 100; // 2-row-menu 17 | } else { 18 | $('div.navbar-collapse').removeClass('collapse'); 19 | } 20 | 21 | height = ((this.window.innerHeight > 0) ? this.window.innerHeight : this.screen.height) - 1; 22 | height = height - topOffset; 23 | if (height < 1) height = 1; 24 | if (height > topOffset) { 25 | $("#page-wrapper").css("min-height", (height) + "px"); 26 | } 27 | }); 28 | 29 | var url = window.location; 30 | var element = $('ul.nav a').filter(function() { 31 | return this.href == url; 32 | }).addClass('active').parent().parent().addClass('in').parent(); 33 | if (element.is('li')) { 34 | element.addClass('active'); 35 | } 36 | }); 37 | -------------------------------------------------------------------------------- /js/flot-data.js: -------------------------------------------------------------------------------- 1 | //Flot Line Chart 2 | $(document).ready(function() { 3 | console.log("document ready"); 4 | var offset = 0; 5 | plot(); 6 | 7 | function plot() { 8 | var sin = [], 9 | cos = []; 10 | for (var i = 0; i < 12; i += 0.2) { 11 | sin.push([i, Math.sin(i + offset)]); 12 | cos.push([i, Math.cos(i + offset)]); 13 | } 14 | 15 | var options = { 16 | series: { 17 | lines: { 18 | show: true 19 | }, 20 | points: { 21 | show: true 22 | } 23 | }, 24 | grid: { 25 | hoverable: true //IMPORTANT! this is needed for tooltip to work 26 | }, 27 | yaxis: { 28 | min: -1.2, 29 | max: 1.2 30 | }, 31 | tooltip: true, 32 | tooltipOpts: { 33 | content: "'%s' of %x.1 is %y.4", 34 | shifts: { 35 | x: -60, 36 | y: 25 37 | } 38 | } 39 | }; 40 | 41 | var plotObj = $.plot($("#flot-line-chart"), [{ 42 | data: sin, 43 | label: "sin(x)" 44 | }, { 45 | data: cos, 46 | label: "cos(x)" 47 | }], 48 | options); 49 | } 50 | }); 51 | 52 | //Flot Pie Chart 53 | $(function() { 54 | 55 | var data = [{ 56 | label: "Series 0", 57 | data: 1 58 | }, { 59 | label: "Series 1", 60 | data: 3 61 | }, { 62 | label: "Series 2", 63 | data: 9 64 | }, { 65 | label: "Series 3", 66 | data: 20 67 | }]; 68 | 69 | var plotObj = $.plot($("#flot-pie-chart"), data, { 70 | series: { 71 | pie: { 72 | show: true 73 | } 74 | }, 75 | grid: { 76 | hoverable: true 77 | }, 78 | tooltip: true, 79 | tooltipOpts: { 80 | content: "%p.0%, %s", // show percentages, rounding to 2 decimal places 81 | shifts: { 82 | x: 20, 83 | y: 0 84 | }, 85 | defaultTheme: false 86 | } 87 | }); 88 | 89 | }); 90 | 91 | //Flot Multiple Axes Line Chart 92 | $(function() { 93 | var oilprices = [ 94 | [1167692400000, 61.05], 95 | [1167778800000, 58.32], 96 | [1167865200000, 57.35], 97 | [1167951600000, 56.31], 98 | [1168210800000, 55.55], 99 | [1168297200000, 55.64], 100 | [1168383600000, 54.02], 101 | [1168470000000, 51.88], 102 | [1168556400000, 52.99], 103 | [1168815600000, 52.99], 104 | [1168902000000, 51.21], 105 | [1168988400000, 52.24], 106 | [1169074800000, 50.48], 107 | [1169161200000, 51.99], 108 | [1169420400000, 51.13], 109 | [1169506800000, 55.04], 110 | [1169593200000, 55.37], 111 | [1169679600000, 54.23], 112 | [1169766000000, 55.42], 113 | [1170025200000, 54.01], 114 | [1170111600000, 56.97], 115 | [1170198000000, 58.14], 116 | [1170284400000, 58.14], 117 | [1170370800000, 59.02], 118 | [1170630000000, 58.74], 119 | [1170716400000, 58.88], 120 | [1170802800000, 57.71], 121 | [1170889200000, 59.71], 122 | [1170975600000, 59.89], 123 | [1171234800000, 57.81], 124 | [1171321200000, 59.06], 125 | [1171407600000, 58.00], 126 | [1171494000000, 57.99], 127 | [1171580400000, 59.39], 128 | [1171839600000, 59.39], 129 | [1171926000000, 58.07], 130 | [1172012400000, 60.07], 131 | [1172098800000, 61.14], 132 | [1172444400000, 61.39], 133 | [1172530800000, 61.46], 134 | [1172617200000, 61.79], 135 | [1172703600000, 62.00], 136 | [1172790000000, 60.07], 137 | [1173135600000, 60.69], 138 | [1173222000000, 61.82], 139 | [1173308400000, 60.05], 140 | [1173654000000, 58.91], 141 | [1173740400000, 57.93], 142 | [1173826800000, 58.16], 143 | [1173913200000, 57.55], 144 | [1173999600000, 57.11], 145 | [1174258800000, 56.59], 146 | [1174345200000, 59.61], 147 | [1174518000000, 61.69], 148 | [1174604400000, 62.28], 149 | [1174860000000, 62.91], 150 | [1174946400000, 62.93], 151 | [1175032800000, 64.03], 152 | [1175119200000, 66.03], 153 | [1175205600000, 65.87], 154 | [1175464800000, 64.64], 155 | [1175637600000, 64.38], 156 | [1175724000000, 64.28], 157 | [1175810400000, 64.28], 158 | [1176069600000, 61.51], 159 | [1176156000000, 61.89], 160 | [1176242400000, 62.01], 161 | [1176328800000, 63.85], 162 | [1176415200000, 63.63], 163 | [1176674400000, 63.61], 164 | [1176760800000, 63.10], 165 | [1176847200000, 63.13], 166 | [1176933600000, 61.83], 167 | [1177020000000, 63.38], 168 | [1177279200000, 64.58], 169 | [1177452000000, 65.84], 170 | [1177538400000, 65.06], 171 | [1177624800000, 66.46], 172 | [1177884000000, 64.40], 173 | [1178056800000, 63.68], 174 | [1178143200000, 63.19], 175 | [1178229600000, 61.93], 176 | [1178488800000, 61.47], 177 | [1178575200000, 61.55], 178 | [1178748000000, 61.81], 179 | [1178834400000, 62.37], 180 | [1179093600000, 62.46], 181 | [1179180000000, 63.17], 182 | [1179266400000, 62.55], 183 | [1179352800000, 64.94], 184 | [1179698400000, 66.27], 185 | [1179784800000, 65.50], 186 | [1179871200000, 65.77], 187 | [1179957600000, 64.18], 188 | [1180044000000, 65.20], 189 | [1180389600000, 63.15], 190 | [1180476000000, 63.49], 191 | [1180562400000, 65.08], 192 | [1180908000000, 66.30], 193 | [1180994400000, 65.96], 194 | [1181167200000, 66.93], 195 | [1181253600000, 65.98], 196 | [1181599200000, 65.35], 197 | [1181685600000, 66.26], 198 | [1181858400000, 68.00], 199 | [1182117600000, 69.09], 200 | [1182204000000, 69.10], 201 | [1182290400000, 68.19], 202 | [1182376800000, 68.19], 203 | [1182463200000, 69.14], 204 | [1182722400000, 68.19], 205 | [1182808800000, 67.77], 206 | [1182895200000, 68.97], 207 | [1182981600000, 69.57], 208 | [1183068000000, 70.68], 209 | [1183327200000, 71.09], 210 | [1183413600000, 70.92], 211 | [1183586400000, 71.81], 212 | [1183672800000, 72.81], 213 | [1183932000000, 72.19], 214 | [1184018400000, 72.56], 215 | [1184191200000, 72.50], 216 | [1184277600000, 74.15], 217 | [1184623200000, 75.05], 218 | [1184796000000, 75.92], 219 | [1184882400000, 75.57], 220 | [1185141600000, 74.89], 221 | [1185228000000, 73.56], 222 | [1185314400000, 75.57], 223 | [1185400800000, 74.95], 224 | [1185487200000, 76.83], 225 | [1185832800000, 78.21], 226 | [1185919200000, 76.53], 227 | [1186005600000, 76.86], 228 | [1186092000000, 76.00], 229 | [1186437600000, 71.59], 230 | [1186696800000, 71.47], 231 | [1186956000000, 71.62], 232 | [1187042400000, 71.00], 233 | [1187301600000, 71.98], 234 | [1187560800000, 71.12], 235 | [1187647200000, 69.47], 236 | [1187733600000, 69.26], 237 | [1187820000000, 69.83], 238 | [1187906400000, 71.09], 239 | [1188165600000, 71.73], 240 | [1188338400000, 73.36], 241 | [1188511200000, 74.04], 242 | [1188856800000, 76.30], 243 | [1189116000000, 77.49], 244 | [1189461600000, 78.23], 245 | [1189548000000, 79.91], 246 | [1189634400000, 80.09], 247 | [1189720800000, 79.10], 248 | [1189980000000, 80.57], 249 | [1190066400000, 81.93], 250 | [1190239200000, 83.32], 251 | [1190325600000, 81.62], 252 | [1190584800000, 80.95], 253 | [1190671200000, 79.53], 254 | [1190757600000, 80.30], 255 | [1190844000000, 82.88], 256 | [1190930400000, 81.66], 257 | [1191189600000, 80.24], 258 | [1191276000000, 80.05], 259 | [1191362400000, 79.94], 260 | [1191448800000, 81.44], 261 | [1191535200000, 81.22], 262 | [1191794400000, 79.02], 263 | [1191880800000, 80.26], 264 | [1191967200000, 80.30], 265 | [1192053600000, 83.08], 266 | [1192140000000, 83.69], 267 | [1192399200000, 86.13], 268 | [1192485600000, 87.61], 269 | [1192572000000, 87.40], 270 | [1192658400000, 89.47], 271 | [1192744800000, 88.60], 272 | [1193004000000, 87.56], 273 | [1193090400000, 87.56], 274 | [1193176800000, 87.10], 275 | [1193263200000, 91.86], 276 | [1193612400000, 93.53], 277 | [1193698800000, 94.53], 278 | [1193871600000, 95.93], 279 | [1194217200000, 93.98], 280 | [1194303600000, 96.37], 281 | [1194476400000, 95.46], 282 | [1194562800000, 96.32], 283 | [1195081200000, 93.43], 284 | [1195167600000, 95.10], 285 | [1195426800000, 94.64], 286 | [1195513200000, 95.10], 287 | [1196031600000, 97.70], 288 | [1196118000000, 94.42], 289 | [1196204400000, 90.62], 290 | [1196290800000, 91.01], 291 | [1196377200000, 88.71], 292 | [1196636400000, 88.32], 293 | [1196809200000, 90.23], 294 | [1196982000000, 88.28], 295 | [1197241200000, 87.86], 296 | [1197327600000, 90.02], 297 | [1197414000000, 92.25], 298 | [1197586800000, 90.63], 299 | [1197846000000, 90.63], 300 | [1197932400000, 90.49], 301 | [1198018800000, 91.24], 302 | [1198105200000, 91.06], 303 | [1198191600000, 90.49], 304 | [1198710000000, 96.62], 305 | [1198796400000, 96.00], 306 | [1199142000000, 99.62], 307 | [1199314800000, 99.18], 308 | [1199401200000, 95.09], 309 | [1199660400000, 96.33], 310 | [1199833200000, 95.67], 311 | [1200351600000, 91.90], 312 | [1200438000000, 90.84], 313 | [1200524400000, 90.13], 314 | [1200610800000, 90.57], 315 | [1200956400000, 89.21], 316 | [1201042800000, 86.99], 317 | [1201129200000, 89.85], 318 | [1201474800000, 90.99], 319 | [1201561200000, 91.64], 320 | [1201647600000, 92.33], 321 | [1201734000000, 91.75], 322 | [1202079600000, 90.02], 323 | [1202166000000, 88.41], 324 | [1202252400000, 87.14], 325 | [1202338800000, 88.11], 326 | [1202425200000, 91.77], 327 | [1202770800000, 92.78], 328 | [1202857200000, 93.27], 329 | [1202943600000, 95.46], 330 | [1203030000000, 95.46], 331 | [1203289200000, 101.74], 332 | [1203462000000, 98.81], 333 | [1203894000000, 100.88], 334 | [1204066800000, 99.64], 335 | [1204153200000, 102.59], 336 | [1204239600000, 101.84], 337 | [1204498800000, 99.52], 338 | [1204585200000, 99.52], 339 | [1204671600000, 104.52], 340 | [1204758000000, 105.47], 341 | [1204844400000, 105.15], 342 | [1205103600000, 108.75], 343 | [1205276400000, 109.92], 344 | [1205362800000, 110.33], 345 | [1205449200000, 110.21], 346 | [1205708400000, 105.68], 347 | [1205967600000, 101.84], 348 | [1206313200000, 100.86], 349 | [1206399600000, 101.22], 350 | [1206486000000, 105.90], 351 | [1206572400000, 107.58], 352 | [1206658800000, 105.62], 353 | [1206914400000, 101.58], 354 | [1207000800000, 100.98], 355 | [1207173600000, 103.83], 356 | [1207260000000, 106.23], 357 | [1207605600000, 108.50], 358 | [1207778400000, 110.11], 359 | [1207864800000, 110.14], 360 | [1208210400000, 113.79], 361 | [1208296800000, 114.93], 362 | [1208383200000, 114.86], 363 | [1208728800000, 117.48], 364 | [1208815200000, 118.30], 365 | [1208988000000, 116.06], 366 | [1209074400000, 118.52], 367 | [1209333600000, 118.75], 368 | [1209420000000, 113.46], 369 | [1209592800000, 112.52], 370 | [1210024800000, 121.84], 371 | [1210111200000, 123.53], 372 | [1210197600000, 123.69], 373 | [1210543200000, 124.23], 374 | [1210629600000, 125.80], 375 | [1210716000000, 126.29], 376 | [1211148000000, 127.05], 377 | [1211320800000, 129.07], 378 | [1211493600000, 132.19], 379 | [1211839200000, 128.85], 380 | [1212357600000, 127.76], 381 | [1212703200000, 138.54], 382 | [1212962400000, 136.80], 383 | [1213135200000, 136.38], 384 | [1213308000000, 134.86], 385 | [1213653600000, 134.01], 386 | [1213740000000, 136.68], 387 | [1213912800000, 135.65], 388 | [1214172000000, 134.62], 389 | [1214258400000, 134.62], 390 | [1214344800000, 134.62], 391 | [1214431200000, 139.64], 392 | [1214517600000, 140.21], 393 | [1214776800000, 140.00], 394 | [1214863200000, 140.97], 395 | [1214949600000, 143.57], 396 | [1215036000000, 145.29], 397 | [1215381600000, 141.37], 398 | [1215468000000, 136.04], 399 | [1215727200000, 146.40], 400 | [1215986400000, 145.18], 401 | [1216072800000, 138.74], 402 | [1216159200000, 134.60], 403 | [1216245600000, 129.29], 404 | [1216332000000, 130.65], 405 | [1216677600000, 127.95], 406 | [1216850400000, 127.95], 407 | [1217282400000, 122.19], 408 | [1217455200000, 124.08], 409 | [1217541600000, 125.10], 410 | [1217800800000, 121.41], 411 | [1217887200000, 119.17], 412 | [1217973600000, 118.58], 413 | [1218060000000, 120.02], 414 | [1218405600000, 114.45], 415 | [1218492000000, 113.01], 416 | [1218578400000, 116.00], 417 | [1218751200000, 113.77], 418 | [1219010400000, 112.87], 419 | [1219096800000, 114.53], 420 | [1219269600000, 114.98], 421 | [1219356000000, 114.98], 422 | [1219701600000, 116.27], 423 | [1219788000000, 118.15], 424 | [1219874400000, 115.59], 425 | [1219960800000, 115.46], 426 | [1220306400000, 109.71], 427 | [1220392800000, 109.35], 428 | [1220565600000, 106.23], 429 | [1220824800000, 106.34] 430 | ]; 431 | var exchangerates = [ 432 | [1167606000000, 0.7580], 433 | [1167692400000, 0.7580], 434 | [1167778800000, 0.75470], 435 | [1167865200000, 0.75490], 436 | [1167951600000, 0.76130], 437 | [1168038000000, 0.76550], 438 | [1168124400000, 0.76930], 439 | [1168210800000, 0.76940], 440 | [1168297200000, 0.76880], 441 | [1168383600000, 0.76780], 442 | [1168470000000, 0.77080], 443 | [1168556400000, 0.77270], 444 | [1168642800000, 0.77490], 445 | [1168729200000, 0.77410], 446 | [1168815600000, 0.77410], 447 | [1168902000000, 0.77320], 448 | [1168988400000, 0.77270], 449 | [1169074800000, 0.77370], 450 | [1169161200000, 0.77240], 451 | [1169247600000, 0.77120], 452 | [1169334000000, 0.7720], 453 | [1169420400000, 0.77210], 454 | [1169506800000, 0.77170], 455 | [1169593200000, 0.77040], 456 | [1169679600000, 0.7690], 457 | [1169766000000, 0.77110], 458 | [1169852400000, 0.7740], 459 | [1169938800000, 0.77450], 460 | [1170025200000, 0.77450], 461 | [1170111600000, 0.7740], 462 | [1170198000000, 0.77160], 463 | [1170284400000, 0.77130], 464 | [1170370800000, 0.76780], 465 | [1170457200000, 0.76880], 466 | [1170543600000, 0.77180], 467 | [1170630000000, 0.77180], 468 | [1170716400000, 0.77280], 469 | [1170802800000, 0.77290], 470 | [1170889200000, 0.76980], 471 | [1170975600000, 0.76850], 472 | [1171062000000, 0.76810], 473 | [1171148400000, 0.7690], 474 | [1171234800000, 0.7690], 475 | [1171321200000, 0.76980], 476 | [1171407600000, 0.76990], 477 | [1171494000000, 0.76510], 478 | [1171580400000, 0.76130], 479 | [1171666800000, 0.76160], 480 | [1171753200000, 0.76140], 481 | [1171839600000, 0.76140], 482 | [1171926000000, 0.76070], 483 | [1172012400000, 0.76020], 484 | [1172098800000, 0.76110], 485 | [1172185200000, 0.76220], 486 | [1172271600000, 0.76150], 487 | [1172358000000, 0.75980], 488 | [1172444400000, 0.75980], 489 | [1172530800000, 0.75920], 490 | [1172617200000, 0.75730], 491 | [1172703600000, 0.75660], 492 | [1172790000000, 0.75670], 493 | [1172876400000, 0.75910], 494 | [1172962800000, 0.75820], 495 | [1173049200000, 0.75850], 496 | [1173135600000, 0.76130], 497 | [1173222000000, 0.76310], 498 | [1173308400000, 0.76150], 499 | [1173394800000, 0.760], 500 | [1173481200000, 0.76130], 501 | [1173567600000, 0.76270], 502 | [1173654000000, 0.76270], 503 | [1173740400000, 0.76080], 504 | [1173826800000, 0.75830], 505 | [1173913200000, 0.75750], 506 | [1173999600000, 0.75620], 507 | [1174086000000, 0.7520], 508 | [1174172400000, 0.75120], 509 | [1174258800000, 0.75120], 510 | [1174345200000, 0.75170], 511 | [1174431600000, 0.7520], 512 | [1174518000000, 0.75110], 513 | [1174604400000, 0.7480], 514 | [1174690800000, 0.75090], 515 | [1174777200000, 0.75310], 516 | [1174860000000, 0.75310], 517 | [1174946400000, 0.75270], 518 | [1175032800000, 0.74980], 519 | [1175119200000, 0.74930], 520 | [1175205600000, 0.75040], 521 | [1175292000000, 0.750], 522 | [1175378400000, 0.74910], 523 | [1175464800000, 0.74910], 524 | [1175551200000, 0.74850], 525 | [1175637600000, 0.74840], 526 | [1175724000000, 0.74920], 527 | [1175810400000, 0.74710], 528 | [1175896800000, 0.74590], 529 | [1175983200000, 0.74770], 530 | [1176069600000, 0.74770], 531 | [1176156000000, 0.74830], 532 | [1176242400000, 0.74580], 533 | [1176328800000, 0.74480], 534 | [1176415200000, 0.7430], 535 | [1176501600000, 0.73990], 536 | [1176588000000, 0.73950], 537 | [1176674400000, 0.73950], 538 | [1176760800000, 0.73780], 539 | [1176847200000, 0.73820], 540 | [1176933600000, 0.73620], 541 | [1177020000000, 0.73550], 542 | [1177106400000, 0.73480], 543 | [1177192800000, 0.73610], 544 | [1177279200000, 0.73610], 545 | [1177365600000, 0.73650], 546 | [1177452000000, 0.73620], 547 | [1177538400000, 0.73310], 548 | [1177624800000, 0.73390], 549 | [1177711200000, 0.73440], 550 | [1177797600000, 0.73270], 551 | [1177884000000, 0.73270], 552 | [1177970400000, 0.73360], 553 | [1178056800000, 0.73330], 554 | [1178143200000, 0.73590], 555 | [1178229600000, 0.73590], 556 | [1178316000000, 0.73720], 557 | [1178402400000, 0.7360], 558 | [1178488800000, 0.7360], 559 | [1178575200000, 0.7350], 560 | [1178661600000, 0.73650], 561 | [1178748000000, 0.73840], 562 | [1178834400000, 0.73950], 563 | [1178920800000, 0.74130], 564 | [1179007200000, 0.73970], 565 | [1179093600000, 0.73960], 566 | [1179180000000, 0.73850], 567 | [1179266400000, 0.73780], 568 | [1179352800000, 0.73660], 569 | [1179439200000, 0.740], 570 | [1179525600000, 0.74110], 571 | [1179612000000, 0.74060], 572 | [1179698400000, 0.74050], 573 | [1179784800000, 0.74140], 574 | [1179871200000, 0.74310], 575 | [1179957600000, 0.74310], 576 | [1180044000000, 0.74380], 577 | [1180130400000, 0.74430], 578 | [1180216800000, 0.74430], 579 | [1180303200000, 0.74430], 580 | [1180389600000, 0.74340], 581 | [1180476000000, 0.74290], 582 | [1180562400000, 0.74420], 583 | [1180648800000, 0.7440], 584 | [1180735200000, 0.74390], 585 | [1180821600000, 0.74370], 586 | [1180908000000, 0.74370], 587 | [1180994400000, 0.74290], 588 | [1181080800000, 0.74030], 589 | [1181167200000, 0.73990], 590 | [1181253600000, 0.74180], 591 | [1181340000000, 0.74680], 592 | [1181426400000, 0.7480], 593 | [1181512800000, 0.7480], 594 | [1181599200000, 0.7490], 595 | [1181685600000, 0.74940], 596 | [1181772000000, 0.75220], 597 | [1181858400000, 0.75150], 598 | [1181944800000, 0.75020], 599 | [1182031200000, 0.74720], 600 | [1182117600000, 0.74720], 601 | [1182204000000, 0.74620], 602 | [1182290400000, 0.74550], 603 | [1182376800000, 0.74490], 604 | [1182463200000, 0.74670], 605 | [1182549600000, 0.74580], 606 | [1182636000000, 0.74270], 607 | [1182722400000, 0.74270], 608 | [1182808800000, 0.7430], 609 | [1182895200000, 0.74290], 610 | [1182981600000, 0.7440], 611 | [1183068000000, 0.7430], 612 | [1183154400000, 0.74220], 613 | [1183240800000, 0.73880], 614 | [1183327200000, 0.73880], 615 | [1183413600000, 0.73690], 616 | [1183500000000, 0.73450], 617 | [1183586400000, 0.73450], 618 | [1183672800000, 0.73450], 619 | [1183759200000, 0.73520], 620 | [1183845600000, 0.73410], 621 | [1183932000000, 0.73410], 622 | [1184018400000, 0.7340], 623 | [1184104800000, 0.73240], 624 | [1184191200000, 0.72720], 625 | [1184277600000, 0.72640], 626 | [1184364000000, 0.72550], 627 | [1184450400000, 0.72580], 628 | [1184536800000, 0.72580], 629 | [1184623200000, 0.72560], 630 | [1184709600000, 0.72570], 631 | [1184796000000, 0.72470], 632 | [1184882400000, 0.72430], 633 | [1184968800000, 0.72440], 634 | [1185055200000, 0.72350], 635 | [1185141600000, 0.72350], 636 | [1185228000000, 0.72350], 637 | [1185314400000, 0.72350], 638 | [1185400800000, 0.72620], 639 | [1185487200000, 0.72880], 640 | [1185573600000, 0.73010], 641 | [1185660000000, 0.73370], 642 | [1185746400000, 0.73370], 643 | [1185832800000, 0.73240], 644 | [1185919200000, 0.72970], 645 | [1186005600000, 0.73170], 646 | [1186092000000, 0.73150], 647 | [1186178400000, 0.72880], 648 | [1186264800000, 0.72630], 649 | [1186351200000, 0.72630], 650 | [1186437600000, 0.72420], 651 | [1186524000000, 0.72530], 652 | [1186610400000, 0.72640], 653 | [1186696800000, 0.7270], 654 | [1186783200000, 0.73120], 655 | [1186869600000, 0.73050], 656 | [1186956000000, 0.73050], 657 | [1187042400000, 0.73180], 658 | [1187128800000, 0.73580], 659 | [1187215200000, 0.74090], 660 | [1187301600000, 0.74540], 661 | [1187388000000, 0.74370], 662 | [1187474400000, 0.74240], 663 | [1187560800000, 0.74240], 664 | [1187647200000, 0.74150], 665 | [1187733600000, 0.74190], 666 | [1187820000000, 0.74140], 667 | [1187906400000, 0.73770], 668 | [1187992800000, 0.73550], 669 | [1188079200000, 0.73150], 670 | [1188165600000, 0.73150], 671 | [1188252000000, 0.7320], 672 | [1188338400000, 0.73320], 673 | [1188424800000, 0.73460], 674 | [1188511200000, 0.73280], 675 | [1188597600000, 0.73230], 676 | [1188684000000, 0.7340], 677 | [1188770400000, 0.7340], 678 | [1188856800000, 0.73360], 679 | [1188943200000, 0.73510], 680 | [1189029600000, 0.73460], 681 | [1189116000000, 0.73210], 682 | [1189202400000, 0.72940], 683 | [1189288800000, 0.72660], 684 | [1189375200000, 0.72660], 685 | [1189461600000, 0.72540], 686 | [1189548000000, 0.72420], 687 | [1189634400000, 0.72130], 688 | [1189720800000, 0.71970], 689 | [1189807200000, 0.72090], 690 | [1189893600000, 0.7210], 691 | [1189980000000, 0.7210], 692 | [1190066400000, 0.7210], 693 | [1190152800000, 0.72090], 694 | [1190239200000, 0.71590], 695 | [1190325600000, 0.71330], 696 | [1190412000000, 0.71050], 697 | [1190498400000, 0.70990], 698 | [1190584800000, 0.70990], 699 | [1190671200000, 0.70930], 700 | [1190757600000, 0.70930], 701 | [1190844000000, 0.70760], 702 | [1190930400000, 0.7070], 703 | [1191016800000, 0.70490], 704 | [1191103200000, 0.70120], 705 | [1191189600000, 0.70110], 706 | [1191276000000, 0.70190], 707 | [1191362400000, 0.70460], 708 | [1191448800000, 0.70630], 709 | [1191535200000, 0.70890], 710 | [1191621600000, 0.70770], 711 | [1191708000000, 0.70770], 712 | [1191794400000, 0.70770], 713 | [1191880800000, 0.70910], 714 | [1191967200000, 0.71180], 715 | [1192053600000, 0.70790], 716 | [1192140000000, 0.70530], 717 | [1192226400000, 0.7050], 718 | [1192312800000, 0.70550], 719 | [1192399200000, 0.70550], 720 | [1192485600000, 0.70450], 721 | [1192572000000, 0.70510], 722 | [1192658400000, 0.70510], 723 | [1192744800000, 0.70170], 724 | [1192831200000, 0.70], 725 | [1192917600000, 0.69950], 726 | [1193004000000, 0.69940], 727 | [1193090400000, 0.70140], 728 | [1193176800000, 0.70360], 729 | [1193263200000, 0.70210], 730 | [1193349600000, 0.70020], 731 | [1193436000000, 0.69670], 732 | [1193522400000, 0.6950], 733 | [1193612400000, 0.6950], 734 | [1193698800000, 0.69390], 735 | [1193785200000, 0.6940], 736 | [1193871600000, 0.69220], 737 | [1193958000000, 0.69190], 738 | [1194044400000, 0.69140], 739 | [1194130800000, 0.68940], 740 | [1194217200000, 0.68910], 741 | [1194303600000, 0.69040], 742 | [1194390000000, 0.6890], 743 | [1194476400000, 0.68340], 744 | [1194562800000, 0.68230], 745 | [1194649200000, 0.68070], 746 | [1194735600000, 0.68150], 747 | [1194822000000, 0.68150], 748 | [1194908400000, 0.68470], 749 | [1194994800000, 0.68590], 750 | [1195081200000, 0.68220], 751 | [1195167600000, 0.68270], 752 | [1195254000000, 0.68370], 753 | [1195340400000, 0.68230], 754 | [1195426800000, 0.68220], 755 | [1195513200000, 0.68220], 756 | [1195599600000, 0.67920], 757 | [1195686000000, 0.67460], 758 | [1195772400000, 0.67350], 759 | [1195858800000, 0.67310], 760 | [1195945200000, 0.67420], 761 | [1196031600000, 0.67440], 762 | [1196118000000, 0.67390], 763 | [1196204400000, 0.67310], 764 | [1196290800000, 0.67610], 765 | [1196377200000, 0.67610], 766 | [1196463600000, 0.67850], 767 | [1196550000000, 0.68180], 768 | [1196636400000, 0.68360], 769 | [1196722800000, 0.68230], 770 | [1196809200000, 0.68050], 771 | [1196895600000, 0.67930], 772 | [1196982000000, 0.68490], 773 | [1197068400000, 0.68330], 774 | [1197154800000, 0.68250], 775 | [1197241200000, 0.68250], 776 | [1197327600000, 0.68160], 777 | [1197414000000, 0.67990], 778 | [1197500400000, 0.68130], 779 | [1197586800000, 0.68090], 780 | [1197673200000, 0.68680], 781 | [1197759600000, 0.69330], 782 | [1197846000000, 0.69330], 783 | [1197932400000, 0.69450], 784 | [1198018800000, 0.69440], 785 | [1198105200000, 0.69460], 786 | [1198191600000, 0.69640], 787 | [1198278000000, 0.69650], 788 | [1198364400000, 0.69560], 789 | [1198450800000, 0.69560], 790 | [1198537200000, 0.6950], 791 | [1198623600000, 0.69480], 792 | [1198710000000, 0.69280], 793 | [1198796400000, 0.68870], 794 | [1198882800000, 0.68240], 795 | [1198969200000, 0.67940], 796 | [1199055600000, 0.67940], 797 | [1199142000000, 0.68030], 798 | [1199228400000, 0.68550], 799 | [1199314800000, 0.68240], 800 | [1199401200000, 0.67910], 801 | [1199487600000, 0.67830], 802 | [1199574000000, 0.67850], 803 | [1199660400000, 0.67850], 804 | [1199746800000, 0.67970], 805 | [1199833200000, 0.680], 806 | [1199919600000, 0.68030], 807 | [1200006000000, 0.68050], 808 | [1200092400000, 0.6760], 809 | [1200178800000, 0.6770], 810 | [1200265200000, 0.6770], 811 | [1200351600000, 0.67360], 812 | [1200438000000, 0.67260], 813 | [1200524400000, 0.67640], 814 | [1200610800000, 0.68210], 815 | [1200697200000, 0.68310], 816 | [1200783600000, 0.68420], 817 | [1200870000000, 0.68420], 818 | [1200956400000, 0.68870], 819 | [1201042800000, 0.69030], 820 | [1201129200000, 0.68480], 821 | [1201215600000, 0.68240], 822 | [1201302000000, 0.67880], 823 | [1201388400000, 0.68140], 824 | [1201474800000, 0.68140], 825 | [1201561200000, 0.67970], 826 | [1201647600000, 0.67690], 827 | [1201734000000, 0.67650], 828 | [1201820400000, 0.67330], 829 | [1201906800000, 0.67290], 830 | [1201993200000, 0.67580], 831 | [1202079600000, 0.67580], 832 | [1202166000000, 0.6750], 833 | [1202252400000, 0.6780], 834 | [1202338800000, 0.68330], 835 | [1202425200000, 0.68560], 836 | [1202511600000, 0.69030], 837 | [1202598000000, 0.68960], 838 | [1202684400000, 0.68960], 839 | [1202770800000, 0.68820], 840 | [1202857200000, 0.68790], 841 | [1202943600000, 0.68620], 842 | [1203030000000, 0.68520], 843 | [1203116400000, 0.68230], 844 | [1203202800000, 0.68130], 845 | [1203289200000, 0.68130], 846 | [1203375600000, 0.68220], 847 | [1203462000000, 0.68020], 848 | [1203548400000, 0.68020], 849 | [1203634800000, 0.67840], 850 | [1203721200000, 0.67480], 851 | [1203807600000, 0.67470], 852 | [1203894000000, 0.67470], 853 | [1203980400000, 0.67480], 854 | [1204066800000, 0.67330], 855 | [1204153200000, 0.6650], 856 | [1204239600000, 0.66110], 857 | [1204326000000, 0.65830], 858 | [1204412400000, 0.6590], 859 | [1204498800000, 0.6590], 860 | [1204585200000, 0.65810], 861 | [1204671600000, 0.65780], 862 | [1204758000000, 0.65740], 863 | [1204844400000, 0.65320], 864 | [1204930800000, 0.65020], 865 | [1205017200000, 0.65140], 866 | [1205103600000, 0.65140], 867 | [1205190000000, 0.65070], 868 | [1205276400000, 0.6510], 869 | [1205362800000, 0.64890], 870 | [1205449200000, 0.64240], 871 | [1205535600000, 0.64060], 872 | [1205622000000, 0.63820], 873 | [1205708400000, 0.63820], 874 | [1205794800000, 0.63410], 875 | [1205881200000, 0.63440], 876 | [1205967600000, 0.63780], 877 | [1206054000000, 0.64390], 878 | [1206140400000, 0.64780], 879 | [1206226800000, 0.64810], 880 | [1206313200000, 0.64810], 881 | [1206399600000, 0.64940], 882 | [1206486000000, 0.64380], 883 | [1206572400000, 0.63770], 884 | [1206658800000, 0.63290], 885 | [1206745200000, 0.63360], 886 | [1206831600000, 0.63330], 887 | [1206914400000, 0.63330], 888 | [1207000800000, 0.6330], 889 | [1207087200000, 0.63710], 890 | [1207173600000, 0.64030], 891 | [1207260000000, 0.63960], 892 | [1207346400000, 0.63640], 893 | [1207432800000, 0.63560], 894 | [1207519200000, 0.63560], 895 | [1207605600000, 0.63680], 896 | [1207692000000, 0.63570], 897 | [1207778400000, 0.63540], 898 | [1207864800000, 0.6320], 899 | [1207951200000, 0.63320], 900 | [1208037600000, 0.63280], 901 | [1208124000000, 0.63310], 902 | [1208210400000, 0.63420], 903 | [1208296800000, 0.63210], 904 | [1208383200000, 0.63020], 905 | [1208469600000, 0.62780], 906 | [1208556000000, 0.63080], 907 | [1208642400000, 0.63240], 908 | [1208728800000, 0.63240], 909 | [1208815200000, 0.63070], 910 | [1208901600000, 0.62770], 911 | [1208988000000, 0.62690], 912 | [1209074400000, 0.63350], 913 | [1209160800000, 0.63920], 914 | [1209247200000, 0.640], 915 | [1209333600000, 0.64010], 916 | [1209420000000, 0.63960], 917 | [1209506400000, 0.64070], 918 | [1209592800000, 0.64230], 919 | [1209679200000, 0.64290], 920 | [1209765600000, 0.64720], 921 | [1209852000000, 0.64850], 922 | [1209938400000, 0.64860], 923 | [1210024800000, 0.64670], 924 | [1210111200000, 0.64440], 925 | [1210197600000, 0.64670], 926 | [1210284000000, 0.65090], 927 | [1210370400000, 0.64780], 928 | [1210456800000, 0.64610], 929 | [1210543200000, 0.64610], 930 | [1210629600000, 0.64680], 931 | [1210716000000, 0.64490], 932 | [1210802400000, 0.6470], 933 | [1210888800000, 0.64610], 934 | [1210975200000, 0.64520], 935 | [1211061600000, 0.64220], 936 | [1211148000000, 0.64220], 937 | [1211234400000, 0.64250], 938 | [1211320800000, 0.64140], 939 | [1211407200000, 0.63660], 940 | [1211493600000, 0.63460], 941 | [1211580000000, 0.6350], 942 | [1211666400000, 0.63460], 943 | [1211752800000, 0.63460], 944 | [1211839200000, 0.63430], 945 | [1211925600000, 0.63460], 946 | [1212012000000, 0.63790], 947 | [1212098400000, 0.64160], 948 | [1212184800000, 0.64420], 949 | [1212271200000, 0.64310], 950 | [1212357600000, 0.64310], 951 | [1212444000000, 0.64350], 952 | [1212530400000, 0.6440], 953 | [1212616800000, 0.64730], 954 | [1212703200000, 0.64690], 955 | [1212789600000, 0.63860], 956 | [1212876000000, 0.63560], 957 | [1212962400000, 0.6340], 958 | [1213048800000, 0.63460], 959 | [1213135200000, 0.6430], 960 | [1213221600000, 0.64520], 961 | [1213308000000, 0.64670], 962 | [1213394400000, 0.65060], 963 | [1213480800000, 0.65040], 964 | [1213567200000, 0.65030], 965 | [1213653600000, 0.64810], 966 | [1213740000000, 0.64510], 967 | [1213826400000, 0.6450], 968 | [1213912800000, 0.64410], 969 | [1213999200000, 0.64140], 970 | [1214085600000, 0.64090], 971 | [1214172000000, 0.64090], 972 | [1214258400000, 0.64280], 973 | [1214344800000, 0.64310], 974 | [1214431200000, 0.64180], 975 | [1214517600000, 0.63710], 976 | [1214604000000, 0.63490], 977 | [1214690400000, 0.63330], 978 | [1214776800000, 0.63340], 979 | [1214863200000, 0.63380], 980 | [1214949600000, 0.63420], 981 | [1215036000000, 0.6320], 982 | [1215122400000, 0.63180], 983 | [1215208800000, 0.6370], 984 | [1215295200000, 0.63680], 985 | [1215381600000, 0.63680], 986 | [1215468000000, 0.63830], 987 | [1215554400000, 0.63710], 988 | [1215640800000, 0.63710], 989 | [1215727200000, 0.63550], 990 | [1215813600000, 0.6320], 991 | [1215900000000, 0.62770], 992 | [1215986400000, 0.62760], 993 | [1216072800000, 0.62910], 994 | [1216159200000, 0.62740], 995 | [1216245600000, 0.62930], 996 | [1216332000000, 0.63110], 997 | [1216418400000, 0.6310], 998 | [1216504800000, 0.63120], 999 | [1216591200000, 0.63120], 1000 | [1216677600000, 0.63040], 1001 | [1216764000000, 0.62940], 1002 | [1216850400000, 0.63480], 1003 | [1216936800000, 0.63780], 1004 | [1217023200000, 0.63680], 1005 | [1217109600000, 0.63680], 1006 | [1217196000000, 0.63680], 1007 | [1217282400000, 0.6360], 1008 | [1217368800000, 0.6370], 1009 | [1217455200000, 0.64180], 1010 | [1217541600000, 0.64110], 1011 | [1217628000000, 0.64350], 1012 | [1217714400000, 0.64270], 1013 | [1217800800000, 0.64270], 1014 | [1217887200000, 0.64190], 1015 | [1217973600000, 0.64460], 1016 | [1218060000000, 0.64680], 1017 | [1218146400000, 0.64870], 1018 | [1218232800000, 0.65940], 1019 | [1218319200000, 0.66660], 1020 | [1218405600000, 0.66660], 1021 | [1218492000000, 0.66780], 1022 | [1218578400000, 0.67120], 1023 | [1218664800000, 0.67050], 1024 | [1218751200000, 0.67180], 1025 | [1218837600000, 0.67840], 1026 | [1218924000000, 0.68110], 1027 | [1219010400000, 0.68110], 1028 | [1219096800000, 0.67940], 1029 | [1219183200000, 0.68040], 1030 | [1219269600000, 0.67810], 1031 | [1219356000000, 0.67560], 1032 | [1219442400000, 0.67350], 1033 | [1219528800000, 0.67630], 1034 | [1219615200000, 0.67620], 1035 | [1219701600000, 0.67770], 1036 | [1219788000000, 0.68150], 1037 | [1219874400000, 0.68020], 1038 | [1219960800000, 0.6780], 1039 | [1220047200000, 0.67960], 1040 | [1220133600000, 0.68170], 1041 | [1220220000000, 0.68170], 1042 | [1220306400000, 0.68320], 1043 | [1220392800000, 0.68770], 1044 | [1220479200000, 0.69120], 1045 | [1220565600000, 0.69140], 1046 | [1220652000000, 0.70090], 1047 | [1220738400000, 0.70120], 1048 | [1220824800000, 0.7010], 1049 | [1220911200000, 0.70050] 1050 | ]; 1051 | 1052 | function euroFormatter(v, axis) { 1053 | return v.toFixed(axis.tickDecimals) + "€"; 1054 | } 1055 | 1056 | function doPlot(position) { 1057 | $.plot($("#flot-line-chart-multi"), [{ 1058 | data: oilprices, 1059 | label: "Oil price ($)" 1060 | }, { 1061 | data: exchangerates, 1062 | label: "USD/EUR exchange rate", 1063 | yaxis: 2 1064 | }], { 1065 | xaxes: [{ 1066 | mode: 'time' 1067 | }], 1068 | yaxes: [{ 1069 | min: 0 1070 | }, { 1071 | // align if we are to the right 1072 | alignTicksWithAxis: position == "right" ? 1 : null, 1073 | position: position, 1074 | tickFormatter: euroFormatter 1075 | }], 1076 | legend: { 1077 | position: 'sw' 1078 | }, 1079 | grid: { 1080 | hoverable: true //IMPORTANT! this is needed for tooltip to work 1081 | }, 1082 | tooltip: true, 1083 | tooltipOpts: { 1084 | content: "%s for %x was %y", 1085 | xDateFormat: "%y-%0m-%0d", 1086 | 1087 | onHover: function(flotItem, $tooltipEl) { 1088 | // console.log(flotItem, $tooltipEl); 1089 | } 1090 | } 1091 | 1092 | }); 1093 | } 1094 | 1095 | doPlot("right"); 1096 | 1097 | $("button").click(function() { 1098 | doPlot($(this).text()); 1099 | }); 1100 | }); 1101 | 1102 | //Flot Moving Line Chart 1103 | 1104 | $(function() { 1105 | 1106 | var container = $("#flot-line-chart-moving"); 1107 | 1108 | // Determine how many data points to keep based on the placeholder's initial size; 1109 | // this gives us a nice high-res plot while avoiding more than one point per pixel. 1110 | 1111 | var maximum = container.outerWidth() / 2 || 300; 1112 | 1113 | // 1114 | 1115 | var data = []; 1116 | 1117 | function getRandomData() { 1118 | 1119 | if (data.length) { 1120 | data = data.slice(1); 1121 | } 1122 | 1123 | while (data.length < maximum) { 1124 | var previous = data.length ? data[data.length - 1] : 50; 1125 | var y = previous + Math.random() * 10 - 5; 1126 | data.push(y < 0 ? 0 : y > 100 ? 100 : y); 1127 | } 1128 | 1129 | // zip the generated y values with the x values 1130 | 1131 | var res = []; 1132 | for (var i = 0; i < data.length; ++i) { 1133 | res.push([i, data[i]]) 1134 | } 1135 | 1136 | return res; 1137 | } 1138 | 1139 | // 1140 | 1141 | series = [{ 1142 | data: getRandomData(), 1143 | lines: { 1144 | fill: true 1145 | } 1146 | }]; 1147 | 1148 | // 1149 | 1150 | var plot = $.plot(container, series, { 1151 | grid: { 1152 | borderWidth: 1, 1153 | minBorderMargin: 20, 1154 | labelMargin: 10, 1155 | backgroundColor: { 1156 | colors: ["#fff", "#e4f4f4"] 1157 | }, 1158 | margin: { 1159 | top: 8, 1160 | bottom: 20, 1161 | left: 20 1162 | }, 1163 | markings: function(axes) { 1164 | var markings = []; 1165 | var xaxis = axes.xaxis; 1166 | for (var x = Math.floor(xaxis.min); x < xaxis.max; x += xaxis.tickSize * 2) { 1167 | markings.push({ 1168 | xaxis: { 1169 | from: x, 1170 | to: x + xaxis.tickSize 1171 | }, 1172 | color: "rgba(232, 232, 255, 0.2)" 1173 | }); 1174 | } 1175 | return markings; 1176 | } 1177 | }, 1178 | xaxis: { 1179 | tickFormatter: function() { 1180 | return ""; 1181 | } 1182 | }, 1183 | yaxis: { 1184 | min: 0, 1185 | max: 110 1186 | }, 1187 | legend: { 1188 | show: true 1189 | } 1190 | }); 1191 | 1192 | // Update the random dataset at 25FPS for a smoothly-animating chart 1193 | 1194 | setInterval(function updateRandom() { 1195 | series[0].data = getRandomData(); 1196 | plot.setData(series); 1197 | plot.draw(); 1198 | }, 40); 1199 | 1200 | }); 1201 | 1202 | //Flot Bar Chart 1203 | 1204 | $(function() { 1205 | 1206 | var barOptions = { 1207 | series: { 1208 | bars: { 1209 | show: true, 1210 | barWidth: 43200000 1211 | } 1212 | }, 1213 | xaxis: { 1214 | mode: "time", 1215 | timeformat: "%m/%d", 1216 | minTickSize: [1, "day"] 1217 | }, 1218 | grid: { 1219 | hoverable: true 1220 | }, 1221 | legend: { 1222 | show: false 1223 | }, 1224 | tooltip: true, 1225 | tooltipOpts: { 1226 | content: "x: %x, y: %y" 1227 | } 1228 | }; 1229 | var barData = { 1230 | label: "bar", 1231 | data: [ 1232 | [1354521600000, 1000], 1233 | [1355040000000, 2000], 1234 | [1355223600000, 3000], 1235 | [1355306400000, 4000], 1236 | [1355487300000, 5000], 1237 | [1355571900000, 6000] 1238 | ] 1239 | }; 1240 | $.plot($("#flot-bar-chart"), [barData], barOptions); 1241 | 1242 | }); 1243 | -------------------------------------------------------------------------------- /js/morris-data.js: -------------------------------------------------------------------------------- 1 | $(function() { 2 | 3 | Morris.Area({ 4 | element: 'morris-area-chart', 5 | data: [{ 6 | period: '2010 Q1', 7 | iphone: 2666, 8 | ipad: null, 9 | itouch: 2647 10 | }, { 11 | period: '2010 Q2', 12 | iphone: 2778, 13 | ipad: 2294, 14 | itouch: 2441 15 | }, { 16 | period: '2010 Q3', 17 | iphone: 4912, 18 | ipad: 1969, 19 | itouch: 2501 20 | }, { 21 | period: '2010 Q4', 22 | iphone: 3767, 23 | ipad: 3597, 24 | itouch: 5689 25 | }, { 26 | period: '2011 Q1', 27 | iphone: 6810, 28 | ipad: 1914, 29 | itouch: 2293 30 | }, { 31 | period: '2011 Q2', 32 | iphone: 5670, 33 | ipad: 4293, 34 | itouch: 1881 35 | }, { 36 | period: '2011 Q3', 37 | iphone: 4820, 38 | ipad: 3795, 39 | itouch: 1588 40 | }, { 41 | period: '2011 Q4', 42 | iphone: 15073, 43 | ipad: 5967, 44 | itouch: 5175 45 | }, { 46 | period: '2012 Q1', 47 | iphone: 10687, 48 | ipad: 4460, 49 | itouch: 2028 50 | }, { 51 | period: '2012 Q2', 52 | iphone: 8432, 53 | ipad: 5713, 54 | itouch: 1791 55 | }], 56 | xkey: 'period', 57 | ykeys: ['iphone', 'ipad', 'itouch'], 58 | labels: ['iPhone', 'iPad', 'iPod Touch'], 59 | pointSize: 2, 60 | hideHover: 'auto', 61 | resize: true 62 | }); 63 | 64 | Morris.Donut({ 65 | element: 'morris-donut-chart', 66 | data: [{ 67 | label: "Download Sales", 68 | value: 12 69 | }, { 70 | label: "In-Store Sales", 71 | value: 30 72 | }, { 73 | label: "Mail-Order Sales", 74 | value: 20 75 | }], 76 | resize: true 77 | }); 78 | 79 | Morris.Bar({ 80 | element: 'morris-bar-chart', 81 | data: [{ 82 | y: '2006', 83 | a: 100, 84 | b: 90 85 | }, { 86 | y: '2007', 87 | a: 75, 88 | b: 65 89 | }, { 90 | y: '2008', 91 | a: 50, 92 | b: 40 93 | }, { 94 | y: '2009', 95 | a: 75, 96 | b: 65 97 | }, { 98 | y: '2010', 99 | a: 50, 100 | b: 40 101 | }, { 102 | y: '2011', 103 | a: 75, 104 | b: 65 105 | }, { 106 | y: '2012', 107 | a: 100, 108 | b: 90 109 | }], 110 | xkey: 'y', 111 | ykeys: ['a', 'b'], 112 | labels: ['Series A', 'Series B'], 113 | hideHover: 'auto', 114 | resize: true 115 | }); 116 | 117 | }); 118 | -------------------------------------------------------------------------------- /loginform.py: -------------------------------------------------------------------------------- 1 | from wtforms import form, fields, validators 2 | from user import User 3 | 4 | 5 | # Define login and registration forms (for flask-login) 6 | class LoginForm(form.Form): 7 | username = fields.TextField(validators=[validators.required()]) 8 | password = fields.PasswordField(validators=[validators.required()]) 9 | 10 | def validate_login(self, field): 11 | user = self.get_user() 12 | 13 | if user is None: 14 | raise validators.ValidationError('Invalid user') 15 | 16 | if user.password != self.password.data: 17 | raise validators.ValidationError('Invalid password') 18 | 19 | def get_user(self): 20 | return User.get(self.username.data) -------------------------------------------------------------------------------- /requirements.txt: -------------------------------------------------------------------------------- 1 | Flask 2 | Flask-Admin 3 | Flask-Login 4 | -------------------------------------------------------------------------------- /stub.py: -------------------------------------------------------------------------------- 1 | def get_messages_summary(): 2 | m = { 3 | "from": "John Smith", 4 | "receivedon": "Yesterday", 5 | "text": "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque eleifend...", 6 | "url":"#" 7 | } 8 | messages = list() 9 | for i in range(3): 10 | messages.append(m) 11 | return messages 12 | 13 | def get_tasks(): 14 | t1 = { "name": "Task 1", "completed" : 40, "type": "success" } 15 | t2 = { "name": "Task 2", "completed" : 20, "type": "info" } 16 | t3 = { "name": "Task 3", "completed" : 60, "type": "warning" } 17 | t4 = { "name": "Task 4", "completed" : 80, "type": "danger" } 18 | 19 | return [t1, t2, t3, t4] 20 | 21 | def get_alerts(): 22 | 23 | a1 = { "title": "New Comment", "time" : 4, "type": "comment", "url": "#" } 24 | a2 = { "title": "3 New Followers", "time" : 12, "type": "twitter", "url": "#" } 25 | a3 = { "title": "Message Sent", "time" : 4, "type": "envelope", "url": "#" } 26 | a4 = { "title": "New Task", "time" : 4, "type": "tasks", "url": "#" } 27 | a5 = { "title": "Server Rebooted", "time" : 4, "type": "upload", "url": "#" } 28 | 29 | return [a1, a2, a3, a4, a5] 30 | 31 | def get_adv_tables(): 32 | columns = ["Rendering engine", "Browser", "Platform(s)", "Engine version", "CSS grade"] 33 | rows = [ 34 | ["Trident", "Internet Explorer 4.0", "Win 95+", "4", "X"], 35 | ["Trident", "Internet Explorer 5.0", "Win 95+", "5", "C"], 36 | ["Trident", "Internet Explorer 5.5", "Win 95+", "5.5", "A"], 37 | ["Trident", "Internet Explorer 6", "Win 98+", "6", "A"], 38 | ["Trident", "Internet Explorer 7", "Win XP SP2+", "7", "A"], 39 | ["Trident", "AOL browser (AOL desktop)", "Win XP", "6", "A"], 40 | ["Gecko", "Firefox 1.0", "Win 98+ / OSX.2+", "1.7", "A"], 41 | ["Gecko", "Firefox 1.5", "Win 98+ / OSX.2+", "1.8", "A"], 42 | ["Gecko", "Firefox 2.0", "Win 98+ / OSX.2+", "1.8", "A"], 43 | ["Gecko", "Firefox 3.0", "Win 2k+ / OSX.3+", "1.9", "A"], 44 | ["Gecko", "Camino 1.0", "OSX.2+", "1.8", "A"], 45 | ["Gecko", "Camino 1.5", "OSX.3+", "1.8", "A"], 46 | ["Gecko", "Netscape 7.2", "Win 95+ / Mac OS 8.6-9.2", "1.7", "A"], 47 | ["Gecko", "Netscape Browser 8", "Win 98SE+", "1.7", "A"], 48 | ["Gecko", "Netscape Navigator 9", "Win 98+ / OSX.2+", "1.8", "A"], 49 | ["Gecko", "Mozilla 1.0", "Win 95+ / OSX.1+", "1", "A"], 50 | ["Gecko", "Mozilla 1.1", "Win 95+ / OSX.1+", "1.1", "A"], 51 | ["Gecko", "Mozilla 1.2", "Win 95+ / OSX.1+", "1.2", "A"], 52 | ["Gecko", "Mozilla 1.3", "Win 95+ / OSX.1+", "1.3", "A"], 53 | ["Gecko", "Mozilla 1.4", "Win 95+ / OSX.1+", "1.4", "A"], 54 | ["Gecko", "Mozilla 1.5", "Win 95+ / OSX.1+", "1.5", "A"], 55 | ["Gecko", "Mozilla 1.6", "Win 95+ / OSX.1+", "1.6", "A"], 56 | ["Gecko", "Mozilla 1.7", "Win 98+ / OSX.1+", "1.7", "A"], 57 | ["Gecko", "Mozilla 1.8", "Win 98+ / OSX.1+", "1.8", "A"], 58 | ["Gecko", "Seamonkey 1.1", "Win 98+ / OSX.2+", "1.8", "A"], 59 | ["Gecko", "Epiphany 2.20", "Gnome", "1.8", "A"], 60 | ["Webkit", "Safari 1.2", "OSX.3", "125.5", "A"], 61 | ["Webkit", "Safari 1.3", "OSX.3", "312.8", "A"], 62 | ["Webkit", "Safari 2.0", "OSX.4+", "419.3", "A"], 63 | ["Webkit", "Safari 3.0", "OSX.4+", "522.1", "A"], 64 | ["Webkit", "OmniWeb 5.5", "OSX.4+", "420", "A"], 65 | ["Webkit", "iPod Touch / iPhone", "iPod", "420.1", "A"], 66 | ["Webkit", "S60", "S60", "413", "A"], 67 | ["Presto", "Opera 7.0", "Win 95+ / OSX.1+", "-", "A"], 68 | ["Presto", "Opera 7.5", "Win 95+ / OSX.2+", "-", "A"], 69 | ["Presto", "Opera 8.0", "Win 95+ / OSX.2+", "-", "A"], 70 | ["Presto", "Opera 8.5", "Win 95+ / OSX.2+", "-", "A"], 71 | ["Presto", "Opera 9.0", "Win 95+ / OSX.3+", "-", "A"], 72 | ["Presto", "Opera 9.2", "Win 88+ / OSX.3+", "-", "A"], 73 | ["Presto", "Opera 9.5", "Win 88+ / OSX.3+", "-", "A"], 74 | ["Presto", "Opera for Wii", "Wii", "-", "A"], 75 | ["Presto", "Nokia N800", "N800", "-", "A"], 76 | ["Presto", "Nintendo DS browser", "Nintendo DS", "8.5", "C/A"], 77 | ["KHTML", "Konqureror 3.1", "KDE 3.1", "3.1", "C"], 78 | ["KHTML", "Konqureror 3.3", "KDE 3.3", "3.3", "A"], 79 | ["KHTML", "Konqureror 3.5", "KDE 3.5", "3.5", "A"], 80 | ["Tasman", "Internet Explorer 4.5", "Mac OS 8-9", "-", "X"], 81 | ["Tasman", "Internet Explorer 5.1", "Mac OS 7.6-9", "1", "C"], 82 | ["Tasman", "Internet Explorer 5.2", "Mac OS 8-X", "1", "C"], 83 | ["Misc", "NetFront 3.1", "Embedded devices", "-", "C"], 84 | ["Misc", "NetFront 3.4", "Embedded devices", "-", "A"], 85 | ["Misc", "Dillo 0.8", "Embedded devices", "-", "X"], 86 | ["Misc", "Links", "Text only", "-", "X"], 87 | ["Misc", "Lynx", "Text only", "-", "X"], 88 | ["Misc", "IE Mobile", "Windows Mobile 6", "-", "C"], 89 | ["Misc", "PSP browser", "PSP", "-", "C"], 90 | ["Other browsers","All others","-","-","U"] 91 | ] 92 | 93 | return (columns, rows) 94 | 95 | def get_tables(): 96 | columns = ["#", "First Name", "Last Name", "Username"] 97 | rows = [ 98 | ["1", "Mark", "Otto", "@motto"], 99 | ["2", "Kaushik", "Raj", "@kaushikraj"], 100 | ["3", "Jacob", "Smith", "@jsmith"], 101 | ["4", "Bill", "Clinton", "@thestud"] 102 | ] 103 | context = [ 104 | "success", 105 | "info", 106 | "warning", 107 | "danger" 108 | ] 109 | 110 | return (columns, rows, context) 111 | 112 | def get_accordion_items(): 113 | t = "Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum." 114 | items = [ 115 | { "header" : "Collapsible Group Item #1", "text" : t }, 116 | { "header" : "Collapsible Group Item #2", "text" : t }, 117 | { "header" : "Collapsible Group Item #3", "text" : t }, 118 | { "header" : "Collapsible Group Item #4", "text" : t } 119 | ] 120 | 121 | return items 122 | 123 | def get_tab_items(): 124 | t = "Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum." 125 | items = [ 126 | { "tab": "Home", "title" : "Home Tab", "text" : t }, 127 | { "tab": "Profile", "title" : "Profile Tab", "text" : t }, 128 | { "tab": "Messages", "title" : "Messages Tab", "text" : t }, 129 | { "tab": "Settings", "title" : "Settings Tab", "text" : t }, 130 | ] 131 | 132 | return items -------------------------------------------------------------------------------- /templates/sb-admin/base.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | {% block title %}{% if admin_view.header %}{{ admin_view.header }} - {% endif %} {{ admin_view.admin.name }}{% endblock %} 5 | {% block head_meta %} 6 | 7 | 8 | 9 | 10 | 11 | {% endblock %} 12 | {% block head_css %} 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 31 | {% endblock %} 32 | {% block head %} 33 | {% endblock %} 34 | {% block head_tail %} 35 | {% endblock %} 36 | 37 | 38 | {% block page_body %} 39 | {% block body %}{% endblock %} 40 | {% endblock %} 41 | 42 | {% block tail_js %} 43 | 44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | 53 | 54 | {% endblock %} 55 | 56 | {% block tail %} 57 | {% endblock %} 58 | 59 | -------------------------------------------------------------------------------- /templates/sb-admin/loginbase.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | sb-admin-2 5 | {% block head_meta %} 6 | 7 | 8 | 9 | 10 | 11 | {% endblock %} 12 | {% block head_css %} 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 31 | {% endblock %} 32 | {% block head %} 33 | {% endblock %} 34 | {% block head_tail %} 35 | {% endblock %} 36 | 37 | 38 | {% block page_body %} 39 | {% block body %}{% endblock %} 40 | {% endblock %} 41 | 42 | {% block tail_js %} 43 | 44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | 53 | 54 | {% endblock %} 55 | 56 | {% block tail %} 57 | {% endblock %} 58 | 59 | -------------------------------------------------------------------------------- /templates/sb-admin/macros/dashboard/areachart.html: -------------------------------------------------------------------------------- 1 | {% macro area_chart(name) %} 2 |
3 |
4 | {{name}} 5 |
6 |
7 | 11 | 22 |
23 |
24 |
25 | 26 |
27 |
28 |
29 | 30 |
31 | {% endmacro %} -------------------------------------------------------------------------------- /templates/sb-admin/macros/dashboard/barchart.html: -------------------------------------------------------------------------------- 1 | {% macro bar_chart(name) %} 2 |
3 |
4 | Bar Chart Example 5 |
6 |
7 | 11 | 22 |
23 |
24 |
25 | 26 |
27 |
28 |
29 |
30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | 53 | 54 | 55 | 56 | 57 | 58 | 59 | 60 | 61 | 62 | 63 | 64 | 65 | 66 | 67 | 68 | 69 | 70 | 71 | 72 | 73 | 74 | 75 | 76 | 77 | 78 | 79 | 80 | 81 | 82 | 83 | 84 | 85 | 86 | 87 | 88 | 89 |
#DateTimeAmount
332610/21/20133:29 PM$321.33
332510/21/20133:20 PM$234.34
332410/21/20133:03 PM$724.17
332310/21/20133:00 PM$23.71
332210/21/20132:49 PM$8345.23
332110/21/20132:23 PM$245.12
332010/21/20132:15 PM$5663.54
331910/21/20132:13 PM$943.45
90 |
91 | 92 |
93 | 94 |
95 |
96 |
97 | 98 |
99 | 100 |
101 | 102 |
103 | {% endmacro %} -------------------------------------------------------------------------------- /templates/sb-admin/macros/dashboard/chat.html: -------------------------------------------------------------------------------- 1 | {% macro chat(title) %} 2 |
3 |
4 | 5 | {{title}} 6 |
7 | 10 | 38 |
39 |
40 | 41 |
42 |
    43 |
  • 44 | 45 | User Avatar 46 | 47 |
    48 |
    49 | Jack Sparrow 50 | 51 | 12 mins ago 52 | 53 |
    54 |

    55 | Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur bibendum ornare dolor, quis ullamcorper ligula sodales. 56 |

    57 |
    58 |
    • 59 |
  • 60 | 61 | User Avatar 62 | 63 |
    64 |
    65 | 66 | 13 mins ago 67 | Bhaumik Patel 68 |
    69 |

    70 | Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur bibendum ornare dolor, quis ullamcorper ligula sodales. 71 |

    72 |
    73 |
    • 74 |
  • 75 | 76 | User Avatar 77 | 78 |
    79 |
    80 | Jack Sparrow 81 | 82 | 14 mins ago 83 |
    84 |

    85 | Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur bibendum ornare dolor, quis ullamcorper ligula sodales. 86 |

    87 |
    88 |
    • 89 |
  • 90 | 91 | User Avatar 92 | 93 |
    94 |
    95 | 96 | 15 mins ago 97 | Bhaumik Patel 98 |
    99 |

    100 | Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur bibendum ornare dolor, quis ullamcorper ligula sodales. 101 |

    102 |
    103 |
    • 104 |
105 |
106 | 107 |
108 |
109 | 110 | 111 | 114 | 115 |
116 |
117 | 118 |
119 | 120 | {% endmacro %} -------------------------------------------------------------------------------- /templates/sb-admin/macros/dashboard/counticon.html: -------------------------------------------------------------------------------- 1 | {% macro count_icon(count, title, icontype, color, url) %} 2 |
3 |
4 |
5 |
6 | 7 |
8 |
9 |
{{count}}
10 |
{{title}}
11 |
12 |
13 |
14 | 15 |
16 | View Details 17 | 18 |
19 |
20 | 21 |
22 | {% endmacro %} -------------------------------------------------------------------------------- /templates/sb-admin/macros/dashboard/donut.html: -------------------------------------------------------------------------------- 1 | {% macro donut(title) %} 2 |
3 |
4 | {{title}} 5 |
6 |
7 |
8 | View Details 9 |
10 | 11 |
12 | {% endmacro %} -------------------------------------------------------------------------------- /templates/sb-admin/macros/dashboard/notification.html: -------------------------------------------------------------------------------- 1 | {% macro notification(title) %} 2 |
3 |
4 | {{title}} 5 |
6 |
7 |
8 | 9 | New Comment 10 | 4 minutes ago 11 | 12 | 13 | 14 | 3 New Followers 15 | 12 minutes ago 16 | 17 | 18 | 19 | Message Sent 20 | 27 minutes ago 21 | 22 | 23 | 24 | New Task 25 | 43 minutes ago 26 | 27 | 28 | 29 | Server Rebooted 30 | 11:32 AM 31 | 32 | 33 | 34 | Server Crashed! 35 | 11:13 AM 36 | 37 | 38 | 39 | Server Not Responding 40 | 10:57 AM 41 | 42 | 43 | 44 | New Order Placed 45 | 9:49 AM 46 | 47 | 48 | 49 | Payment Received 50 | Yesterday 51 | 52 | 53 |
54 | 55 | View All Alerts 56 |
57 | 58 |
59 | {% endmacro %} -------------------------------------------------------------------------------- /templates/sb-admin/macros/dashboard/timeline.html: -------------------------------------------------------------------------------- 1 | {% macro timeline(title) %} 2 | 3 |
4 |
5 | {{title}} 6 |
7 | 8 |
9 |
    10 |
  • 11 |
    12 |
    13 |
    14 |
    15 |

    Lorem ipsum dolor

    16 |

    11 hours ago via Twitter 17 |

    18 |
    19 |
    20 |

    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Libero laboriosam dolor perspiciatis omnis exercitationem. Beatae, officia pariatur? Est cum veniam excepturi. Maiores praesentium, porro voluptas suscipit facere rem dicta, debitis.

    21 |
    22 |
    23 |
    • 24 |
  • 25 |
    26 |
    27 |
    28 |
    29 |

    Lorem ipsum dolor

    30 |
    31 |
    32 |

    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Autem dolorem quibusdam, tenetur commodi provident cumque magni voluptatem libero, quis rerum. Fugiat esse debitis optio, tempore. Animi officiis alias, officia repellendus.

    33 |

    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Laudantium maiores odit qui est tempora eos, nostrum provident explicabo dignissimos debitis vel! Adipisci eius voluptates, ad aut recusandae minus eaque facere.

    34 |
    35 |
    36 |
    • 37 |
  • 38 |
    39 |
    40 |
    41 |
    42 |

    Lorem ipsum dolor

    43 |
    44 |
    45 |

    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Repellendus numquam facilis enim eaque, tenetur nam id qui vel velit similique nihil iure molestias aliquam, voluptatem totam quaerat, magni commodi quisquam.

    46 |
    47 |
    48 |
    • 49 |
  • 50 |
    51 |
    52 |

    Lorem ipsum dolor

    53 |
    54 |
    55 |

    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Voluptates est quaerat asperiores sapiente, eligendi, nihil. Itaque quos, alias sapiente rerum quas odit! Aperiam officiis quidem delectus libero, omnis ut debitis!

    56 |
    57 |
    58 |
    • 59 |
  • 60 |
    61 |
    62 |
    63 |
    64 |

    Lorem ipsum dolor

    65 |
    66 |
    67 |

    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nobis minus modi quam ipsum alias at est molestiae excepturi delectus nesciunt, quibusdam debitis amet, beatae consequuntur impedit nulla qui! Laborum, atque.

    68 |
    69 |
    70 | 73 | 84 |
    85 |
    86 |
    87 |
    • 88 |
  • 89 |
    90 |
    91 |

    Lorem ipsum dolor

    92 |
    93 |
    94 |

    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sequi fuga odio quibusdam. Iure expedita, incidunt unde quis nam! Quod, quisquam. Officia quam qui adipisci quas consequuntur nostrum sequi. Consequuntur, commodi.

    95 |
    96 |
    97 |
    • 98 |
  • 99 |
    100 |
    101 |
    102 |
    103 |

    Lorem ipsum dolor

    104 |
    105 |
    106 |

    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Deserunt obcaecati, quaerat tempore officia voluptas debitis consectetur culpa amet, accusamus dolorum fugiat, animi dicta aperiam, enim incidunt quisquam maxime neque eaque.

    107 |
    108 |
    109 |
    • 110 |
111 |
112 | 113 |
114 | {% endmacro %} -------------------------------------------------------------------------------- /templates/sb-admin/macros/flot/barchart.html: -------------------------------------------------------------------------------- 1 | {% macro flot_bar_chart(header) %} 2 | 3 |
4 |
5 | {{ header }} 6 |
7 |
8 |
9 |
10 |
11 |
12 |
13 | 14 | {% endmacro %} -------------------------------------------------------------------------------- /templates/sb-admin/macros/flot/linechart.html: -------------------------------------------------------------------------------- 1 | {% macro flot_line_chart(header) %} 2 |
3 |
4 | {{ header }} 5 |
6 |
7 |
8 |
9 |
10 |
11 |
12 | {% endmacro %} -------------------------------------------------------------------------------- /templates/sb-admin/macros/flot/movinglinechart.html: -------------------------------------------------------------------------------- 1 | {% macro flot_movingline_chart(header) %} 2 |
3 |
4 | {{ header }} 5 |
6 |
7 |
8 |
9 |
10 |
11 |
12 | {% endmacro %} -------------------------------------------------------------------------------- /templates/sb-admin/macros/flot/multiaxeschart.html: -------------------------------------------------------------------------------- 1 | {% macro flot_multiaxes_chart(header) %} 2 |
3 |
4 | {{header}} 5 |
6 |
7 |
8 |
9 |
10 |
11 |
12 | {% endmacro %} -------------------------------------------------------------------------------- /templates/sb-admin/macros/flot/piechart.html: -------------------------------------------------------------------------------- 1 | {% macro flot_pie_chart(header) %} 2 |
3 |
4 | {{header}} 5 |
6 |
7 |
8 |
9 |
10 |
11 |
12 | {% endmacro %} -------------------------------------------------------------------------------- /templates/sb-admin/macros/morris/areachart.html: -------------------------------------------------------------------------------- 1 | {% macro area_chart(header) %} 2 |
3 |
4 | {{header}} 5 |
6 |
7 |
8 |
9 |
10 | {% endmacro %} -------------------------------------------------------------------------------- /templates/sb-admin/macros/morris/barchart.html: -------------------------------------------------------------------------------- 1 | {% macro bar_chart(header) %} 2 |
3 |
4 | {{header}} 5 |
6 |
7 |
8 |
9 |
10 | {% endmacro %} -------------------------------------------------------------------------------- /templates/sb-admin/macros/morris/donutchart.html: -------------------------------------------------------------------------------- 1 | 2 | {% macro donut_chart(header) %} 3 |
4 |
5 | {{header}} 6 |
7 |
8 |
9 |
10 |
11 | {% endmacro %} -------------------------------------------------------------------------------- /templates/sb-admin/macros/morris/linechart.html: -------------------------------------------------------------------------------- 1 | {% macro line_chart(header) %} 2 |
3 |
4 | {{header}} 5 |
6 |
7 |
8 |
9 |
10 | {% endmacro %} -------------------------------------------------------------------------------- /templates/sb-admin/macros/navlink.html: -------------------------------------------------------------------------------- 1 | {% macro nav_link(name, url, active) %} 2 |
  • 3 | {% if name == active %} 4 | {{ name }} 5 | {% else %} 6 | {{ name }} 7 | {% endif %} 8 |
    • 9 | {% endmacro %} -------------------------------------------------------------------------------- /templates/sb-admin/macros/tables/advtable.html: -------------------------------------------------------------------------------- 1 | {% macro adv_table(header, columns, rows) %} 2 |
    3 |
    4 | {{header}} 5 |
    6 | 7 |
    8 |
    9 | 10 | 11 | 12 | {% for c in columns %} 13 | 14 | {% endfor %} 15 | 16 | 17 | 18 | {% for r in rows %} 19 | {% set c = "odd" %} 20 | {% set grade = "gradeX" %} 21 | {% if loop.index % 2 == 1 %} 22 | {% set c = "even" %} 23 | {% endif %} 24 | 25 | {% for d in r %} 26 | 27 | {% endfor %} 28 | 29 | {% endfor %} 30 | 31 | 32 |
    {{c}}
    {{d}}
    33 |
    34 | 35 |
    36 |

    DataTables Usage Information

    37 |

    DataTables is a very flexible, advanced tables plugin for jQuery. In SB Admin, we are using a specialized version of DataTables built for Bootstrap 3. We have also customized the table headings to use Font Awesome icons in place of images. For complete documentation on DataTables, visit their website at https://datatables.net/.

    38 | View DataTables Documentation 39 |
    40 |
    41 | 42 |
    43 | 44 | {% endmacro %} -------------------------------------------------------------------------------- /templates/sb-admin/macros/tables/table.html: -------------------------------------------------------------------------------- 1 | {% macro table(header, columns, rows, tabletype, context = None) %} 2 | {% set c = "table" %} 3 | {% if tabletype == "sink" %} 4 | {% set c = "table table-striped table-bordered table-hover" %} 5 | {% endif %} 6 | {% if tabletype == "striped" %} 7 | {% set c = "table table-striped" %} 8 | {% endif %} 9 | {% if tabletype == "hover" %} 10 | {% set c = "table table-hover" %} 11 | {% endif %} 12 | {% set tc = "table-responsive" %} 13 | {% if tabletype == "bordered" %} 14 | {% set tc = "table-responsive table-bordered" %} 15 | {% endif %} 16 |
    17 |
    18 | {{header}} 19 |
    20 | 21 |
    22 |
    23 | 24 | 25 | 26 | {% for col in columns %} 27 | 28 | {% endfor %} 29 | 30 | 31 | 32 | {% for row in rows %} 33 | = loop.index %} class="{{context[loop.index-1]}}" {% endif%}> 34 | {% for d in row %} 35 | 36 | {% endfor %} 37 | 38 | {% endfor %} 39 | 40 |
    {{col}}
    {{d}}
    41 |
    42 | 43 |
    44 | 45 |
    46 | 47 | {% endmacro %} -------------------------------------------------------------------------------- /templates/sb-admin/macros/topnav/alert.html: -------------------------------------------------------------------------------- 1 | {% macro alert(title, type, time, url) %} 2 | 3 |
    4 | {{title}} 5 | {{time}} minutes ago 6 |
    7 |     8 | {% endmacro %} -------------------------------------------------------------------------------- /templates/sb-admin/macros/topnav/messagesummary.html: -------------------------------------------------------------------------------- 1 | {% macro message_summary(receivedon, from, text, url)%} 2 |
  • 3 | 4 |
    5 | {{from}} 6 | 7 | {{receivedon}} 8 | 9 |
    10 |
    {{text}}
    11 |     12 |
    • 13 | {% endmacro %} -------------------------------------------------------------------------------- /templates/sb-admin/macros/topnav/tasksummary.html: -------------------------------------------------------------------------------- 1 | {% macro task_summary(name, type, completed, url) %} 2 | 3 |
    4 |

    5 | {{name}} 6 | {{completed}}% Complete 7 |

    8 |
    9 |
    10 | {{completed}}% Complete ({{type}}) 11 |
    12 |
    13 |
    14 |     15 | {% endmacro %} -------------------------------------------------------------------------------- /templates/sb-admin/macros/ui/notifications/alert.html: -------------------------------------------------------------------------------- 1 | {% macro alert(type, text) %} 2 |
    3 | {{text|safe}} 4 |
    5 | {% endmacro %} -------------------------------------------------------------------------------- /templates/sb-admin/macros/ui/notifications/dismissablealert.html: -------------------------------------------------------------------------------- 1 | {% macro dismissable_alert(type, text) %} 2 |
    3 | 4 | {{text|safe}} 5 |
    6 | {% endmacro %} -------------------------------------------------------------------------------- /templates/sb-admin/macros/ui/panels/accordion.html: -------------------------------------------------------------------------------- 1 | {% macro accordion(header, items) %} 2 |
    3 |
    4 | {{header}} 5 |
    6 |
    7 |
    8 | {% for item in items %} 9 | {% set id="collapse" + loop.index|string %} 10 | {% set in="" %} 11 | {% if loop.index == 1 %} 12 | {% set in="in" %} 13 | {% endif %} 14 |
    15 |
    16 |

    17 | {{item.header}} 18 |

    19 |
    20 |
    21 |
    22 | {{item.text}} 23 |
    24 |
    25 |
    26 | {% endfor %} 27 |
    28 |
    29 |
    30 | {% endmacro %} -------------------------------------------------------------------------------- /templates/sb-admin/macros/ui/panels/panel.html: -------------------------------------------------------------------------------- 1 | {% macro panel(paneltype, header, text, footer) %} 2 |
    3 |
    4 | {{header}} 5 |
    6 |
    7 |

    {{text}}

    8 |
    9 |
    10 | {{footer}} 11 |
    12 |
    13 | {% endmacro %} -------------------------------------------------------------------------------- /templates/sb-admin/macros/ui/panels/tab.html: -------------------------------------------------------------------------------- 1 | {% macro tab(id, tabtype, header, items) %} 2 |
    3 |
    4 | {{header}} 5 |
    6 | 7 |
    8 | 9 |
      10 | {% for item in items %} 11 | {% set hrefid="tabitem" + loop.index|string %} 12 | {% set active="" %} 13 | {% if loop.index == 1 %} 14 | {% set active="active" %} 15 | {% endif %} 16 |
    • {{item.tab}} 17 | {% endfor %} 18 |
    19 | 20 |
    21 | {% for item in items %} 22 | {% set hrefid="tabitem" + loop.index|string %} 23 | {% set inactive="" %} 24 | {% if loop.index == 1 %} 25 | {% set inactive="in active" %} 26 | {% endif %} 27 |
    28 |

    {{item.title}}

    29 |

    {{item.text}}

    30 |
    31 | {% endfor %} 32 |
    33 | 34 |
    35 |
    36 | 37 | {% endmacro %} -------------------------------------------------------------------------------- /templates/sb-admin/macros/ui/panels/well.html: -------------------------------------------------------------------------------- 1 | {% macro well(type, title, text) %} 2 |
    3 |

    {{title}}

    4 |

    {{text}}

    5 |
    6 | {% endmacro %} -------------------------------------------------------------------------------- /templates/sb-admin/master.html: -------------------------------------------------------------------------------- 1 | {% from "sb-admin/nav.html" import nav_bar with context %} 2 | {% extends 'sb-admin/base.html' %} 3 | 4 | {% block page_body %} 5 | 6 |
    7 | 8 | {{nav_bar(admin_view.header)}} 9 | 10 |
    11 |
    12 |
    13 |

    {{admin_view.header}}

    14 |
    15 | 16 |
    17 | {% block body %}{% endblock %} 18 |
    19 |
    20 | {% endblock %} -------------------------------------------------------------------------------- /templates/sb-admin/nav.html: -------------------------------------------------------------------------------- 1 | {% from "sb-admin/macros/navlink.html" import nav_link with context %} 2 | {% from "sb-admin/macros/topnav/messagesummary.html" import message_summary with context %} 3 | {% from "sb-admin/macros/topnav/tasksummary.html" import task_summary with context %} 4 | {% from "sb-admin/macros/topnav/alert.html" import alert with context %} 5 | 6 | {% macro nav_bar(name) %} 7 | 8 | 192 | {% endmacro %} -------------------------------------------------------------------------------- /templates/sb-admin/pages/blank.html: -------------------------------------------------------------------------------- 1 | 2 | {% extends "sb-admin/master.html" %} 3 | 4 | {% block body %} 5 | {% endblock %} -------------------------------------------------------------------------------- /templates/sb-admin/pages/dashboard.html: -------------------------------------------------------------------------------- 1 | 2 | {% extends "sb-admin/master.html" %} 3 | 4 | {% from "sb-admin/macros/dashboard/counticon.html" import count_icon %} 5 | {% from "sb-admin/macros/dashboard/areachart.html" import area_chart %} 6 | {% from "sb-admin/macros/dashboard/barchart.html" import bar_chart %} 7 | {% from "sb-admin/macros/dashboard/timeline.html" import timeline %} 8 | {% from "sb-admin/macros/dashboard/notification.html" import notification %} 9 | {% from "sb-admin/macros/dashboard/donut.html" import donut %} 10 | {% from "sb-admin/macros/dashboard/chat.html" import chat %} 11 | 12 | {% block body %} 13 |
    14 |
    15 | {{count_icon(26, "New Comments!", "comments", "primary", "#")}} 16 |
    17 |
    18 | {{count_icon(12, "New Tasks!", "tasks", "green", "#")}} 19 |
    20 |
    21 | {{count_icon(124, "New Orders!", "shopping-cart", "yellow", "#")}} 22 |
    23 |
    24 | {{count_icon(13, "Support Tickets!", "support", "red", "#")}} 25 |
    26 |
    27 | 28 |
    29 |
    30 | {{area_chart("Area Chart Example")}} 31 | {{bar_chart("Bar Chart Example")}} 32 | {{timeline("Responsive Timeline")}} 33 |
    34 |
    35 | {{notification("Notifications Panel")}} 36 | {{donut("Donut Chart Example")}} 37 | {{chat("Chat")}} 38 |
    39 |
    40 | 41 | {% endblock %} 42 | 43 | {% block tail %} 44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | {% endblock %} -------------------------------------------------------------------------------- /templates/sb-admin/pages/flot.html: -------------------------------------------------------------------------------- 1 | {% from "sb-admin/macros/flot/linechart.html" import flot_line_chart %} 2 | {% from "sb-admin/macros/flot/piechart.html" import flot_pie_chart %} 3 | {% from "sb-admin/macros/flot/multiaxeschart.html" import flot_multiaxes_chart %} 4 | {% from "sb-admin/macros/flot/movinglinechart.html" import flot_movingline_chart %} 5 | {% from "sb-admin/macros/flot/barchart.html" import flot_bar_chart %} 6 | 7 | 8 | {% extends "sb-admin/master.html" %} 9 | 10 | {% block body %} 11 |
    12 |
    13 | {{flot_line_chart(header="Line Chart Example")}} 14 |
    15 |
    16 | {{flot_pie_chart(header="Pie Chart Example")}} 17 |
    18 |
    19 | {{flot_multiaxes_chart(header="Multiple Axes Line Chart Example")}} 20 |
    21 |
    22 | {{flot_movingline_chart(header="Moving Line Chart Example")}} 23 |
    24 |
    25 | {{flot_bar_chart(header="Bar Chart Example")}} 26 |
    27 |
    28 |
    29 |
    30 | Flot Charts Usage 31 |
    32 |
    33 |

    Flot is a pure JavaScript plotting library for jQuery, with a focus on simple usage, attractive looks, and interactive features. In SB Admin, we are using the most recent version of Flot along with a few plugins to enhance the user experience. The Flot plugins being used are the tooltip plugin for hoverable tooltips, and the resize plugin for fully responsive charts. The documentation for Flot Charts is available on their website, http://www.flotcharts.org/.

    34 | View Flot Charts Documentation 35 |
    36 |
    37 |
    38 |
    39 | {% endblock %} 40 | 41 | {% block tail %} 42 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | 50 | {% endblock %} -------------------------------------------------------------------------------- /templates/sb-admin/pages/forms.html: -------------------------------------------------------------------------------- 1 | 2 | {% extends "sb-admin/master.html" %} 3 | 4 | {% block body %} 5 |
    6 |
    7 |
    8 |
    9 | Basic Form Elements 10 |
    11 |
    12 |
    13 |
    14 |
    15 |
    16 | 17 | 18 |

    Example block-level help text here.

    19 |
    20 |
    21 | 22 | 23 |
    24 |
    25 | 26 |

    email@example.com

    27 |
    28 |
    29 | 30 | 31 |
    32 |
    33 | 34 | 35 |
    36 |
    37 | 38 |
    39 | 42 |
    43 |
    44 | 47 |
    48 |
    49 | 52 |
    53 |
    54 |
    55 | 56 | 59 | 62 | 65 |
    66 |
    67 | 68 |
    69 | 72 |
    73 |
    74 | 77 |
    78 |
    79 | 82 |
    83 |
    84 |
    85 | 86 | 89 | 92 | 95 |
    96 |
    97 | 98 | 105 |
    106 |
    107 | 108 | 115 |
    116 | 117 | 118 |
    119 |
    120 | 121 |
    122 |

    Disabled Form States

    123 |
    124 |
    125 |
    126 | 127 | 128 |
    129 |
    130 | 131 | 134 |
    135 |
    136 | 139 |
    140 | 141 |
    142 |
    143 |

    Form Validation States

    144 |
    145 |
    146 | 147 | 148 |
    149 |
    150 | 151 | 152 |
    153 |
    154 | 155 | 156 |
    157 |
    158 |

    Input Groups

    159 |
    160 |
    161 | @ 162 | 163 |
    164 |
    165 | 166 | .00 167 |
    168 |
    169 | 170 | 171 | 172 |
    173 |
    174 | $ 175 | 176 | .00 177 |
    178 |
    179 | 180 | 181 | 183 | 184 |
    185 |
    186 |
    187 | 188 |
    189 | 190 |
    191 | 192 |
    193 | 194 |
    195 | 196 |
    197 | 198 | {% endblock %} -------------------------------------------------------------------------------- /templates/sb-admin/pages/login.html: -------------------------------------------------------------------------------- 1 | 2 | {% extends "sb-admin/loginbase.html" %} 3 | 4 | {% block body %} 5 |
    6 |
    7 |
    8 | 33 |
    34 |
    35 |
    36 | {% endblock %} 37 | -------------------------------------------------------------------------------- /templates/sb-admin/pages/morris.html: -------------------------------------------------------------------------------- 1 | {% from "sb-admin/macros/morris/areachart.html" import area_chart %} 2 | {% from "sb-admin/macros/morris/barchart.html" import bar_chart %} 3 | {% from "sb-admin/macros/morris/linechart.html" import line_chart %} 4 | {% from "sb-admin/macros/morris/donutchart.html" import donut_chart %} 5 | 6 | 7 | {% extends "sb-admin/master.html" %} 8 | 9 | {% block body %} 10 |
    11 |
    12 | {{area_chart("Area Chart Example")}} 13 |
    14 |
    15 | {{bar_chart("Bar Chart Example")}} 16 |
    17 |
    18 | {{line_chart("Line Chart Example")}} 19 |
    20 |
    21 | {{donut_chart("Donut Chart Example")}} 22 |
    23 |
    24 |
    25 |
    26 | Morris.js Usage 27 |
    28 | 29 |
    30 |

    Morris.js is a jQuery based charting plugin created by Olly Smith. In SB Admin, we are using the most recent version of Morris.js which includes the resize function, which makes the charts fully responsive. The documentation for Morris.js is available on their website, http://morrisjs.github.io/morris.js/.

    31 | View Morris.js Documentation 32 |
    33 | 34 |
    35 | 36 |
    37 | 38 |
    39 | {% endblock %} 40 | 41 | {% block tail %} 42 | 43 | 44 | 45 | 46 | 47 | 48 | {% endblock %} -------------------------------------------------------------------------------- /templates/sb-admin/pages/tables.html: -------------------------------------------------------------------------------- 1 | {% from "sb-admin/macros/tables/advtable.html" import adv_table %} 2 | {% from "sb-admin/macros/tables/table.html" import table %} 3 | 4 | {% extends "sb-admin/master.html" %} 5 | 6 | {% block body %} 7 |
    8 |
    9 | {{adv_table("DataTables Advanced Tables", admin_view.tables.advtables.columns, admin_view.tables.advtables.rows)}} 10 |
    11 |
    12 | 13 |
    14 |
    15 | {{table("Kitchen Sink", admin_view.tables.table.columns, admin_view.tables.table.rows, "sink")}} 16 |
    17 |
    18 | {{table("Basic Table", admin_view.tables.table.columns, admin_view.tables.table.rows, "basic")}} 19 |
    20 |
    21 | 22 |
    23 |
    24 | {{table("Striped Rows", admin_view.tables.table.columns, admin_view.tables.table.rows, "striped")}} 25 |
    26 |
    27 | {{table("Bordered Table", admin_view.tables.table.columns, admin_view.tables.table.rows, "bordered")}} 28 |
    29 |
    30 | 31 |
    32 |
    33 | {{table("Hover Rows", admin_view.tables.table.columns, admin_view.tables.table.rows, "hover")}} 34 |
    35 |
    36 | {{table("Context Classes", admin_view.tables.table.columns, admin_view.tables.table.rows, "simple", admin_view.tables.table.context)}} 37 |
    38 |
    39 | 40 | {% endblock %} 41 | 42 | {% block tail %} 43 | 44 | 45 | 46 | 47 | 48 | 49 | 56 | 57 | {% endblock %} -------------------------------------------------------------------------------- /templates/sb-admin/pages/ui/buttons.html: -------------------------------------------------------------------------------- 1 | 2 | {% extends "sb-admin/master.html" %} 3 | 4 | {% block body %} 5 |
    6 |
    7 |
    8 |
    9 | Default Buttons 10 |
    11 | 12 |
    13 |

    Normal Buttons

    14 |

    15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 |

    23 |
    24 |

    Disabled Buttons

    25 |

    26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 |

    34 |
    35 |

    Button Sizes

    36 |

    37 | 38 | 39 | 40 | 41 |
    42 |
    43 | 44 |

    45 |
    46 | 47 |
    48 | 49 |
    50 |
    51 | Circle Icon Buttons with Font Awesome Icons 52 |
    53 | 54 |
    55 |

    Normal Circle Buttons

    56 | 58 | 60 | 62 | 64 | 66 | 68 |
    69 |
    70 |

    Large Circle Buttons

    71 | 73 | 75 | 77 | 79 | 81 | 83 |
    84 |
    85 |

    Extra Large Circle Buttons

    86 | 88 | 90 | 92 | 94 | 96 | 98 |
    99 | 100 |
    101 | 102 |
    103 | 104 |
    105 |
    106 |
    107 | Outline Buttons with Smooth Transition 108 |
    109 | 110 |
    111 |

    Outline Buttons

    112 |

    113 | 114 | 115 | 116 | 117 | 118 | 119 | 120 |

    121 |
    122 |

    Outline Button Sizes

    123 |

    124 | 125 | 126 | 127 | 128 |
    129 |
    130 | 131 |

    132 |
    133 | 134 |
    135 | 136 |
    137 |
    138 | Social Buttons with Font Awesome Icons 139 |
    140 | 141 |
    142 |

    Social Buttons

    143 | 144 | Sign in with Bitbucket 145 | 146 | 147 | Sign in with Dropbox 148 | 149 | 150 | Sign in with Facebook 151 | 152 | 153 | Sign in with Flickr 154 | 155 | 156 | Sign in with GitHub 157 | 158 | 159 | Sign in with Google 160 | 161 | 162 | Sign in with Instagram 163 | 164 | 165 | Sign in with LinkedIn 166 | 167 | 168 | Sign in with Pinterest 169 | 170 | 171 | Sign in with Tumblr 172 | 173 | 174 | Sign in with Twitter 175 | 176 | 177 | Sign in with VK 178 | 179 | 180 |
    181 | 182 |
    183 | 184 | 185 | 186 | 187 | 188 | 189 | 190 | 191 | 192 | 193 | 194 | 195 |
    196 |
    197 | 198 |
    199 | 200 |
    201 | 202 |
    203 | 204 | {% endblock %} -------------------------------------------------------------------------------- /templates/sb-admin/pages/ui/grid.html: -------------------------------------------------------------------------------- 1 | 2 | {% extends "sb-admin/master.html" %} 3 | 4 | {% block body %} 5 |
    6 |
    7 |
    8 |
    9 |

    Grid options

    10 |

    See how aspects of the Bootstrap grid system work across multiple devices with a handy table.

    11 |
    12 | 13 | 14 | 15 | 16 | 20 | 24 | 28 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | 52 | 55 | 58 | 61 | 62 | 63 | 64 | 65 | 66 | 67 | 68 | 69 | 70 | 71 | 72 | 73 | 74 | 75 | 76 | 77 | 78 | 79 | 80 | 81 | 82 | 83 | 84 | 85 | 86 | 87 | 88 | 89 | 90 |
    17 | Extra small devices 18 | Phones (<768px) 19 | 21 | Small devices 22 | Tablets (≥768px) 23 | 25 | Medium devices 26 | Desktops (≥992px) 27 | 29 | Large devices 30 | Desktops (≥1200px) 31 |
    Grid behaviorHorizontal at all timesCollapsed to start, horizontal above breakpoints
    Max container widthNone (auto)750px970px1170px
    Class prefix 50 | .col-xs- 51 | 53 | .col-sm- 54 | 56 | .col-md- 57 | 59 | .col-lg- 60 |
    # of columns12
    Max column widthAuto60px78px95px
    Gutter width30px (15px on each side of a column)
    NestableYes
    OffsetsYes
    Column orderingYes
    91 |
    92 |

    Grid classes apply to devices with screen widths greater than or equal to the breakpoint sizes, and override grid classes targeted at smaller devices. Therefore, applying any 93 | .col-md- class to an element will not only affect its styling on medium devices but also on large devices if a 94 | .col-lg- class is not present.

    95 |
    96 |
    97 |
    98 | 99 |
    100 | 101 | 102 |
    103 |
    104 |
    105 |
    106 |

    Example: Stacked-to-horizontal

    107 |

    Using a single set of 108 | .col-md-* grid classes, you can create a default grid system that starts out stacked on mobile devices and tablet devices (the extra small to small range) before becoming horizontal on desktop (medium) devices. Place grid columns in any 109 | .row.

    110 |
    111 |
    .col-md-1
    112 |
    .col-md-1
    113 |
    .col-md-1
    114 |
    .col-md-1
    115 |
    .col-md-1
    116 |
    .col-md-1
    117 |
    .col-md-1
    118 |
    .col-md-1
    119 |
    .col-md-1
    120 |
    .col-md-1
    121 |
    .col-md-1
    122 |
    .col-md-1
    123 |
    124 |
    125 |
    .col-md-8
    126 |
    .col-md-4
    127 |
    128 |
    129 |
    .col-md-4
    130 |
    .col-md-4
    131 |
    .col-md-4
    132 |
    133 |
    134 |
    .col-md-6
    135 |
    .col-md-6
    136 |
    137 |
    138 |
    139 |
    140 | 141 |
    142 | 143 | 144 |
    145 |
    146 |
    147 |
    148 |

    Example: Mobile and desktop

    149 |

    Don't want your columns to simply stack in smaller devices? Use the extra small and medium device grid classes by adding 150 | .col-xs-* 151 | .col-md-* to your columns. See the example below for a better idea of how it all works.

    152 |
    153 |
    .col-xs-12 .col-md-8
    154 |
    .col-xs-6 .col-md-4
    155 |
    156 |
    157 |
    .col-xs-6 .col-md-4
    158 |
    .col-xs-6 .col-md-4
    159 |
    .col-xs-6 .col-md-4
    160 |
    161 |
    162 |
    .col-xs-6
    163 |
    .col-xs-6
    164 |
    165 |
    166 |
    167 |
    168 | 169 |
    170 | 171 | 172 |
    173 |
    174 |
    175 |
    176 |

    Example: Mobile, tablet, desktops

    177 |

    Build on the previous example by creating even more dynamic and powerful layouts with tablet 178 | .col-sm-* classes.

    179 |
    180 |
    .col-xs-12 .col-sm-6 .col-md-8
    181 |
    .col-xs-6 .col-md-4
    182 |
    183 |
    184 |
    .col-xs-6 .col-sm-4
    185 |
    .col-xs-6 .col-sm-4
    186 | 187 |
    188 |
    .col-xs-6 .col-sm-4
    189 |
    190 |
    191 |
    192 |
    193 | 194 |
    195 | 196 | 197 |
    198 |
    199 |
    200 |
    201 |

    Responsive column resets

    202 |

    With the four tiers of grids available you're bound to run into issues where, at certain breakpoints, your columns don't clear quite right as one is taller than the other. To fix that, use a combination of a 203 | .clearfix and our responsive utility classes.

    204 |
    205 |
    206 | .col-xs-6 .col-sm-3 207 |
    Resize your viewport or check it out on your phone for an example. 208 |
    209 |
    .col-xs-6 .col-sm-3
    210 | 211 | 212 |
    213 | 214 |
    .col-xs-6 .col-sm-3
    215 |
    .col-xs-6 .col-sm-3
    216 |
    217 |
    218 |
    219 |
    220 | 221 |
    222 | 223 | 224 |
    225 |
    226 |
    227 |
    228 |

    Offsetting columns

    229 |

    Move columns to the right using 230 | .col-md-offset-* classes. These classes increase the left margin of a column by 231 | * columns. For example, 232 | .col-md-offset-4 moves 233 | .col-md-4 over four columns.

    234 |
    235 |
    .col-md-4
    236 |
    .col-md-4 .col-md-offset-4
    237 |
    238 |
    239 |
    .col-md-3 .col-md-offset-3
    240 |
    .col-md-3 .col-md-offset-3
    241 |
    242 |
    243 |
    .col-md-6 .col-md-offset-3
    244 |
    245 |
    246 |
    247 |
    248 | 249 |
    250 | 251 | 252 |
    253 |
    254 |
    255 |
    256 |

    Nesting columns

    257 |

    To nest your content with the default grid, add a new 258 | .row and set of 259 | .col-md-* columns within an existing 260 | .col-md-* column. Nested rows should include a set of columns that add up to 12.

    261 |
    262 |
    263 | Level 1: .col-md-9 264 |
    265 |
    266 | Level 2: .col-md-6 267 |
    268 |
    269 | Level 2: .col-md-6 270 |
    271 |
    272 |
    273 |
    274 |
    275 |
    276 |
    277 | 278 |
    279 | 280 | 281 |
    282 |
    283 |
    284 |
    285 |

    Column ordering

    286 |

    Easily change the order of our built-in grid columns with 287 | .col-md-push-* and 288 | .col-md-pull-* modifier classes.

    289 |
    290 |
    .col-md-9 .col-md-push-3
    291 |
    .col-md-3 .col-md-pull-9
    292 |
    293 |
    294 |
    295 |
    296 | 297 |
    298 | {% endblock %} -------------------------------------------------------------------------------- /templates/sb-admin/pages/ui/notifications.html: -------------------------------------------------------------------------------- 1 | 2 | {% extends "sb-admin/master.html" %} 3 | 4 | {% from "sb-admin/macros/ui/notifications/alert.html" import alert %} 5 | {% from "sb-admin/macros/ui/notifications/dismissablealert.html" import dismissable_alert %} 6 | 7 | 8 | {% block body %} 9 | {% set alerttext='Lorem ipsum dolor sit amet, consectetur adipisicing elit. Alert Link.' %} 10 |
    11 |
    12 |
    13 |
    14 | Alert Styles 15 |
    16 |
    17 | {{alert("success", alerttext)}} 18 | {{alert("info", alerttext)}} 19 | {{alert("warning", alerttext)}} 20 | {{alert("danger", alerttext)}} 21 |
    22 |
    23 | 24 |
    25 | 26 |
    27 |
    28 |
    29 | Dismissable Alerts 30 |
    31 |
    32 | {{dismissable_alert("success", alerttext)}} 33 | {{dismissable_alert("info", alerttext)}} 34 | {{dismissable_alert("warning", alerttext)}} 35 | {{dismissable_alert("danger", alerttext)}} 36 |
    37 |
    38 | 39 |
    40 | 41 |
    42 | 43 |
    44 |
    45 |
    46 |
    47 | Modals 48 |
    49 | 50 |
    51 | 52 | 55 | 56 | 75 | 76 |
    77 | 78 |
    79 | 80 |
    81 | 82 |
    83 |
    84 |
    85 | Tooltips and Popovers 86 |
    87 | 88 |
    89 |

    Tooltip Demo

    90 |
    91 | 92 | 93 | 94 | 95 |
    96 |
    97 |

    Clickable Popover Demo

    98 |
    99 | 102 | 105 | 108 | 111 |
    112 |
    113 | 114 |
    115 | 116 |
    117 | 118 |
    119 | {% endblock %} 120 | 121 | {% block tail %} 122 | 133 | {% endblock %} -------------------------------------------------------------------------------- /templates/sb-admin/pages/ui/panels-wells.html: -------------------------------------------------------------------------------- 1 | 2 | {% extends "sb-admin/master.html" %} 3 | 4 | {% from "sb-admin/macros/ui/panels/panel.html" import panel %} 5 | {% from "sb-admin/macros/ui/panels/accordion.html" import accordion %} 6 | {% from "sb-admin/macros/ui/panels/tab.html" import tab %} 7 | {% from "sb-admin/macros/ui/panels/well.html" import well %} 8 | 9 | {% block body %} 10 | {% set paneltext="Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum tincidunt est vitae ultrices accumsan. Aliquam ornare lacus adipiscing, posuere lectus et, fringilla augue." %} 11 | 12 |
    13 |
    14 | {{panel("default", "Default Panel", paneltext, "Panel Footer")}} 15 |
    16 |
    17 | {{panel("primary", "Primary Panel", paneltext, "Panel Footer")}} 18 |
    19 |
    20 | {{panel("success", "Success Panel", paneltext, "Panel Footer")}} 21 |
    22 |
    23 | 24 |
    25 |
    26 | {{panel("info", "Info Panel", paneltext, "Panel Footer")}} 27 |
    28 |
    29 | {{panel("warning", "Warning Panel", paneltext, "Panel Footer")}} 30 |
    31 |
    32 | {{panel("danger", "Danger Panel", paneltext, "Panel Footer")}} 33 |
    34 |
    35 | 36 |
    37 |
    38 | {{panel("green", "Green Panel", paneltext, "Panel Footer")}} 39 |
    40 |
    41 | {{panel("yellow", "Yellow Panel", paneltext, "Panel Footer")}} 42 |
    43 |
    44 | {{panel("red", "Red Panel", paneltext, "Panel Footer")}} 45 |
    46 |
    47 | 48 |
    49 |
    50 | {{accordion("Collapsible Accordion Panel Group", admin_view.panelswells.accordion)}} 51 |
    52 |
    53 | 54 |
    55 |
    56 | {{tab('basic_1', 'tabs', "Basic Tabs", admin_view.panelswells.tabitems)}} 57 |
    58 |
    59 | {{tab('pills_1', 'pills', "Pill Tabs", admin_view.panelswells.tabitems)}} 60 |
    61 |
    62 | 63 |
    64 |
    65 | {{well("","Normal Well", paneltext)}} 66 |
    67 |
    68 | {{well("well-lg","Large Well", paneltext)}} 69 |
    70 |
    71 | {{well("well-sm","Small Well", paneltext)}} 72 |
    73 |
    74 | 75 |
    76 |
    77 |
    78 |

    Jumbotron

    79 |

    {{paneltext}}{{paneltext}}

    80 |

    Learn more 81 |

    82 |
    83 |
    84 |
    85 | {% endblock %} -------------------------------------------------------------------------------- /templates/sb-admin/pages/ui/typography.html: -------------------------------------------------------------------------------- 1 | 2 | {% extends "sb-admin/master.html" %} 3 | 4 | {% block body %} 5 |
    6 |
    7 |
    8 |
    9 | Headings 10 |
    11 |
    12 |

    Heading 1 13 | Sub-heading 14 |

    15 |

    Heading 2 16 | Sub-heading 17 |

    18 |

    Heading 3 19 | Sub-heading 20 |

    21 |

    Heading 4 22 | Sub-heading 23 |

    24 |
    Heading 5 25 | Sub-heading 26 |
    27 |
    Heading 6 28 | Sub-heading 29 |
    30 |
    31 | 32 |
    33 | 34 |
    35 | 36 |
    37 |
    38 |
    39 | Paragraphs 40 |
    41 |
    42 |

    This is an example of lead body copy.

    43 |

    This is an example of standard paragraph text. This is an example of link anchor text within body copy.

    44 |

    45 | This is an example of small, fine print text. 46 |

    47 |

    48 | This is an example of strong, bold text. 49 |

    50 |

    51 | This is an example of emphasized, italic text. 52 |

    53 |
    54 |

    Alignment Helpers

    55 |

    Left aligned text.

    56 |

    Center aligned text.

    57 |

    Right aligned text.

    58 |
    59 | 60 |
    61 | 62 |
    63 | 64 |
    65 |
    66 |
    67 | Emphasis Classes 68 |
    69 |
    70 |

    This is an example of muted text.

    71 |

    This is an example of primary text.

    72 |

    This is an example of success text.

    73 |

    This is an example of info text.

    74 |

    This is an example of warning text.

    75 |

    This is an example of danger text.

    76 |
    77 | 78 |
    79 | 80 |
    81 | 82 |
    83 | 84 |
    85 |
    86 |
    87 |
    88 | Abbreviations 89 |
    90 |
    91 |

    The abbreviation of the word attribute is 92 | attr.

    93 |

    94 | HTMLis an abbreviation for a programming language.

    95 |
    96 |

    Addresses

    97 |
    98 | Twitter, Inc. 99 |
    795 Folsom Ave, Suite 600 100 |
    San Francisco, CA 94107 101 |
    102 | P:(123) 456-7890 103 |
    104 |
    105 | Full Name 106 |
    107 | first.last@example.com 108 |
    109 |
    110 | 111 |
    112 | 113 |
    114 | 115 |
    116 |
    117 |
    118 | Blockquotes 119 |
    120 |
    121 |

    Default Blockquote

    122 |
    123 |

    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.

    124 |
    125 |

    Blockquote with Citation

    126 |
    127 |

    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.

    128 | Someone famous in 129 | Source Title 130 | 131 |
    132 |

    Right Aligned Blockquote

    133 |
    134 |

    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.

    135 |
    136 |
    137 | 138 |
    139 | 140 |
    141 | 142 |
    143 |
    144 |
    145 | Lists 146 |
    147 |
    148 |

    Unordered List

    149 |
      150 |
    • List Item
      • 151 |
    • List Item
      • 152 |
    • 153 |
        154 |
      • List Item
        • 155 |
      • List Item
        • 156 |
      • List Item
        • 157 |
      158 |
      • 159 |
    • List Item
      • 160 |
    161 |

    Ordered List

    162 |
      163 |
    1. List Item
      2. 164 |
    2. List Item
      3. 165 |
    3. List Item
      4. 166 |
    167 |

    Unstyled List

    168 |
      169 |
    • List Item
      • 170 |
    • List Item
      • 171 |
    • List Item
      • 172 |
    173 |

    Inline List

    174 |
      175 |
    • List Item
      • 176 |
    • List Item
      • 177 |
    • List Item
      • 178 |
    179 |
    180 | 181 |
    182 | 183 |
    184 | 185 |
    186 | 187 |
    188 |
    189 |
    190 |
    191 | Description Lists 192 |
    193 |
    194 |
    195 |
    Standard Description List
    196 |
    Description Text
    197 |
    Description List Title
    198 |
    Description List Text
    199 |
    200 |
    201 |
    Horizontal Description List
    202 |
    Description Text
    203 |
    Description List Title
    204 |
    Description List Text
    205 |
    206 |
    207 | 208 |
    209 | 210 |
    211 | 212 |
    213 |
    214 |
    215 | Code 216 |
    217 |
    218 |

    This is an example of an inline code element within body copy. Wrap inline code within a 219 | <code>...</code>tag.

    220 | 
    This is an example of preformatted text.
    221 |
    222 | 223 |
    224 | 225 |
    226 | 227 |
    228 | 229 | {% endblock %} -------------------------------------------------------------------------------- /templates/sb-admin/redirect.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | Please load admin page. 9 | 10 | -------------------------------------------------------------------------------- /user.py: -------------------------------------------------------------------------------- 1 | from flask.ext.login import UserMixin 2 | 3 | class UserNotFoundError(Exception): 4 | pass 5 | 6 | class User(UserMixin): 7 | 8 | USERS = { 9 | # username: password 10 | 'john': 'doe', 11 | 'mary': 'jane' 12 | } 13 | 14 | id = None 15 | password = None 16 | 17 | def __init__(self, id): 18 | if not id in self.USERS: 19 | raise UserNotFoundError() 20 | self.id = id 21 | self.password = self.USERS[id] 22 | 23 | @classmethod 24 | def get(self_class, id): 25 | try: 26 | return self_class(id) 27 | except UserNotFoundError: 28 | return None -------------------------------------------------------------------------------- /views.py: -------------------------------------------------------------------------------- 1 | import flask_login as login 2 | import flask_admin as admin 3 | from flask_admin import helpers, expose 4 | from flask import redirect, url_for, request, render_template 5 | 6 | from loginform import LoginForm 7 | import stub as stub 8 | 9 | 10 | # Create customized index view class that handles login & registration 11 | class AdminIndexView(admin.AdminIndexView): 12 | 13 | def _stubs(self): 14 | self.nav = { 15 | "tasks" : stub.get_tasks(), 16 | "messages" : stub.get_messages_summary(), 17 | "alerts" : stub.get_alerts() 18 | } 19 | 20 | (cols, rows) = stub.get_adv_tables() 21 | (scols, srows, context) = stub.get_tables() 22 | 23 | self.tables = { 24 | "advtables" : { "columns" : cols, "rows" : rows }, 25 | "table" : { "columns" : scols, "rows" : srows, "context" : context} 26 | } 27 | 28 | self.panelswells = { 29 | "accordion" : stub.get_accordion_items(), 30 | "tabitems" : stub.get_tab_items() 31 | } 32 | 33 | @expose('/') 34 | def index(self): 35 | if not login.current_user.is_authenticated: 36 | return redirect(url_for('.login_view')) 37 | 38 | self._stubs() 39 | self.header = "Dashboard" 40 | return render_template('sb-admin/pages/dashboard.html', admin_view=self) 41 | 42 | @expose('/blank') 43 | def blank(self): 44 | if not login.current_user.is_authenticated: 45 | return redirect(url_for('.login_view')) 46 | 47 | self._stubs() 48 | self.header = "Blank" 49 | return render_template('sb-admin/pages/blank.html', admin_view=self) 50 | 51 | @expose('/flot') 52 | def flot(self): 53 | if not login.current_user.is_authenticated: 54 | return redirect(url_for('.login_view')) 55 | 56 | self._stubs() 57 | self.header = "Flot Charts" 58 | return render_template('sb-admin/pages/flot.html', admin_view=self) 59 | 60 | @expose('/morris') 61 | def morris(self): 62 | if not login.current_user.is_authenticated: 63 | return redirect(url_for('.login_view')) 64 | 65 | self._stubs() 66 | self.header = "Morris Charts" 67 | return render_template('sb-admin/pages/morris.html', admin_view=self) 68 | 69 | @expose('/tables') 70 | def tables(self): 71 | if not login.current_user.is_authenticated: 72 | return redirect(url_for('.login_view')) 73 | 74 | self._stubs() 75 | self.header = "Tables" 76 | return render_template('sb-admin/pages/tables.html', admin_view=self) 77 | 78 | @expose('/forms') 79 | def forms(self): 80 | if not login.current_user.is_authenticated: 81 | return redirect(url_for('.login_view')) 82 | 83 | self._stubs() 84 | self.header = "Forms" 85 | return render_template('sb-admin/pages/forms.html', admin_view=self) 86 | 87 | @expose('/ui/panelswells') 88 | def panelswells(self): 89 | if not login.current_user.is_authenticated: 90 | return redirect(url_for('.login_view')) 91 | 92 | self._stubs() 93 | self.header = "Panels Wells" 94 | return render_template('sb-admin/pages/ui/panels-wells.html', admin_view=self) 95 | 96 | @expose('/ui/buttons') 97 | def buttons(self): 98 | if not login.current_user.is_authenticated: 99 | return redirect(url_for('.login_view')) 100 | 101 | self._stubs() 102 | self.header = "Buttons" 103 | return render_template('sb-admin/pages/ui/buttons.html', admin_view=self) 104 | 105 | @expose('/ui/notifications') 106 | def notifications(self): 107 | if not login.current_user.is_authenticated: 108 | return redirect(url_for('.login_view')) 109 | 110 | self._stubs() 111 | self.header = "Notifications" 112 | return render_template('sb-admin/pages/ui/notifications.html', admin_view=self) 113 | 114 | @expose('/ui/typography') 115 | def typography(self): 116 | if not login.current_user.is_authenticated: 117 | return redirect(url_for('.login_view')) 118 | 119 | self._stubs() 120 | self.header = "Typography" 121 | return render_template('sb-admin/pages/ui/typography.html', admin_view=self) 122 | 123 | @expose('/ui/icons') 124 | def icons(self): 125 | if not login.current_user.is_authenticated: 126 | return redirect(url_for('.login_view')) 127 | 128 | self._stubs() 129 | self.header = "Icons" 130 | return render_template('sb-admin/pages/ui/icons.html', admin_view=self) 131 | 132 | @expose('/ui/grid') 133 | def grid(self): 134 | if not login.current_user.is_authenticated: 135 | return redirect(url_for('.login_view')) 136 | 137 | self._stubs() 138 | self.header = "Grid" 139 | return render_template('sb-admin/pages/ui/grid.html', admin_view=self) 140 | 141 | @expose('/login/', methods=('GET', 'POST')) 142 | def login_view(self): 143 | # handle user login 144 | form = LoginForm(request.form) 145 | if helpers.validate_form_on_submit(form): 146 | user = form.get_user() 147 | login.login_user(user) 148 | 149 | if login.current_user.is_authenticated: 150 | return redirect(url_for('.index')) 151 | self._template_args['form'] = form 152 | return render_template('sb-admin/pages/login.html', form=form) 153 | 154 | @expose('/logout/') 155 | def logout_view(self): 156 | login.logout_user() 157 | return redirect(url_for('.index')) 158 | 159 | class BlankView(admin.BaseView): 160 | @expose('/') 161 | def index(self): 162 | return render_template('sb-admin/pages/blank.html', admin_view=self) 163 | --------------------------------------------------------------------------------