http://git-wip-us.apache.org/repos/asf/incubator-airflow/blob/5a7f0b2e/airflow/www_rbac/static/css/gantt.css ---------------------------------------------------------------------- diff --git a/airflow/www_rbac/static/css/gantt.css b/airflow/www_rbac/static/css/gantt.css new file mode 100644 index 0000000..8714705 --- /dev/null +++ b/airflow/www_rbac/static/css/gantt.css @@ -0,0 +1,57 @@ +/** +* Licensed to the Apache Software Foundation (ASF) under one +* or more contributor license agreements. See the NOTICE file +* distributed with this work for additional information +* regarding copyright ownership. The ASF licenses this file +* to you under the Apache License, Version 2.0 (the +* "License"); you may not use this file except in compliance +* with the License. You may obtain a copy of the License at +* +* http://www.apache.org/licenses/LICENSE-2.0 +* +* Unless required by applicable law or agreed to in writing, +* software distributed under the License is distributed on an +* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY +* KIND, either express or implied. See the License for the +* specific language governing permissions and limitations +* under the License. +*/ + +.axis path,.axis line { + fill: none; + stroke: #000; + shape-rendering: crispEdges; +} +rect { + stroke: black; + cursor: pointer; +} +.d3-tip { + line-height: 1; + font-weight: bold; + padding: 5px; + background: rgba(0, 0, 0, 0.8); + color: #fff; + border-radius: 2px; + font-size: 12px; +} + +/* Creates a small triangle extender for the tooltip */ +.d3-tip:after { + box-sizing: border-box; + display: inline; + font-size: 8px; + width: 100%; + line-height: 1; + color: rgba(0, 0, 0, 0.8); + content: "\25BC"; + position: absolute; + text-align: center; +} + +/* Style northward tooltips differently */ +.d3-tip.n:after { + margin: -1px 0 0 0; + top: 100%; + left: 0; +}
http://git-wip-us.apache.org/repos/asf/incubator-airflow/blob/5a7f0b2e/airflow/www_rbac/static/css/graph.css ---------------------------------------------------------------------- diff --git a/airflow/www_rbac/static/css/graph.css b/airflow/www_rbac/static/css/graph.css new file mode 100644 index 0000000..fa055b9 --- /dev/null +++ b/airflow/www_rbac/static/css/graph.css @@ -0,0 +1,92 @@ +/** +* Licensed to the Apache Software Foundation (ASF) under one +* or more contributor license agreements. See the NOTICE file +* distributed with this work for additional information +* regarding copyright ownership. The ASF licenses this file +* to you under the Apache License, Version 2.0 (the +* "License"); you may not use this file except in compliance +* with the License. You may obtain a copy of the License at +* +* http://www.apache.org/licenses/LICENSE-2.0 +* +* Unless required by applicable law or agreed to in writing, +* software distributed under the License is distributed on an +* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY +* KIND, either express or implied. See the License for the +* specific language governing permissions and limitations +* under the License. +*/ + +svg { + overflow: hidden; +} + +.node rect { + stroke: #333; + stroke-width: 1px; + fill: #fff; +} + +.edgeLabel rect { + fill: #fff; +} + +.edgePath { + stroke: #333; + stroke-width: 1px; + fill: none; +} + +g.node rect { + stroke-width: 3; + stroke: white; + cursor: pointer; +} +g.node text { + cursor: pointer; +} +g.node.success rect { + stroke: green; +} +g.node.up_for_retry rect { + stroke: gold; +} + +g.node.queued rect { + stroke: grey; +} + +g.node.running rect{ + stroke: lime; +} +g.node.failed rect { + stroke: red; +} +g.node.shutdown rect{ + stroke: blue; +} +g.node.upstream_failed rect{ + stroke: orange; +} +g.node.skipped rect{ + stroke: pink; +} +div#svg_container { + border: 1px solid black; + background-color: #EEE; + cursor: move; +} + +#refresh_button { + top: 15px; + right: 15px; + position: relative; +} + +#loading { + margin: auto; + display: none; + position: relative; + width: 100px; + top: -550px; +} http://git-wip-us.apache.org/repos/asf/incubator-airflow/blob/5a7f0b2e/airflow/www_rbac/static/css/main.css ---------------------------------------------------------------------- diff --git a/airflow/www_rbac/static/css/main.css b/airflow/www_rbac/static/css/main.css new file mode 100644 index 0000000..ac61899 --- /dev/null +++ b/airflow/www_rbac/static/css/main.css @@ -0,0 +1,267 @@ +/** +* Licensed to the Apache Software Foundation (ASF) under one +* or more contributor license agreements. See the NOTICE file +* distributed with this work for additional information +* regarding copyright ownership. The ASF licenses this file +* to you under the Apache License, Version 2.0 (the +* "License"); you may not use this file except in compliance +* with the License. You may obtain a copy of the License at +* +* http://www.apache.org/licenses/LICENSE-2.0 +* +* Unless required by applicable law or agreed to in writing, +* software distributed under the License is distributed on an +* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY +* KIND, either express or implied. See the License for the +* specific language governing permissions and limitations +* under the License. +*/ +body { padding-top: 70px; } + +div.container { + width: 98%; + padding-left: 15px; + padding-right: 15px; +} + +a.navbar-brand span { + color: white; +} +.modal-backdrop{ + z-index: 0; + position: fixed; +} +.modal-content{ + z-index: 5; +} +nav{ + -webkit-box-shadow: 0px 3px 3px #AAA; + -moz-box-shadow: 0px 3px 3px #AAA; + box-shadow: 0px 3px 3px #AAA; + z-index:999; +} +a.navbar-brand { + cursor: default; +} +td>span.glyphicon{ + padding-left: 3px; + padding-top: 3px; +} +button.btn { + border: 1px solid black; +} + +div.rich_doc { + padding: 5px 10px; + border: 1px solid #dddddd; + background: white; + border-radius: 4px; +} + +span.status_square { + width:10px; + height:10px; + border:1px solid grey; + display:inline-block; + padding-left: 0px; + cursor: pointer; +} +div.squares{ + float:right; + font-size: 1; +} +div.task_row{ +} +span.success{ + background-color: green; +} +span.up_for_retry{ + background-color: gold; +} +span.started{ + background-color: lime; +} +span.error{ + background-color: red; +} +span.queued{ + background-color: gray; +} +span.upstream_failed{ + background-color: orange; +} +span.skipped{ + background-color: pink; +} +.tooltip-inner { + max-width: 500px; + text-align:left !important; + font-size: 12px; +} +input#execution_date { + margin-bottom: 0px; +} +table.highlighttable{ + width: 100%; + table-layout:fixed; +} +div.linenodiv { + padding-right: 1px !important; +} +.linenos { + width: 50px; + border: none; +} +div.linenodiv pre { + padding-left: 4px; + padding-right: 4px; + color: #AAA; + background-color: #FCFCFC; + text-align:right; +} + +pre { + overflow: auto; + word-wrap: normal; + white-space: pre; +} +pre code { + overflow-wrap: normal; + white-space: pre; +} +input, select { + margin: 0px; +} +.code { + font-family: monospace; +} + +#sql { + border: 1px solid #CCC; + border-radius: 5px; +} +.ace_editor div { + font: inherit!important +} +#ace_container { + margin: 10px 0px; +} +#sql_ace { + visibility: hidden; +} +table.dataframe { + font-size: 12px; +} +table.dataframe tbody tr td { + padding: 2px; +} +table thead th { + background-color: #F3F3F3; +} +table.dataframe.dataTable thead > tr > th { + padding: 10px 20px 10px 10px; +} +table.dataTable.dataframe thead .sorting { + background: url('./../sort_both.png') no-repeat center right +} +table.dataTable.dataframe thead .sorting_desc { + background: url('./../sort_desc.png') no-repeat center right +} +table.dataTable.dataframe thead .sorting_asc { + background: url('./../sort_asc.png') no-repeat center right +} +.no-wrap { + white-space: nowrap; +} +div.form-inline{ + margin-bottom: 5px; +} + +body div.panel { + padding: 0px; +} +.blur { + filter:url(#blur-effect-1); +} +div.legend_item { + -moz-border-radius: 5px/5px; + -webkit-border-radius: 5px 5px; + border-radius: 5px/5px; + float:right; + margin: 0px 3px 0px 0px; + padding:0px 3px; + border:solid 2px grey; + font-size: 11px; +} +div.legend_circle{ + -moz-border-radius: 10px/10px; + -webkit-border-radius: 10px 10px; + border-radius: 10px/10px; + width:15px; + height:15px; + border:1px solid grey; + float:left; + margin-top: 2px; + margin-right: 0px; +} +div.square { + width:12px; + height:12px; + float: right; + margin-top: 2px; + border:1px solid black; +} +.btn:active, .btn.active { + box-shadow: inset 0 6px 6px rgba(0, 0, 0, 0.4); +} + +.hll { background-color: #ffffcc } +.c { color: #408080; font-style: italic } /* Comment */ +.err { border: 1px solid #FF0000 } /* Error */ +.k { color: #008000; font-weight: bold } /* Keyword */ +.o { color: #666666 } /* Operator */ +.cm { color: #408080; font-style: italic } /* Comment.Multiline */ +.cp { color: #BC7A00 } /* Comment.Preproc */ +.c1 { color: #408080; font-style: italic } /* Comment.Single */ +.cs { color: #408080; font-style: italic } /* Comment.Special */ +.gd { color: #A00000 } /* Generic.Deleted */ +.ge { font-style: italic } /* Generic.Emph */ +.gr { color: #FF0000 } /* Generic.Error */ +.gh { color: #000080; font-weight: bold } /* Generic.Heading */ +.gi { color: #00A000 } /* Generic.Inserted */ +.go { color: #888888 } /* Generic.Output */ +.gp { color: #000080; font-weight: bold } /* Generic.Prompt */ +.gs { font-weight: bold } /* Generic.Strong */ +.gu { color: #800080; font-weight: bold } /* Generic.Subheading */ +.gt { color: #0044DD } /* Generic.Traceback */ +.kc { color: #008000; font-weight: bold } /* Keyword.Constant */ +.kd { color: #008000; font-weight: bold } /* Keyword.Declaration */ +.kn { color: #008000; font-weight: bold } /* Keyword.Namespace */ +.kp { color: #008000 } /* Keyword.Pseudo */ +.kr { color: #008000; font-weight: bold } /* Keyword.Reserved */ +.kt { color: #B00040 } /* Keyword.Type */ +.m { color: #666666 } /* Literal.Number */ +.s { color: #BA2121 } /* Literal.String */ +.na { color: #7D9029 } /* Name.Attribute */ +.nb { color: #008000 } /* Name.Builtin */ +.nc { color: #0000FF; font-weight: bold } /* Name.Class */ +.no { color: #880000 } /* Name.Constant */ +.nd { color: #AA22FF } /* Name.Decorator */ +.ni { color: #999999; font-weight: bold } /* Name.Entity */ +.ne { color: #D2413A; font-weight: bold } /* Name.Exception */ +.nf { color: #0000FF } /* Name.Function */ +.nl { color: #A0A000 } /* Name.Label */ +.nn { color: #0000FF; font-weight: bold } /* Name.Namespace */ +.nt { color: #008000; font-weight: bold } /* Name.Tag */ +.nv { color: #19177C } /* Name.Variable */ +.ow { color: #AA22FF; font-weight: bold } /* Operator.Word */ +.w { color: #bbbbbb } /* Text.Whitespace */ +.mb { color: #666666 } /* Literal.Number.Bin */ +.mf { color: #666666 } /* Literal.Number.Float */ +.mh { color: #666666 } /* Literal.Number.Hex */ +.mi { color: #666666 } /* Literal.Number.Integer */ +.mo { color: #666666 } /* Literal.Number.Oct */ +.sb { color: #BA2121 } /* Literal.String.Backtick */ +.sc { color: #BA2121 } /* Literal.String.Char */ +.sd { color: #BA2121; font-style: italic } /* Literal.String.Doc */ +.s2 { color: #BA2121 } /* Literal.String.Double */ http://git-wip-us.apache.org/repos/asf/incubator-airflow/blob/5a7f0b2e/airflow/www_rbac/static/css/tree.css ---------------------------------------------------------------------- diff --git a/airflow/www_rbac/static/css/tree.css b/airflow/www_rbac/static/css/tree.css new file mode 100644 index 0000000..9304bb1 --- /dev/null +++ b/airflow/www_rbac/static/css/tree.css @@ -0,0 +1,96 @@ +/** +* Licensed to the Apache Software Foundation (ASF) under one +* or more contributor license agreements. See the NOTICE file +* distributed with this work for additional information +* regarding copyright ownership. The ASF licenses this file +* to you under the Apache License, Version 2.0 (the +* "License"); you may not use this file except in compliance +* with the License. You may obtain a copy of the License at +* +* http://www.apache.org/licenses/LICENSE-2.0 +* +* Unless required by applicable law or agreed to in writing, +* software distributed under the License is distributed on an +* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY +* KIND, either express or implied. See the License for the +* specific language governing permissions and limitations +* under the License. +*/ + +#svg_container{ + // overflow: scroll; +} +.node text { + font: 11px sans-serif; + pointer-events: none; +} +path.link { + fill: none; + stroke: #3182bd; + stroke-width: 1.5px; + opacity: 0.5; +} +g.tick line{ + shape-rendering: crispEdges; +} +rect.state { + stroke: black; + shape-rendering: crispEdges; + cursor: pointer; +} +rect.null, rect.scheduled, rect.undefined { + fill: white; +} +rect.success { + fill: green; +} +rect.running { + fill: lime; +} +rect.failed { + fill: red; +} +rect.queued { + fill: gray; +} +rect.shutdown { + fill: blue; +} +rect.upstream_failed { + fill: orange; +} +rect.up_for_retry { + fill: gold; +} +rect.skipped { + fill: pink; +} +.tooltip.in { + opacity: 1; + filter: alpha(opacity=100); +} + +.axis path, .axis line { + fill: none; + stroke: #000; +} +.axis text { + font: 11px sans-serif; +} + +g.parent circle { + cursor: pointer; +} + +g.node.collapsed circle { + stroke: #444; + stroke-width: 4px; +} +circle { + stroke: blue; + fill: white; + stroke-width: 1.5px; +} +g.axis path { + shape-rendering: crispEdges; +} http://git-wip-us.apache.org/repos/asf/incubator-airflow/blob/5a7f0b2e/airflow/www_rbac/static/d3.tip.v0.6.3.js ---------------------------------------------------------------------- diff --git a/airflow/www_rbac/static/d3.tip.v0.6.3.js b/airflow/www_rbac/static/d3.tip.v0.6.3.js deleted file mode 100644 index b2b48fb..0000000 --- a/airflow/www_rbac/static/d3.tip.v0.6.3.js +++ /dev/null @@ -1,302 +0,0 @@ -/** - * The MIT License (MIT) - * Copyright (c) 2013 Justin Palmer - * - * Permission is hereby granted, free of charge, to any person obtaining a copy of - * this software and associated documentation files (the "Software"), to deal in - * the Software without restriction, including without limitation the rights to - * use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies - * of the Software, and to permit persons to whom the Software is furnished to do - * so, subject to the following conditions: - * - * The above copyright notice and this permission notice shall be included in all - * copies or substantial portions of the Software. - * - * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, - * INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A - * PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT - * HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION - * OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE - * SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. -*/ - -// d3.tip -// Copyright (c) 2013 Justin Palmer -// -// Tooltips for d3.js SVG visualizations - -// Public - contructs a new tooltip -// -// Returns a tip -d3.tip = function() { - var direction = d3_tip_direction, - offset = d3_tip_offset, - html = d3_tip_html, - node = initNode(), - svg = null, - point = null, - target = null - - function tip(vis) { - svg = getSVGNode(vis) - point = svg.createSVGPoint() - document.body.appendChild(node) - } - - // Public - show the tooltip on the screen - // - // Returns a tip - tip.show = function() { - var args = Array.prototype.slice.call(arguments) - if(args[args.length - 1] instanceof SVGElement) target = args.pop() - - var content = html.apply(this, args), - poffset = offset.apply(this, args), - dir = direction.apply(this, args), - nodel = d3.select(node), i = 0, - coords - - nodel.html(content) - .style({ opacity: 1, 'pointer-events': 'all' }) - - while(i--) nodel.classed(directions[i], false) - coords = direction_callbacks.get(dir).apply(this) - nodel.classed(dir, true).style({ - top: (coords.top + poffset[0]) + 'px', - left: (coords.left + poffset[1]) + 'px' - }) - - return tip - } - - // Public - hide the tooltip - // - // Returns a tip - tip.hide = function() { - nodel = d3.select(node) - nodel.style({ opacity: 0, 'pointer-events': 'none' }) - return tip - } - - // Public: Proxy attr calls to the d3 tip container. Sets or gets attribute value. - // - // n - name of the attribute - // v - value of the attribute - // - // Returns tip or attribute value - tip.attr = function(n, v) { - if (arguments.length < 2 && typeof n === 'string') { - return d3.select(node).attr(n) - } else { - var args = Array.prototype.slice.call(arguments) - d3.selection.prototype.attr.apply(d3.select(node), args) - } - - return tip - } - - // Public: Proxy style calls to the d3 tip container. Sets or gets a style value. - // - // n - name of the property - // v - value of the property - // - // Returns tip or style property value - tip.style = function(n, v) { - if (arguments.length < 2 && typeof n === 'string') { - return d3.select(node).style(n) - } else { - var args = Array.prototype.slice.call(arguments) - d3.selection.prototype.style.apply(d3.select(node), args) - } - - return tip - } - - // Public: Set or get the direction of the tooltip - // - // v - One of n(north), s(south), e(east), or w(west), nw(northwest), - // sw(southwest), ne(northeast) or se(southeast) - // - // Returns tip or direction - tip.direction = function(v) { - if (!arguments.length) return direction - direction = v == null ? v : d3.functor(v) - - return tip - } - - // Public: Sets or gets the offset of the tip - // - // v - Array of [x, y] offset - // - // Returns offset or - tip.offset = function(v) { - if (!arguments.length) return offset - offset = v == null ? v : d3.functor(v) - - return tip - } - - // Public: sets or gets the html value of the tooltip - // - // v - String value of the tip - // - // Returns html value or tip - tip.html = function(v) { - if (!arguments.length) return html - html = v == null ? v : d3.functor(v) - - return tip - } - - function d3_tip_direction() { return 'n' } - function d3_tip_offset() { return [0, 0] } - function d3_tip_html() { return ' ' } - - var direction_callbacks = d3.map({ - n: direction_n, - s: direction_s, - e: direction_e, - w: direction_w, - nw: direction_nw, - ne: direction_ne, - sw: direction_sw, - se: direction_se - }), - - directions = direction_callbacks.keys() - - function direction_n() { - var bbox = getScreenBBox() - return { - top: bbox.n.y - node.offsetHeight, - left: bbox.n.x - node.offsetWidth / 2 - } - } - - function direction_s() { - var bbox = getScreenBBox() - return { - top: bbox.s.y, - left: bbox.s.x - node.offsetWidth / 2 - } - } - - function direction_e() { - var bbox = getScreenBBox() - return { - top: bbox.e.y - node.offsetHeight / 2, - left: bbox.e.x - } - } - - function direction_w() { - var bbox = getScreenBBox() - return { - top: bbox.w.y - node.offsetHeight / 2, - left: bbox.w.x - node.offsetWidth - } - } - - function direction_nw() { - var bbox = getScreenBBox() - return { - top: bbox.nw.y - node.offsetHeight, - left: bbox.nw.x - node.offsetWidth - } - } - - function direction_ne() { - var bbox = getScreenBBox() - return { - top: bbox.ne.y - node.offsetHeight, - left: bbox.ne.x - } - } - - function direction_sw() { - var bbox = getScreenBBox() - return { - top: bbox.sw.y, - left: bbox.sw.x - node.offsetWidth - } - } - - function direction_se() { - var bbox = getScreenBBox() - return { - top: bbox.se.y, - left: bbox.e.x - } - } - - function initNode() { - var node = d3.select(document.createElement('div')) - node.style({ - position: 'absolute', - opacity: 0, - pointerEvents: 'none', - boxSizing: 'border-box' - }) - - return node.node() - } - - function getSVGNode(el) { - el = el.node() - if(el.tagName.toLowerCase() == 'svg') - return el - - return el.ownerSVGElement - } - - // Private - gets the screen coordinates of a shape - // - // Given a shape on the screen, will return an SVGPoint for the directions - // n(north), s(south), e(east), w(west), ne(northeast), se(southeast), nw(northwest), - // sw(southwest). - // - // +-+-+ - // | | - // + + - // | | - // +-+-+ - // - // Returns an Object {n, s, e, w, nw, sw, ne, se} - function getScreenBBox() { - var targetel = target || d3.event.target, - bbox = {}, - matrix = targetel.getScreenCTM(), - tbbox = targetel.getBBox(), - width = tbbox.width, - height = tbbox.height, - x = tbbox.x, - y = tbbox.y, - scrollTop = document.documentElement.scrollTop || document.body.scrollTop, - scrollLeft = document.documentElement.scrollLeft || document.body.scrollLeft - - - point.x = x + scrollLeft - point.y = y + scrollTop - bbox.nw = point.matrixTransform(matrix) - point.x += width - bbox.ne = point.matrixTransform(matrix) - point.y += height - bbox.se = point.matrixTransform(matrix) - point.x -= width - bbox.sw = point.matrixTransform(matrix) - point.y -= height / 2 - bbox.w = point.matrixTransform(matrix) - point.x += width - bbox.e = point.matrixTransform(matrix) - point.x -= width / 2 - point.y -= height / 2 - bbox.n = point.matrixTransform(matrix) - point.y += height - bbox.s = point.matrixTransform(matrix) - - return bbox - } - - return tip -};
