Mirrors/overte-thingvellir
3
0
Fork 0
mirror of https://thingvellir.net/git/overte synced 2025-03-27 23:52:03 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions

virtualKeyboard.js - scale 50%

Browse source 
virtualKeyboardLocation.js - toggle visibility with Enter/Return key
virtualKeyboardTextEntityExample.js - attempt to fix character glyphs
This commit is contained in:
Thijs Wenker 2014-12-30 23:30:48 +01:00
parent 4eec066d69
commit a8122e5a85
3 changed files with 78 additions and 62 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

112
examples/libraries/virtualKeyboard.js
View file

@ -37,6 +37,8 @@ KEYBOARD_HEIGHT = 434.1;
CURSOR_WIDTH = 33.9;
CURSOR_HEIGHT = 33.9;
KEYBOARD_SCALE_MULTIPLIER = 0.50;
// VIEW_ANGLE can be adjusted to your likings, the smaller the faster movement.
// Try setting it to 60 if it goes too fast for you.
const VIEW_ANGLE = 40.0;
@ -127,6 +129,11 @@ KeyboardKey = (function(keyboard, keyProperties) {
});
}
};
this.updateVisibility = function() {
for (var i = 0; i < tthis.bounds.length; i++) {
Overlays.editOverlay(tthis.overlays[i], {visible: tthis.keyboard.visible});
}
};
this.rescale = function() {
for (var i = 0; i < tthis.bounds.length; i++) {
Overlays.editOverlay(tthis.overlays[i], {
@ -153,26 +160,26 @@ KeyboardKey = (function(keyboard, keyProperties) {
for (var i = 0; i < this.bounds.length; i++) {
var newOverlay = Overlays.cloneOverlay(this.keyboard.background);
if (THREE_D_MODE) {
Overlays.editOverlay(newOverlay, {
position: {
x: MyAvatar.position.x,// + this.bounds[i][BOUND_X] * 0.01,// /*+ this.keyboard.getX()*/ + this.bounds[i][BOUND_X] * keyboard.scale,
y: MyAvatar.position.y,// - this.bounds[i][BOUND_Y] * 0.01,// /*+ this.keyboard.getY()*/ + this.bounds[i][BOUND_Y] * keyboard.scale,
z: MyAvatar.position.z
},
width: this.bounds[i][BOUND_W] * keyboard.scale,
height: this.bounds[i][BOUND_H] * keyboard.scale,
subImage: {width: this.bounds[i][BOUND_W], height: this.bounds[i][BOUND_H], x: this.bounds[i][BOUND_X], y: (KEYBOARD_HEIGHT * this.keyState) + this.bounds[i][BOUND_Y]},
alpha: 1
});
Overlays.editOverlay(newOverlay, {
position: {
x: MyAvatar.position.x,// + this.bounds[i][BOUND_X] * 0.01,// /*+ this.keyboard.getX()*/ + this.bounds[i][BOUND_X] * keyboard.scale,
y: MyAvatar.position.y,// - this.bounds[i][BOUND_Y] * 0.01,// /*+ this.keyboard.getY()*/ + this.bounds[i][BOUND_Y] * keyboard.scale,
z: MyAvatar.position.z
},
width: this.bounds[i][BOUND_W] * keyboard.scale,
height: this.bounds[i][BOUND_H] * keyboard.scale,
subImage: {width: this.bounds[i][BOUND_W], height: this.bounds[i][BOUND_H], x: this.bounds[i][BOUND_X], y: (KEYBOARD_HEIGHT * this.keyState) + this.bounds[i][BOUND_Y]},
alpha: 1
});
} else {
Overlays.editOverlay(newOverlay, {
x: this.keyboard.getX() + this.bounds[i][BOUND_X] * keyboard.scale,
y: this.keyboard.getY() + this.bounds[i][BOUND_Y] * keyboard.scale,
width: this.bounds[i][BOUND_W] * keyboard.scale,
height: this.bounds[i][BOUND_H] * keyboard.scale,
subImage: {width: this.bounds[i][BOUND_W], height: this.bounds[i][BOUND_H], x: this.bounds[i][BOUND_X], y: (KEYBOARD_HEIGHT * this.keyState) + this.bounds[i][BOUND_Y]},
alpha: 1
});
Overlays.editOverlay(newOverlay, {
x: this.keyboard.getX() + this.bounds[i][BOUND_X] * keyboard.scale,
y: this.keyboard.getY() + this.bounds[i][BOUND_Y] * keyboard.scale,
width: this.bounds[i][BOUND_W] * keyboard.scale,
height: this.bounds[i][BOUND_H] * keyboard.scale,
subImage: {width: this.bounds[i][BOUND_W], height: this.bounds[i][BOUND_H], x: this.bounds[i][BOUND_X], y: (KEYBOARD_HEIGHT * this.keyState) + this.bounds[i][BOUND_Y]},
alpha: 1
});
}
this.overlays.push(newOverlay);
}
@ -181,8 +188,9 @@ KeyboardKey = (function(keyboard, keyProperties) {
Keyboard = (function() {
var tthis = this;
this.focussed_key = -1;
this.scale = windowDimensions.x / KEYBOARD_WIDTH;
this.scale = (windowDimensions.x / KEYBOARD_WIDTH) * KEYBOARD_SCALE_MULTIPLIER;
this.shift = false;
this.visible = true;
this.width = function() {
return KEYBOARD_WIDTH * tthis.scale;
};
@ -196,30 +204,30 @@ Keyboard = (function() {
return windowDimensions.y - this.height();
};
if (THREE_D_MODE) {
this.background = Overlays.addOverlay("billboard", {
scale: 1,
position: MyAvatar.position,
rotation: MyAvatar.rotation,
width: this.width(),
height: this.height(),
subImage: {width: KEYBOARD_WIDTH, height: KEYBOARD_HEIGHT, y: KEYBOARD_HEIGHT * KBD_BACKGROUND},
isFacingAvatar: false,
url: KEYBOARD_URL,
alpha: 1
});
this.background = Overlays.addOverlay("billboard", {
scale: 1,
position: MyAvatar.position,
rotation: MyAvatar.rotation,
width: this.width(),
height: this.height(),
subImage: {width: KEYBOARD_WIDTH, height: KEYBOARD_HEIGHT, y: KEYBOARD_HEIGHT * KBD_BACKGROUND},
isFacingAvatar: false,
url: KEYBOARD_URL,
alpha: 1
});
} else {
this.background = Overlays.addOverlay("image", {
x: this.getX(),
y: this.getY(),
width: this.width(),
height: this.height(),
subImage: {width: KEYBOARD_WIDTH, height: KEYBOARD_HEIGHT, y: KEYBOARD_HEIGHT * KBD_BACKGROUND},
imageURL: KEYBOARD_URL,
alpha: 1
});
this.background = Overlays.addOverlay("image", {
x: this.getX(),
y: this.getY(),
width: this.width(),
height: this.height(),
subImage: {width: KEYBOARD_WIDTH, height: KEYBOARD_HEIGHT, y: KEYBOARD_HEIGHT * KBD_BACKGROUND},
imageURL: KEYBOARD_URL,
alpha: 1
});
}
this.rescale = function() {
this.scale = windowDimensions.x / KEYBOARD_WIDTH;
this.scale = (windowDimensions.x / KEYBOARD_WIDTH) * KEYBOARD_SCALE_MULTIPLIER;
Overlays.editOverlay(tthis.background, {
x: this.getX(),
y: this.getY(),
@ -312,6 +320,28 @@ Keyboard = (function() {
}
};
this.show = function() {
tthis.visible = true;
tthis.updateVisibility();
};
this.hide = function() {
tthis.visible = false;
tthis.updateVisibility();
};
this.toggle = function() {
tthis.visible = !tthis.visible;
tthis.updateVisibility();
};
this.updateVisibility = function() {
Overlays.editOverlay(tthis.background, { visible: tthis.visible });
for (var i = 0; i < this.keys.length; i++) {
this.keys[i].updateVisibility();
}
};
this.onKeyPress = null;
this.onKeyRelease = null;
this.onSubmit = null;

4
examples/virtualKeyboardLocation.js
View file

@ -2,7 +2,7 @@
// virtualKeyboardTextEntityExample.js
// examples
//
// Created by Thijs Wenker on 11/18/14.
// Created by Thijs Wenker on 12/28/14.
// Copyright 2014 High Fidelity, Inc.
//
// Control a virtual keyboard using your favorite HMD.
@ -156,7 +156,7 @@ function keyPressEvent(event) {
if (event.key === SPACEBAR_CHARCODE) {
keyboard.pressFocussedKey();
} else if (event.key === ENTER_CHARCODE || event.key === RETURN_CHARCODE) {
print("Enter pressed");
keyboard.toggle();
}
}

24
examples/virtualKeyboardTextEntityExample.js
View file

@ -2,7 +2,7 @@
// virtualKeyboardTextEntityExample.js
// examples
//
// Created by Thijs Wenker on 11/18/14.
// Created by Thijs Wenker on 12/28/14.
// Copyright 2014 High Fidelity, Inc.
//
// Control a virtual keyboard using your favorite HMD.
@ -45,29 +45,15 @@ function deleteChar() {
updateTextOverlay();
}
}
function updateTextOverlay() {
var textLines = textText.split("\n");
var maxLineWidth = 0;
for (textLine in textLines) {
var lineWidth = Overlays.textSize(text, textLines[textLine]).width;
if (lineWidth > maxLineWidth) {
maxLineWidth = lineWidth;
}
}
var suggestedFontSize = (windowDimensions.x / maxLineWidth) * textFontSize * 0.90;
var maxFontSize = 190 / textLines.length;
var suggestedFontSize = (windowDimensions.x / Overlays.textSize(text, textLines).width) * textFontSize * 0.90;
var maxFontSize = 170 / textLines.length;
textFontSize = (suggestedFontSize > maxFontSize) ? maxFontSize : suggestedFontSize;
var topMargin = (250 - (textFontSize * textLines.length)) / 4;
Overlays.editOverlay(text, {text: textText, font: {size: textFontSize}, topMargin: topMargin});
var maxLineWidth = 0;
for (textLine in textLines) {
var lineWidth = Overlays.textSize(text, textLines[textLine]).width;
if (lineWidth > maxLineWidth) {
maxLineWidth = lineWidth;
}
}
Overlays.editOverlay(text, {leftMargin: (windowDimensions.x - maxLineWidth) / 2});
Overlays.editOverlay(text, {leftMargin: (windowDimensions.x - Overlays.textSize(text, textLines).width) / 2});
}
keyboard.onKeyPress = function(event) {