Skip to content
Projects
Groups
Snippets
Help
Loading...
Help
Support
Keyboard shortcuts
?
Submit feedback
Contribute to GitLab
Sign in / Register
Toggle navigation
G
gitlab-ce
Project overview
Project overview
Details
Activity
Releases
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Issues
0
Issues
0
List
Boards
Labels
Milestones
Merge Requests
1
Merge Requests
1
Analytics
Analytics
Repository
Value Stream
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Create a new issue
Commits
Issue Boards
Open sidebar
nexedi
gitlab-ce
Commits
3f5919e2
Commit
3f5919e2
authored
7 years ago
by
Eric Eastwood
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
Add frequently used emojis back to awards menu
Thanks @filipa for the shout`
parent
130fd255
Changes
3
Hide whitespace changes
Inline
Side-by-side
Showing
3 changed files
with
61 additions
and
23 deletions
+61
-23
app/assets/javascripts/awards_handler.js
app/assets/javascripts/awards_handler.js
+12
-18
changelogs/unreleased/add-frequently-used-emojis-back-to-menu.yml
...gs/unreleased/add-frequently-used-emojis-back-to-menu.yml
+4
-0
spec/javascripts/awards_handler_spec.js
spec/javascripts/awards_handler_spec.js
+45
-5
No files found.
app/assets/javascripts/awards_handler.js
View file @
3f5919e2
...
@@ -45,12 +45,12 @@ function buildCategoryMap() {
...
@@ -45,12 +45,12 @@ function buildCategoryMap() {
});
});
}
}
function
renderCategory
(
name
,
emojiList
)
{
function
renderCategory
(
name
,
emojiList
,
opts
=
{}
)
{
return
`
return
`
<h5 class="emoji-menu-title">
<h5 class="emoji-menu-title">
${
name
}
${
name
}
</h5>
</h5>
<ul class="clearfix emoji-menu-list">
<ul class="clearfix emoji-menu-list
${
opts
.
menuListClass
}
">
${
emojiList
.
map
(
emojiName
=>
`
${
emojiList
.
map
(
emojiName
=>
`
<li class="emoji-menu-list-item">
<li class="emoji-menu-list-item">
<button class="emoji-menu-btn text-center js-emoji-btn" type="button">
<button class="emoji-menu-btn text-center js-emoji-btn" type="button">
...
@@ -140,9 +140,6 @@ AwardsHandler.prototype.showEmojiMenu = function showEmojiMenu($addBtn) {
...
@@ -140,9 +140,6 @@ AwardsHandler.prototype.showEmojiMenu = function showEmojiMenu($addBtn) {
const
$createdMenu
=
$
(
'
.emoji-menu
'
);
const
$createdMenu
=
$
(
'
.emoji-menu
'
);
$addBtn
.
removeClass
(
'
is-loading
'
);
$addBtn
.
removeClass
(
'
is-loading
'
);
this
.
positionMenu
(
$createdMenu
,
$addBtn
);
this
.
positionMenu
(
$createdMenu
,
$addBtn
);
if
(
!
this
.
frequentEmojiBlockRendered
)
{
this
.
renderFrequentlyUsedBlock
();
}
return
setTimeout
(()
=>
{
return
setTimeout
(()
=>
{
$createdMenu
.
addClass
(
'
is-visible
'
);
$createdMenu
.
addClass
(
'
is-visible
'
);
$
(
'
#emoji_search
'
).
focus
();
$
(
'
#emoji_search
'
).
focus
();
...
@@ -165,11 +162,21 @@ AwardsHandler.prototype.createEmojiMenu = function createEmojiMenu(callback) {
...
@@ -165,11 +162,21 @@ AwardsHandler.prototype.createEmojiMenu = function createEmojiMenu(callback) {
const
emojisInCategory
=
categoryMap
[
categoryNameKey
];
const
emojisInCategory
=
categoryMap
[
categoryNameKey
];
const
firstCategory
=
renderCategory
(
categoryLabelMap
[
categoryNameKey
],
emojisInCategory
);
const
firstCategory
=
renderCategory
(
categoryLabelMap
[
categoryNameKey
],
emojisInCategory
);
// Render the frequently used
const
frequentlyUsedEmojis
=
this
.
getFrequentlyUsedEmojis
();
let
frequentlyUsedCatgegory
=
''
;
if
(
frequentlyUsedEmojis
.
length
>
0
)
{
frequentlyUsedCatgegory
=
renderCategory
(
'
Frequently used
'
,
frequentlyUsedEmojis
,
{
menuListClass
:
'
frequent-emojis
'
,
});
}
const
emojiMenuMarkup
=
`
const
emojiMenuMarkup
=
`
<div class="emoji-menu">
<div class="emoji-menu">
<input type="text" name="emoji_search" id="emoji_search" value="" class="emoji-search search-input form-control" placeholder="Search emoji" />
<input type="text" name="emoji_search" id="emoji_search" value="" class="emoji-search search-input form-control" placeholder="Search emoji" />
<div class="emoji-menu-content">
<div class="emoji-menu-content">
${
frequentlyUsedCatgegory
}
${
firstCategory
}
${
firstCategory
}
</div>
</div>
</div>
</div>
...
@@ -457,19 +464,6 @@ AwardsHandler.prototype.getFrequentlyUsedEmojis = function getFrequentlyUsedEmoj
...
@@ -457,19 +464,6 @@ AwardsHandler.prototype.getFrequentlyUsedEmojis = function getFrequentlyUsedEmoj
return
_
.
compact
(
_
.
uniq
(
frequentlyUsedEmojis
));
return
_
.
compact
(
_
.
uniq
(
frequentlyUsedEmojis
));
};
};
AwardsHandler
.
prototype
.
renderFrequentlyUsedBlock
=
function
renderFrequentlyUsedBlock
()
{
if
(
Cookies
.
get
(
'
frequently_used_emojis
'
))
{
const
frequentlyUsedEmojis
=
this
.
getFrequentlyUsedEmojis
();
const
ul
=
$
(
'
<ul class="clearfix emoji-menu-list frequent-emojis">
'
);
for
(
let
i
=
0
,
len
=
frequentlyUsedEmojis
.
length
;
i
<
len
;
i
+=
1
)
{
const
emoji
=
frequentlyUsedEmojis
[
i
];
$
(
`.emoji-menu-content [data-name="
${
emoji
}
"]`
).
closest
(
'
li
'
).
clone
().
appendTo
(
ul
);
}
$
(
'
.emoji-menu-content
'
).
prepend
(
ul
).
prepend
(
$
(
'
<h5>
'
).
text
(
'
Frequently used
'
));
}
this
.
frequentEmojiBlockRendered
=
true
;
};
AwardsHandler
.
prototype
.
setupSearch
=
function
setupSearch
()
{
AwardsHandler
.
prototype
.
setupSearch
=
function
setupSearch
()
{
this
.
registerEventListener
(
'
on
'
,
$
(
'
input.emoji-search
'
),
'
input
'
,
(
e
)
=>
{
this
.
registerEventListener
(
'
on
'
,
$
(
'
input.emoji-search
'
),
'
input
'
,
(
e
)
=>
{
const
term
=
$
(
e
.
target
).
val
().
trim
();
const
term
=
$
(
e
.
target
).
val
().
trim
();
...
...
This diff is collapsed.
Click to expand it.
changelogs/unreleased/add-frequently-used-emojis-back-to-menu.yml
0 → 100644
View file @
3f5919e2
---
title
:
Add frequently used emojis back to awards menu
merge_request
:
author
:
This diff is collapsed.
Click to expand it.
spec/javascripts/awards_handler_spec.js
View file @
3f5919e2
/* eslint-disable space-before-function-paren, no-var, one-var, one-var-declaration-per-line, no-unused-expressions, comma-dangle, new-parens, no-unused-vars, quotes, jasmine/no-spec-dupes, prefer-template, max-len */
/* eslint-disable space-before-function-paren, no-var, one-var, one-var-declaration-per-line, no-unused-expressions, comma-dangle, new-parens, no-unused-vars, quotes, jasmine/no-spec-dupes, prefer-template, max-len */
import
promisePolyfill
from
'
es6-promise
'
;
import
promisePolyfill
from
'
es6-promise
'
;
import
Cookies
from
'
js-cookie
'
;
import
AwardsHandler
from
'
~/awards_handler
'
;
import
AwardsHandler
from
'
~/awards_handler
'
;
promisePolyfill
.
polyfill
();
promisePolyfill
.
polyfill
();
...
@@ -208,8 +209,8 @@ promisePolyfill.polyfill();
...
@@ -208,8 +209,8 @@ promisePolyfill.polyfill();
expect
(
$
(
'
[data-name=alien]
'
).
is
(
'
:visible
'
)).
toBe
(
true
);
expect
(
$
(
'
[data-name=alien]
'
).
is
(
'
:visible
'
)).
toBe
(
true
);
})
})
.
then
(
done
)
.
then
(
done
)
.
catch
(()
=>
{
.
catch
((
err
)
=>
{
done
.
fail
(
'
Failed to open and build emoji menu
'
);
done
.
fail
(
`Failed to open and build emoji menu:
${
err
.
message
}
`
);
});
});
});
});
});
});
...
@@ -232,8 +233,8 @@ promisePolyfill.polyfill();
...
@@ -232,8 +233,8 @@ promisePolyfill.polyfill();
it
(
'
should add selected emoji to awards block
'
,
function
(
done
)
{
it
(
'
should add selected emoji to awards block
'
,
function
(
done
)
{
return
openEmojiMenuAndAddEmoji
()
return
openEmojiMenuAndAddEmoji
()
.
then
(
done
)
.
then
(
done
)
.
catch
(()
=>
{
.
catch
((
err
)
=>
{
done
.
fail
(
'
Failed to open and build emoji menu
'
);
done
.
fail
(
`Failed to open and build emoji menu:
${
err
.
message
}
`
);
});
});
});
});
it
(
'
should remove already selected emoji
'
,
function
(
done
)
{
it
(
'
should remove already selected emoji
'
,
function
(
done
)
{
...
@@ -247,7 +248,46 @@ promisePolyfill.polyfill();
...
@@ -247,7 +248,46 @@ promisePolyfill.polyfill();
})
})
.
then
(
done
)
.
then
(
done
)
.
catch
((
err
)
=>
{
.
catch
((
err
)
=>
{
done
.
fail
(
'
Failed to open and build emoji menu
'
);
done
.
fail
(
`Failed to open and build emoji menu:
${
err
.
message
}
`
);
});
});
});
describe
(
'
frequently used emojis
'
,
function
()
{
beforeEach
(()
=>
{
// Clear it out
Cookies
.
set
(
'
frequently_used_emojis
'
,
''
);
});
it
(
'
shouldn
\'
t have any "Frequently used" heading if no frequently used emojis
'
,
function
(
done
)
{
return
openAndWaitForEmojiMenu
()
.
then
(()
=>
{
const
emojiMenu
=
document
.
querySelector
(
'
.emoji-menu
'
);
Array
.
prototype
.
forEach
.
call
(
emojiMenu
.
querySelectorAll
(
'
.emoji-menu-title
'
),
(
title
)
=>
{
expect
(
title
.
textContent
.
trim
().
toLowerCase
()).
not
.
toBe
(
'
frequently used
'
);
});
})
.
then
(
done
)
.
catch
((
err
)
=>
{
done
.
fail
(
`Failed to open and build emoji menu:
${
err
.
message
}
`
);
});
});
it
(
'
should have any frequently used section when there are frequently used emojis
'
,
function
(
done
)
{
awardsHandler
.
addEmojiToFrequentlyUsedList
(
'
8ball
'
);
return
openAndWaitForEmojiMenu
()
.
then
(()
=>
{
const
emojiMenu
=
document
.
querySelector
(
'
.emoji-menu
'
);
const
hasFrequentlyUsedHeading
=
Array
.
prototype
.
some
.
call
(
emojiMenu
.
querySelectorAll
(
'
.emoji-menu-title
'
),
title
=>
title
.
textContent
.
trim
().
toLowerCase
()
===
'
frequently used
'
);
expect
(
hasFrequentlyUsedHeading
).
toBe
(
true
);
})
.
then
(
done
)
.
catch
((
err
)
=>
{
done
.
fail
(
`Failed to open and build emoji menu:
${
err
.
message
}
`
);
});
});
});
});
});
});
...
...
This diff is collapsed.
Click to expand it.
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment