Commit 3e5b09f4 authored by bbaer's avatar bbaer
Browse files

Reworked Text Boxes

parent 936044d1
......@@ -132,6 +132,29 @@ $(function () {
canvas.renderAll();
}
function addText(displayText) {
var text = new fabric.Text(displayText, {
fontSize: textSize,
color: '#000',
left: 10,
top: 10
});
var rect = new fabric.Rect();
rect.set({
width: text.width + 20,
height: text.height + 20,
fill: bgColor,
opacity: bgOpacity
});
var group = new fabric.Group([rect, text], {
left: addPositionLeft,
top: addPositionTop
});
canvas.add(group);
canvas.setActiveGroup(group);
adjustDefaultPosition();
}
// Custom Mouse / Touch Events on Canvas
canvas.on('mouse:up', function (e) {
......@@ -185,27 +208,7 @@ $(function () {
$("#text-bg-submit").on("click", function() {
deactivateToggles();
var userText = $("#text-user-value").val();
console.log(userText);
var text = new fabric.Text(userText, {
fontSize: textSize,
color: '#000',
left: 10,
top: 10
});
var rect = new fabric.Rect();
rect.set({
width: text.width + 20,
height: text.height + 20,
fill: bgColor,
opacity: bgOpacity
});
var group = new fabric.Group([rect, text], {
left: addPositionLeft,
top: addPositionTop
});
canvas.add(group);
canvas.setActiveGroup(group);
adjustDefaultPosition();
addText(userText);
$("#text-user-value").val('');
});
......@@ -239,8 +242,7 @@ $(function () {
});
$("#add-text").on("click", function() {
var text = new fabric.IText('type your text here', { fontSize: 20, left: 100, top: 100, editable: true});
canvas.add(text);
$("#user-text-control").slideToggle();
deactivateDrawing();
});
......
......@@ -45,7 +45,7 @@
<button class="btn btn-default" id="add-rect"><span class="glyphicon glyphicon-stop"></span></button>
<button class="btn btn-default" id="move-mode"><span class="glyphicon glyphicon-move"></span></button>
</div>
<div class="text-insert">
<div class="text-insert" style="display:none;" id="user-text-control">
<textarea class="fabric-text" placeholder="Remember, be nice!" id="text-user-value"></textarea>
<div class="text-options">
<button type="button" class="text-bg-toggle" id="text-no-bg"></button>
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment