\
+
\
+
\
' +
text + '
\
@@ -342,7 +372,7 @@ function drawNewCard(id, text, x, y, rot, colour, type, sticker, animationspeed)
function() {
rotateCardColor(id, $(this).data('colour'));
});
-
+
card.children('.content').editable({
multiline: true,
@@ -409,7 +439,8 @@ function addSticker(cardId, stickerId) {
// cards
//----------------------------------
function createCard(id, text, x, y, rot, colour, type) {
- drawNewCard(id, text, x, y, rot, colour, type, null, null);
+ const username = getCookie('adh-username');
+ drawNewCard(id, text, x, y, rot, colour, type, null, null, username);
var action = "createCard";
@@ -420,7 +451,8 @@ function createCard(id, text, x, y, rot, colour, type) {
y: y,
rot: rot,
colour: colour,
- type: type
+ type: type,
+ username: getCookie('adh-username')
};
sendAction(action, data);
@@ -452,6 +484,7 @@ function rotateCardColor(id, currentColour) {
var newIndex = index + 1;
newIndex = newIndex % (stickyColours.length + 1);
+ $('#'+id).removeClass(currentColour).addClass(cardColours[newIndex]);
$('#'+id).children('.card-image').attr("src", 'images/' + cardColours[newIndex] + '-card.png');
$('#'+id).children('.change-colour').data('colour',cardColours[newIndex]);
@@ -480,6 +513,7 @@ function initCards(cardArray) {
card.type,
card.sticker,
0,
+ card.username
);
}
@@ -492,67 +526,106 @@ function initCards(cardArray) {
// cols
//----------------------------------
-function drawNewColumn(columnName) {
+function drawNewColumn() {
var cls = "col";
- if (totalcolumns === 0) {
+ var drawn_col_number = $('tr:first').find('td').length - 1;
+
+ if (drawn_col_number === 0) {
cls = "col first";
}
- $('#icon-col').before('
' + columnName + ' | ');
+ var columnName = 'New';
+ var colId = drawn_col_number + 1;
- $('.editable').editable({
- multiline: false,
- save: function(content) {
- onColumnChange(this.id, content.target.innerText);
- }
- });
+ $('tr').each(function() {
+ var newTd = $('
' + columnName + ' | ');
+ $( this ).find('#icon-col').before(newTd);
+
+ newTd.hide();
+ $( this ).find('.col:last').fadeIn(1500);
+ });
- $('.col:last').fadeIn(1500);
+ /*$('#icon-col').before('
' + columnName + ' | ');*/
- totalcolumns++;
+ refreshEditable();
+
+ //$('.col:last').fadeIn(1500);
}
-function onColumnChange(id, text) {
- var names = Array();
+function refreshEditable(){
+ $('.editable').editable({
+ multiline: false,
+ save: function(content) {
+ const colId = parseInt($(this).attr('data-col'));
+ const rowId = parseInt($(this).parents('tr:first').attr('data-row'));
+ onColumnChange(colId, rowId, content.target.innerText);
+ }
+ });
+}
- //console.log(id + " " + text );
+function setCellText(colId, rowId, text){
+ const row = $('tr[data-row=' + rowId + ']');
+ const col = row.find('h2[data-col=' + colId + ']');
+ col.text(text);
+}
- //Get the names of all the columns right from the DOM
- $('.col').each(function() {
+function onColumnChange(colId, rowId, text) {
+ columns[colId - 1][rowId - 1] = text;
+ updateColumns(columns);
+}
- //get ID of current column we are traversing over
- var thisID = $(this).children("h2").attr('id');
+function displayRemoveAllColumns() {
+ if (columns.length <= 0) return false;
- if (id == thisID) {
- names.push(text);
- } else {
- names.push($(this).text());
+ $('.col').fadeOut(150,
+ function() {
+ $(this).remove();
}
+ );
+}
+
+function displayRemoveColumn() {
+ if (columns.length <= 0) return false;
+
+ $('tr').each(function(){
+ $(this).find('.col:last').fadeOut(150,
+ function() {
+ $(this).remove();
+ }
+ );
});
- updateColumns(names);
}
-function displayRemoveColumn() {
- if (totalcolumns <= 0) return false;
+function displayRemoveRow() {
+ if (columns.length <= 0) return false;
+ if (columns[0].length <= 1) return false;
- $('.col:last').fadeOut(150,
+ $('tr:last').fadeOut(150,
function() {
$(this).remove();
}
);
- totalcolumns--;
}
-function createColumn(name) {
- if (totalcolumns >= 8) return false;
+function createColumn() {
+ if (columns.length >= 8) return false;
- drawNewColumn(name);
- columns.push(name);
+ drawNewColumn();
+ if (columns.length){
+ // Create a copy of the first col
+ var newCol = columns[0].map((x) => x);
+ columns.push(newCol);
+ }
+ else {
+ columns.push(['New']);
+ }
var action = "updateColumns";
@@ -561,8 +634,19 @@ function createColumn(name) {
sendAction(action, data);
}
+function deleteAllColumns() {
+ if (columns.length <= 0) return false;
+
+ displayRemoveAllColumns();
+ columns = [];
+
+ var action = "updateColumns";
+ var data = columns;
+ sendAction(action, data);
+}
+
function deleteColumn() {
- if (totalcolumns <= 0) return false;
+ if (columns.length <= 0) return false;
displayRemoveColumn();
columns.pop();
@@ -574,6 +658,72 @@ function deleteColumn() {
sendAction(action, data);
}
+
+function deleteRow() {
+ if (columns.length <= 0) return false;
+
+ // Delete all cols if last line
+ if (columns[0].length == 1){
+ return deleteAllColumns();
+ }
+
+ if (columns[0].length <= 1) return false;
+
+ displayRemoveRow();
+ columns.forEach(function(col){
+ col.pop();
+ });
+
+ var action = "updateColumns";
+
+ var data = columns;
+
+ sendAction(action, data);
+}
+
+
+function drawNewRow() {
+
+ var line = $('tr:last');
+ var newLine = line.clone();
+ newLine.find('.col').css('opacity', '1');
+ var latestRowId = parseInt(newLine.attr('data-row'));
+ newLine.attr('data-row', latestRowId + 1);
+ newLine.insertAfter(line);
+ newLine.hide();
+ newLine.fadeIn(1500);
+
+ rowCount = $('tr').length;
+
+ $('tr td:last-child').hide();
+ $('tr:first td:last-child').attr('rowspan', rowCount).show();
+
+ refreshEditable();
+
+}
+
+function createRow() {
+ if (!columns.length){
+ return createColumn();
+ }
+ const totalrows = columns[0].length;
+
+ if (totalrows >= 4) return false;
+
+ drawNewRow();
+
+ columns.forEach(function(col){
+ col.push('New');
+ });
+
+ var action = "updateColumns";
+
+ var data = columns;
+
+ sendAction(action, data);
+
+}
+
function updateColumns(c) {
columns = c;
@@ -590,18 +740,27 @@ function deleteColumns(next) {
}
function initColumns(columnArray) {
- totalcolumns = 0;
columns = columnArray;
+ // Remove all cols
$('.col').remove();
+ // Remove all rows except first
+ $("tr:not(:first)").remove();
+
+ // Init cols and rows
+ if (columnArray.length){
+ columnArray.forEach(drawNewColumn);
+ for (var i=0; i < columnArray[0].length - 1; i++)
+ drawNewRow();
+ }
- for (var i in columnArray) {
- column = columnArray[i];
-
- drawNewColumn(
- column
- );
+ for (var i in columns){
+ const col = columns[i];
+ for (var j in col){
+ setCellText(parseInt(i)+1, parseInt(j)+1, col[j]);
+ }
}
+
}
@@ -611,6 +770,14 @@ function changeThemeTo(theme) {
}
+function changeBgTo(bgUrl) {
+ $("#board-doodles").css(
+ "background-image",
+ "url('" + bgUrl + "')"
+ );
+}
+
+
//////////////////////////////////////////////////////////
////////// NAMES STUFF ///////////////////////////////////
//////////////////////////////////////////////////////////
@@ -644,6 +811,30 @@ function setName(name) {
setCookie('scrumscrum-username', name, 365);
}
+function updateUserInfo() {
+ const username = getCookie('adh-username');
+ const userEmail = getCookie('adh-email');
+ const userAvatar = getCookie('adh-avatar');
+
+ if (!username)
+ return false;
+
+ sendAction('setUserInfo', {
+ username,
+ userEmail,
+ userAvatar
+ });
+ userCache[username] = {
+ username,
+ userEmail,
+ userAvatar
+ };
+}
+
+function updateUserCache(users) {
+ userCache = users;
+}
+
function displayInitialUsers(users) {
for (var i in users) {
//console.log(users);
@@ -768,7 +959,7 @@ function adjustMarker(originalSize, newSize) {
$("#marker,#eraser").css('top','');
// console.log( "markerleft: " + $('#marker').css('left') );
// console.log( "size: " + newSize.width);
-
+
//if either has gone over the edge of the board, just bring it in
if ( parseFloat($('#marker').css('left')) > newSize.width - 100)
{
@@ -780,6 +971,18 @@ function adjustMarker(originalSize, newSize) {
}
}
+
+function fullscreenMode() {
+ var offsets = calcCardOffset();
+ var size = {
+ width: $(window).width() - 32,
+ height: $(window).height() - 85
+ };
+ resizeBoard(size);
+ boardResizeHappened(null, size);
+ adjustCard(offsets, true);
+}
+
//////////////////////////////////////////////////////////
//////////////////////////////////////////////////////////
@@ -809,7 +1012,7 @@ $(function() {
randomCardColour(),
"card");
});
-
+
$("#create-sticky")
.click(function() {
var rotation = Math.random() * 4 - 2; //add a bit of random rotation (+/- 2deg)
@@ -825,6 +1028,21 @@ $(function() {
});
+ $("#create-label")
+ .click(function() {
+ var rotation = Math.random() * 4 - 2; //add a bit of random rotation (+/- 2deg)
+ uniqueID = Math.round(Math.random() * 99999999); //is this big enough to assure uniqueness?
+ //alert(uniqueID);
+ createCard(
+ 'card' + uniqueID,
+ '',
+ 58, $('div.board-outline').height(), // hack - not a great way to get the new card coordinates, but most consistant ATM
+ rotation,
+ randomCardColour(),
+ "label");
+ });
+
+
// Style changer
$("#smallify").click(function() {
@@ -834,7 +1052,7 @@ $(function() {
var oldHeight = $(".board-outline").height();
var offsets = calcCardOffset();
-
+
if (currentTheme == "bigcards") {
changeThemeTo('smallcards');
newBoardSize.height = oldHeight / 1.5;
@@ -849,7 +1067,7 @@ $(function() {
currentTheme = "bigcards";
$("link[title=cardsize]").attr("href", "css/bigcards.css");
}*/
-
+
resizeBoard(newBoardSize);
boardResizeHappened(null, newBoardSize);
adjustCard(offsets, true);
@@ -874,9 +1092,18 @@ $(function() {
}
);
+ $('.line-buttons').hover(
+ function() {
+ $('.line-icon').fadeIn(10);
+ },
+ function() {
+ $('.line-icon').fadeOut(150);
+ }
+ );
+
$('#add-col').click(
function() {
- createColumn('New');
+ createColumn();
return false;
}
);
@@ -888,6 +1115,20 @@ $(function() {
}
);
+ $('#add-line').click(
+ function() {
+ createRow();
+ return false;
+ }
+ );
+
+ $('#delete-line').click(
+ function() {
+ deleteRow();
+ return false;
+ }
+ );
+
// $('#cog-button').click( function(){
// $('#config-dropdown').fadeToggle();
@@ -900,6 +1141,7 @@ $(function() {
//
var user_name = getCookie('scrumscrum-username');
+ var adh_user_name = getCookie('adh-username');
@@ -921,7 +1163,14 @@ $(function() {
setName($(this).val());
});
- $("#yourname-input").val(user_name);
+ if (adh_user_name){
+ $("#yourname-input").val(adh_user_name);
+ $("#yourname-input").prop('readonly', true);
+ }
+ else {
+ $("#yourname-input").val(user_name);
+ }
+
$("#yourname-input").blur();
$("#yourname-li").hide();
@@ -979,7 +1228,7 @@ $(function() {
});
-
+
$( "#menu" ).menu();
$('#configmenu').click(function() {
$('#menu').show();
@@ -990,7 +1239,7 @@ $(function() {
$("#menu,#configmenu").click( function(e) {
e.stopPropagation(); // this stops the event from bubbling up to the body
});
-
+
$(".ceditable").editable({
multiline: false,
saveDelay: 600, //wait 600ms before calling "save" callback
@@ -1005,7 +1254,7 @@ $(function() {
item: 'board-title',
text: content.target.innerText
};
-
+
if (content.target.innerText.length > 0)
sendAction(action, data);
},
@@ -1015,5 +1264,5 @@ $(function() {
}
});
-
+
});
diff --git a/lib/data/redis.js b/lib/data/redis.js
index 0d118d8c..87c59896 100644
--- a/lib/data/redis.js
+++ b/lib/data/redis.js
@@ -22,7 +22,7 @@ var db = function(callback) {
redisClient = redis.createClient(nconf.get('redis:url'));
redisClient.on("connect", function (err) {
- callback();
+ callback && callback();
});
redisClient.on("error", function (err) {
@@ -32,37 +32,63 @@ var db = function(callback) {
};
db.prototype = {
- clearRoom: function(room, callback) {
- redisClient.del(REDIS_PREFIX + '-room:/demo-cards', function (err, res) {
- redisClient.del(REDIS_PREFIX + '-room:/demo-columns', function (err, res) {
- callback();
- });
+ clearRoom: function(room, callback) {
+ const keysToDelete = [
+ REDIS_PREFIX + '-room:' + room + '-cards',
+ REDIS_PREFIX + '-room:' + room + '-columns',
+ REDIS_PREFIX + '-room:' + room + '-size',
+ REDIS_PREFIX + '-room:' + room + '-theme',
+ REDIS_PREFIX + '-room:' + room + '-bg',
+ REDIS_PREFIX + '-room:' + room + '-users',
+ REDIS_PREFIX + '-room:' + room + '-texts'
+ ];
+ redisClient.del(keysToDelete, function (err, res) {
+ callback && callback();
});
},
// theme commands
- setTheme: function(room, theme) {
- redisClient.set(REDIS_PREFIX + '-room:' + room + '-theme', theme);
+ setTheme: function(room, theme, callback) {
+ redisClient.set(REDIS_PREFIX + '-room:' + room + '-theme', theme, function (err, res) {
+ callback && callback();
+ });
},
getTheme: function(room, callback) {
redisClient.get(REDIS_PREFIX + '-room:' + room + '-theme', function (err, res) {
- callback(res);
+ callback && callback(res);
+ });
+ },
+
+ getBg: function(room, callback) {
+ redisClient.get(REDIS_PREFIX + '-room:' + room + '-bg', function (err, res) {
+ callback && callback(res);
+ });
+ },
+
+ setBg: function(room, theme, callback) {
+ redisClient.set(REDIS_PREFIX + '-room:' + room + '-bg', theme, function (err, res) {
+ callback && callback();
});
},
// Column commands
- createColumn: function(room, name, callback) {
- redisClient.rpush(REDIS_PREFIX + '-room:' + room + '-columns', name,
+ createColumn: function(room, col, callback) {
+ const colStr = JSON.stringify(col);
+ redisClient.rpush(REDIS_PREFIX + '-room:' + room + '-columns', colStr,
function (err, res) {
- if (typeof callback != "undefined" && callback !== null) callback();
+ if (typeof callback != "undefined" && callback !== null) callback();
}
);
},
getAllColumns: function(room, callback) {
redisClient.lrange(REDIS_PREFIX + '-room:' + room + '-columns', 0, -1, function(err, res) {
- callback(res);
+ var out = [];
+ res.forEach(function(col){
+ out.push(JSON.parse(col));
+ });
+ callback && callback(out);
});
},
@@ -70,7 +96,7 @@ db.prototype = {
redisClient.rpop(REDIS_PREFIX + '-room:' + room + '-columns');
},
- setColumns: function(room, columns) {
+ setColumns: function(room, columns, callback) {
//1. first delete all columns
redisClient.del(REDIS_PREFIX + '-room:' + room + '-columns', function () {
//2. now add columns for each thingy
@@ -78,26 +104,30 @@ db.prototype = {
columns,
function( item, callback ) {
//console.log('rpush: ' + REDIS_PREFIX + '-room:' + room + '-columns' + ' -- ' + item);
- redisClient.rpush(REDIS_PREFIX + '-room:' + room + '-columns', item,
+ const stringCol = JSON.stringify(item);
+ redisClient.rpush(REDIS_PREFIX + '-room:' + room + '-columns', stringCol,
function (err, res) {
- callback();
+ callback && callback();
}
);
},
function() {
- //this happens when the series is complete
+ callback && callback();
}
);
});
},
// Card commands
- createCard: function(room, id, card) {
+ createCard: function(room, id, card, callback) {
var cardString = JSON.stringify(card);
redisClient.hset(
REDIS_PREFIX + '-room:' + room + '-cards',
id,
- cardString
+ cardString,
+ function (err, res) {
+ callback && callback();
+ }
);
},
@@ -115,18 +145,65 @@ db.prototype = {
});
},
- cardEdit: function(room, id, text, colour) {
- redisClient.hget(REDIS_PREFIX + '-room:' + room + '-cards', id, function(err, res) {
- var card = JSON.parse(res);
- if (card !== null) {
- if (text) card.text = text;
- if (colour) card.colour = colour;
+ getAllUsers: function(room, callback) {
+ redisClient.hgetall(REDIS_PREFIX + '-room:' + room + '-users', function (err, res) {
- redisClient.hset(REDIS_PREFIX + '-room:' + room + '-cards', id, JSON.stringify(card));
+ var users = {};
+
+ for (var i in res) {
+ users[i] = JSON.parse(res[i]);
}
+
+ callback(users);
});
},
+ addUser: function(room, username, userinfo, callback) {
+ var userinfoStr = JSON.stringify(userinfo);
+ redisClient.hset(
+ REDIS_PREFIX + '-room:' + room + '-users',
+ username,
+ userinfoStr,
+ function (err, res) {
+ callback && callback();
+ }
+ );
+ },
+
+ getCard: function(room, id, callback) {
+ redisClient.hget(REDIS_PREFIX + '-room:' + room + '-cards', id, function(err, res) {
+ var card = JSON.parse(res);
+ callback && callback(card);
+ });
+ },
+
+ editCard: function(room, id, card, callback) {
+ redisClient.hget(REDIS_PREFIX + '-room:' + room + '-cards', id, function(err, res) {
+ var storedCard = JSON.parse(res);
+ if (storedCard === null){
+ callback && callback(null);
+ }
+ else {
+ const cardFields = ['colour', 'rot', 'x', 'y', 'text', 'type', 'sticker'];
+ // Update only supplied fields
+ cardFields.forEach(field => {
+ if (card[field])
+ storedCard[field] = card[field];
+ });
+ redisClient.hset(REDIS_PREFIX + '-room:' + room + '-cards', id, JSON.stringify(storedCard), function(err, res) {
+ callback && callback(storedCard);
+ });
+ }
+ });
+ },
+
+ cardEdit: function(room, id, text, colour) {
+ const card = {};
+ if (text) card.text = text;
+ if (colour) card.colour = colour;
+ this.editCard(room, id, card);
+ },
+
cardSetXY: function(room, id, x, y) {
redisClient.hget(REDIS_PREFIX + '-room:' + room + '-cards', id, function(err, res) {
var card = JSON.parse(res);
@@ -138,10 +215,13 @@ db.prototype = {
});
},
- deleteCard: function(room, id) {
+ deleteCard: function(room, id, callback) {
redisClient.hdel(
REDIS_PREFIX + '-room:' + room + '-cards',
- id
+ id,
+ function (){
+ callback && callback();
+ }
);
},
@@ -173,8 +253,10 @@ db.prototype = {
});
},
- setBoardSize: function(room, size) {
- redisClient.set(REDIS_PREFIX + '-room:' + room + '-size', JSON.stringify(size));
+ setBoardSize: function(room, size, callback) {
+ redisClient.set(REDIS_PREFIX + '-room:' + room + '-size', JSON.stringify(size), function (err, res) {
+ callback && callback();
+ });
},
getBoardSize: function(room, callback) {
@@ -197,10 +279,24 @@ db.prototype = {
});
},
- textEdit: function(room, id, text) {
+ getAllTextsMap: function(room, callback) {
+ redisClient.hgetall(REDIS_PREFIX + '-room:' + room + '-texts', function (err, res) {
+ callback && callback(res);
+ });
+ },
+
+ setAllTextsMap: function(room, texts, callback) {
+ redisClient.hmset(REDIS_PREFIX + '-room:' + room + '-texts', texts, function (err, res) {
+ callback && callback();
+ });
+ },
+
+ textEdit: function(room, id, text, callback) {
if (text !== null) {
- redisClient.hset(REDIS_PREFIX + '-room:' + room + '-texts', id, text);
+ redisClient.hset(REDIS_PREFIX + '-room:' + room + '-texts', id, text, function (err, res) {
+ callback && callback();
+ });
}
}
diff --git a/server.js b/server.js
index cff0230a..f2907c2c 100644
--- a/server.js
+++ b/server.js
@@ -57,6 +57,7 @@ var router = express.Router();
app.set('view engine', 'pug');
app.use(compression());
+app.use(express.json());
app.use(nconf.get('server:baseurl'), router);
// app.locals.ga = ga.enabled;
@@ -106,12 +107,163 @@ router.get('/demo', function(req, res) {
});
router.get('/:id', function(req, res){
- res.render('index.pug', {
- pageTitle: ('scrumblr - ' + req.params.id)
+
+ // Check for background param
+ if (req.query.bg !== undefined){
+ const room = '/' + req.params.id;
+ db.setBg(room, req.query.bg, function() {
+ res.redirect(302, room);
+ });
+ }
+ else {
+ res.render('index.pug', {
+ pageTitle: ('scrumblr - ' + req.params.id),
+ embed: req.query.embed,
+ darkMode: req.query.darkmode
+ });
+ }
+});
+
+// *******************
+// REST API Routes
+// *******************
+
+router.get('/api/rooms/:id', function(req, res) {
+ const room = '/' + req.params.id;
+
+ db.getAllColumns ( room, function (columns) {
+ db.getTheme( room, function(theme) {
+ db.getBg( room, function(bg) {
+ db.getBoardSize( room, function(size) {
+ db.getAllTextsMap( room , function (texts) {
+ res.json({
+ columns,
+ theme,
+ size,
+ texts,
+ bg
+ });
+ });
+ });
+ });
+ });
+ });
+});
+
+router.put('/api/rooms/:id', function(req, res) {
+ const room = '/' + req.params.id;
+ var operations = [];
+
+ // Add an empty function to avoid hangups
+ operations.push(function (callback){
+ callback && callback();
+ });
+
+ if (req.body.columns){
+ // TODO: check columns format
+ operations.push(function (callback){
+ db.setColumns(room, req.body.columns, callback);
+ });
+ }
+
+ if (req.body.theme){
+ operations.push(function (callback){
+ db.setTheme(room, req.body.theme, callback);
+ });
+ }
+
+ if (req.body.bg){
+ operations.push(function (callback){
+ db.setBg(room, req.body.bg, callback);
+ });
+ }
+
+ if (req.body.size){
+ operations.push(function (callback){
+ db.setBoardSize(room, req.body.size, callback);
+ });
+ }
+
+ if (req.body.texts){
+ operations.push(function (callback){
+ db.setAllTextsMap(room, req.body.texts, callback);
+ });
+ }
+
+ async.parallel(operations, function(){
+ res.json({ ok: true });
+ });
+
+});
+
+
+router.delete('/api/rooms/:id', function(req, res) {
+ const room = '/' + req.params.id;
+ db.clearRoom('/' + room, function() {
+ res.json({ ok: true });
+ });
+});
+
+
+router.get('/api/rooms/:roomId/cards', function(req, res) {
+ const room = '/' + req.params.roomId;
+
+ db.getAllCards( room , function (cards) {
+ res.json(cards);
+ });
+});
+
+router.post('/api/rooms/:roomId/cards', function(req, res) {
+ const room = '/' + req.params.roomId;
+ const card = req.body;
+ const scrub = sanitizer.sanitize;
+
+ //delete card.id;
+ card.id = "card" + Math.floor(Math.random() * 100000000);;
+ card.colour = scrub(card.colour);
+ card.rot = scrub(card.rot);
+ card.rot = scrub(card.rot);
+ card.x = parseFloat(card.x);
+ card.y = parseFloat(card.y);
+ card.text = scrub(card.text);
+ card.type = scrub(card.type);
+ // TODO: validate stickers
+
+ db.createCard(room, card.id, card, function() {
+ res.json(card);
+ });
+
+});
+
+router.get('/api/rooms/:roomId/cards/:cardId', function(req, res) {
+ const room = '/' + req.params.roomId;
+ const id = req.params.cardId;
+
+ db.getCard( room , id , function (card) {
+ res.json(card);
+ });
+});
+
+router.put('/api/rooms/:roomId/cards/:cardId', function(req, res) {
+ const room = '/' + req.params.roomId;
+ const id = req.params.cardId;
+ const card = req.body;
+
+ db.editCard( room , id , card, function (card) {
+ res.json(card);
});
});
+router.delete('/api/rooms/:roomId/cards/:cardId', function(req, res) {
+ const room = '/' + req.params.roomId;
+ const id = req.params.cardId;
+
+ db.deleteCard( room , id , function (card) {
+ res.json({ok: true});
+ });
+});
+
/**************
SOCKET.I0
**************/
@@ -195,10 +347,11 @@ io.on('connection', (client) => {
clean_data.rot = scrub(data.rot);
clean_data.colour = scrub(data.colour);
clean_data.type = scrub(data.type);
+ clean_data.username = data.username ? scrub(data.username) : null;
getRoom(client, function(room) {
- createCard( room, clean_data.id, clean_data.text, clean_data.x, clean_data.y, clean_data.rot, clean_data.colour, clean_data.type);
+ createCard( room, clean_data.id, clean_data.text, clean_data.x, clean_data.y, clean_data.rot, clean_data.colour, clean_data.type, clean_data.username);
});
message_out = {
@@ -275,17 +428,11 @@ io.on('connection', (client) => {
if (!(columns instanceof Array))
break;
- var clean_columns = [];
-
- for (var i in columns)
- {
- clean_columns[i] = scrub( columns[i] );
- }
getRoom( client, function(room) {
- db.setColumns( room, clean_columns );
+ db.setColumns( room, columns );
});
- broadcastToRoom( client, { action: 'updateColumns', data: clean_columns } );
+ broadcastToRoom( client, { action: 'updateColumns', data: columns } );
break;
@@ -315,6 +462,30 @@ io.on('connection', (client) => {
broadcastToRoom( client, msg );
break;
+
+ case 'setUserInfo':
+ const username = scrub(message.data.username);
+ const userEmail = scrub(message.data.userEmail);
+ const userAvatar = scrub(message.data.userAvatar);
+ const userinfo = {
+ username,
+ userEmail,
+ userAvatar
+ };
+
+ getRoom(client, function(room) {
+ db.addUser(room, username, userinfo, function(){
+ db.getAllUsers(room, function(users){
+ var msg = {};
+ msg.action = 'updateUserCache';
+ msg.data = users;
+ broadcastToRoom( client, msg );
+ });
+ });
+ });
+
+ break;
+
case 'addSticker':
var cardId = scrub(message.data.cardId);
var stickerId = scrub(message.data.stickerId);
@@ -384,18 +555,15 @@ function initClient ( client )
//console.log ('initClient Started');
getRoom(client, function(room) {
- db.getAllCards( room , function (cards) {
-
+ db.getAllUsers(room, function(users){
client.send(
{
- action: 'initCards',
- data: cards
+ action: 'updateUserCache',
+ data: users
}
);
-
});
-
db.getAllColumns ( room, function (columns) {
client.send(
{
@@ -418,6 +586,18 @@ function initClient ( client )
);
});
+ db.getBg( room, function(bg) {
+
+ if (bg === null) bg = 'css/bg/scribbles2.png';
+
+ client.send(
+ {
+ action: 'changeBg',
+ data: bg
+ }
+ );
+ });
+
db.getBoardSize( room, function(size) {
if (size !== null) {
@@ -443,6 +623,17 @@ function initClient ( client )
}
});
+ db.getAllCards( room , function (cards) {
+
+ client.send(
+ {
+ action: 'initCards',
+ data: cards
+ }
+ );
+
+ });
+
roommates_clients = rooms.room_clients(room);
roommates = [];
@@ -497,7 +688,7 @@ function broadcastToRoom ( client, message ) {
}
//----------------CARD FUNCTIONS
-function createCard( room, id, text, x, y, rot, colour, type ) {
+function createCard( room, id, text, x, y, rot, colour, type, username ) {
var card = {
id: id,
colour: colour,
@@ -506,7 +697,8 @@ function createCard( room, id, text, x, y, rot, colour, type ) {
y: y,
text: text,
type: type,
- sticker: null
+ sticker: null,
+ username: username
};
db.createCard(room, id, card);
diff --git a/views/home.pug b/views/home.pug
index bdd84e54..b1b90b29 100644
--- a/views/home.pug
+++ b/views/home.pug
@@ -24,7 +24,10 @@ body
form.home(onsubmit="return go();")
label name your new board:
br
- input.text(type="text", name="name")
+ input.text(type="text", name="name", placeholder="Board name")
+ br
+ input.url(type="text", name="bg", placeholder="Background image URL (optionnal)")
+ br
a#go(onclick="return go();") go.
p.home example board:
@@ -54,6 +57,6 @@ body
//
this will be the backlog that only appears on drag or perhaps not at all
-
+
diff --git a/views/index.pug b/views/index.pug
index 228bb2bb..d98af361 100644
--- a/views/index.pug
+++ b/views/index.pug
@@ -2,65 +2,14 @@ extends layout
block body
// Header Start
- header.site-header
- div.site-header__wrapper
- a.greyheading(href="/") scrumblr
- //ul.nav__wrapper
- li.nav__item
- a#configmenu(href="#")
- svg.title(width='12', height='12')
-
- ul#menu
- li
- div Enlarge
- li
- div Books
- li
- div Electronics
- li
- div Movies
- //- li.nav__item
- //- a(href="#")
- //- svg.title(width='12', height='12')
- //-
-
-
- - if (locals.demo)
- div.notice-bar this is a demo board. to make a private board, go to
scrumblr home
-
- //div.config
- // i.fa.fa-cog.fa-lg.faded-icon
- //- svg(width='15', height='15')
- //-
-
- //p.greyheading scrumblr by
aliasaria
div.board-wrapper
- div.topflexcontainer(style="display: flex; justify-content: space-between; align-items: baseline;")
- h1#board-title.ceditable(style="") Board Title
- //div(style="")
- a#configmenu(href="#")
- svg.title(width='12', height='12')
-
- ul#menu
- li
- div(style="height: 12px;")
- svg.title(width='12', height='12')
-
- li
- div(style="height: 12px;")
- svg.title(width='12', height='12')
-
- li
- div(style="height: 12px;")
- svg.title(width='12', height='12')
-
- li
- div Poop
+ div.topflexcontainer(style="display: flex; justify-content: space-between; align-items: baseline; margin-top: 10px;")
div.board-outline(style="clear:both;")
+ img.logo(src="images/adh-logo.png", height=25, style="")
div#board
- div#board-doodles
+ div#board-doodles(style="background-image: url('css/bg/scribbles2.png');")
//
image#marker(src='images/marker.png')
@@ -68,21 +17,30 @@ block body
table#board-table.board-table
- tr
+ tr(data-row='1')
td#icon-col(width='1%')
- svg#add-col.col-icon(width='20', height='20')
+ svg#add-col.col-icon(width='20', height='20', title='Add column')
- svg#delete-col.col-icon(width='20', height='20')
+ svg#delete-col.col-icon(width='20', height='20', title='Remove column')
+ div.line-buttons
+ div.line-buttons-inner
+ svg#add-line.line-icon(width='20', height='20')
+
+ svg#delete-line.line-icon(width='20', height='20')
+
- div.buttons
+
+ div.buttons(class=locals.darkMode ? "dark" : "")
//- svg#pen.bottom-icon(width='20', height='20', data-ison='true')
//-
svg#create-card.bottom-icon(width='20', height='20')
svg#create-sticky.bottom-icon(width='20', height='20')
+ svg#create-label.bottom-icon(width='20', height='20')
+
//- svg#smallify.bottom-icon(width='20', height='20')
//-
@@ -112,12 +70,13 @@ block body
// image(src="/images/stickers/sticker-redstar.png")
- div.names
- p connected:
- //image#user-icon(src="/images/icons/cc/black/png/user_icon&16.png")
- input#yourname-input
- span.you-text (you)
- ul#names-ul
+ - if (!locals.embed)
+ div.names
+ p Connected users:
+ //image#user-icon(src="/images/icons/cc/black/png/user_icon&16.png")
+ input#yourname-input
+ span.you-text (you)
+ ul#names-ul
//div.trash
// i.fa.fa-trash-o.fa-lg.faded-icon
diff --git a/views/layout.pug b/views/layout.pug
index 6b5a48a5..c0292adc 100644
--- a/views/layout.pug
+++ b/views/layout.pug
@@ -11,6 +11,10 @@ html(lang="en")
+
+
+
+
\
- 
\
+ ' + (userAvatar ? ('