Skip to content

Commit

Permalink
avatar improvements
Browse files Browse the repository at this point in the history 
* busy indicator while avatar loading
* unload images that are no longer useful in avatar
  • Loading branch information
@remjey
remjey committed Mar 26, 2018
1 parent ed5a0c6 commit 2dfdd79
Show file tree
Hide file tree
Showing 2 changed files with 63 additions and 33 deletions.
48 changes: 39 additions & 9 deletions qml/pages/Main.qml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -99,6 +99,11 @@ Page {
width: Math.min(root.width / 3, Theme.itemSizeExtraLarge * 3)
height: width

BusyIndicator {
anchors.centerIn: parent
running: profilePicture.opacity != 1.0 || !profilePicture.available;
}

Canvas {
id: profilePicture
anchors.fill: parent
Expand All @@ -110,22 +115,46 @@ Page {

onImageLoaded: requestPaint();

property var imageCollection: ({})

onPaint: {
// TODO unload images maybe some day
var parts = Model.getAvatarParts();
var imagesLoaded = 0, imagesCount = 0;

// Mark all images as unused
for (var imageUrl in imageCollection) imageCollection[imageUrl] = false;

// Load images that are necessary, mark images still used
for (var part in parts) {
++imagesCount;
var partUrl = parts[part];
if (!partUrl) continue;
++imagesCount;
imageCollection[partUrl] = true;
if (!isImageLoaded(partUrl) && !isImageLoading(partUrl) && !isImageError(partUrl)) {
loadImage(partUrl);
} else if (isImageLoaded(partUrl) || isImageError(partUrl)) {
}
if (isImageLoaded(partUrl) || isImageError(partUrl)) {
++imagesLoaded;
}
}

if (imagesLoaded !== imagesCount) return;
if (opacity == 0.0) opacity = 1.0;
// Unload unused images
Object.keys(imageCollection).forEach(function (url) {
if (imageCollection[url] === false) {
unloadImage(url);
delete imageCollection[url];
}
});

// If images are still not loaded, do not display
if (imagesLoaded !== imagesCount) {
opacity = 0.0;
return;
}

// Render the avatar, show it
opacity = 1.0;

var ctx = getContext("2d");
if (!available || !ctx) {
print("Impossible to draw: ", available, "/", ctx)
Expand All @@ -135,17 +164,18 @@ Page {
context.setTransform(width / 140, 0, 0, height / 147, 0, 0);
ctx.clearRect(0, 0, 140, 147);

drawImageIfAvailable(ctx, parts["background"]);
if (parts.mountBody) drawImageIfAvailable(ctx, parts["mountBody"], 24, 18);
drawImageIfAvailable(ctx, parts.background, 0, 0);
drawImageIfAvailable(ctx, parts.mountBody, 24, 18);

// Draw parts in order
[ "chair", "back", "skin", "shirt", "armor", "body", "bangs", "base", "mustache",
"beard", "eyewear", "head", "headAccessory", "flower", "shield", "weapon", "zzz",
].every(function (part) {
drawImageIfAvailable(ctx, parts[part], 24, parts.mountBody ? 0 : 24);
return true;
});

if (parts.mountHead) drawImageIfAvailable(ctx, parts["mountHead"], 24, 18);
drawImageIfAvailable(ctx, parts["mountHead"], 24, 18);

drawImageIfAvailable(ctx, parts["pet"], 0, 48);

Expand All @@ -154,7 +184,7 @@ Page {

function drawImageIfAvailable(ctx, url, x, y) {
if (url && isImageLoaded(url)) {
ctx.drawImage(url, x || 0, y || 0);
ctx.drawImage(url, x, y);
}
}
}
Expand Down
48 changes: 24 additions & 24 deletions translations/harbour-habitsailor-fr.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -249,123 +249,123 @@ Toutes vos quotidiennes sont faites!</translation>
<translation>Profil</translation>
</message>
<message>
<location filename="../qml/pages/Main.qml" line="184"/>
<location filename="../qml/pages/Main.qml" line="214"/>
<source>Resting in the Inn</source>
<comment>status</comment>
<translation>Se repose à l&apos;auberge</translation>
</message>
<message>
<location filename="../qml/pages/Main.qml" line="196"/>
<location filename="../qml/pages/Main.qml" line="226"/>
<source>Gems</source>
<translation>Gemmes</translation>
</message>
<message>
<location filename="../qml/pages/Main.qml" line="202"/>
<location filename="../qml/pages/Main.qml" line="232"/>
<source>Gold</source>
<translation>Or</translation>
</message>
<message>
<location filename="../qml/pages/Main.qml" line="208"/>
<location filename="../qml/pages/Main.qml" line="238"/>
<source>Level</source>
<translation>Niveau</translation>
</message>
<message>
<location filename="../qml/pages/Main.qml" line="223"/>
<location filename="../qml/pages/Main.qml" line="253"/>
<source>Health</source>
<translation>Santé</translation>
</message>
<message>
<location filename="../qml/pages/Main.qml" line="230"/>
<location filename="../qml/pages/Main.qml" line="260"/>
<source>Experience</source>
<translation>Expérience</translation>
</message>
<message>
<location filename="../qml/pages/Main.qml" line="237"/>
<location filename="../qml/pages/Main.qml" line="267"/>
<source>Mana</source>
<translation>Mana</translation>
</message>
<message>
<location filename="../qml/pages/Main.qml" line="259"/>
<location filename="../qml/pages/Main.qml" line="289"/>
<source>Cron</source>
<translation>Cron</translation>
</message>
<message>
<location filename="../qml/pages/Main.qml" line="266"/>
<location filename="../qml/pages/Main.qml" line="296"/>
<source>The last cron ran yesterday or earlier. To start a new day, touch the button below. Before doing so, you may still check yesterday’s dailies.</source>
<translation>Le dernier cron a eu lieu hier ou avant. Pour commencer une nouvelle journée, touchez le bouton ci-dessous. Avant cela, vous pouvez encore cocher vos quotidiennes d’hier.</translation>
</message>
<message>
<location filename="../qml/pages/Main.qml" line="275"/>
<location filename="../qml/pages/Main.qml" line="305"/>
<source>Start new day</source>
<translation>Commencer ma journée</translation>
</message>
<message>
<location filename="../qml/pages/Main.qml" line="288"/>
<location filename="../qml/pages/Main.qml" line="318"/>
<source>Tasks</source>
<translation>Tâches</translation>
</message>
<message>
<location filename="../qml/pages/Main.qml" line="295"/>
<location filename="../qml/pages/Main.qml" line="325"/>
<source>Refill your health</source>
<translation>Restaurez votre santé</translation>
</message>
<message>
<location filename="../qml/pages/Main.qml" line="304"/>
<location filename="../qml/pages/Main.qml" line="334"/>
<source>Habits</source>
<translation>Habitudes</translation>
</message>
<message>
<location filename="../qml/pages/Main.qml" line="313"/>
<location filename="../qml/pages/Main.qml" line="343"/>
<source>Dailies</source>
<translation>Quotidiennes</translation>
</message>
<message>
<location filename="../qml/pages/Main.qml" line="322"/>
<location filename="../qml/pages/Main.qml" line="352"/>
<source>To-Dos</source>
<translation>À faire</translation>
</message>
<message>
<location filename="../qml/pages/Main.qml" line="329"/>
<location filename="../qml/pages/Main.qml" line="359"/>
<source>Rewards</source>
<translation>Récompenses</translation>
</message>
<message>
<location filename="../qml/pages/Main.qml" line="335"/>
<location filename="../qml/pages/Main.qml" line="365"/>
<source>Health Potion</source>
<translation>Potion de santé</translation>
</message>
<message>
<location filename="../qml/pages/Main.qml" line="336"/>
<location filename="../qml/pages/Main.qml" line="366"/>
<source>Costs %1 Gold</source>
<translation>Coûte %1 pièce(s) d’or</translation>
</message>
<message>
<location filename="../qml/pages/Main.qml" line="338"/>
<location filename="../qml/pages/Main.qml" line="368"/>
<source>Buying Health Potion</source>
<translation>Achat d’une Potion de Santé</translation>
</message>
<message>
<location filename="../qml/pages/Main.qml" line="347"/>
<location filename="../qml/pages/Main.qml" line="377"/>
<source>Custom Rewards</source>
<translation>Récompenses personnalisées</translation>
</message>
<message>
<location filename="../qml/pages/Main.qml" line="359"/>
<location filename="../qml/pages/Main.qml" line="389"/>
<source>Check Out of Inn</source>
<translation>Quitter l’auberge</translation>
</message>
<message>
<location filename="../qml/pages/Main.qml" line="359"/>
<location filename="../qml/pages/Main.qml" line="389"/>
<source>Rest in the Inn</source>
<translation>Se reposer à l’auberge</translation>
</message>
<message>
<location filename="../qml/pages/Main.qml" line="360"/>
<location filename="../qml/pages/Main.qml" line="390"/>
<source>Checking out of inn</source>
<translation>Quitter l’auberge</translation>
</message>
<message>
<location filename="../qml/pages/Main.qml" line="360"/>
<location filename="../qml/pages/Main.qml" line="390"/>
<source>Resting in the inn</source>
<translation>Se reposer à l’auberge</translation>
</message>
Expand Down

0 comments on commit 2dfdd79

Please sign in to comment.