[smileybutton] Rework addon #1081
8 changed files with 161 additions and 89 deletions
|
@ -2,36 +2,32 @@
|
||||||
/**
|
/**
|
||||||
* Name: Smileybutton
|
* Name: Smileybutton
|
||||||
* Description: Adds a smileybutton to the Inputbox
|
* Description: Adds a smileybutton to the Inputbox
|
||||||
* Version: 0.2
|
* Version: 1.0
|
||||||
* Author: Johannes Schwab <https://friendica.jschwab.org/profile/ddorian>
|
* Author: Johannes Schwab <https://friendica.jschwab.org/profile/ddorian>
|
||||||
|
* Maintainer: Hypolite Petovan <https://friendica.mrpetovan.com/profile/hypolite>
|
||||||
*/
|
*/
|
||||||
|
|
||||||
use Friendica\Core\Hook;
|
use Friendica\Core\Hook;
|
||||||
use Friendica\Core\Logger;
|
|
||||||
use Friendica\DI;
|
use Friendica\DI;
|
||||||
|
|
||||||
function smileybutton_install() {
|
function smileybutton_install()
|
||||||
|
{
|
||||||
//Register hooks
|
//Register hooks
|
||||||
Hook::register('jot_tool', 'addon/smileybutton/smileybutton.php', 'show_button');
|
Hook::register('jot_tool', 'addon/smileybutton/smileybutton.php', 'smileybutton_jot_tool');
|
||||||
|
|
||||||
Logger::log("installed smileybutton");
|
|
||||||
}
|
}
|
||||||
|
|
||||||
function show_button(Friendica\App $a, &$b) {
|
function smileybutton_jot_tool(Friendica\App $a, &$b)
|
||||||
|
{
|
||||||
// Disable if theme is quattro
|
// Disable if theme is quattro
|
||||||
// TODO add style for quattro
|
// TODO add style for quattro
|
||||||
if ($a->getCurrentTheme() == 'quattro')
|
if ($a->getCurrentTheme() == 'quattro') {
|
||||||
return;
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
// Disable for mobile because most mobiles have a smiley key for ther own
|
// Disable for mobile because they have a smiley key of their own
|
||||||
if (DI::mode()->isMobile() || DI::mode()->isMobile())
|
if (DI::mode()->isMobile() || DI::mode()->isMobile()) {
|
||||||
return;
|
return;
|
||||||
|
}
|
||||||
/**
|
|
||||||
*
|
|
||||||
* I have copied this from /include/text.php, removed doubles
|
|
||||||
* and escaped them.
|
|
||||||
*
|
|
||||||
*/
|
|
||||||
|
|
||||||
$texts = [
|
$texts = [
|
||||||
'<3',
|
'<3',
|
||||||
|
@ -45,19 +41,18 @@ function show_button(Friendica\App $a, &$b) {
|
||||||
':-O',
|
':-O',
|
||||||
'\\\\o/',
|
'\\\\o/',
|
||||||
'O_o',
|
'O_o',
|
||||||
":\'(",
|
':\'(',
|
||||||
":-!",
|
':-!',
|
||||||
":-/",
|
':-/',
|
||||||
":-[",
|
':-[',
|
||||||
"8-)",
|
'8-)',
|
||||||
':beer',
|
':beer',
|
||||||
':coffee',
|
':coffee',
|
||||||
':facepalm',
|
':facepalm',
|
||||||
':like',
|
':like',
|
||||||
':dislike',
|
':dislike',
|
||||||
'~friendica',
|
'~friendica',
|
||||||
'red#'
|
'red#',
|
||||||
|
|
||||||
];
|
];
|
||||||
|
|
||||||
$icons = [
|
$icons = [
|
||||||
|
@ -87,42 +82,41 @@ function show_button(Friendica\App $a, &$b) {
|
||||||
];
|
];
|
||||||
|
|
||||||
// Call hooks to get aditional smileies from other addons
|
// Call hooks to get aditional smileies from other addons
|
||||||
$params = ['texts' => $texts, 'icons' => $icons, 'string' => ""]; //changed
|
$params = ['texts' => $texts, 'icons' => $icons, 'string' => '']; //changed
|
||||||
Hook::callAll('smilie', $params);
|
Hook::callAll('smilie', $params);
|
||||||
|
|
||||||
//Generate html for smiley list
|
//Generate html for smiley list
|
||||||
$s = "<table class=\"smiley-preview\"><tr>\n\t";
|
$s = '<table class="smiley-preview"><tr>';
|
||||||
for($x = 0; $x < count($params['texts']); $x ++) {
|
for ($x = 0; $x < count($params['texts']); $x++) {
|
||||||
$icon = $params['icons'][$x];
|
$icon = $params['icons'][$x];
|
||||||
$icon = str_replace('/>', 'onclick="smileybutton_addsmiley(\'' . $params['texts'][$x] . '\')"/>', $icon);
|
$s .= '<td onclick="smileybutton_addsmiley(\'' . $params['texts'][$x] . '\')">' . $icon . '</td>';
|
||||||
$icon = str_replace('class="smiley"', 'class="smiley_preview"', $icon);
|
if (($x + 1) % (sqrt(count($params['texts'])) + 1) == 0) {
|
||||||
$s .= "<td>" . $icon . "</td>";
|
$s .= '</tr><tr>';
|
||||||
if (($x+1) % (sqrt(count($params['texts']))+1) == 0) {
|
|
||||||
$s .= "</tr>\n\t<tr>";
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
$s .= "\t</tr></table>";
|
$s .= '</tr></table>';
|
||||||
|
|
||||||
//Add css to header
|
//Add css to header
|
||||||
$css_file = 'addon/smileybutton/view/' . $a->getCurrentTheme() . '.css';
|
$css_file = 'addon/smileybutton/view/' . $a->getCurrentTheme() . '.css';
|
||||||
if (! file_exists($css_file))
|
if (!file_exists($css_file)) {
|
||||||
$css_file = 'addon/smileybutton/view/default.css';
|
$css_file = 'addon/smileybutton/view/default.css';
|
||||||
$css_url = DI::baseUrl()->get().'/'.$css_file;
|
}
|
||||||
|
|
||||||
DI::page()['htmlhead'] .= '<link rel="stylesheet" type="text/css" href="'.$css_url.'" media="all" />'."\r\n";
|
|
||||||
|
|
||||||
|
DI::page()->registerStylesheet($css_file);
|
||||||
|
|
||||||
//Get the correct image for the theme
|
//Get the correct image for the theme
|
||||||
$image = 'addon/smileybutton/view/' . $a->getCurrentTheme() . '.png';
|
$image = 'addon/smileybutton/view/' . $a->getCurrentTheme() . '.png';
|
||||||
if (! file_exists($image))
|
if (!file_exists($image)) {
|
||||||
$image = 'addon/smileybutton/view/default.png';
|
$image = 'addon/smileybutton/view/default.png';
|
||||||
$image_url = DI::baseUrl()->get().'/'.$image;
|
}
|
||||||
|
|
||||||
|
$image_url = DI::baseUrl()->get() . '/' . $image;
|
||||||
|
|
||||||
//Add the hmtl and script to the page
|
//Add the hmtl and script to the page
|
||||||
$b = <<< EOT
|
$b = <<< EOT
|
||||||
<div id="profile-smiley-wrapper" style="display: block;" >
|
<div id="profile-smiley-wrapper">
|
||||||
<img src="$image_url" class="smiley_button" onclick="toggle_smileybutton()" alt="smiley">
|
<button type="button" class="btn btn-link smiley_button" onclick="toggle_smileybutton()"><img src="$image_url" alt="smiley"></button>
|
||||||
<div id="smileybutton" style="display:none;">
|
<div id="smileybutton">
|
||||||
$s
|
$s
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -140,18 +134,11 @@ function show_button(Friendica\App $a, &$b) {
|
||||||
}
|
}
|
||||||
|
|
||||||
function smileybutton_addsmiley(text) {
|
function smileybutton_addsmiley(text) {
|
||||||
if(plaintext == "none") {
|
|
||||||
var v = $("#profile-jot-text").val();
|
var v = $("#profile-jot-text").val();
|
||||||
v = v + text;
|
v = v + text;
|
||||||
$("#profile-jot-text").val(v);
|
$("#profile-jot-text").val(v).focus();
|
||||||
$("#profile-jot-text").focus();
|
|
||||||
} else {
|
|
||||||
var v = tinymce.activeEditor.getContent();
|
|
||||||
v = v + text;
|
|
||||||
tinymce.activeEditor.setContent(v);
|
|
||||||
tinymce.activeEditor.focus();
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
EOT;
|
EOT;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -1,9 +1,17 @@
|
||||||
img.smiley_button {
|
#profile-smiley-wrapper {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
|
#smileybutton {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.smiley_button > img {
|
||||||
height: 18px;
|
height: 18px;
|
||||||
width: 18px;
|
width: 18px;
|
||||||
}
|
}
|
||||||
|
|
||||||
img.smiley_preview {
|
table.smiley-preview img.smiley {
|
||||||
max-height: 25px;
|
max-height: 25px;
|
||||||
max-width: 25px;
|
max-width: 25px;
|
||||||
}
|
}
|
||||||
|
@ -11,3 +19,7 @@ img.smiley_preview {
|
||||||
table.smiley-preview {
|
table.smiley-preview {
|
||||||
border: 1px solid #AAAAAA;
|
border: 1px solid #AAAAAA;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
table.smiley-preview td {
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
|
@ -1,14 +1,26 @@
|
||||||
img.smiley_button {
|
#profile-smiley-wrapper {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
|
#smileybutton {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.smiley_button {
|
||||||
height: 18px;
|
height: 18px;
|
||||||
width: 18px;
|
width: 18px;
|
||||||
position: relative;
|
position: relative;
|
||||||
left: 285px;
|
left: 285px;
|
||||||
top: -45px;
|
top: -45px;
|
||||||
|
padding: 0;
|
||||||
|
border: 0;
|
||||||
|
background: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
img.smiley_preview {
|
table.smiley-preview img.smiley {
|
||||||
max-height: 25px;
|
max-height: 25px;
|
||||||
max-width: 25px;
|
max-width: 25px;
|
||||||
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
|
|
||||||
table.smiley-preview {
|
table.smiley-preview {
|
||||||
|
@ -19,3 +31,7 @@ table.smiley-preview {
|
||||||
left: 285px;
|
left: 285px;
|
||||||
top: -36px;
|
top: -36px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
table.smiley-preview td {
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
31
smileybutton/view/frio.css
Normal file
31
smileybutton/view/frio.css
Normal file
|
@ -0,0 +1,31 @@
|
||||||
|
#profile-smiley-wrapper {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
|
#smileybutton {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.smiley_button > img {
|
||||||
|
height: 14px;
|
||||||
|
width: 14px;
|
||||||
|
}
|
||||||
|
|
||||||
|
table.smiley-preview img.smiley {
|
||||||
|
max-height: 25px;
|
||||||
|
max-width: 25px;
|
||||||
|
}
|
||||||
|
|
||||||
|
table.smiley-preview {
|
||||||
|
border: 1px solid #AAAAAA;
|
||||||
|
}
|
||||||
|
|
||||||
|
table.smiley-preview td {
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
#profile-smiley-wrapper > .btn-link {
|
||||||
|
position: relative;
|
||||||
|
display: block;
|
||||||
|
padding: 10px 15px;
|
||||||
|
}
|
|
@ -1,21 +0,0 @@
|
||||||
img.smiley_button {
|
|
||||||
height: 25;
|
|
||||||
width: 25px;
|
|
||||||
position: relative;
|
|
||||||
left: 335px;
|
|
||||||
top: -45px;
|
|
||||||
}
|
|
||||||
|
|
||||||
img.smiley_preview {
|
|
||||||
max-height: 25px;
|
|
||||||
max-width: 25px;
|
|
||||||
}
|
|
||||||
|
|
||||||
table.smiley-preview {
|
|
||||||
border: 1px solid #AAAAAA;
|
|
||||||
-moz-border-radius: 3px;
|
|
||||||
border-radius: 3px;
|
|
||||||
position: relative;
|
|
||||||
left: 285px;
|
|
||||||
top: -36px;
|
|
||||||
}
|
|
Binary file not shown.
Before Width: | Height: | Size: 865 B |
|
@ -1,4 +1,12 @@
|
||||||
img.smiley_button {
|
#profile-smiley-wrapper {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
|
#smileybutton {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.smiley_button > img {
|
||||||
height: 22px;
|
height: 22px;
|
||||||
width: 22px;
|
width: 22px;
|
||||||
position: relative;
|
position: relative;
|
||||||
|
@ -8,9 +16,10 @@ img.smiley_button {
|
||||||
border-radius: 0px;
|
border-radius: 0px;
|
||||||
}
|
}
|
||||||
|
|
||||||
img.smiley_preview {
|
table.smiley-preview img.smiley {
|
||||||
max-height: 25px;
|
max-height: 25px;
|
||||||
max-width: 25px;
|
max-width: 25px;
|
||||||
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
|
|
||||||
table.smiley-preview {
|
table.smiley-preview {
|
||||||
|
@ -19,3 +28,7 @@ table.smiley-preview {
|
||||||
border-radius: 5px;
|
border-radius: 5px;
|
||||||
margin: 5px;
|
margin: 5px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
table.smiley-preview td {
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
|
@ -1,15 +1,49 @@
|
||||||
img.smiley_button {
|
#profile-smiley-wrapper {
|
||||||
|
float: left;
|
||||||
|
margin-left: 15px;
|
||||||
|
cursor: pointer;
|
||||||
|
height: 10px;
|
||||||
|
display: inline-block;
|
||||||
|
}
|
||||||
|
|
||||||
|
#profile-smiley-wrapper .btn {
|
||||||
|
padding: 0;
|
||||||
|
margin: 0;
|
||||||
|
border: 0;
|
||||||
|
background: none;
|
||||||
|
width: 20px;
|
||||||
|
height: 20px;
|
||||||
|
line-height: inherit;
|
||||||
|
display: inline-block;
|
||||||
|
overflow: hidden;
|
||||||
|
padding: 1px;
|
||||||
|
color: #999;
|
||||||
|
vertical-align: text-top;
|
||||||
|
}
|
||||||
|
|
||||||
|
#smileybutton {
|
||||||
|
position: absolute;
|
||||||
|
z-index: 99;
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.smiley_button > img {
|
||||||
height: 18px;
|
height: 18px;
|
||||||
width: 18px;
|
width: 18px;
|
||||||
margin-right: 18px;
|
margin-right: 18px;
|
||||||
}
|
}
|
||||||
|
|
||||||
img.smiley_preview {
|
table.smiley-preview {
|
||||||
max-height: 25px;
|
background-color: #FFF;
|
||||||
max-width: 25px;
|
box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.7);
|
||||||
}
|
}
|
||||||
|
|
||||||
table.smiley-preview {
|
table.smiley-preview img.smiley {
|
||||||
border: 1px solid #999999;
|
max-height: 25px;
|
||||||
margin-left: 10px;
|
max-width: 25px;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
table.smiley-preview td {
|
||||||
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in a new issue