Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.
const w = this.width();
const h = this.height();
this.background = new Konva.Rect({
name: 'background',
x: 0,
y: 0,
width: w,
height: h,
cornerRadius: 0.12 * h,
fill: 'black',
opacity: 0.6,
});
this.add(this.background);
const text = new Konva.Text({
x: 0,
y: 0.275 * h, // 0.25 is too high for some reason
width: w,
height: 0.5 * h,
fontSize: 0.5 * h,
fontFamily: 'Verdana',
fill: 'white',
align: 'center',
text: config.number.toString(),
listening: false,
});
this.add(text);
const resetButton = () => {
this.background.fill('black');
const layer = this.getLayer();
fill: 'black',
})
courseTxt.offsetX(courseTxt.width() / 2)
const achievemTxt = new Konva.TextPath({
x: 10, y: 306,
fill: '#EEE',
fontSize: 14,
fontStyle: 'bold',
fontFamily: 'Arial',
text: achievement,
// text: 'qualified',
data: 'M288 44 C 284 72, 342 72, 340 30'
})
const qore = new Konva.Text({
x: 310, y: 324,
fontFamily: 'Bitter Bold',
fontSize: 30,
text: achievement?achievement[0]:'-',
fill: 'white',
})
textLayer.add(qore)
textLayer.add(achievemTxt)
textLayer.add(courseTxt)
textLayer.add(dateTxt)
textLayer.add(sigitureTxt)
textLayer.add(textpath)
textLayer.add(userTxt)
textLayer.draw()
setTimeout(()=>{
drawAllText(textLayer, courseName, achievement, dateObj) {
textLayer.destroyChildren()// clear first
const textpath = new Konva.TextPath({
x: 0,
y: 0,
fill: '#7D9EC0',
fontSize: 14,
fontFamily: 'Arial',
text: 'ULTRONELE',
data: 'M280 40 C 290 22, 340 22, 360 40'
})
const userName = this.state.userFullName
const userTxt = new Konva.Text({
x: 280, y: 196,
fontFamily: 'Bitter Bold',
fontSize: 24,
fontStyle: 'bold',
text: userName,
fill: 'black',
})
const { signiture } = this.props
const sigitureTxt = new Konva.Text({
x: 446, y: 356,
fontFamily: 'Permanent Marker',
fontSize: 20,
fontStyle: 'bold',
text: signiture?signiture:'Unknown',
fill: 'black',
})
constructor(config: Konva.ContainerConfig) {
super(config);
this.listening(true);
this.cardBack = new Konva.Image({
x: 0,
y: 0,
width: this.width(),
height: this.height(),
image: globals.cardImages.get('deck-back')!,
});
this.add(this.cardBack);
this.cardBack.on('dragend', this.dragEnd);
// The text that shows the number of cards remaining in the deck
this.numLeftText = new Konva.Text({
fill: 'white',
stroke: '#222222',
strokeWidth: 3,
align: 'center',
x: 0,
y: 0.3 * this.height(),
width: this.width(),
height: 0.4 * this.height(),
fontSize: 0.4 * this.height(),
fontFamily: 'Verdana',
fontStyle: 'bold',
text: globals.deckSize.toString(),
listening: false,
});
this.add(this.numLeftText);
drawLegend(layer) {
var startCle = new Konva.Circle({
x: 680,
y: 340,
radius: 6,
fill: '#47BA47',
stroke: 'black',
strokeWidth: 2
});
layer.add(startCle)
var startTxt = new Konva.Text({
x: 700,
y: 334,
text: 'Start',
fontSize: 14,
fontFamily: 'Calibri',
fill: 'green'
});
layer.add(startTxt)
var unlockCle = new Konva.Circle({
x: 680,
y: 360,
radius: 6,
fill: '#EEC900',
stroke: 'black',
strokeWidth: 2
opacity: 1,
listening: false,
}),
tooltip_tag: new Konva.Tag({
cornerRadius: 4,
fill: self.options.tooltip.fill,
lineJoin: 'round',
listening: false,
pointerHeight: 10,
pointerWidth: 18,
stroke: self.options.tooltip.stroke,
strokeWidth: 2,
}),
tooltip_text: new Konva.Text({
fontFamily: self.options.font.family,
fontSize: 10,
padding: 8,
fill: self.options.tooltip.text_fill,
listening: false,
align: 'center',
lineHeight: 1.2,
}),
node: new Konva.Line({
stroke: 'grey',
strokeWidth: 2,
lineCap: 'square',
lineJoin: 'round',
listening: false,
}),
fill: LABEL_COLOR,
stroke: '#747278',
strokeWidth: 1,
text: 'Loading...',
align: 'center',
x: 0,
y: 0.7 * winH,
width: winW,
height: 0.05 * winH,
fontFamily: 'Arial',
fontStyle: 'bold',
fontSize: 0.05 * winH,
});
loadingLayer.add(loadingLabel);
const progresslabel = new Konva.Text({
fill: LABEL_COLOR,
stroke: '#747278',
strokeWidth: 1,
text: '0 / 0',
align: 'center',
x: 0,
y: 0.8 * winH,
width: winW,
height: 0.05 * winH,
fontFamily: 'Arial',
fontStyle: 'bold',
fontSize: 0.05 * winH,
});
loadingLayer.add(progresslabel);
globals.stage!.add(loadingLayer);
fontFamily: 'Verdana',
fontSize: 0.08 * winH,
text: 'Game Paused',
align: 'center',
fill: 'white',
shadowColor: 'black',
shadowBlur: 10,
shadowOffset: {
x: 0,
y: 0,
},
shadowOpacity: 0.9,
});
globals.elements.pauseArea.add(pauseTitle);
globals.elements.pauseText = new Konva.Text({
y: 0.21 * winH,
width: pauseAreaValues.w * winW,
fontFamily: 'Verdana',
fontSize: 0.05 * winH,
text: 'by: [username]',
align: 'center',
fill: 'white',
shadowColor: 'black',
shadowBlur: 10,
shadowOffset: {
x: 0,
y: 0,
},
shadowOpacity: 0.9,
});
globals.elements.pauseArea.add(globals.elements.pauseText);
fontFamily: 'Calibri',
fill: '#EE7942'
});
layer.add(quizTxt)
var completeCle = new Konva.Circle({
x: 680,
y: 400,
radius: 6,
fill: '#EE0000',
stroke: 'black',
strokeWidth: 2
});
layer.add(completeCle)
var completeTxt = new Konva.Text({
x: 700,
y: 394,
text: 'Complete',
fontSize: 14,
fontFamily: 'Calibri',
fill: '#EE0000'
});
layer.add(completeTxt)
}
});
this.add(this.background);
const color = new Konva.Rect({
x: 0.1 * w,
y: 0.1 * h,
width: 0.8 * w,
height: 0.8 * h,
cornerRadius: 0.12 * 0.8 * h,
fill: config.color,
opacity: 0.9,
listening: false,
});
this.add(color);
const text = new Konva.Text({
x: 0,
y: 0.2 * h,
width: w,
height: 0.6 * h,
fontSize: 0.5 * h,
fontFamily: 'Verdana',
fill: 'white',
stroke: 'black',
strokeWidth: 1,
align: 'center',
text: config.text,
visible: showColorblindUI,
listening: false,
});
this.add(text);