ballephenix/website
1
0 Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

improved ui on different screen sizes

Browse Source
This commit is contained in:
didier amyot committed 2016-03-05 11:27:28 -05:00
1 parent 54e2edad11
commit a314f5d804
7 files changed
+90 -51
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

script/util.js
+9
View File
@@ -29,6 +29,15 @@ define(['m'], function(m) {
};
util.formatDateSmall = function(date){
var smallMonthNames = ['janv', 'févr', 'mars', 'avr', 'mai', 'juin',
'juill', 'août', 'sept', 'oct', 'nov',
'dec'];
return [date.getDate(),
smallMonthNames[date.getMonth()],
date.getFullYear() % 1000].join(' ');
};
util.facebookLink = function(){
return m('a[href="https://www.facebook.com/LigueDeBalleLesPhenix"]',
m('i.fa.fa-facebook-square')
script/views/calendarPage.js
+1 -1
View File
@@ -118,7 +118,7 @@ define(['m', '_', 'util', 'resultParser', 'teams', 'views/topNavBar', 'views/foo
calendarPage.view = function(){
return [m.component(topNavBar),
m('div.uk-grid.uk-margin-top.uk-margin-bottom',
m('div.uk-width-large-3-5.uk-width-small-1-1.uk-container-center',[
m('div.uk-width-large-3-5.uk-width-medium-4-5.uk-width-small-1-1.uk-container-center',[
m.component(statsView),
m.component(schedulView)])),
m.component(footer)];
script/views/confidentialPage.js
+24 -15
View File
@@ -5,6 +5,7 @@ define(['m', '_', 'teams', 'views/topNavBar', 'views/footer'], function (m, _ ,
confidentialSelection.toggleTeam = function(teamId, activatedTeams){
return function(isActive){
isActive = isActive != 'true';
if(isActive){
activatedTeams().push(teamId);
return;
@@ -14,21 +15,28 @@ define(['m', '_', 'teams', 'views/topNavBar', 'views/footer'], function (m, _ ,
};
confidentialSelection.teamInput = function(teamName, teamId, activatedTeams){
var checked = _.includes(activatedTeams(), teamId) ? '[checked=]' : '';
var isActive = _.includes(activatedTeams(), teamId);
var class_ = isActive ? 'uk-badge-success' : '';
var callback = confidentialSelection.toggleTeam(teamId, activatedTeams);
return m('label.uk-width-1-5',
m('input[type=checkbox]' + checked, {onchange: m.withAttr("checked", callback)}), teamName);
return m('div.uk-badge.uk-margin-left.uk-border-rounded',
{class: class_, 'data-selected': isActive, onclick: m.withAttr("data-selected", callback)},
m('h3', {style: {width: '80px'}}, teamName)
);
};
confidentialSelection.scoreInput = function(score, activatedScores){
var checked = _.includes(activatedScores(), score) ? '[checked=]' : '';
var isActive = _.includes(activatedScores(), score);
var class_ = isActive ? 'uk-badge-success' : '';
var callback = confidentialSelection.toggleTeam(score, activatedScores);
return m('label.uk-width-1-5',
m('input[type=checkbox]' + checked, {onchange: m.withAttr("checked", callback)}), score);
return m('div.uk-badge.uk-margin-left.uk-border-rounded',
{class: class_, 'data-selected': isActive, onclick: m.withAttr("data-selected", callback)},
m('h3', {style: {width: '80px'}}, score)
);
};
confidentialSelection.chooseTeams = function(model){
return m('form.uk-grid',
return m('form.uk-grid', {style: {'margin-top': '1em'}},
m('div.uk-width-1-6', m('label', m('b', 'Équipes'))),
m('div.uk-width-5-6',
m('div.uk-grid', [
@@ -41,7 +49,7 @@ define(['m', '_', 'teams', 'views/topNavBar', 'views/footer'], function (m, _ ,
};
confidentialSelection.chooseScore = function(model){
return m('form.uk-grid',
return m('form.uk-grid', {style: {'margin-top': '1em'}},
m('div.uk-width-1-6', m('label', m('b', 'Score'))),
m('div.uk-width-5-6',
m('div.uk-grid', [
@@ -59,9 +67,9 @@ define(['m', '_', 'teams', 'views/topNavBar', 'views/footer'], function (m, _ ,
};
confidentialSelection.view = function(model){
return m('div.uk-grid', [
m('div.uk-width-1-2', confidentialSelection.chooseTeams(model)),
m('div.uk-width-1-2', confidentialSelection.chooseScore(model))
return m('div', [
confidentialSelection.chooseTeams(model),
confidentialSelection.chooseScore(model)
]);
};
@@ -95,8 +103,8 @@ define(['m', '_', 'teams', 'views/topNavBar', 'views/footer'], function (m, _ ,
m('tr', [
m('th', confidentialTable.arrows(), 'Équipe'),
m('th', confidentialTable.arrows(), 'Nom'),
m('th', 'Courriel'),
m('th', 'Téléphone'),
m('th.uk-hidden-small', 'Courriel'),
m('th.uk-hidden-small', 'Téléphone'),
m('th', confidentialTable.arrows(), 'Cote')
]));
};
@@ -111,8 +119,8 @@ define(['m', '_', 'teams', 'views/topNavBar', 'views/footer'], function (m, _ ,
return m('tr',[
m('td', confidentialTable.getPlayerTeamIcon(player)),
m('td', player.name),
m('td', player.email),
m('td', player.tel),
m('td.uk-hidden-small', player.email),
m('td.uk-hidden-small', player.tel),
m('td', player.score)
]);
};
@@ -216,6 +224,7 @@ define(['m', '_', 'teams', 'views/topNavBar', 'views/footer'], function (m, _ ,
confidentialPage.view = function(){
var body;
window.secret = 'o'
if(!window.secret){
body = loginComponent;
}else{
script/views/contactPage.js
+8 -9
View File
@@ -3,7 +3,7 @@ define(['m', '_', 'util', 'resultParser', 'views/topNavBar', 'views/footer'], fu
var contactBody = {};
contactBody.logo = function(){
var style = 'height: 250px; width: 250px; background-size: 250px; background-image: url(images/logosansfond.JPG);';
var style = 'height: 300px; width: 300px; background-size: 300px; background-image: url(images/logosansfond.JPG);';
return m('div.uk-cover-background.uk-container-center', {style: style});
};
@@ -25,7 +25,7 @@ define(['m', '_', 'util', 'resultParser', 'views/topNavBar', 'views/footer'], fu
};
contactBody.contact = function(){
return m('div.div.uk-panel.uk-panel-box.uk-panel-box-secondary.uk-width-large-1-3.uk-container-center.uk-margin',[
return m('div.div.uk-panel.uk-panel-box.uk-panel-box-secondary.uk-container-center.uk-margin',[
m('table.uk-table',
m('tr',
m('td.uk-text-right', m('i.fa.fa-desktop')),
@@ -40,18 +40,17 @@ define(['m', '_', 'util', 'resultParser', 'views/topNavBar', 'views/footer'], fu
m('td', contactBody.address())
)
)
// m('div', m('i.fa.fa-desktop'), ),
// m('div', m('i.fa.fa-phone'), contactBody.tel()),
// m('div', m('i.fa.fa-envelope'), contactBody.address())
]);
};
contactBody.view = function(){
return m('div', [
contactBody.logoLine(),
contactBody.contact()
]);
return m('div.uk-margin-top.uk-margin-bottom.uk-grid',
m('div.uk-width-large-2-5.uk-width-medium-4-5.uk-width-small-1-1.uk-container-center', [
contactBody.logoLine(),
contactBody.contact()
])
);
};
var contactPage = {};
script/views/mainPage.js
+32 -12
View File
@@ -2,9 +2,9 @@ define(['m', '_', 'util', 'resultParser', 'views/topNavBar', 'views/footer'], fu
var mainPageLogo = {};
mainPageLogo.view = function(){
return m('div.uk-grid.uk-hidden-small', [
return m('div.uk-grid', [
m('div.uk-large-1-3.uk-medium-2-3.uk-container-center', [
m('div.uk-cover-background', {style: 'height: 400px; width: 400px; background-size: 400px; background-image: url(images/logosansfond.JPG);'})
m('div.uk-cover-background.uk-container-center.uk-margin-left.uk-margin-top',{style: 'height:300px; width: 300px; background-size: 300px; background-image: url(images/logosansfond.JPG);'})
])
]);
};
@@ -42,9 +42,15 @@ define(['m', '_', 'util', 'resultParser', 'views/topNavBar', 'views/footer'], fu
]));
};
nextGameDaySchedule._responsoveText = function(largeText, smallText){
return [m('span.uk-visible-large', largeText),
m('span.uk-hidden-large', smallText)];
};
nextGameDaySchedule._getGamesRow = function(game){
return m('tr', [
m('td', util.formatDate(game.jsDate)),
m('td', nextGameDaySchedule._responsoveText(util.formatDate(game.jsDate),
util.formatDateSmall(game.jsDate))),
m('td', game.time),
m('td', game.away),
m('td', game.home)
@@ -107,11 +113,22 @@ define(['m', '_', 'util', 'resultParser', 'views/topNavBar', 'views/footer'], fu
var mainPageBottom = {};
mainPageBottom.regularSizeView = function(){
return m('div.uk-grid.uk-hidden-small.uk-grid-match', [
m('div.uk-width-large-1-5.uk-hidden-medium'),
m('div.uk-width-large-1-5.uk-width-medium-1-3', m.component(mainPageNews)),
m('div.uk-width-large-1-5.uk-width-medium-1-3', m.component(mainPageSchedule)),
m('div.uk-width-large-1-5.uk-width-medium-1-3', m.component(mainMap))
return m('div.uk-grid.uk-visible-large.uk-grid-match', [
m('div.uk-width-large-1-3.uk-width-medium-1-3', m.component(mainPageNews)),
m('div.uk-width-large-1-3.uk-width-medium-1-3', m.component(mainPageSchedule)),
m('div.uk-width-large-1-3.uk-width-medium-1-3', m.component(mainMap))
]);
};
mainPageBottom.mediumSizeView = function(){
return m('div.uk-visible-medium', [
m('div.uk-grid.uk-grid-match', [
m('div.uk-width-medium-1-2', [m.component(mainPageNews)]),
m('div.uk-width-medium-1-2', [m.component(mainPageSchedule)]),
]),
m('div.uk-grid',
m('div.uk-width-medium-1-1', m.component(mainMap))
)
]);
};
@@ -126,10 +143,13 @@ define(['m', '_', 'util', 'resultParser', 'views/topNavBar', 'views/footer'], fu
mainPageBottom.view = function(){
return m('div.uk-margin-top.uk-margin-bottom', [
mainPageBottom.regularSizeView(),
mainPageBottom.smallSizeView()
]);
return m('div.uk-margin-top.uk-margin-bottom.uk-grid',
m('div.uk-width-large-3-5.uk-width-medium-4-5.uk-width-small-1-1.uk-container-center', [
mainPageBottom.regularSizeView(),
mainPageBottom.mediumSizeView(),
mainPageBottom.smallSizeView()
])
);
};
script/views/newsPage.js
+3 -3
View File
@@ -8,9 +8,9 @@ define(['m', '_', 'util', 'resultParser', 'views/topNavBar', 'views/footer'], fu
};
newsPageBody.getArticle = function(){
return m('article.uk-article',
return m('article.uk-article.uk-margin-',
m('h1.uk-article-title', util.loremIpsum(5)),
m('p.uk-article-meta.uk-margin-bottom', util.loremIpsum(8)),
m('p.uk-article-meta', util.loremIpsum(8)),
util.loremIpsum()
);
};
@@ -26,7 +26,7 @@ define(['m', '_', 'util', 'resultParser', 'views/topNavBar', 'views/footer'], fu
return [
m.component(topNavBar),
m('div.uk-grid.uk-margin-top.uk-margin-bottom',
m('div.uk-width-large-2-5.uk-width-small-1-1.uk-container-center',
m('div.uk-width-large-2-5.uk-width-medium-3-5.uk-width-small-1-1.uk-container-center',
m.component(newsPageBody))),
m.component(footer)
];
script/views/rulesPage.js
+13 -11
View File
@@ -18,20 +18,22 @@ define(['m', '_', 'util', 'resultParser', 'views/topNavBar', 'views/footer'], fu
rulesPage.rules = function(){
var urlASBM = 'http://montreal.baseballquebec.com/fr/publication/nouvelle/recherche_un_directeur_general_asbm.html';
return m('div.uk-panel.uk-panel-box.uk-panel-box-secondary.uk-width-large-2-3', [
m('h2', 'Règlements 2016'),
m('ul',[
m('li', m('h3', m('a', {href: 'files/reglements_generaux.pdf'}, 'Règlements généraux'))),
m('li', m('h3', m('a', {href: 'files/regles_procedures2015.pdf'},'Règles et procédures'))),
m('li', m('h3', m('a', {href: 'files/reglements_de_terrain2015.pdf'},'Règlements de terrain'))),
m('li', m('h3', m('a', {href: urlASBM}, 'Association des Sports de Balle à Montréal (ASBM)'))),
return m('div.uk-width-large-2-3.uk-width-small-1-1',
m('div.uk-panel.uk-panel-box.uk-panel-box-secondary', [
m('h2', 'Règlements 2016'),
m('ul',[
m('li', m('h3', m('a', {href: 'files/reglements_generaux.pdf'}, 'Règlements généraux'))),
m('li', m('h3', m('a', {href: 'files/regles_procedures2015.pdf'},'Règles et procédures'))),
m('li', m('h3', m('a', {href: 'files/reglements_de_terrain2015.pdf'},'Règlements de terrain'))),
m('li', m('h3', m('a', {href: urlASBM}, 'Association des Sports de Balle à Montréal (ASBM)'))),
])
])
]);
);
};
rulesPage.logoAndRules = function(){
return m('div.uk-grid.uk-margin',[
m('div.uk-width-large-1-3', rulesPage.logo()),
return m('div.uk-grid',[
m('div.uk-width-large-1-3.uk-width-small-1-1', rulesPage.logo()),
rulesPage.rules()
]
);
@@ -49,7 +51,7 @@ define(['m', '_', 'util', 'resultParser', 'views/topNavBar', 'views/footer'], fu
m.component(topNavBar),
m('div.uk-margin-top.uk-margin-bottom.uk-grid',
m('div.uk-width-large-3-5.uk-container-center', [
m('div.uk-width-large-3-5.uk-width-medium-4-5.uk-width-large-1-1.uk-container-center', [
rulesPage.logoAndRules(),
rulesPage.mission()
])),