mirror of
https://github.com/UiO-Gaming/infoscreen3.git
synced 2026-11-05 13:56:52 +01:00
ui changes
This commit is contained in:
1 parent
5e3fc0f2de
commit
7b5c6e1c89
3 files changed
+87
-72
No files matched your search
@@ -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
@@ -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
@@ -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>
|
||||
|
||||
Reference in new issue
Block a user