dbaq / angular-emoji-filter-hd Goto Github PK

View Code? Open in Web Editor NEW

39.0 39.0 16.0 3.09 MB

An AngularJS filter for replacing emoji codes with high-definition emoticons (Retina friendly).

License: Other

JavaScript 29.16% CSS 70.84%

angular-emoji-filter-hd's People

Contributors

Stargazers

Watchers

Forkers

foresmac vokal cooljith91112 maggie03230 battlefy chanthus rm2kdev mskec andreicojea itsjw tekkchand sprinterorg clementprevot seawenzhu ramzimaalej

angular-emoji-filter-hd's Issues

0.0.6 is not registered on bower

I'm trying to instal this in a project using the version 0.0.6 as defined in your bower.json however it errors and suggest me to use 0.0.4 instead which doesnt contain the less and sass files

Just thought you should know about this 👍

Emoji path images substitution does not work in less

Hi,
I'm opening the issue because I needed to change the images path and I noticed that it doesn't work in less.

@emoji-images-path: "example/path/";
.emoji { 
    text-indent:-9999px;
    display:inline-block;
    height: 22px;
    margin-right: .5em;
    width: 22px;
}
@media all and (-webkit-min-device-pixel-ratio:1),all and (min--moz-device-pixel-ratio:1),all and (-o-min-device-pixel-ratio:1),all and (min-device-pixel-ratio:1),all and (min-resolution:96dpi) { .emoji
    {     background: transparent url(#{@emoji-images-path}emojis.png) 0 0 no-repeat;
    }
}
@media all and (-webkit-min-device-pixel-ratio:1.5),all and (-o-min-device-pixel-ratio:3/2),all and (min-device-pixel-ratio:1.5),all and (min-resolution:144dpi) { .emoji
    {     background: transparent url(#{@emoji-images-path}[email protected]) 0 0 no-repeat;
        background-size: 27776px 22px;
    }
}
@-moz-document url-prefix() { .emoji
    {     background: transparent url(#{@emoji-images-path}emojis.png) 0 0 no-repeat;
    }
}

The emoji-images-path is not used correctly to generate links in css files.

The syntax to have the right substitution should be :

@emoji-images-path: "example/path/";
.emoji { 
    text-indent:-9999px;
    display:inline-block;
    height: 22px;
    margin-right: .5em;
    width: 22px;
}
@media all and (-webkit-min-device-pixel-ratio:1),all and (min--moz-device-pixel-ratio:1),all and (-o-min-device-pixel-ratio:1),all and (min-device-pixel-ratio:1),all and (min-resolution:96dpi) { .emoji
    {     background: transparent url("@{emoji-images-path}emojis.png") 0 0 no-repeat;
    }
}
@media all and (-webkit-min-device-pixel-ratio:1.5),all and (-o-min-device-pixel-ratio:3/2),all and (min-device-pixel-ratio:1.5),all and (min-resolution:144dpi) { .emoji
    {     background: transparent url("@{emoji-images-path}emojis.png") 0 0 no-repeat;
        background-size: 27776px 22px;
    }
}
@-moz-document url-prefix() { .emoji
    {     background: transparent url("@{emoji-images-path}emojis.png") 0 0 no-repeat;
    }
}

Regards,
Erwan

NPM version?

Hello,

What are the odds of getting an NPM version of this?

Also, can the bower.json be changed so that angular is a devDependency not a dependency? I don't want it to install angular as that conflicts with my npm installation of angular...

The emojis black_square and white_square correspond to the incorrectly named CSS classes emoji_black_large_square and emoji_white_large_square. Should be emoji_black_square and emoji_white_square I think. Otherwise great work, thanks.

Emojis not showing on low definition devices?

I tested the filter on Samsung SII and emojis are not showing.

can i specialize the path to the emoji png?

Apple new skin tones support

Hi,
I'm opening this issue as the filter does not currently support Apple's new skin tones emojis.

When a skin tone is specified when using emojis, the normal emoji is set along with a color modifier, according to The Unicode Consortium (see http://www.unicode.org/reports/tr51/tr51-2.html#Diversity).

Any plans to implement this new upcoming unicode standard?

Regards,
Jordan

version 0.0.8 have a major bug

I'm trying to replace emojis inside a message that contains some html.

on version 0.0.6 it worked perfectly every time. After updating to 0.0.8, It started getting broken

I send the following text (parsed for presentation):

<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <style type="text/css" style="display:none;">
    <!-- P {margin-top:0;margin-bottom:0;} -->
    </style>
  </head>
  <body dir="rtl">
    <div id="divtagdefaultwrapper" style="font-size:12pt;color:#000000;background-color:#FFFFFF;font-family:Calibri,Arial,Helvetica,sans-serif;">
      <p>This is great! :wink:</p>
    </div>
  </body>
</html>

and I get the following with 0.0.6:

<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <style type="text/css" style="display:none;"> <!-- P {margin-top:0;margin-bottom:0;} --> </style> </head> <body dir="rtl"> <div id="divtagdefaultwrapper" style="font-size:12pt;color:#000000;background-color:#FFFFFF;font-family:Calibri,Arial,Helvetica,sans-serif;"> <p>This is great! <i class='emoji emoji_wink' title=':wink:'></i></p> </div> </body> </html>

and this with 0.0.8:

undefined<undefinedhundefinedtundefinedmundefinedlundefined>undefined undefined<undefinedhundefinedeundefinedaundefineddundefined>undefined undefined<undefinedmundefinedeundefinedtundefinedaundefined undefinedhundefinedtundefinedtundefinedpundefined-undefinedeundefinedqundefineduundefinediundefinedvundefined=undefined"undefinedCundefinedoundefinednundefinedtundefinedeundefinednundefinedtundefined-undefinedTundefinedyundefinedpundefinedeundefined"undefined undefinedcundefinedoundefinednundefinedtundefinedeundefinednundefinedtundefined=undefined"undefinedtundefinedeundefinedxundefinedtundefined/undefinedhundefinedtundefinedmundefinedlundefined;undefined undefinedcundefinedhundefinedaundefinedrundefinedsundefinedeundefinedtundefined=undefineduundefinedtundefinedfundefined-undefined8undefined"undefined>undefined undefined<undefinedsundefinedtundefinedyundefinedlundefinedeundefined undefinedtundefinedyundefinedpundefinedeundefined=undefined"undefinedtundefinedeundefinedxundefinedtundefined/undefinedcundefinedsundefinedsundefined"undefined undefinedsundefinedtundefinedyundefinedlundefinedeundefined=undefined"undefineddundefinediundefinedsundefinedpundefinedlundefinedaundefinedyundefined:undefinednundefinedoundefinednundefinedeundefined;undefined"undefined>undefined undefined<undefined!undefined-undefined-undefined undefinedPundefined undefined{undefinedmundefinedaundefinedrundefinedgundefinediundefinednundefined-undefinedtundefinedoundefinedpundefined:undefined0undefined;undefinedmundefinedaundefinedrundefinedgundefinediundefinednundefined-undefinedbundefinedoundefinedtundefinedtundefinedoundefinedmundefined:undefined0undefined;undefined}undefined undefined-undefined-undefined>undefined undefined<undefined/undefinedsundefinedtundefinedyundefinedlundefinedeundefined>undefined undefined<undefined/undefinedhundefinedeundefinedaundefineddundefined>undefined undefined<undefinedbundefinedoundefineddundefinedyundefined undefineddundefinediundefinedrundefined=undefined"undefinedrundefinedtundefinedlundefined"undefined>undefined undefined<undefineddundefinediundefinedvundefined undefinediundefineddundefined=undefined"undefineddundefinediundefinedvundefinedtundefinedaundefinedgundefineddundefinedeundefinedfundefinedaundefineduundefinedlundefinedtundefinedwundefinedrundefinedaundefinedpundefinedpundefinedeundefinedrundefined"undefined undefinedsundefinedtundefinedyundefinedlundefinedeundefined=undefined"undefinedfundefinedoundefinednundefinedtundefined-undefinedsundefinediundefinedzundefinedeundefined:undefined1undefined2undefinedpundefinedtundefined;undefinedcundefinedoundefinedlundefinedoundefinedrundefined:undefined#undefined0undefined0undefined0undefined0undefined0undefined0undefined;undefinedbundefinedaundefinedcundefinedkundefinedgundefinedrundefinedoundefineduundefinednundefineddundefined-undefinedcundefinedoundefinedlundefinedoundefinedrundefined:undefined#undefinedFundefinedFundefinedFundefinedFundefinedFundefinedFundefined;undefinedfundefinedoundefinednundefinedtundefined-undefinedfundefinedaundefinedmundefinediundefinedlundefinedyundefined:undefinedCundefinedaundefinedlundefinediundefinedbundefinedrundefinediundefined,undefinedAundefinedrundefinediundefinedaundefinedlundefined,undefinedHundefinedeundefinedlundefinedvundefinedeundefinedtundefinediundefinedcundefinedaundefined,undefinedsundefinedaundefinednundefinedsundefined-undefinedsundefinedeundefinedrundefinediundefinedfundefined;undefined"undefined>undefined undefined<undefinedpundefined>undefinedTundefinedhundefinediundefinedsundefined undefinediundefinedsundefined undefinedgundefinedrundefinedeundefinedaundefinedtundefined!undefined undefined:undefinedwundefinediundefinednundefinedkundefined:undefined<undefined/undefinedpundefined>undefined undefined<undefined/undefineddundefinediundefinedvundefined>undefined undefined<undefined/undefinedbundefinedoundefineddundefinedyundefined>undefined undefined<undefined/undefinedhundefinedtundefinedmundefinedlundefined>undefined

Support for emoji aliases

Hi,

I used this repo in one project I work on.

What we are missing is ability to add aliases for emojis.
What I mean is to make it possible to write :) and make it display :smile: (:smile:). Or to write <3 and to make it display :heart: (:heart:).

Would you be open to pull request with this support?

Martin

Recommend Projects

React

A declarative, efficient, and flexible JavaScript library for building user interfaces.
Vue.js

🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
Typescript

TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
TensorFlow

An Open Source Machine Learning Framework for Everyone
Django

The Web framework for perfectionists with deadlines.
Laravel

A PHP framework for web artisans
D3

Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

javascript

JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
web

Some thing interesting about web. New door for the world.
server

A server is a program made to process requests and deliver data to clients.
Machine learning

Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Visualization

Some thing interesting about visualization, use data art
Game

Some thing interesting about game, make everyone happy.

Recommend Org

Facebook

We are working to build community through open source technology. NB: members must have two-factor auth.
Microsoft

Open source projects and samples from Microsoft.
Google

Google ❤️ Open Source for everyone.
Alibaba

Alibaba Open Source for everyone
D3

Data-Driven Documents codes.
Tencent

China tencent open source team.