Korbs/Squire
0
Fork 0
mirror of https://github.com/fastmail/Squire.git synced 2024-12-22 23:40:35 -05:00
Code Issues Activity

Update: Loading now works in Chrome

Browse source
This commit is contained in:
Matthew Borden 2014-07-08 11:21:18 +10:00
parent 99ae3eac96
commit c63ab9c74b
5 changed files with 23 additions and 16 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
Demo.html
View file

@ -10,7 +10,7 @@
<script src="build/Squire-UI.js" type="text/javascript"></script>
<script>
window.addEventListener('load', function () {
var editor = new SquireUI({div: '#editor'});
var editor = new SquireUI({replace: 'textarea#foo'});
});
</script>
</head>

4
build/Squire-UI.css
View file

@ -6,6 +6,9 @@ body {
font: 400 14px/1.24 helvetica, arial, sans-serif;
text-shadow: 0 1px 0 white;
}
iframe {
width:100%;
}
.menu .item {
color:#000;
@ -31,7 +34,6 @@ body {
}
.menu {
text-align:center;
-webkit-touch-callout:none;
-webkit-user-select:none;
-khtml-user-select:none;

5
ui/Squire-UI.css
View file

@ -7,6 +7,10 @@ body {
text-shadow: 0 1px 0 white;
}
iframe {
width:100%;
}
.menu .item {
color:#000;
float:left;
@ -31,7 +35,6 @@ body {
}
.menu {
text-align:center;
-webkit-touch-callout:none;
-webkit-user-select:none;
-khtml-user-select:none;

12
ui/Squire-UI.html
View file

@ -1,16 +1,16 @@
<div class="menu" contenteditable="false">
<div class="group">
<div class="item"><i class="fa fa-bold"></i></div>
<div class="item"><i class="fa fa-italic"></i></div>
<div class="item"><i class="fa fa-underline"></i></div>
<div class="item"><i data-action="bold" data-value="" class="fa fa-bold"></i></div>
<div class="item"><i data-action="italic" data-value="" class="fa fa-italic"></i></div>
<div class="item"><i data-action="underline" data-value="" class="fa fa-underline"></i></div>
<div id="font" class="item">
<i class="fa fa-font"></i>
<i data-action="bold" data-value="" class="fa fa-font"></i>
</div>
</div>
<div class="group">
<div class="item"><i class="fa fa-link"></i></div>
<div class="item"><i class="fa fa-quote-right"></i></div>
<div class="item"><i class="fa fa-list"></i></div>
<div data-action="quote" data-value="" class="item"><i class="fa fa-quote-right"></i></div>
<div data-action="list" data-value="" class="item"><i class="fa fa-list"></i></div>
<div class="item">
<i class="fa fa-picture-o"></i>
</div>

16
ui/Squire-UI.js
View file

@ -222,7 +222,7 @@ LazyLoad = (function (doc) {
SquireUI = function(options) {
// Create instance of iFrame
var container;
var container, editor;
if (options.replace) {
container = $(options.replace).parent();
@ -236,14 +236,16 @@ SquireUI = function(options) {
var iframe = document.createElement('iframe');
var div = document.createElement('div');
$(div).load(buildPath + 'Squire-UI.html').appendTo(element);
$(div).load(buildPath + 'Squire-UI.html');
var editorDocument = editorContainer[0].contentWindow.document;
var editor = new Squire(editorDocument);
$(container).append(div);
$(container).append(iframe);
$('.squire-ui-button').click(function () {
var instance = $(this).parent.child('iframe')[0];
eval('instance.contentWindow.document.' + $(this).data('action') + '(' + $(this).data('action') + ')')
editor = new Squire ($(container).children('iframe').first()[0].contentWindow.document);
$('i').click(function () {
var instance = $(this).parent().children('iframe').first();
console.log(instance);
});
return editor;