mirror of
https://github.com/friendica/friendica
synced 2024-11-18 05:43:42 +00:00
improve like/share buttons
change the button only if it could send its request successfully to the server. fixes: * disrupting a video on liking or sharing * timeline jumps around somewhere else, when you like or share a posting/comment, and you can not find back.
This commit is contained in:
parent
bb835848d4
commit
f8fc9c1e8b
3 changed files with 53 additions and 14 deletions
|
@ -764,12 +764,52 @@ function htmlToText(htmlString) {
|
||||||
* @param {boolean} un Whether to perform an activity removal instead of creation
|
* @param {boolean} un Whether to perform an activity removal instead of creation
|
||||||
*/
|
*/
|
||||||
function doActivityItemAction(ident, verb, un) {
|
function doActivityItemAction(ident, verb, un) {
|
||||||
if (verb.indexOf("attend") === 0) {
|
console.log(ident, verb, un);
|
||||||
$(".item-" + ident + " .button-event:not(#" + verb + "-" + ident + ")").removeClass("active");
|
_verb = un ? 'un' + verb : verb;
|
||||||
}
|
$('#like-rotator-' + ident.toString()).show();
|
||||||
$("#" + verb + "-" + ident).toggleClass("active");
|
$.post('item/' + ident.toString() + '/activity/' + _verb)
|
||||||
|
.success(
|
||||||
|
function(data){
|
||||||
|
console.log("data.status: " + data.status);
|
||||||
|
if (data.status == "ok") {
|
||||||
|
console.log("connection: " + data.status);
|
||||||
|
$('#like-rotator-' + ident.toString()).hide();
|
||||||
|
if (verb.indexOf("announce") === 0 ) {
|
||||||
|
console.log("announce")
|
||||||
|
if (data.verb == "un" + verb) {
|
||||||
|
$("button[id^=shareMenuOptions-" + ident.toString() + "]" ).removeClass("active");
|
||||||
|
$("button[id^=shareMenuOptions-" + ident.toString() + "]" ).attr("onclick", "doActivityItemAction(" + ident +", '" + verb + "', " + false + ")").change();
|
||||||
|
$("button[id^=" + verb + "-" + ident.toString() + "]" ).removeClass("active");
|
||||||
|
$("button[id^=" + verb + "-" + ident.toString() + "]" ).attr("onclick", "doActivityItemAction(" + ident +", '" + verb + "', " + false + ")").change();
|
||||||
|
} else {
|
||||||
|
$("button[id^=shareMenuOptions-" + ident.toString() + "]" ).addClass("active");
|
||||||
|
$("button[id^=shareMenuOptions-" + ident.toString() + "]" ).attr("onclick", "doActivityItemAction(" + ident +", '" + verb + "', " + true + ")").change();
|
||||||
|
$("button[id^=" + verb + "-" + ident.toString() + "]" ).addClass("active");
|
||||||
|
$("button[id^=" + verb + "-" + ident.toString() + "]" ).attr("onclick", "doActivityItemAction(" + ident +", '" + verb + "', " + true + ")").change();
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
console.log("likes")
|
||||||
|
if (data.verb == "un" + verb) {
|
||||||
|
console.log(data.state);
|
||||||
|
$("button[id^=" + verb + "-" + ident.toString() + "]" ).removeClass("active");
|
||||||
|
$("button[id^=" + verb + "-" + ident.toString() + "]" ).attr("onclick", "doActivityItemAction(" + ident +", '" + verb + "', " + false + ")").change();
|
||||||
|
} else {
|
||||||
|
$("button[id^=" + verb + "-" + ident.toString() + "]" ).addClass("active");
|
||||||
|
$("button[id^=" + verb + "-" + ident.toString() + "]" ).attr("onclick", "doActivityItemAction(" + ident +", '" + verb + "', " + true + ")").change();
|
||||||
|
}
|
||||||
|
$("button[id^=" + verb + "-" + ident.toString() + "]" ).button('refresh');
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
$.jGrowl("No connection to host for like or share", {sticky: false, theme: 'info', life: 5000});
|
||||||
|
console.err("No connection to host");
|
||||||
|
}
|
||||||
|
})
|
||||||
|
.error(
|
||||||
|
function(data){
|
||||||
|
$.jGrowl("Network not reachable", {sticky: false, theme: 'info', life: 5000});
|
||||||
|
console.log("POST unsuccessfull " + data.toString());
|
||||||
|
});
|
||||||
|
|
||||||
doActivityItem(ident, verb, un);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
// Decodes a hexadecimally encoded binary string
|
// Decodes a hexadecimally encoded binary string
|
||||||
|
|
|
@ -3,8 +3,7 @@
|
||||||
<button type="button"
|
<button type="button"
|
||||||
class="btn-link button-likes{{if $responses.like.self}} active" aria-pressed="true{{/if}}" id="like-{{$id}}"
|
class="btn-link button-likes{{if $responses.like.self}} active" aria-pressed="true{{/if}}" id="like-{{$id}}"
|
||||||
title="{{$like_title}}"
|
title="{{$like_title}}"
|
||||||
onclick="doActivityItemAction({{$id}}, 'like'{{if $responses.like.self}}, true{{/if}});"
|
onclick="doActivityItemAction({{$id}}, 'like'{{if $responses.like.self}}, true{{/if}});">
|
||||||
data-toggle="button">
|
|
||||||
<i class="fa fa-thumbs-up" aria-hidden="true"></i> {{$like}}
|
<i class="fa fa-thumbs-up" aria-hidden="true"></i> {{$like}}
|
||||||
</button>
|
</button>
|
||||||
{{if !$hide_dislike}}
|
{{if !$hide_dislike}}
|
||||||
|
@ -13,8 +12,8 @@
|
||||||
class="btn-link button-likes{{if $responses.dislike.self}} active" aria-pressed="true{{/if}}"
|
class="btn-link button-likes{{if $responses.dislike.self}} active" aria-pressed="true{{/if}}"
|
||||||
id="dislike-{{$id}}"
|
id="dislike-{{$id}}"
|
||||||
title="{{$dislike_title}}"
|
title="{{$dislike_title}}"
|
||||||
onclick="doActivityItemAction({{$id}}, 'dislike'{{if $responses.dislike.self}}, true{{/if}});"
|
onclick="doActivityItemAction({{$id}}, 'dislike'{{if $responses.dislike.self}}, true{{/if}});">
|
||||||
data-toggle="button"><i class="fa fa-thumbs-down" aria-hidden="true"></i> {{$dislike}}
|
<i class="fa fa-thumbs-down" aria-hidden="true"></i> {{$dislike}}
|
||||||
</button>
|
</button>
|
||||||
{{/if}}
|
{{/if}}
|
||||||
<img id="like-rotator-{{$id}}" class="like-rotator" src="images/rotator.gif" alt="{{$wait}}" title="{{$wait}}" style="display: none;" />
|
<img id="like-rotator-{{$id}}" class="like-rotator" src="images/rotator.gif" alt="{{$wait}}" title="{{$wait}}" style="display: none;" />
|
||||||
|
|
|
@ -285,13 +285,13 @@ as the value of $top_child_total (this is done at the end of this file)
|
||||||
{{* Buttons for like and dislike *}}
|
{{* Buttons for like and dislike *}}
|
||||||
{{if $item.vote}}
|
{{if $item.vote}}
|
||||||
{{if $item.vote.like}}
|
{{if $item.vote.like}}
|
||||||
<button type="button" class="btn-link button-likes{{if $item.responses.like.self}} active" aria-pressed="true{{/if}}" id="like-{{$item.id}}" title="{{$item.vote.like.0}}" onclick="doActivityItemAction({{$item.id}}, 'like'{{if $item.responses.like.self}}, true{{/if}});" data-toggle="button"><i class="fa fa-thumbs-up" aria-hidden="true"></i> {{$item.vote.like.1}}</button>
|
<button type="button" class="btn-link button-likes{{if $item.responses.like.self}} active" aria-pressed="true{{/if}}" id="like-{{$item.id}}" title="{{$item.vote.like.0}}" onclick="doActivityItemAction({{$item.id}}, 'like'{{if $item.responses.like.self}}, true{{/if}});" ><i class="fa fa-thumbs-up" aria-hidden="true"></i> {{$item.vote.like.1}}</button>
|
||||||
{{/if}}
|
{{/if}}
|
||||||
{{if $item.vote.like AND $item.vote.dislike}}
|
{{if $item.vote.like AND $item.vote.dislike}}
|
||||||
<span role="presentation" class="separator"></span>
|
<span role="presentation" class="separator"></span>
|
||||||
{{/if}}
|
{{/if}}
|
||||||
{{if $item.vote.dislike}}
|
{{if $item.vote.dislike}}
|
||||||
<button type="button" class="btn-link button-likes{{if $item.responses.dislike.self}} active" aria-pressed="true{{/if}}" id="dislike-{{$item.id}}" title="{{$item.vote.dislike.0}}" onclick="doActivityItemAction({{$item.id}}, 'dislike'{{if $item.responses.dislike.self}}, true{{/if}});" data-toggle="button"><i class="fa fa-thumbs-down" aria-hidden="true"></i> {{$item.vote.dislike.1}}</button>
|
<button type="button" class="btn-link button-likes{{if $item.responses.dislike.self}} active" aria-pressed="true{{/if}}" id="dislike-{{$item.id}}" title="{{$item.vote.dislike.0}}" onclick="doActivityItemAction({{$item.id}}, 'dislike'{{if $item.responses.dislike.self}}, true{{/if}});" ><i class="fa fa-thumbs-down" aria-hidden="true"></i> {{$item.vote.dislike.1}}</button>
|
||||||
{{/if}}
|
{{/if}}
|
||||||
|
|
||||||
{{if ($item.vote.like OR $item.vote.dislike) AND $item.comment_html}}
|
{{if ($item.vote.like OR $item.vote.dislike) AND $item.comment_html}}
|
||||||
|
@ -316,7 +316,7 @@ as the value of $top_child_total (this is done at the end of this file)
|
||||||
{{/if}}
|
{{/if}}
|
||||||
{{/if}}
|
{{/if}}
|
||||||
{{if $item.vote.announce}}
|
{{if $item.vote.announce}}
|
||||||
<button type="button" class="btn-link button-announces{{if $item.responses.announce.self}} active" aria-pressed="true{{/if}}" id="announce-{{$item.id}}" title="{{$item.vote.announce.0}}" onclick="doActivityItemAction({{$item.id}}, 'announce'{{if $item.responses.announce.self}}, true{{/if}});" data-toggle="button"><i class="fa fa-retweet" aria-hidden="true"></i> {{$item.vote.announce.1}}</button>
|
<button type="button" class="btn-link button-announces{{if $item.responses.announce.self}} active" aria-pressed="true{{/if}}" id="announce-{{$item.id}}" title="{{$item.vote.announce.0}}" onclick="doActivityItemAction({{$item.id}}, 'announce'{{if $item.responses.announce.self}}, true{{/if}});" ><i class="fa fa-retweet" aria-hidden="true"></i> {{$item.vote.announce.1}}</button>
|
||||||
<span role="presentation" class="separator"></span>
|
<span role="presentation" class="separator"></span>
|
||||||
{{/if}}
|
{{/if}}
|
||||||
{{if $item.vote.share}}
|
{{if $item.vote.share}}
|
||||||
|
@ -441,10 +441,10 @@ as the value of $top_child_total (this is done at the end of this file)
|
||||||
{{* Buttons for like and dislike *}}
|
{{* Buttons for like and dislike *}}
|
||||||
{{if $item.vote}}
|
{{if $item.vote}}
|
||||||
{{if $item.vote.like}}
|
{{if $item.vote.like}}
|
||||||
<button type="button" class="btn button-likes{{if $item.responses.like.self}} active" aria-pressed="true{{/if}}" id="like-{{$item.id}}" title="{{$item.vote.like.0}}" onclick="doActivityItemAction({{$item.id}}, 'like'{{if $item.responses.like.self}}, true{{/if}});" data-toggle="button"><i class="fa fa-thumbs-up" aria-hidden="true"></i></button>
|
<button type="button" class="btn button-likes{{if $item.responses.like.self}} active" aria-pressed="true{{/if}}" id="like-{{$item.id}}" title="{{$item.vote.like.0}}" onclick="doActivityItemAction({{$item.id}}, 'like'{{if $item.responses.like.self}}, true{{/if}});" ><i class="fa fa-thumbs-up" aria-hidden="true"></i></button>
|
||||||
{{/if}}
|
{{/if}}
|
||||||
{{if $item.vote.dislike}}
|
{{if $item.vote.dislike}}
|
||||||
<button type="button" class="btn button-likes{{if $item.responses.dislike.self}} active" aria-pressed="true{{/if}}" id="dislike-{{$item.id}}" title="{{$item.vote.dislike.0}}" onclick="doActivityItemAction({{$item.id}}, 'dislike'{{if $item.responses.dislike.self}}, true{{/if}});" data-toggle="button"><i class="fa fa-thumbs-down" aria-hidden="true"></i></button>
|
<button type="button" class="btn button-likes{{if $item.responses.dislike.self}} active" aria-pressed="true{{/if}}" id="dislike-{{$item.id}}" title="{{$item.vote.dislike.0}}" onclick="doActivityItemAction({{$item.id}}, 'dislike'{{if $item.responses.dislike.self}}, true{{/if}});" ><i class="fa fa-thumbs-down" aria-hidden="true"></i></button>
|
||||||
{{/if}}
|
{{/if}}
|
||||||
{{/if}}
|
{{/if}}
|
||||||
|
|
||||||
|
|
Loading…
Reference in a new issue