ui changes

This commit is contained in:
Reaby committed 2019-03-16 22:14:44 +02:00
1 parent 5e3fc0f2de
commit 7b5c6e1c89
3 files changed
+87 -72

No files matched your search

+2 -2
View File
@@ -10,14 +10,14 @@
"fill": "#f90",
"fontSize": 56,
"fontWeight": 900,
"fontFamily": "Arial Black"
"fontFamily": "Arial"
},
"styleText": {
"stroke": "",
"fill": "#fff",
"fontSize": 32,
"fontWeight": 900,
"fontFamily": "Arial Black"
"fontFamily": "Arial"
},
"bundleName": "default"
}
+6 -7
View File
@@ -1,7 +1,7 @@
let canvas;
let bundleData;
var grid = 1280/32;
var grid = 1280 / 32;
let _clipboard = null;
let slideName = "untitled";
@@ -42,12 +42,11 @@ $(function () {
$('#order')
.dropdown({
action: 'hide',
onChange: function (value, text, $selectedItem) {
onChange: function (value, text, selectedItem) {
setZindex(value);
}
});
$('#contextmenu .dropdown').dropdown({
on: 'hover',
});
@@ -305,19 +304,20 @@ function parseUrl(url) {
function nextSlide(data) {
canvas.loadFromJSON(data.json, function () {
var w = 1280 / 32 / 8;
// Grid display part
for (var i = 1; i <= (1280 / grid); i++) {
canvas.add(new fabric.Line([i * grid, 0, i * grid, 1280], {
stroke: '#ccc',
strokeDashArray: [5, 5],
strokeDashArray: [w, w],
opacity: 0.5,
selectable: false,
zIndex: 0
}));
canvas.add(new fabric.Line([0, i * grid, 1280, i * grid], {
stroke: '#ccc',
strokeDashArray: [5, 5],
strokeDashArray: [w, w],
opacity: 0.5,
selectable: false,
zIndex: 0
@@ -647,5 +647,4 @@ function uuidv4() {
let r = Math.random() * 16 | 0, v = c === 'x' ? r : (r & 0x3 | 0x8);
return v.toString(16);
});
}
}
+79 -63
View File
@@ -16,77 +16,20 @@
label {
color: white;
}
canvas {
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
-moz-font-smoothing:antialiased;
font-smoothing:antialiased;
text-rendering:geometricPrecision;
font-smooth:always;
-moz-font-smoothing: antialiased;
font-smoothing: antialiased;
text-rendering: geometricPrecision;
font-smooth: always;
}
</style>
{% endblock %}
{% block body %}
<div id="imageLayer" class="ui modal">
<div class="header">{{ t("admin.editSlide.insertImage") }}</div>
<div id="dropzone" class="scrolling content">
<div class="ui info message">{{ t("admin.editSlide.dropToUpload") }}</div>
<div id="imageList" class="ui three stackable cards">
</div>
</div>
<div class="actions">
<div class="ui cancel button">{{ t("actions.cancel") }}</div>
</div>
</div>
<div class="ui menu">
<div class="item">
<div class="ui inverted buttons">
<a href="#" onclick="addHeader('header')" class="ui basic icon button"><i
class="ui heading icon"></i></a>
<a href="#" onclick="addText('paragraph text')" class="ui basic icon button"><i
class="ui paragraph icon"></i></a>
<a href="#" onclick="openImageBrowser()" class="ui basic icon button"><i
class="ui image icon"></i></a>
</div>
</div>
<div class="item">
<div class="ui inverted buttons">
<a href="#" onclick="copyObject()" class="ui basic icon button"><i
class="ui copy icon"></i></a>
<a href="#" onclick="pasteObject()" class="ui basic icon button"><i
class="ui paste icon"></i></a>
<a href="#" onclick="removeSelectedObjects()" class="ui basic icon button"><i
class="ui remove icon"></i></a>
</div>
</div>
<!-- <div class="item">
<div id="order" class="ui dropdown basic button">
<div class="default text">{{ t("admin.editSlide.order") }} <i class="dropdown icon"></i></div>
<div class="menu">
<div class="item" data-value="bringToFront">{{ t("admin.editSlide.sendToFront") }}</div>
<div class="item" data-value="bringForward">{{ t("admin.editSlide.moveForward") }}</div>
<div class="item" data-value="sendBackwards">{{ t("admin.editSlide.moveBackward") }}</div>
<div class="item" data-value="sendToBack">{{ t("admin.editSlide.sendToBack") }}</div>
</div>
</div>
</div> -->
<div class="item">
<div class="ui inverted buttons">
<a href="#" onclick="setAlign('left')" class="ui basic icon button"><i
class="ui align left icon"></i></a>
<a href="#" onclick="setAlign('center')" class="ui basic icon button"><i
class="ui align center icon"></i></a>
<a href="#" onclick="setAlign('right')" class="ui basic icon button"><i
class="ui align right icon"></i></a>
<a href="#" onclick="setAlign('justify')" class="ui basic icon button"><i
class="ui align justify icon"></i></a>
</div>
</div>
<div class="ui primary pointing menu" style="margin: 0;">
<div class="item">
<div class="ui input">
<input type="number" id="duration" placeholder="{{ t("navs.duration") }}" min="5"/>
@@ -123,6 +66,66 @@
</div>
</div>
</div>
<div class="ui primary pointing menu" style="margin: 0;">
<div class="item">
<div class="ui inverted buttons">
<a href="#" onclick="addHeader('header')" class="ui basic icon button"><i
class="ui heading icon"></i></a>
<a href="#" onclick="addText('paragraph text')" class="ui basic icon button"><i
class="ui paragraph icon"></i></a>
<a href="#" onclick="openImageBrowser()" class="ui basic icon button"><i
class="ui image icon"></i></a>
</div>
</div>
<div class="item">
<div class="ui inverted buttons">
<a class="ui basic icon button"
onclick="setZindex('bringToFront');">
<i class="ui level up icon"></i>
</a>
<a class="ui basic icon button"
onclick="setZindex('bringForward');">
<i class="ui arrow up icon"></i>
</a>
<a class="ui basic icon button"
onclick="setZindex('sendBackwards>');">
<i class="ui arrow down icon"></i>
</a>
<a class="ui basic icon button"
onclick="setZindex('sendToBack');">
<i class="ui level down icon"></i>
</a>
</div>
</div>
<div class="item">
<div class="ui inverted buttons">
<a href="#" onclick="setAlign('left')" class="ui basic icon button"><i
class="ui align left icon"></i></a>
<a href="#" onclick="setAlign('center')" class="ui basic icon button"><i
class="ui align center icon"></i></a>
<a href="#" onclick="setAlign('right')" class="ui basic icon button"><i
class="ui align right icon"></i></a>
<a href="#" onclick="setAlign('justify')" class="ui basic icon button"><i
class="ui align justify icon"></i></a>
</div>
</div>
<div class="right menu">
<div class="item">
<div class="ui inverted buttons">
<a href="#" onclick="copyObject()" class="ui basic icon button"><i
class="ui copy icon"></i></a>
<a href="#" onclick="pasteObject()" class="ui basic icon button"><i
class="ui paste icon"></i></a>
<a href="#" onclick="removeSelectedObjects()" class="ui basic icon button"><i
class="ui remove icon"></i></a>
</div>
</div>
</div>
</div>
<div class="ui basic segment">
<div id="matchsize">
@@ -157,6 +160,19 @@
{{ t("actions.delete") }}
</a>
</div>
<div id="imageLayer" class="ui modal">
<div class="header">{{ t("admin.editSlide.insertImage") }}</div>
<div id="dropzone" class="scrolling content">
<div class="ui info message">{{ t("admin.editSlide.dropToUpload") }}</div>
<div id="imageList" class="ui three stackable cards">
</div>
</div>
<div class="actions">
<div class="ui cancel button">{{ t("actions.cancel") }}</div>
</div>
</div>
<canvas id="tempCanvas" width="1280" height="720" style="display: none"></canvas>
<script>