lnmch/kops-arm64
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

sort labels

Browse Source
This commit is contained in:
Henning Jacobs
2016-12-23 20:43:34 +01:00
parent f6daedc56c
commit 868ce15a01
7 changed files with 27 additions and 26 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
app/src/app.js
View File

@@ -2,7 +2,7 @@ import Tooltip from './tooltip.js'
import Cluster from './cluster.js'
import {Pod, ALL_PODS, sortByName, sortByMemory, sortByCPU, sortByAge} from './pod.js'
import SelectBox from './selectbox'
import { PRIMARY_VIOLET, SECONDARY_COLOR } from './colors.js'
import { PRIMARY_COLOR, SECONDARY_COLOR } from './colors.js'
import { DESATURATION_FILTER } from './filters.js'
const PIXI = require('pixi.js')
@@ -77,11 +77,11 @@ export default class App {
menuBar.lineStyle(2, SECONDARY_COLOR, 0.8)
menuBar.moveTo(0, 28)
menuBar.lineTo(window.innerWidth, 28)
menuBar.lineStyle(1, PRIMARY_VIOLET, 1)
menuBar.lineStyle(1, PRIMARY_COLOR, 1)
menuBar.drawRect(20, 3, 200, 22)
stage.addChild(menuBar)
const searchPrompt = new PIXI.Text('>', {fontFamily: 'ShareTechMono', fontSize: 14, fill: PRIMARY_VIOLET})
const searchPrompt = new PIXI.Text('>', {fontFamily: 'ShareTechMono', fontSize: 14, fill: PRIMARY_COLOR})
searchPrompt.x = 26
searchPrompt.y = 8
PIXI.ticker.shared.add(function (_) {
@@ -90,7 +90,7 @@ export default class App {
})
stage.addChild(searchPrompt)
const searchText = new PIXI.Text('', {fontFamily: 'ShareTechMono', fontSize: 14, fill: PRIMARY_VIOLET})
const searchText = new PIXI.Text('', {fontFamily: 'ShareTechMono', fontSize: 14, fill: PRIMARY_COLOR})
searchText.x = 40
searchText.y = 8
stage.addChild(searchText)

6
app/src/bars.js
View File

@@ -1,5 +1,5 @@
import {FACTORS, getBarColor} from './utils'
import {PRIMARY_VIOLET} from './colors'
import {PRIMARY_COLOR} from './colors'
const PIXI = require('pixi.js')
@@ -16,7 +16,7 @@ export default class Bars extends PIXI.Graphics {
const barHeight = 92
bars.beginFill(PRIMARY_VIOLET, 0.1)
bars.beginFill(PRIMARY_COLOR, 0.1)
bars.drawRect(5, 110 - barHeight, 15, barHeight)
bars.endFill()
@@ -39,7 +39,7 @@ export default class Bars extends PIXI.Graphics {
bars.drawRect(16.5, 110 - bars.resources.memory.used / scale, 2.5, bars.resources.memory.used / scale)
bars.endFill()
bars.lineStyle(1, PRIMARY_VIOLET, 1)
bars.lineStyle(1, PRIMARY_COLOR, 1)
for (var i = 0; i < bars.resources.cpu.capacity; i++) {
bars.drawRect(5, 110 - (i + 1) * cpuHeight, 5, cpuHeight)
}

6
app/src/cluster.js
View File

@@ -1,6 +1,6 @@
import Node from './node.js'
import { Pod } from './pod.js'
import { PRIMARY_VIOLET } from './colors.js'
import { PRIMARY_COLOR } from './colors.js'
const PIXI = require('pixi.js')
export default class Cluster extends PIXI.Graphics {
@@ -38,12 +38,12 @@ export default class Cluster extends PIXI.Graphics {
rows[0] += 20
}
this.lineStyle(2, PRIMARY_VIOLET, 1)
this.lineStyle(2, PRIMARY_COLOR, 1)
const width = Math.max(rows[0], rows[1])
this.drawRect(0, 0, width, nodeBox.height * 2 + 30)
var topHandle = new PIXI.Graphics()
topHandle.beginFill(PRIMARY_VIOLET, 1)
topHandle.beginFill(PRIMARY_COLOR, 1)
topHandle.drawRect(0, 0, width, 15)
topHandle.endFill()
var text = new PIXI.Text(this.cluster.api_server_url, {fontFamily: 'ShareTechMono', fontSize: 10, fill: 0x000000})

4
app/src/colors.js
View File

@@ -1,4 +1,4 @@
const PRIMARY_VIOLET = 0xaaaaff
const PRIMARY_COLOR = 0xaaaaff
const SECONDARY_COLOR = 0x222233
export { PRIMARY_VIOLET, SECONDARY_COLOR }
export { PRIMARY_COLOR, SECONDARY_COLOR }

11
app/src/node.js
View File

@@ -1,7 +1,7 @@
import {Pod} from './pod.js'
import Bars from './bars.js'
import {parseResource} from './utils.js'
import {PRIMARY_VIOLET, SECONDARY_COLOR} from './colors.js'
import {PRIMARY_COLOR, SECONDARY_COLOR} from './colors.js'
import App from './app'
const PIXI = require('pixi.js')
@@ -48,16 +48,16 @@ export default class Node extends PIXI.Graphics {
draw() {
const nodeBox = this
const topHandle = new PIXI.Graphics()
topHandle.beginFill(PRIMARY_VIOLET, 1)
topHandle.beginFill(PRIMARY_COLOR, 1)
topHandle.drawRect(0, 0, 105, 15)
topHandle.endFill()
const ellipsizedNodeName = this.node.name.substring(0, 18).concat('...')
const ellipsizedNodeName = this.node.name.length > 17 ? this.node.name.substring(0, 17).concat('…') : this.node.name
const text = new PIXI.Text(ellipsizedNodeName, {fontFamily: 'ShareTechMono', fontSize: 10, fill: 0x000000})
text.x = 2
text.y = 2
topHandle.addChild(text)
nodeBox.addChild(topHandle)
nodeBox.lineStyle(2, PRIMARY_VIOLET, 1)
nodeBox.lineStyle(2, PRIMARY_COLOR, 1)
nodeBox.beginFill(SECONDARY_COLOR, 1)
nodeBox.drawRect(0, 0, 105, 115)
nodeBox.endFill()
@@ -65,7 +65,8 @@ export default class Node extends PIXI.Graphics {
topHandle.interactive = true
topHandle.on('mouseover', function () {
let s = nodeBox.node.name
for (const key of Object.keys(nodeBox.node.labels)) {
s += '\nLabels:'
for (const key of Object.keys(nodeBox.node.labels).sort()) {
s += '\n ' + key + ': ' + nodeBox.node.labels[key]
}
nodeBox.tooltip.setText(s)

6
app/src/pod.js
View File

@@ -1,5 +1,5 @@
const PIXI = require('pixi.js')
import {PRIMARY_VIOLET} from './colors.js'
import {PRIMARY_COLOR} from './colors.js'
import {FACTORS, getBarColor, podResource} from './utils.js'
import {BRIGHTNESS_FILTER} from './filters.js'
@@ -167,7 +167,7 @@ export class Pod extends PIXI.Graphics {
s += '\nStatus : ' + this.pod.status.phase + ' (' + ready + '/' + containerStatuses.length + ' ready)'
s += '\nStart Time: ' + this.pod.status.startTime
s += '\nLabels :'
for (var key of Object.keys(this.pod.labels)) {
for (var key of Object.keys(this.pod.labels).sort()) {
if (key !== 'pod-template-hash') {
s += '\n ' + key + ': ' + this.pod.labels[key]
}
@@ -201,7 +201,7 @@ export class Pod extends PIXI.Graphics {
podBox.filters = []
this.tooltip.visible = false
})
podBox.lineStyle(1, PRIMARY_VIOLET, 1)
podBox.lineStyle(1, PRIMARY_COLOR, 1)
let i = 0
const w = 10 / this.pod.containers.length
for (const container of this.pod.containers) {

10
app/src/selectbox.js
View File

@@ -1,4 +1,4 @@
import { PRIMARY_VIOLET, SECONDARY_COLOR } from './colors.js'
import { PRIMARY_COLOR, SECONDARY_COLOR } from './colors.js'
import App from './app'
const PIXI = require('pixi.js')
@@ -11,7 +11,7 @@ export default class SelectBox extends PIXI.Graphics {
this.text = new PIXI.Text(this.items[this.count].text, {
fontFamily: 'ShareTechMono',
fontSize: 14,
fill: PRIMARY_VIOLET,
fill: PRIMARY_COLOR,
align: 'center'
})
this.text.x = 10
@@ -53,7 +53,7 @@ export default class SelectBox extends PIXI.Graphics {
// draw a triangle
backArrow.beginFill(SECONDARY_COLOR, 1)
backArrow.drawRect(-18, 0, arrowBoxWidth, 22)
backArrow.lineStyle(1, PRIMARY_VIOLET, 1)
backArrow.lineStyle(1, PRIMARY_COLOR, 1)
backArrow.beginFill(SECONDARY_COLOR, 1)
backArrow.moveTo(-4, 5)
backArrow.lineTo(-15, 11)
@@ -62,14 +62,14 @@ export default class SelectBox extends PIXI.Graphics {
backArrow.endFill()
selectBox.addChild(backArrow)
selectBox.lineStyle(1, PRIMARY_VIOLET, 1)
selectBox.lineStyle(1, PRIMARY_COLOR, 1)
selectBox.beginFill(SECONDARY_COLOR, 0.5)
selectBox.drawRect(4, 0, 100, 22)
selectBox.endFill()
forwardArrow.beginFill(SECONDARY_COLOR, 1)
forwardArrow.drawRect(108, 0, arrowBoxWidth, 22)
forwardArrow.lineStyle(1, PRIMARY_VIOLET, 1)
forwardArrow.lineStyle(1, PRIMARY_COLOR, 1)
forwardArrow.beginFill(SECONDARY_COLOR, 1)
forwardArrow.moveTo(111, 5)
forwardArrow.lineTo(122, 11)