X-Git-Url: https://git.auder.net/assets/icon_infos.svg?a=blobdiff_plain;f=client%2Fsrc%2Fviews%2FProblems.vue;h=d3dfdfd2913c6a779616bec576054b393de3919c;hb=5fe7e71c7d34afbaed99d5bb75525db411bade61;hp=7c81e6782447e4e0dec7263f1f09755cfe215b6e;hpb=bd76b45611cbb58dcf774745a4d690277a82aacd;p=vchess.git
diff --git a/client/src/views/Problems.vue b/client/src/views/Problems.vue
index 7c81e678..d3dfdfd2 100644
--- a/client/src/views/Problems.vue
+++ b/client/src/views/Problems.vue
@@ -39,9 +39,10 @@ main
button(@click="sendProblem()") {{ st.tr["Send"] }}
#dialog.text-center {{ st.tr[infoMsg] }}
.row(v-if="showOne")
- .col-sm-12.col-md-10.col-md-offset-1.col-lg-8.col-lg-offset-2
+ .col-sm-12.col-md-10.col-md-offset-2
#topPage
- span {{ curproblem.vname }}
+ span.vname {{ curproblem.vname }}
+ span.uname {{ "(" + curproblem.uname + ")" }}
button.marginleft(@click="backToList()") {{ st.tr["Back to list"] }}
button.nomargin(
v-if="st.user.id == curproblem.uid"
@@ -54,7 +55,7 @@ main
)
| {{ st.tr["Delete"] }}
p.clickable(
- v-html="curproblem.uname + ' : ' + parseHtml(curproblem.instruction)"
+ v-html="parseHtml(curproblem.instruction)"
@click="curproblem.showSolution=!curproblem.showSolution"
)
| {{ st.tr["Show solution"] }}
@@ -83,13 +84,15 @@ main
tr
th {{ st.tr["Variant"] }}
th {{ st.tr["Instructions"] }}
+ th {{ st.tr["Number"] }}
tr(
v-for="p in problems"
v-show="displayProblem(p)"
@click="setHrefPid(p)"
)
td {{ p.vname }}
- td(v-html="p.instruction")
+ td {{ firstChars(p.instruction) }}
+ td {{ p.id }}
BaseGame(v-if="showOne" :game="game" :vr="vr")
@@ -146,10 +149,15 @@ export default {
this.problems.forEach(p => {
if (p.uid != this.st.user.id)
names[p.uid] = ""; //unknwon for now
- else { console.log("assign " + this.st.user.name);
- p.uname = this.st.user.name; console.log(p); console.log(this.problems); }
+ else
+ p.uname = this.st.user.name;
});
- if (Object.keys(name).length > 0)
+ const showOneIfPid = () => {
+ const pid = this.$route.query["id"];
+ if (!!pid)
+ this.showProblem(this.problems.find(p => p.id == pid));
+ };
+ if (Object.keys(names).length > 0)
{
ajax("/users",
"GET",
@@ -157,12 +165,12 @@ export default {
res2 => {
res2.users.forEach(u => {names[u.id] = u.name});
this.problems.forEach(p => p.uname = names[p.uid]);
+ showOneIfPid();
}
);
}
- const pid = this.$route.query["id"];
- if (!!pid)
- this.showProblem(this.problems.find(p => p.id == pid));
+ else
+ showOneIfPid();
});
},
mounted: function() {
@@ -175,7 +183,7 @@ export default {
if (this.problems.length > 0 && this.problems[0].vname == "")
this.problems.forEach(p => this.setVname(p));
},
- "$route": function(to, from) { console.log("ddddd");
+ "$route": function(to, from) {
const pid = to.query["id"];
if (!!pid)
this.showProblem(this.problems.find(p => p.id == pid));
@@ -187,6 +195,19 @@ export default {
setVname: function(prob) {
prob.vname = this.st.variants.find(v => v.id == prob.vid).name;
},
+ firstChars: function(text) {
+ let preparedText = text
+ // Replace line jumps and
by spaces
+ .replace(/\n/g, " " )
+ .replace(/
/g, " " )
+ .replace(/<[^>]+>/g, "") //remove remaining HTML tags
+ .replace(/[ ]+/g, " ") //remove series of spaces by only one
+ .trim();
+ const maxLength = 32; //arbitrary...
+ if (preparedText.length > maxLength)
+ return preparedText.substr(0,32) + "...";
+ return preparedText;
+ },
copyProblem: function(p1, p2) {
for (let key in p1)
p2[key] = p1[key];
@@ -336,13 +357,21 @@ textarea
text-align: center
& > *
margin: 0
+
#topPage
- span
+ span.vname
font-weight: bold
+ padding-left: var(--universal-margin)
+ span.uname
+ padding-left: var(--universal-margin)
margin: 0 auto
& > .nomargin
margin: 0
& > .marginleft
margin: 0 0 0 15px
+@media screen and (max-width: 767px)
+ #topPage
+ text-align: center
+