suzanne.soy/2011-m1s2-ter
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Ajustement de la taille des icones

Browse Source
This commit is contained in:
Bertrand BRUN 2011-04-28 12:56:07 +02:00
parent 447573e593
commit e3b7233e5d
3 changed files with 48 additions and 33 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
code/serveur/php/jeu.html
View File

@ -61,35 +61,23 @@ body {
</div>
<div class="screen" id="frontpage">
<div id="title-block"></div>
<div id="game-icon-block"></div>
<div id="prefs-icon-block"></div>
<div id="connection-icon-block"></div>
<div id="about-icon-block"></div>
<div id="game-text-block"></div>
<div id="prefs-text-block"></div>
<div id="connection-text-block"></div>
<div id="about-text-block"></div>
<span id="title">PtiClic</span>
<div class="frontpage-button game">
<img class="icon" alt="" src="ressources/img/mode_normal.png" />
<br />
<span class="text">Jouer</span>
<div><img class="icon" alt="" src="ressources/img/mode_normal.png" /></div>
<div class="text">Jouer</div>
</div>
<div class="frontpage-button prefs">
<img class="icon" alt="" src="ressources/img/config.png" />
<br />
<span class="text">Configuration</span>
<div><img class="icon" alt="" src="ressources/img/config.png" /></div>
<div class="text">Configuration</div>
</div>
<div class="frontpage-button connection">
<img class="icon" alt="" src="ressources/img/config.png" />
<br />
<span class="text">Connexion</span>
<div><img class="icon" alt="" src="ressources/img/config.png" /></div>
<div class="text">Connexion</div>
</div>
<div class="frontpage-button about">
<img class="icon" alt="" src="ressources/img/rel/default.png" />
<br />
<span class="text">A Propos</span>
<div><img class="icon" alt="" src="ressources/img/rel/default.png" /></div>
<div class="text">A Propos</div>
</div>
</div>
<div class="screen" id="score">

6
code/serveur/php/ressources/my-extensions.js
View File

@ -25,6 +25,12 @@ $.fn.maxHeight = function() {
return max;
}
$.fn.sumHeight = function() {
sum = 0;
this.each(function(i,e){ sum += $(e).height(); });
return sum;
}
$.fn.fitFont = function(w, h, minFont, maxFont) {
var oldpos = this.css("position");
this.css({

47
code/serveur/php/ressources/pticlic.js
View File

@ -37,7 +37,10 @@ function hashchange() {
function jss() {
var w = $(window).width();
var h = $(window).height();
var iconSize = 72;
var iconSize;
if (h > 600) iconSize = 72;
else if(h > 500) iconSize = 48;
else iconSize = 36;
$(".screen")
.wh(w, h)
@ -88,25 +91,43 @@ frontpage = {};
frontpage.jss = function(w, h, iconSize) {
var fp = $("#frontpage.screen");
var $fp = function() { return fp.find.apply(fp,arguments); };
var nbIcons = $fp(".icon").size();
var nbRows = Math.ceil(nbIcons / 2)
var ww = w - 2 * iconSize;
var hh = h - nbRows * iconSize;
var titleHeight = hh*0.4;
var labelHeight = hh*0.4 / nbRows;
var buttonHeight = labelHeight + iconSize;
var buttonWidth = Math.max(w*0.25,iconSize);
var freeSpace = h - titleHeight;
$fp("#title-block")
.wh(w*0.5, h*0.2)
.wh(w*0.5, titleHeight)
.north($("#frontpage.screen").north());
$fp("#title")
.fitIn("#title-block", 0.2);
$fp(".text")
.fitFont(w*0.25,(h-(iconSize*4))*0.8*0.5,10);
.fitFont(buttonWidth, labelHeight, 10);
$fp(".icon")
.wh(iconSize);
$fp(".frontpage-button")
.width(w*0.4);
$fp(".frontpage-button.game")
.northEast({left:w*0.45,top:h*0.3});
$fp(".frontpage-button.about")
.northWest({left:w*0.55,top:h*0.3});
$fp(".frontpage-button.connection")
.southEast({left:w*0.45,top:h*0.8});
$fp(".frontpage-button.prefs")
.southWest({left:w*0.55,top:h*0.8});
.css('text-align', 'center')
.width(buttonWidth);
$fp(".frontpage-button > div").css('display', 'block');
$fp(".frontpage-button").each(function(i,e){
e=$(e);
var currentRow = Math.floor(i/2);
var currentColumn = i % 2;
var interIconSpace = (freeSpace - nbRows * buttonHeight) / (nbRows + 1);
var iconOffset = titleHeight + ((currentRow+1) * interIconSpace) + (currentRow * buttonHeight);
if (currentColumn == 0) {
e.northEast({left:ww*0.45,top:iconOffset});
} else {
e.northWest({left:ww*0.55,top:iconOffset});
}
});
};
frontpage.enter = function () {