Skip to content
Browse files

Fix retina emoticons etc.

  • Loading branch information...
1 parent d0c2cbb commit bd3cd012710967599b3e313d01a60ee91ac99532 @miekd committed Oct 25, 2012
View
4 Brief.SkypeChatStyle/Contents/Resources/Conversation.html
@@ -3,12 +3,14 @@
<head>
<meta charset="utf-8" />
- <title>Brief 1.5 &mdash; Skype 5 Chat Style</title>
+ <title>Brief 1.6 &mdash; Skype 5 Chat Style</title>
<link rel="stylesheet" href="css/main.css" type="text/css" media="screen" />
+ <link rel="stylesheet" href="css/emoticons.css" type="text/css" media="screen" />
<script src="js/jquery.min.js"></script>
<script src="js/main.js"></script>
+ <script src="js/emoticons.js"></script>
<script src="js/jquery.sprite.js"></script>
<script src="js/retina.js"></script>
View
4 Brief.SkypeChatStyle/Contents/Resources/css/emoticons.css
@@ -5,6 +5,7 @@ span.emoticon {
overflow: hidden;
color: transparent;
background-position: 0 0px;
+ background-size: 20px auto;
background-repeat: no-repeat;
background-color: transparent;
vertical-align: bottom;
@@ -15,6 +16,7 @@ span.emoticon {
top: -5px;
}
+
/* STATIC */
/* default 20x20px emoticons */
@@ -488,6 +490,8 @@ span.emoticon {
}
+
+
/* 30x30px emoticons */
/* Animated 20x20px */
View
1 Brief.SkypeChatStyle/Contents/Resources/css/main.scss
@@ -1,6 +1,5 @@
@import "sass-base";
@import "base";
-@import "emoticons.css";
// !!!
View
61 Brief.SkypeChatStyle/Contents/Resources/js/emoticons.js
@@ -0,0 +1,61 @@
+/**
+ * @fileoverview Skype Emoticons
+ * @author Thibault Martin-Lagardette
+ * @version 1.0
+*/
+
+/*
+ * Copyright (c) 2012 Skype Technologies S.A. All rights reserved.
+ */
+
+function elementIsInViewport(elm) {
+ var r = elm.getBoundingClientRect();
+
+ return (
+ (r.top + r.height) >= 0 && (r.bottom - r.height) <= window.innerHeight &&
+ (r.left + r.width) >= 0 && (r.right - r.width) <= window.innerWidth
+ );
+}
+
+// This is also called in -[SkypeChatDisplay SK_processNewMessages];
+// If you rename or move it, be careful :)
+function updateEmoticonSprites() {
+ var elementsToSprite = [],
+ elementsToUnsprite = [];
+ $(".emoticon").each(function (idx, elm) {
+ if (elementIsInViewport(elm)) {
+ //$(elm).removeClass("offscreen");
+ elementsToSprite.push($(elm));
+ }
+ else {
+ //$(elm).addClass("offscreen");
+ elementsToUnsprite.push($(elm));
+ }
+ });
+ $(elementsToSprite).sprite();
+ $(elementsToUnsprite).unsprite();
+}
+
+function pauseAllEmoticonAnimations() {
+ $.pauseAnimations();
+}
+
+function resumeAllEmoticonAnimations() {
+ $.resumeAnimations();
+}
+
+// Scroll timer
+// When the view scroll, make sure to updateEmoticonSprites (aka, stop animating
+// any hidden ones and start animating visible ones)
+// For performance, do it with a timer, because `scroll' is called for every
+// scrolled pixel
+spriteScrollTimer = null;
+$(window).load(function() {
+ $(window).scroll(function() {
+ if (spriteScrollTimer) {
+ clearTimeout(spriteScrollTimer);
+ }
+ spriteScrollTimer = setTimeout(updateEmoticonSprites, 100);
+ });
+});
+

0 comments on commit bd3cd01

Please sign in to comment.
Something went wrong with that request. Please try again.