Mirrors/overte-Armored-Dragon
3
0
Fork 0
mirror of https://github.com/Armored-Dragon/overte.git synced 2025-03-11 16:13:16 +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_WIDTH = 33.9;
CURSOR_HEIGHT = 33.9; CURSOR_HEIGHT = 33.9;
KEYBOARD_SCALE_MULTIPLIER = 0.50;
// VIEW_ANGLE can be adjusted to your likings, the smaller the faster movement. // 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. // Try setting it to 60 if it goes too fast for you.
const VIEW_ANGLE = 40.0; 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() { this.rescale = function() {
for (var i = 0; i < tthis.bounds.length; i++) { for (var i = 0; i < tthis.bounds.length; i++) {
Overlays.editOverlay(tthis.overlays[i], { Overlays.editOverlay(tthis.overlays[i], {
@ -153,26 +160,26 @@ KeyboardKey = (function(keyboard, keyProperties) {
for (var i = 0; i < this.bounds.length; i++) { for (var i = 0; i < this.bounds.length; i++) {
var newOverlay = Overlays.cloneOverlay(this.keyboard.background); var newOverlay = Overlays.cloneOverlay(this.keyboard.background);
if (THREE_D_MODE) { if (THREE_D_MODE) {
Overlays.editOverlay(newOverlay, { Overlays.editOverlay(newOverlay, {
position: { position: {
x: MyAvatar.position.x,// + this.bounds[i][BOUND_X] * 0.01,// /*+ this.keyboard.getX()*/ + this.bounds[i][BOUND_X] * keyboard.scale, 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, 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 z: MyAvatar.position.z
}, },
width: this.bounds[i][BOUND_W] * keyboard.scale, width: this.bounds[i][BOUND_W] * keyboard.scale,
height: this.bounds[i][BOUND_H] * 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]}, 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 alpha: 1
}); });
} else { } else {
Overlays.editOverlay(newOverlay, { Overlays.editOverlay(newOverlay, {
x: this.keyboard.getX() + this.bounds[i][BOUND_X] * keyboard.scale, x: this.keyboard.getX() + this.bounds[i][BOUND_X] * keyboard.scale,
y: this.keyboard.getY() + this.bounds[i][BOUND_Y] * keyboard.scale, y: this.keyboard.getY() + this.bounds[i][BOUND_Y] * keyboard.scale,
width: this.bounds[i][BOUND_W] * keyboard.scale, width: this.bounds[i][BOUND_W] * keyboard.scale,
height: this.bounds[i][BOUND_H] * 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]}, 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 alpha: 1
}); });
} }
this.overlays.push(newOverlay); this.overlays.push(newOverlay);
} }
@ -181,8 +188,9 @@ KeyboardKey = (function(keyboard, keyProperties) {
Keyboard = (function() { Keyboard = (function() {
var tthis = this; var tthis = this;
this.focussed_key = -1; this.focussed_key = -1;
this.scale = windowDimensions.x / KEYBOARD_WIDTH; this.scale = (windowDimensions.x / KEYBOARD_WIDTH) * KEYBOARD_SCALE_MULTIPLIER;
this.shift = false; this.shift = false;
this.visible = true;
this.width = function() { this.width = function() {
return KEYBOARD_WIDTH * tthis.scale; return KEYBOARD_WIDTH * tthis.scale;
}; };
@ -196,30 +204,30 @@ Keyboard = (function() {
return windowDimensions.y - this.height(); return windowDimensions.y - this.height();
}; };
if (THREE_D_MODE) { if (THREE_D_MODE) {
this.background = Overlays.addOverlay("billboard", { this.background = Overlays.addOverlay("billboard", {
scale: 1, scale: 1,
position: MyAvatar.position, position: MyAvatar.position,
rotation: MyAvatar.rotation, rotation: MyAvatar.rotation,
width: this.width(), width: this.width(),
height: this.height(), height: this.height(),
subImage: {width: KEYBOARD_WIDTH, height: KEYBOARD_HEIGHT, y: KEYBOARD_HEIGHT * KBD_BACKGROUND}, subImage: {width: KEYBOARD_WIDTH, height: KEYBOARD_HEIGHT, y: KEYBOARD_HEIGHT * KBD_BACKGROUND},
isFacingAvatar: false, isFacingAvatar: false,
url: KEYBOARD_URL, url: KEYBOARD_URL,
alpha: 1 alpha: 1
}); });
} else { } else {
this.background = Overlays.addOverlay("image", { this.background = Overlays.addOverlay("image", {
x: this.getX(), x: this.getX(),
y: this.getY(), y: this.getY(),
width: this.width(), width: this.width(),
height: this.height(), height: this.height(),
subImage: {width: KEYBOARD_WIDTH, height: KEYBOARD_HEIGHT, y: KEYBOARD_HEIGHT * KBD_BACKGROUND}, subImage: {width: KEYBOARD_WIDTH, height: KEYBOARD_HEIGHT, y: KEYBOARD_HEIGHT * KBD_BACKGROUND},
imageURL: KEYBOARD_URL, imageURL: KEYBOARD_URL,
alpha: 1 alpha: 1
}); });
} }
this.rescale = function() { this.rescale = function() {
this.scale = windowDimensions.x / KEYBOARD_WIDTH; this.scale = (windowDimensions.x / KEYBOARD_WIDTH) * KEYBOARD_SCALE_MULTIPLIER;
Overlays.editOverlay(tthis.background, { Overlays.editOverlay(tthis.background, {
x: this.getX(), x: this.getX(),
y: this.getY(), 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.onKeyPress = null;
this.onKeyRelease = null; this.onKeyRelease = null;
this.onSubmit = null; this.onSubmit = null;

4
examples/virtualKeyboardLocation.js
View file

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