0
Fork 0
mirror of https://github.com/fastmail/Squire.git synced 2024-12-22 07:13:08 -05:00

Functional stuff working a little better

This commit is contained in:
Matthew Borden 2014-07-09 15:15:32 +10:00
parent 3f0bf902fd
commit cac68fb551
2 changed files with 34 additions and 5 deletions

View file

@ -3,14 +3,14 @@
<div data-action="bold" data-value="" class="item"><i class="fa fa-bold"></i></div>
<div data-action="italic" data-value="" class="item"><i class="fa fa-italic"></i></div>
<div data-action="underline" data-value="" class="item"><i class="fa fa-underline"></i></div>
<div data-action="" data-value="" id="font" class="item">
<div id="selectFont" data-action="selectFont" data-value="" class="item">
<i class="fa fa-font"></i>
</div>
</div>
<div class="group">
<div data-action="makeLink" data-value=""class="item"><i class="fa fa-link"></i></div>
<div id="makeLink"data-action="makeLink" data-value=""class="item"><i class="fa fa-link"></i></div>
<div data-action="makeOrderedList" data-value="" class="item"><i class="fa fa-list"></i></div>
<div data-action="image" data-value="" class="item">
<div id="insertImage" data-action="insertImage" data-value="" class="item">
<i class="fa fa-picture-o"></i>
</div>
<div data-action="increaseQuoteLevel" data-value="" class="item"><i class="fa fa-quote-right"></i></div>
@ -22,7 +22,7 @@
</div>
</div>
<div class="templates hidden">
<div class="drop-font">
<div id="drop-font">
<i class="fa fa-chevron-up quit"></i>
Text Size: <input type="number" min="12" max="72" step="6" value="12" name="font-size">
<br>

View file

@ -32,12 +32,36 @@ $(document).ready(function() {
var div = document.createElement('div');
div.className = 'Squire-UI';
$(div).load(buildPath + 'Squire-UI.html', function() {
function createDrop(element, content) {
element.drop = new Drop({
target: element,
content: content,
position: 'bottom left',
openOn: 'click'
});
element.drop.on('open', function () {
$('.quit').click(function () {
$(this).parent().parent().removeClass('drop-open');
});
});
}
createDrop($('#makeLink').first()[0], "Hello World");
createDrop($('#insertImage').first()[0], "Hello World");
createDrop($('#selectFont').first()[0], $('#drop-font').first().html());
$('.item').click(function() {
var iframe = $(this).parents('.Squire-UI').next('iframe').first()[0];
var editor = iframe.contentWindow.editor;
var action = $(this).data('action');
if (editor.getSelectedText() === '' && action != 'insertImage') return 0;
test = {
value: $(this).data('action'),
testBold: editor.testPresenceinSelection('bold',
action, 'B', (/>B\b/)),
testItalic: editor.testPresenceinSelection('italic',
@ -50,8 +74,11 @@ $(document).ready(function() {
action, 'A', (/>A\b/)),
testQuote: editor.testPresenceinSelection(
'increaseQuoteLevel', action, 'blockquote', (
/>blockquote\b/))
/>blockquote\b/)),
isNotValue: function (a) {return (a == action && this.value !== ''); }
};
if (test.testBold | test.testItalic | test.testUnderline | test.testOrderedList | test.testLink | test.testQuote) {
if (test.testBold) editor.removeBold();
@ -60,6 +87,8 @@ $(document).ready(function() {
if (test.testLink) editor.removeLink();
if (test.testOrderedList) editor.removeList();
if (test.testQuote) editor.decreaseQuoteLevel();
} else if (test.isNotValue('makeLink') | test.isNotValue('insertImage') | test.isNotValue('selectFont')) {
// do nothing
} else {
editor[$(this).data('action')]();
}