paul/plemp-node
Archived
1
0
Fork 0
Code Issues Pull requests Releases Wiki Activity

Wrap the content in a div with title and comments; add some style

Browse source
This commit is contained in:
Paul van Tilburg 2012-01-15 16:17:50 +01:00
parent 7ffe87a70c
commit 3e0d783454
2 changed files with 69 additions and 21 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

37
plemp.js
View file

@ -94,40 +94,39 @@ app.get('/draggables/:id', function(req, res) {
var drag = draggables[drag_id];
var default_style = "left:" + drag.left + "px;top:" + drag.top + "px;";
var mime_type = drag.mime.split("/")
var title = drag.name || drag.title || 'Title not set';
var content;
switch (mime_type[0]) {
case "image":
res.send('<img class="draggable" id="' + drag_id + '" ' +
'style="' + default_style + '" src="' + file_name + '">' +
'</img>');
content = '<img src="' + file_name + '"></img>';
break;
case "video":
res.send('<video class="draggable" id="' + drag_id + '" ' +
'style="' + default_style + '" src="' + file_name +
'" controls="true"></video>');
content = '<video src="' + file_name + '" controls="true"></video>';
break;
case "audio":
res.send('<audio class="draggable" id="' + drag_id + '" ' +
'style="' + default_style + ';height=80px;" src="' +
file_name +
'" controls="true"></audio>');
content = '<audio src="' + file_name + '" controls="true"></audio>';
break;
case "text":
file_contents = fs.readFileSync("public/upload/" + drag_id);
res.send('<div class="draggable" id="' + drag_id + '" ' +
'style="' + default_style + '"><pre>' + file_contents +
'</pre></div>');
content = '<pre>' + file_contents + '</pre>';
break;
case 'application': // FIXME: treat as code for now, but it is probably wrong
file_contents = fs.readFileSync("public/upload/" + drag_id);
res.send('<div class="draggable" id="' + drag_id + '" ' +
'style="' + default_style + '"><pre><code>' + file_contents +
'</code></pre></div>');
content = '<pre><code class="' + drag.type + '">' + file_contents +
'</code></pre>';
break;
default:
res.send('<div class="draggable" id="' + drag_id + '" ' +
'style="' + default_style + '">Unknown type: ' +
mime_type + '</div>');
content = '<span>Unknown type: ' + mime_type + '</span>';
}
// Wrap the content in a div with title and comments.
res.send('<div class="draggable" id="' + drag_id + '" ' +
'style="' + default_style + '">' +
'<div class="header"><div class="title">' + title +
'<span class="edit">(edit)</span>' +
'<div class="delete">X</div></div>' +
'</div>' + content + '<div class="comments"></div>' +
'</div>');
});
// The position save controller: access through AJAX request by the main

53
public/stylesheets/style.css
View file

@ -61,10 +61,59 @@ pre {
.draggable {
position: absolute;
background: white;
border: thin solid #888;
padding: 10px;
width: 400px;
}
.draggable div,
.draggable img,
.draggable audio,
.draggable video,
.draggable pre {
width: 400px;
max-height: 300px;
overflow: auto;
border: thin solid #888;
background: white;
}
.draggable pre {
width: 388px;
}
.draggable .header {
padding-bottom: 3px;
font-size: 11px;
text-align: center;
}
.draggable .header .title {
width: 100%;
margin-right: 30px;
font-weight: bold;
overflow: hidden;
}
.draggable .header .title .edit {
padding-left: 10px;
color: #cccccc;
}
.draggable .header .delete {
width: auto;
float: right;
padding: 0px 2px;
border: thin solid black;
color: #cccccc;
margin-left: 20px;
}
.draggable .header .edit:hover,
.draggable .header .delete:hover {
color: #000000;
cursor: pointer;
}
.draggable .comments {
display: none;
}