HW7: working on 6 (almost done)
This commit is contained in:
parent
d8efbdc8a9
commit
b8fad52ebe
4 changed files with 25 additions and 7 deletions
|
@ -1,6 +1,6 @@
|
||||||
(function(dust){dust.register("500",body_0);function body_0(chk,ctx){return chk.w("<html><head><meta charset='utf-8'></head><body><h1>Error 500</h1><pre>").f(ctx.get(["err"], false),ctx,"h").w("</pre></body></html>");}body_0.__dustBody=!0;return body_0}(dust));
|
(function(dust){dust.register("500",body_0);function body_0(chk,ctx){return chk.w("<html><head><meta charset='utf-8'></head><body><h1>Error 500</h1><pre>").f(ctx.get(["err"], false),ctx,"h").w("</pre></body></html>");}body_0.__dustBody=!0;return body_0}(dust));
|
||||||
(function(dust){dust.register("favourite",body_0);function body_0(chk,ctx){return chk.w("<html><head><meta charset=\"utf-8\"><title>").f(ctx.get(["name"], false),ctx,"h").w("</title></head><body>").p("favourite_partial",ctx,ctx,{}).w("<a href=\"/favorites\">Favourites list</a></body></html>");}body_0.__dustBody=!0;return body_0}(dust));
|
(function(dust){dust.register("favourite",body_0);function body_0(chk,ctx){return chk.w("<html><head><meta charset=\"utf-8\"><title>").f(ctx.get(["name"], false),ctx,"h").w("</title></head><body>").p("favourite_partial",ctx,ctx,{}).w("<a href=\"/favorites\">Favourites list</a></body></html>");}body_0.__dustBody=!0;return body_0}(dust));
|
||||||
(function(dust){dust.register("favourite_partial",body_0);function body_0(chk,ctx){return chk.w("<style>.hidden {display: none}</style><h3>").f(ctx.get(["name"], false),ctx,"h").w("</h3><img src=\"").f(ctx.get(["dataURL"], false),ctx,"h").w("\" alt=\"").f(ctx.get(["name"], false),ctx,"h").w("\">").x(ctx.get(["b"], false),ctx,{"block":body_1},{}).x(ctx.get(["details"], false),ctx,{"else":body_2,"block":body_5},{});}body_0.__dustBody=!0;function body_1(chk,ctx){return chk.w("<p><strong>Bookmarked</strong></p>");}body_1.__dustBody=!0;function body_2(chk,ctx){return chk.w("<form class=\"data\" id=\"favourite").f(ctx.get(["_id"], false),ctx,"h").w("\" method=\"POST\" action=\"/favorites/").f(ctx.get(["_id"], false),ctx,"h").w("?_method=PUT\"><input type=\"hidden\" name=\"dataURL\" value=\"").f(ctx.get(["dataURL"], false),ctx,"h").w("\"><label for=\"name\">Name:</label><input type=\"text\" name=\"name\" placeholder=\"Name\" value=\"").f(ctx.get(["name"], false),ctx,"h").w("\"><br><button type=\"button\" class=\"imgur\">Imgur options</button><hr><button data-update>Update</button><br><button data-delete formaction=\"/favorites/").f(ctx.get(["_id"], false),ctx,"h").w("?_method=DELETE\">Delete</button><br>").x(ctx.get(["bookmarked"], false),ctx,{"else":body_3,"block":body_4},{}).w("</form><form class=\"favorites hidden\"><hr><input type=\"hidden\" name=\"dataURL\" value=\"").f(ctx.get(["dataURL"], false),ctx,"h").w("\"><input type=\"text\" name=\"album\" placeholder=\"Imgur album name\"><br><input type=\"text\" name=\"tags\" placeholder=\"Imgur tags\"><br><label for=\"favorites\">Add in favorites</label><input type=\"checkbox\" name=\"favorites\"><button>Submit</button></form>");}body_2.__dustBody=!0;function body_3(chk,ctx){return chk.w("<button data-bookmark name=\"bookmarked\" value=\"true\"formaction=\"/favorites/").f(ctx.get(["_id"], false),ctx,"h").w("/bookmarked?_method=PUT\">Add bookmark</button>");}body_3.__dustBody=!0;function body_4(chk,ctx){return chk.w("<button data-del-bookmark name=\"bookmarked\" value=\"false\"formaction=\"/favorites/").f(ctx.get(["_id"], false),ctx,"h").w("/bookmarked?_method=PUT\">Remove bookmark</button>");}body_4.__dustBody=!0;function body_5(chk,ctx){return chk.w("<a href=\"/favorites/").f(ctx.get(["_id"], false),ctx,"h").w("\">Details</a>");}body_5.__dustBody=!0;return body_0}(dust));
|
(function(dust){dust.register("favourite_partial",body_0);function body_0(chk,ctx){return chk.w("<h3>").f(ctx.get(["name"], false),ctx,"h").w("</h3><img src=\"").f(ctx.get(["dataURL"], false),ctx,"h").w("\" alt=\"").f(ctx.get(["name"], false),ctx,"h").w("\">").x(ctx.get(["b"], false),ctx,{"block":body_1},{}).x(ctx.get(["details"], false),ctx,{"else":body_2,"block":body_5},{});}body_0.__dustBody=!0;function body_1(chk,ctx){return chk.w("<p><strong>Bookmarked</strong></p>");}body_1.__dustBody=!0;function body_2(chk,ctx){return chk.w("<form class=\"data\" id=\"favourite").f(ctx.get(["_id"], false),ctx,"h").w("\" method=\"POST\" action=\"/favorites/").f(ctx.get(["_id"], false),ctx,"h").w("?_method=PUT\"><input type=\"hidden\" name=\"dataURL\" value=\"").f(ctx.get(["dataURL"], false),ctx,"h").w("\"><label for=\"name\">Name:</label><input type=\"text\" name=\"name\" placeholder=\"Name\" value=\"").f(ctx.get(["name"], false),ctx,"h").w("\"><br><button type=\"button\" class=\"imgur\">Imgur options</button><hr><button data-update>Update</button><br><button data-delete formaction=\"/favorites/").f(ctx.get(["_id"], false),ctx,"h").w("?_method=DELETE\">Delete</button><br>").x(ctx.get(["bookmarked"], false),ctx,{"else":body_3,"block":body_4},{}).w("</form><form class=\"favorites hidden\"><hr><input type=\"hidden\" name=\"dataURL\" value=\"").f(ctx.get(["dataURL"], false),ctx,"h").w("\"><input type=\"text\" name=\"album\" placeholder=\"Imgur album name\"><br><input type=\"text\" name=\"tags\" placeholder=\"Imgur tags\"><br><label for=\"favorites\">Add in favorites</label><input type=\"checkbox\" name=\"favorites\"><br><label for=\"favorites\">Replace an image</label><input type=\"checkbox\" name=\"replace\"><br><div class=\"replace hidden\"><input type=\"text\" name=\"old_name\" placeholder=\"Imgur image name to replace\"><br></div><button type=\"submit\">Submit to Imgur</button></form>");}body_2.__dustBody=!0;function body_3(chk,ctx){return chk.w("<button data-bookmark name=\"bookmarked\" value=\"true\"formaction=\"/favorites/").f(ctx.get(["_id"], false),ctx,"h").w("/bookmarked?_method=PUT\">Add bookmark</button>");}body_3.__dustBody=!0;function body_4(chk,ctx){return chk.w("<button data-del-bookmark name=\"bookmarked\" value=\"false\"formaction=\"/favorites/").f(ctx.get(["_id"], false),ctx,"h").w("/bookmarked?_method=PUT\">Remove bookmark</button>");}body_4.__dustBody=!0;function body_5(chk,ctx){return chk.w("<a href=\"/favorites/").f(ctx.get(["_id"], false),ctx,"h").w("\">Details</a>");}body_5.__dustBody=!0;return body_0}(dust));
|
||||||
(function(dust){dust.register("favourites",body_0);function body_0(chk,ctx){return chk.w("<html><head><meta charset=\"utf-8\">").x(ctx.get(["bookmarked"], false),ctx,{"else":body_1,"block":body_2},{}).w("</head><body>").x(ctx.get(["bookmarked"], false),ctx,{"else":body_3,"block":body_4},{}).s(ctx.get(["favs"], false),ctx,{"else":body_5,"block":body_6},{}).w("</body></html>");}body_0.__dustBody=!0;function body_1(chk,ctx){return chk.w("<title>Favourites</title>");}body_1.__dustBody=!0;function body_2(chk,ctx){return chk.w("<title>Bookmarked</title>");}body_2.__dustBody=!0;function body_3(chk,ctx){return chk.w("<h1>Favourites</h1>");}body_3.__dustBody=!0;function body_4(chk,ctx){return chk.w("<h1>Bookmarked</h1>");}body_4.__dustBody=!0;function body_5(chk,ctx){return chk.w("<strong>No favourites.</strong>");}body_5.__dustBody=!0;function body_6(chk,ctx){return chk.w("<div>").p("favourite_partial",ctx,ctx,{"name":ctx.get(["name"], false),"dataURL":ctx.get(["dataURL"], false),"_id":ctx.get(["_id"], false),"bookmarked":ctx.get(["bookmarked"], false),"details":"true"}).w("</div>");}body_6.__dustBody=!0;return body_0}(dust));
|
(function(dust){dust.register("favourites",body_0);function body_0(chk,ctx){return chk.w("<html><head><meta charset=\"utf-8\">").x(ctx.get(["bookmarked"], false),ctx,{"else":body_1,"block":body_2},{}).w("</head><body>").x(ctx.get(["bookmarked"], false),ctx,{"else":body_3,"block":body_4},{}).s(ctx.get(["favs"], false),ctx,{"else":body_5,"block":body_6},{}).w("</body></html>");}body_0.__dustBody=!0;function body_1(chk,ctx){return chk.w("<title>Favourites</title>");}body_1.__dustBody=!0;function body_2(chk,ctx){return chk.w("<title>Bookmarked</title>");}body_2.__dustBody=!0;function body_3(chk,ctx){return chk.w("<h1>Favourites</h1>");}body_3.__dustBody=!0;function body_4(chk,ctx){return chk.w("<h1>Bookmarked</h1>");}body_4.__dustBody=!0;function body_5(chk,ctx){return chk.w("<strong>No favourites.</strong>");}body_5.__dustBody=!0;function body_6(chk,ctx){return chk.w("<div>").p("favourite_partial",ctx,ctx,{"name":ctx.get(["name"], false),"dataURL":ctx.get(["dataURL"], false),"_id":ctx.get(["_id"], false),"bookmarked":ctx.get(["bookmarked"], false),"details":"true"}).w("</div>");}body_6.__dustBody=!0;return body_0}(dust));
|
||||||
(function(dust){dust.register("index",body_0);function body_0(chk,ctx){return chk.w("<!DOCTYPE html><html><head><meta charset=\"utf-8\"><title>OO-JS Exercise - Web Atelier 2017</title><link rel=\"stylesheet\" href=\"https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css\"><link rel=\"stylesheet\" href=\"style.css\"></head><body onload=\"init()\"><h1>OO-JS Exercise: Canvas</h1><div id=\"app\"><div id=\"left-toolbar\" class=\"toolbar\"><button id=\"clear-btn\">Clear</button><button id=\"undo-btn\">Undo</button><button id=\"camera-btn\"><i class=\"fa fa-camera\" aria-hidden=\"true\"></i></button></div><canvas id=\"canvas\" width=\"600\" height=\"400\"></canvas><div id=\"brush-toolbar\" class=\"toolbar\"><!-- Brushes buttons go here (programmatically). Each button should be a <button> element --></div></div><br><div><label for=\"name-filter\">By name search:</label><input id=\"name-filter\" type=\"text\" placeholder=\"Search by name\"><br><label for=\"bookmarked-filter\">Only bookmarked</label><input id=\"bookmarked-filter\" type=\"checkbox\"></div><div id=\"favourites\"></div><script src=\"dustjs-linkedin/dust-full.min.js\"></script><script src=\"js/views.js\"></script><script src=\"js/fetch.js\"></script><script src=\"/socket.io/socket.io.js\"></script><script src=\"scripts/brushes.js\"></script><script src=\"scripts/undo.js\"></script><!-- <script src=\"scripts/clock.js\"></script> --><script src=\"scripts/app.js\"></script><script src=\"main.js\"></script></body></html>");}body_0.__dustBody=!0;return body_0}(dust));
|
(function(dust){dust.register("index",body_0);function body_0(chk,ctx){return chk.w("<!DOCTYPE html><html><head><meta charset=\"utf-8\"><title>OO-JS Exercise - Web Atelier 2017</title><link rel=\"stylesheet\" href=\"https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css\"><link rel=\"stylesheet\" href=\"style.css\"></head><body onload=\"init()\"><h1>OO-JS Exercise: Canvas</h1><div id=\"app\"><div id=\"left-toolbar\" class=\"toolbar\"><button id=\"clear-btn\">Clear</button><button id=\"undo-btn\">Undo</button><button id=\"camera-btn\"><i class=\"fa fa-camera\" aria-hidden=\"true\"></i></button></div><canvas id=\"canvas\" width=\"600\" height=\"400\"></canvas><div id=\"brush-toolbar\" class=\"toolbar\"><!-- Brushes buttons go here (programmatically). Each button should be a <button> element --></div></div><br><div><label for=\"name-filter\">By name search:</label><input id=\"name-filter\" type=\"text\" placeholder=\"Search by name\"><br><label for=\"bookmarked-filter\">Only bookmarked</label><input id=\"bookmarked-filter\" type=\"checkbox\"></div><div id=\"favourites\"></div><script src=\"dustjs-linkedin/dust-full.min.js\"></script><script src=\"js/views.js\"></script><script src=\"js/fetch.js\"></script><script src=\"/socket.io/socket.io.js\"></script><script src=\"scripts/brushes.js\"></script><script src=\"scripts/undo.js\"></script><!-- <script src=\"scripts/clock.js\"></script> --><script src=\"scripts/app.js\"></script><script src=\"main.js\"></script></body></html>");}body_0.__dustBody=!0;return body_0}(dust));
|
||||||
(function(dust){dust.register("server_side",body_0);function body_0(chk,ctx){return chk.s(ctx.get(["favs"], false),ctx,{"block":body_1},{});}body_0.__dustBody=!0;function body_1(chk,ctx){return chk.w("<div id=\"favorite_").f(ctx.get(["_id"], false),ctx,"h").w("\" class=\"").x(ctx.get(["bookmarked"], false),ctx,{"block":body_2},{}).w("\">").p("favourite_partial",ctx,ctx,{"name":ctx.get(["name"], false),"dataURL":ctx.get(["dataURL"], false),"_id":ctx.get(["_id"], false),"bookmarked":ctx.get(["bookmarked"], false)}).w("</div>");}body_1.__dustBody=!0;function body_2(chk,ctx){return chk.w("bookmarked");}body_2.__dustBody=!0;return body_0}(dust));
|
(function(dust){dust.register("server_side",body_0);function body_0(chk,ctx){return chk.s(ctx.get(["favs"], false),ctx,{"block":body_1},{});}body_0.__dustBody=!0;function body_1(chk,ctx){return chk.w("<div id=\"favorite_").f(ctx.get(["_id"], false),ctx,"h").w("\" class=\"").x(ctx.get(["bookmarked"], false),ctx,{"block":body_2},{}).w("\">").p("favourite_partial",ctx,ctx,{"name":ctx.get(["name"], false),"dataURL":ctx.get(["dataURL"], false),"_id":ctx.get(["_id"], false),"bookmarked":ctx.get(["bookmarked"], false)}).w("</div>");}body_1.__dustBody=!0;function body_2(chk,ctx){return chk.w("bookmarked");}body_2.__dustBody=!0;return body_0}(dust));
|
||||||
|
|
|
@ -17,6 +17,7 @@ class App {
|
||||||
const imgurForm = dom.querySelector('form.favorites');
|
const imgurForm = dom.querySelector('form.favorites');
|
||||||
const replaceToggle = dom.querySelector('input[name=replace]');
|
const replaceToggle = dom.querySelector('input[name=replace]');
|
||||||
const albumInput = imgurForm.querySelector('input[name=album]');
|
const albumInput = imgurForm.querySelector('input[name=album]');
|
||||||
|
const oldNameInput = imgurForm.querySelector('input[name=old_name]');
|
||||||
const replacePanel = imgurForm.querySelector('.replace');
|
const replacePanel = imgurForm.querySelector('.replace');
|
||||||
|
|
||||||
dom.querySelector('button.imgur').onclick = () => {
|
dom.querySelector('button.imgur').onclick = () => {
|
||||||
|
@ -27,9 +28,11 @@ class App {
|
||||||
if (replaceToggle.checked) {
|
if (replaceToggle.checked) {
|
||||||
replacePanel.classList.remove('hidden');
|
replacePanel.classList.remove('hidden');
|
||||||
albumInput.setAttribute('disabled', 'disabled');
|
albumInput.setAttribute('disabled', 'disabled');
|
||||||
|
oldNameInput.setAttribute('required', 'required');
|
||||||
} else {
|
} else {
|
||||||
replacePanel.classList.add('hidden');
|
replacePanel.classList.add('hidden');
|
||||||
albumInput.removeAttribute('disabled');
|
albumInput.removeAttribute('disabled');
|
||||||
|
oldNameInput.removeAttribute('required');
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
@ -49,7 +52,6 @@ class App {
|
||||||
favorites: data.get('favorites')
|
favorites: data.get('favorites')
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
||||||
doJSONRequest('POST', '/imgur/ordeal', {}, obj)
|
doJSONRequest('POST', '/imgur/ordeal', {}, obj)
|
||||||
.then(e => {
|
.then(e => {
|
||||||
if (e.ordealSuccess === true) {
|
if (e.ordealSuccess === true) {
|
||||||
|
|
|
@ -68,6 +68,7 @@ router.post('/imgur/ordeal', async (req, res) => {
|
||||||
const uploadData = {
|
const uploadData = {
|
||||||
image: req.body.dataURL.substring('data:image/png;base64,'.length),
|
image: req.body.dataURL.substring('data:image/png;base64,'.length),
|
||||||
type: 'base64',
|
type: 'base64',
|
||||||
|
title: req.body.name,
|
||||||
name: req.body.name + '.png',
|
name: req.body.name + '.png',
|
||||||
};
|
};
|
||||||
|
|
||||||
|
@ -127,7 +128,9 @@ router.post('/imgur/ordeal', async (req, res) => {
|
||||||
}
|
}
|
||||||
|
|
||||||
const image =
|
const image =
|
||||||
images.data.filter(e => e.name.match(req.body.oldName))[0];
|
images.data.filter(e => e.title.match(req.body.oldName))[0];
|
||||||
|
|
||||||
|
console.log('image', image);
|
||||||
|
|
||||||
if (!image || reject) {
|
if (!image || reject) {
|
||||||
rej();
|
rej();
|
||||||
|
@ -139,12 +142,25 @@ router.post('/imgur/ordeal', async (req, res) => {
|
||||||
}));
|
}));
|
||||||
}
|
}
|
||||||
|
|
||||||
const result = await promiseAny(promises);
|
let result;
|
||||||
|
try {
|
||||||
|
result = await promiseAny(promises);
|
||||||
|
} catch(_) {
|
||||||
|
res.status(404).json({ error: "No image in gallery found" });
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
console.log('result', result);
|
||||||
albumJson = { data: result.album };
|
albumJson = { data: result.album };
|
||||||
|
|
||||||
ordealResponse.views = result.image.views;
|
ordealResponse.views = result.image.views;
|
||||||
ordealResponse.votes = await fetchImgur(req, res, 'GET', '/gallery/'
|
ordealResponse.votes = await fetchImgur(req, res, 'GET', '/gallery/'
|
||||||
+ result.image.id + '/votes');
|
+ result.album.id + '/votes');
|
||||||
|
|
||||||
|
if (!ordealResponse.votes) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
console.log('votes', ordealResponse.votes);
|
||||||
|
|
||||||
if (!await fetchImgur(req, res, 'DELETE', '/image/' + result.image.id)) {
|
if (!await fetchImgur(req, res, 'DELETE', '/image/' + result.image.id)) {
|
||||||
return;
|
return;
|
||||||
|
|
|
@ -35,8 +35,8 @@ formaction="/favorites/{_id}/bookmarked?_method=PUT">Add bookmark</button>
|
||||||
<label for="favorites">Replace an image</label>
|
<label for="favorites">Replace an image</label>
|
||||||
<input type="checkbox" name="replace"><br>
|
<input type="checkbox" name="replace"><br>
|
||||||
<div class="replace hidden">
|
<div class="replace hidden">
|
||||||
<input type="text" name="old_name" required placeholder="Imgur image name to replace"><br>
|
<input type="text" name="old_name" placeholder="Imgur image name to replace"><br>
|
||||||
</div>
|
</div>
|
||||||
<button>Submit to Imgur</button>
|
<button type="submit">Submit to Imgur</button>
|
||||||
</form>
|
</form>
|
||||||
{/details}
|
{/details}
|
||||||
|
|
Reference in a new issue