Merge pull request #569 from oohlaf/fixes
Fix browser prefetch of template strings in images
This commit is contained in:
commit
e05725fb44
36 changed files with 65 additions and 33 deletions
|
@ -248,11 +248,16 @@ ACL.prototype.populate = function(data){
|
|||
that.list_content.height(height);
|
||||
$(data.items).each(function(){
|
||||
html = "<div class='acl-list-item {4} {5}' title='{6}' id='{2}{3}'>"+that.item_tpl+"</div>";
|
||||
html = html.format( this.photo, this.name, this.type, this.id, '', this.network, this.link );
|
||||
html = html.format(this.photo, this.name, this.type, this.id, '', this.network, this.link);
|
||||
if (this.uids!=undefined) that.group_uids[this.id] = this.uids;
|
||||
//console.log(html);
|
||||
that.list_content.append(html);
|
||||
});
|
||||
$(".acl-list-item img[data-src]").each(function(i, el){
|
||||
// Replace data-src attribute with src attribute for every image
|
||||
$(el).attr('src', $(el).data("src"));
|
||||
$(el).removeAttr("data-src");
|
||||
});
|
||||
that.update_view();
|
||||
}
|
||||
|
||||
|
|
10
js/main.js
10
js/main.js
|
@ -181,7 +181,14 @@
|
|||
html = notifications_tpl.format(e.attr('href'),e.attr('photo'), text, e.attr('date'), e.attr('seen'));
|
||||
nnm.append(html);
|
||||
});
|
||||
|
||||
$("img[data-src]", nnm).each(function(i, el){
|
||||
// Replace data-src attribute with src attribute for every image
|
||||
$(el).attr('src', $(el).data("src"));
|
||||
$(el).removeAttr("data-src");
|
||||
});
|
||||
}
|
||||
|
||||
notif = eNotif.attr('count');
|
||||
if (notif>0){
|
||||
$("#nav-notifications-linkmenu").addClass("on");
|
||||
|
@ -202,8 +209,7 @@
|
|||
});
|
||||
|
||||
});
|
||||
|
||||
|
||||
|
||||
NavUpdate();
|
||||
// Allow folks to stop the ajax page updates with the pause/break key
|
||||
$(document).keydown(function(event) {
|
||||
|
|
|
@ -9,7 +9,7 @@
|
|||
</div>
|
||||
|
||||
<div class="acl-list-item" rel="acl-template" style="display:none">
|
||||
<img src="{0}"><p>{1}</p>
|
||||
<img data-src="{0}"><p>{1}</p>
|
||||
<a href="#" class='acl-button-show'>$show</a>
|
||||
<a href="#" class='acl-button-hide'>$hide</a>
|
||||
</div>
|
||||
|
|
|
@ -64,5 +64,5 @@
|
|||
</nav>
|
||||
|
||||
<ul id="nav-notifications-template" style="display:none;" rel="template">
|
||||
<li class="{4}"><a href="{0}"><img src="{1}" height="24" width="24" alt="" />{2} <span class="notif-when">{3}</span></a></li>
|
||||
<li class="{4}"><a href="{0}"><img data-src="{1}" height="24" width="24" alt="" />{2} <span class="notif-when">{3}</span></a></li>
|
||||
</ul>
|
||||
|
|
|
@ -9,7 +9,7 @@
|
|||
</div>
|
||||
|
||||
<div class="acl-list-item" rel="acl-template" style="display:none">
|
||||
<img src="{0}"><p>{1}</p>
|
||||
<img data-src="{0}"><p>{1}</p>
|
||||
<a href="#" class='acl-button-show'>{{$show}}</a>
|
||||
<a href="#" class='acl-button-hide'>{{$hide}}</a>
|
||||
</div>
|
||||
|
|
|
@ -64,5 +64,5 @@
|
|||
</nav>
|
||||
|
||||
<ul id="nav-notifications-template" style="display:none;" rel="template">
|
||||
<li class="{4}"><a href="{0}"><img src="{1}" height="24" width="24" alt="" />{2} <span class="notif-when">{3}</span></a></li>
|
||||
<li class="{4}"><a href="{0}"><img data-src="{1}" height="24" width="24" alt="" />{2} <span class="notif-when">{3}</span></a></li>
|
||||
</ul>
|
||||
|
|
|
@ -69,7 +69,7 @@
|
|||
</nav>
|
||||
|
||||
<ul id="nav-notifications-template" style="display:none;" rel="template">
|
||||
<li class="{4}"><a href="{0}"><img src="{1}" height="24" width="24" alt="" />{2} <span class="notif-when">{3}</span></a></li>
|
||||
<li class="{4}"><a href="{0}"><img data-src="{1}" height="24" width="24" alt="" />{2} <span class="notif-when">{3}</span></a></li>
|
||||
</ul>
|
||||
<script>
|
||||
var pagetitle = null;
|
||||
|
|
|
@ -69,7 +69,7 @@
|
|||
</nav>
|
||||
|
||||
<ul id="nav-notifications-template" style="display:none;" rel="template">
|
||||
<li class="{4}"><a href="{0}"><img src="{1}" height="24" width="24" alt="" />{2} <span class="notif-when">{3}</span></a></li>
|
||||
<li class="{4}"><a href="{0}"><img data-src="{1}" height="24" width="24" alt="" />{2} <span class="notif-when">{3}</span></a></li>
|
||||
</ul>
|
||||
<script>
|
||||
var pagetitle = null;
|
||||
|
|
|
@ -144,7 +144,7 @@
|
|||
|
||||
|
||||
<ul id="nav-notifications-template" style="display:none;" rel="template">
|
||||
<li class="{4}"><a href="{0}"><img src="{1}">{2} <span class="notif-when">{3}</span></a></li>
|
||||
<li class="{4}"><a href="{0}"><img data-src="{1}">{2} <span class="notif-when">{3}</span></a></li>
|
||||
</ul>
|
||||
|
||||
|
||||
|
|
|
@ -144,7 +144,7 @@
|
|||
|
||||
|
||||
<ul id="nav-notifications-template" style="display:none;" rel="template">
|
||||
<li class="{4}"><a href="{0}"><img src="{1}">{2} <span class="notif-when">{3}</span></a></li>
|
||||
<li class="{4}"><a href="{0}"><img data-src="{1}">{2} <span class="notif-when">{3}</span></a></li>
|
||||
</ul>
|
||||
|
||||
|
||||
|
|
|
@ -139,7 +139,7 @@ $langselector
|
|||
|
||||
<ul id="nav-notifications-template" style="display:none;" rel="template">
|
||||
<li class="{4}">
|
||||
<a href="{0}"><img src="{1}" height="24" width="24" alt="" />{2} <span class="notif-when">{3}</span></a>
|
||||
<a href="{0}"><img data-src="{1}" height="24" width="24" alt="" />{2} <span class="notif-when">{3}</span></a>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
|
|
|
@ -139,7 +139,7 @@
|
|||
|
||||
<ul id="nav-notifications-template" style="display:none;" rel="template">
|
||||
<li class="{4}">
|
||||
<a href="{0}"><img src="{1}" height="24" width="24" alt="" />{2} <span class="notif-when">{3}</span></a>
|
||||
<a href="{0}"><img data-src="{1}" height="24" width="24" alt="" />{2} <span class="notif-when">{3}</span></a>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
|
|
|
@ -66,5 +66,5 @@
|
|||
</nav>
|
||||
|
||||
<ul id="nav-notifications-template" style="display:none;" rel="template">
|
||||
<li class="{4}"><a href="{0}"><img src="{1}" height="24" width="24" alt="" />{2} <span class="notif-when">{3}</span></a></li>
|
||||
<li class="{4}"><a href="{0}"><img data-src="{1}" height="24" width="24" alt="" />{2} <span class="notif-when">{3}</span></a></li>
|
||||
</ul>
|
||||
|
|
|
@ -66,5 +66,5 @@
|
|||
</nav>
|
||||
|
||||
<ul id="nav-notifications-template" style="display:none;" rel="template">
|
||||
<li class="{4}"><a href="{0}"><img src="{1}" height="24" width="24" alt="" />{2} <span class="notif-when">{3}</span></a></li>
|
||||
<li class="{4}"><a href="{0}"><img data-src="{1}" height="24" width="24" alt="" />{2} <span class="notif-when">{3}</span></a></li>
|
||||
</ul>
|
||||
|
|
|
@ -64,5 +64,5 @@
|
|||
</nav>
|
||||
|
||||
<ul id="nav-notifications-template" style="display:none;" rel="template">
|
||||
<li class="{4}"><a href="{0}"><img src="{1}" height="24" width="24" alt="" />{2} <span class="notif-when">{3}</span></a></li>
|
||||
<li class="{4}"><a href="{0}"><img data-src="{1}" height="24" width="24" alt="" />{2} <span class="notif-when">{3}</span></a></li>
|
||||
</ul>
|
||||
|
|
|
@ -64,5 +64,5 @@
|
|||
</nav>
|
||||
|
||||
<ul id="nav-notifications-template" style="display:none;" rel="template">
|
||||
<li class="{4}"><a href="{0}"><img src="{1}" height="24" width="24" alt="" />{2} <span class="notif-when">{3}</span></a></li>
|
||||
<li class="{4}"><a href="{0}"><img data-src="{1}" height="24" width="24" alt="" />{2} <span class="notif-when">{3}</span></a></li>
|
||||
</ul>
|
||||
|
|
|
@ -9,7 +9,7 @@
|
|||
</div>
|
||||
|
||||
<div class="acl-list-item" rel="acl-template" style="display:none">
|
||||
<img src="{0}"><p>{1}</p>
|
||||
<img data-src="{0}"><p>{1}</p>
|
||||
<a href="#" class='acl-button-show'>$show</a>
|
||||
<a href="#" class='acl-button-hide'>$hide</a>
|
||||
</div>
|
||||
|
|
|
@ -253,6 +253,11 @@ ACL.prototype.populate = function(data){
|
|||
//console.log(html);
|
||||
that.list_content.append(html);
|
||||
});
|
||||
$(".acl-list-item img[data-src]").each(function(i, el){
|
||||
// Replace data-src attribute with src attribute for every image
|
||||
$(el).attr('src', $(el).data("src"));
|
||||
$(el).removeAttr("data-src");
|
||||
});
|
||||
that.update_view();
|
||||
}
|
||||
|
||||
|
|
|
@ -187,6 +187,12 @@
|
|||
html = notifications_tpl.format(e.attr('href'),e.attr('photo'), text, e.attr('date'), e.attr('seen'));
|
||||
nnm.append(html);
|
||||
});
|
||||
|
||||
$("img[data-src]", nnm).each(function(i, el){
|
||||
// Replace data-src attribute with src attribute for every image
|
||||
$(el).attr('src', $(el).data("src"));
|
||||
$(el).removeAttr("data-src");
|
||||
});
|
||||
}
|
||||
notif = eNotif.attr('count');
|
||||
if (notif>0){
|
||||
|
|
|
@ -142,5 +142,5 @@
|
|||
</nav>
|
||||
|
||||
<ul id="nav-notifications-template" style="display:none;" rel="template">
|
||||
<li class="{4}"><a href="{0}"><img src="{1}" height="24" width="24" alt="" />{2} <span class="notif-when">{3}</span></a></li>
|
||||
<li class="{4}"><a href="{0}"><img data-src="{1}" height="24" width="24" alt="" />{2} <span class="notif-when">{3}</span></a></li>
|
||||
</ul>
|
||||
|
|
|
@ -9,7 +9,7 @@
|
|||
</div>
|
||||
|
||||
<div class="acl-list-item" rel="acl-template" style="display:none">
|
||||
<img src="{0}"><p>{1}</p>
|
||||
<img data-src="{0}"><p>{1}</p>
|
||||
<a href="#" class='acl-button-show'>{{$show}}</a>
|
||||
<a href="#" class='acl-button-hide'>{{$hide}}</a>
|
||||
</div>
|
||||
|
|
|
@ -142,5 +142,5 @@
|
|||
</nav>
|
||||
|
||||
<ul id="nav-notifications-template" style="display:none;" rel="template">
|
||||
<li class="{4}"><a href="{0}"><img src="{1}" height="24" width="24" alt="" />{2} <span class="notif-when">{3}</span></a></li>
|
||||
<li class="{4}"><a href="{0}"><img data-src="{1}" height="24" width="24" alt="" />{2} <span class="notif-when">{3}</span></a></li>
|
||||
</ul>
|
||||
|
|
|
@ -9,7 +9,6 @@
|
|||
</div>
|
||||
|
||||
<div class="acl-list-item" rel="acl-template" style="display:none">
|
||||
<img src="{0}"><p>{1}</p>
|
||||
<a href="#" class='acl-button-show'>$show</a>
|
||||
<a href="#" class='acl-button-hide'>$hide</a>
|
||||
</div>
|
||||
|
|
|
@ -253,6 +253,11 @@ ACL.prototype.populate = function(data){
|
|||
//console.log(html);
|
||||
that.list_content.append(html);
|
||||
});
|
||||
$(".acl-list-item img[data-src]").each(function(i, el){
|
||||
// Replace data-src attribute with src attribute for every image
|
||||
$(el).attr('src', $(el).data("src"));
|
||||
$(el).removeAttr("data-src");
|
||||
});
|
||||
that.update_view();
|
||||
}
|
||||
|
||||
|
|
|
@ -179,6 +179,12 @@
|
|||
html = notifications_tpl.format(e.attr('href'),e.attr('photo'), text, e.attr('date'), e.attr('seen'));
|
||||
nnm.append(html);
|
||||
});
|
||||
|
||||
$("img[data-src]", nnm).each(function(i, el){
|
||||
// Replace data-src attribute with src attribute for every image
|
||||
$(el).attr('src', $(el).data("src"));
|
||||
$(el).removeAttr("data-src");
|
||||
});
|
||||
}
|
||||
notif = eNotif.attr('count');
|
||||
if (notif>0){
|
||||
|
|
|
@ -146,5 +146,5 @@
|
|||
</nav>
|
||||
|
||||
<ul id="nav-notifications-template" style="display:none;" rel="template">
|
||||
<li class="{4}"><a href="{0}"><img src="{1}" height="24" width="24" alt="" />{2} <span class="notif-when">{3}</span></a></li>
|
||||
<li class="{4}"><a href="{0}"><img data-src="{1}" height="24" width="24" alt="" />{2} <span class="notif-when">{3}</span></a></li>
|
||||
</ul>
|
||||
|
|
|
@ -9,7 +9,7 @@
|
|||
</div>
|
||||
|
||||
<div class="acl-list-item" rel="acl-template" style="display:none">
|
||||
<img src="{0}"><p>{1}</p>
|
||||
<img data-src="{0}"><p>{1}</p>
|
||||
<a href="#" class='acl-button-show'>{{$show}}</a>
|
||||
<a href="#" class='acl-button-hide'>{{$hide}}</a>
|
||||
</div>
|
||||
|
|
|
@ -146,5 +146,5 @@
|
|||
</nav>
|
||||
|
||||
<ul id="nav-notifications-template" style="display:none;" rel="template">
|
||||
<li class="{4}"><a href="{0}"><img src="{1}" height="24" width="24" alt="" />{2} <span class="notif-when">{3}</span></a></li>
|
||||
<li class="{4}"><a href="{0}"><img data-src="{1}" height="24" width="24" alt="" />{2} <span class="notif-when">{3}</span></a></li>
|
||||
</ul>
|
||||
|
|
|
@ -89,7 +89,7 @@
|
|||
|
||||
</nav>
|
||||
<ul id="nav-notifications-template" style="display:none;" rel="template">
|
||||
<li><a href="{0}"><img src="{1}">{2} <span class="notif-when">{3}</span></a></li>
|
||||
<li><a href="{0}"><img data-src="{1}">{2} <span class="notif-when">{3}</span></a></li>
|
||||
</ul>
|
||||
|
||||
<div style="position: fixed; top: 3px; left: 5px; z-index:9999">$langselector</div>
|
||||
|
|
|
@ -89,7 +89,7 @@
|
|||
|
||||
</nav>
|
||||
<ul id="nav-notifications-template" style="display:none;" rel="template">
|
||||
<li><a href="{0}"><img src="{1}">{2} <span class="notif-when">{3}</span></a></li>
|
||||
<li><a href="{0}"><img data-src="{1}">{2} <span class="notif-when">{3}</span></a></li>
|
||||
</ul>
|
||||
|
||||
<div style="position: fixed; top: 3px; left: 5px; z-index:9999">{{$langselector}}</div>
|
||||
|
|
|
@ -62,7 +62,7 @@
|
|||
</div>
|
||||
|
||||
<ul id="nav-notifications-template" style="display:none;" rel="template">
|
||||
<li class="{4}"><a href="{0}"><img src="{1}" height="24" width="24" alt="" />{2} <span class="notif-when">{3}</span></a></li>
|
||||
<li class="{4}"><a href="{0}"><img data-src="{1}" height="24" width="24" alt="" />{2} <span class="notif-when">{3}</span></a></li>
|
||||
</ul>
|
||||
|
||||
<div style="position: fixed; top: 3px; left: 5px; z-index:9999">$langselector</div>
|
||||
|
|
|
@ -62,7 +62,7 @@
|
|||
</div>
|
||||
|
||||
<ul id="nav-notifications-template" style="display:none;" rel="template">
|
||||
<li class="{4}"><a href="{0}"><img src="{1}" height="24" width="24" alt="" />{2} <span class="notif-when">{3}</span></a></li>
|
||||
<li class="{4}"><a href="{0}"><img data-src="{1}" height="24" width="24" alt="" />{2} <span class="notif-when">{3}</span></a></li>
|
||||
</ul>
|
||||
|
||||
<div style="position: fixed; top: 3px; left: 5px; z-index:9999">{{$langselector}}</div>
|
||||
|
|
|
@ -60,7 +60,7 @@
|
|||
|
||||
|
||||
<ul id="nav-notifications-template" style="display:none;" rel="template">
|
||||
<li class="{4}"><a href="{0}"><img src="{1}" height="24" width="24" alt="" />{2} <span class="notif-when">{3}</span></a></li>
|
||||
<li class="{4}"><a href="{0}"><img data-src="{1}" height="24" width="24" alt="" />{2} <span class="notif-when">{3}</span></a></li>
|
||||
</ul>
|
||||
|
||||
|
||||
|
|
|
@ -60,7 +60,7 @@
|
|||
|
||||
|
||||
<ul id="nav-notifications-template" style="display:none;" rel="template">
|
||||
<li class="{4}"><a href="{0}"><img src="{1}" height="24" width="24" alt="" />{2} <span class="notif-when">{3}</span></a></li>
|
||||
<li class="{4}"><a href="{0}"><img data-src="{1}" height="24" width="24" alt="" />{2} <span class="notif-when">{3}</span></a></li>
|
||||
</ul>
|
||||
|
||||
|
||||
|
|
|
@ -104,7 +104,7 @@
|
|||
|
||||
</nav>
|
||||
<ul id="nav-notifications-template" style="display:none;" rel="template">
|
||||
<li><a href="{0}"><img src="{1}">{2} <span class="notif-when">{3}</span></a></li>
|
||||
<li><a href="{0}"><img data-src="{1}">{2} <span class="notif-when">{3}</span></a></li>
|
||||
</ul>
|
||||
|
||||
{#
|
||||
|
|
|
@ -104,7 +104,7 @@
|
|||
|
||||
</nav>
|
||||
<ul id="nav-notifications-template" style="display:none;" rel="template">
|
||||
<li><a href="{0}"><img src="{1}">{2} <span class="notif-when">{3}</span></a></li>
|
||||
<li><a href="{0}"><img data-src="{1}">{2} <span class="notif-when">{3}</span></a></li>
|
||||
</ul>
|
||||
|
||||
{{*
|
||||
|
|
Loading…
Reference in a new issue