ziver/hal
1
1
Fork 0
Code Pull requests Releases Activity

Added background upload model to map page, only UI for now

Browse source
This commit is contained in:
Ziver Koc 2016-07-04 17:21:12 +02:00
parent 6b70f2f900
commit 1dfaf781d2
4 changed files with 1498 additions and 3 deletions
Download patch file Download diff file Expand all files Collapse all files

438
resource/web/css/jquery.filer.css Executable file
View file

@ -0,0 +1,438 @@
/*!
* CSS jQuery.filer
* Copyright (c) 2015 CreativeDream
* Version: 1.0.5 (19-Nov-2015)
*/
/*@import url('../assets/fonts/jquery.filer-icons/jquery-filer.css');*/
/*-------------------------
Basic configurations
-------------------------*/
.jFiler * {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.jFiler {
font-family: sans-serif;
font-size: 14px;
color: #494949;
}
/* Helpers */
.jFiler ul.list-inline li {
display: inline-block;
padding-right: 5px;
padding-left: 5px;
}
.jFiler .pull-left {
float: left;
}
.jFiler .pull-right {
float: right;
}
/* File Icons */
span.jFiler-icon-file {
position: relative;
width: 57px;
height: 70px;
display: inline-block;
line-height: 70px;
text-align: center;
border-radius: 3px;
color: #fff;
font-family: sans-serif;
font-size: 13px;
font-weight: bold;
overflow: hidden;
box-shadow: 42px -55px 0 0 #A4A7AC inset;
}
span.jFiler-icon-file:after {
position: absolute;
top: -1px;
right: -1px;
display: inline-block;
content: '';
border-style: solid;
border-width: 16px 0 0 16px;
border-color: transparent transparent transparent #DADDE1;
}
span.jFiler-icon-file i[class*="icon-jfi-"] {
font-size: 24px;
}
span.jFiler-icon-file.f-image {
box-shadow: 42px -55px 0 0 #e15955 inset;
}
span.jFiler-icon-file.f-image:after {
border-left-color: #c6393f;
}
span.jFiler-icon-file.f-video {
box-shadow: 42px -55px 0 0 #4183d7 inset;
}
span.jFiler-icon-file.f-video:after {
border-left-color: #446cb3;
}
span.jFiler-icon-file.f-audio {
box-shadow: 42px -55px 0 0 #5bab6e inset;
}
span.jFiler-icon-file.f-audio:after {
border-left-color: #448353;
}
/* Progress Bar */
.jFiler-jProgressBar {
height: 8px;
background: #f1f1f1;
margin-top: 3px;
margin-bottom: 0;
overflow: hidden;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
}
.jFiler-jProgressBar .bar {
float: left;
width: 0;
height: 100%;
font-size: 12px;
color: #ffffff;
text-align: center;
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
background-color: #50A1E9;
box-sizing: border-box;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
-webkit-transition: width 0.3s ease;
-moz-transition: width 0.3s ease;
-o-transition: width 0.3s ease;
transition: width 0.3s ease;
}
.jFiler-jProgressBar .bar.dark {
background-color: #555;
}
.jFiler-jProgressBar .bar.blue {
background-color: #428bca;
}
.jFiler-jProgressBar .bar.green {
background-color: #5cb85c;
}
.jFiler-jProgressBar .bar.orange {
background-color: #f7a923;
}
.jFiler-jProgressBar .bar.red {
background-color: #d9534f;
}
/* Thumbs */
.jFiler-row:after,
.jFiler-item:after {
display: table;
line-height: 0;
content: "";
clear: both;
}
.jFiler-items ul {
margin: 0;
padding: 0;
list-style: none;
}
/*-------------------------
Default Theme
-------------------------*/
.jFiler-theme-default .jFiler-input {
position: relative;
display: block;
width: 400px;
height: 35px;
margin: 0 0 15px 0;
background: #fefefe;
border: 1px solid #cecece;
font-size: 12px;
font-family: sans-serif;
color: #888;
border-radius: 4px;
cursor: pointer;
overflow: hidden;
-webkit-box-shadow: rgba(0,0,0,.25) 0 4px 5px -5px inset;
-moz-box-shadow: rgba(0,0,0,.25) 0 4px 5px -5px inset;
box-shadow: rgba(0,0,0,.25) 0 4px 5px -5px inset;
}
.jFiler-theme-default .jFiler-input.focused {
outline: none;
-webkit-box-shadow: 0 0 7px rgba(0,0,0,0.1);
-moz-box-shadow: 0 0 7px rgba(0,0,0,0.1);
box-shadow: 0 0 7px rgba(0,0,0,0.1);
}
.jFiler-theme-default .jFiler.dragged .jFiler-input {
border: 1px dashed #aaaaaa;
background: #f9f9f9;
}
.jFiler-theme-default .jFiler.dragged .jFiler-input:hover {
background: #FFF8D0;
}
.jFiler-theme-default .jFiler.dragged .jFiler-input * {
pointer-events: none;
}
.jFiler-theme-default .jFiler.dragged .jFiler-input .jFiler-input-caption {
width: 100%;
text-align: center;
}
.jFiler-theme-default .jFiler.dragged .jFiler-input .jFiler-input-button {
display: none;
}
.jFiler-theme-default .jFiler-input-caption {
display: block;
float: left;
height: 100%;
padding-top: 8px;
padding-left: 10px;
text-overflow: ellipsis;
overflow: hidden;
}
.jFiler-theme-default .jFiler-input-button {
display: block;
float: right;
height: 100%;
padding-top: 8px;
padding-left: 15px;
padding-right: 15px;
border-left: 1px solid #ccc;
color: #666666;
text-align: center;
background-color: #fefefe;
background-image: -webkit-gradient(linear,0 0,0 100%,from(#fefefe),to(#f1f1f1));
background-image: -webkit-linear-gradient(top,#fefefe,#f1f1f1);
background-image: -o-linear-gradient(top,#fefefe,#f1f1f1);
background-image: linear-gradient(to bottom,#fefefe,#f1f1f1);
background-image: -moz-linear-gradient(top,#fefefe,#f1f1f1);
-webkit-transition: all .1s ease-out;
-moz-transition: all .1s ease-out;
-o-transition: all .1s ease-out;
transition: all .1s ease-out;
}
.jFiler-theme-default .jFiler-input-button:hover {
-moz-box-shadow: inset 0 0 10px rgba(0,0,0,0.07);
-webkit-box-shadow: inset 0 0 10px rgba(0,0,0,0.07);
box-shadow: inset 0 0 10px rgba(0,0,0,0.07);
}
.jFiler-theme-default .jFiler-input-button:active {
background-image: -webkit-gradient(linear,0 0,0 100%,from(#f1f1f1),to(#fefefe));
background-image: -webkit-linear-gradient(top,#f1f1f1,#fefefe);
background-image: -o-linear-gradient(top,#f1f1f1,#fefefe);
background-image: linear-gradient(to bottom,#f1f1f1,#fefefe);
background-image: -moz-linear-gradient(top,#f1f1f1,#fefefe);
}
/*-------------------------
Thumbnails
-------------------------*/
.jFiler-items-default .jFiler-items {
}
.jFiler-items-default .jFiler-item {
position: relative;
padding: 16px;
margin-bottom: 16px;
background: #f7f7f7;
color: #4d4d4c;
}
.jFiler-items-default .jFiler-item .jFiler-item-icon {
font-size: 32px;
color: #f5871f;
margin-right: 15px;
margin-top: -3px;
}
.jFiler-items-default .jFiler-item .jFiler-item-title {
font-weight: bold;
}
.jFiler-items-default .jFiler-item .jFiler-item-others {
font-size: 12px;
color: #777;
margin-left: -5px;
margin-right: -5px;
}
.jFiler-items-default .jFiler-item .jFiler-item-others span {
padding-left: 5px;
padding-right: 5px;
}
.jFiler-items-default .jFiler-item-assets {
position: absolute;
display: block;
right: 16px;
top: 50%;
margin-top: -10px;
}
.jFiler-items-default .jFiler-item-assets a {
padding: 8px 9px 8px 12px;
cursor: pointer;
background: #fafafa;
color: #777;
border-radius: 4px;
border: 1px solid #e3e3e3
}
.jFiler-items-default .jFiler-item-assets .jFiler-item-trash-action:hover,
.jFiler-items-default .jFiler-item-assets .jFiler-item-trash-action:active {
color: #d9534f;
}
.jFiler-items-default .jFiler-item-assets .jFiler-item-trash-action:active {
background: transparent;
}
/* Thumbnails: Grid */
.jFiler-items-grid .jFiler-item {
float: left;
}
.jFiler-items-grid .jFiler-item .jFiler-item-container {
position: relative;
margin: 0 20px 30px 0;
padding: 10px;
border: 1px solid #e1e1e1;
border-radius: 3px;
background: #fff;
-webkit-box-shadow: 0px 0px 3px rgba(0,0,0,0.06);
-moz-box-shadow: 0px 0px 3px rgba(0,0,0,0.06);
box-shadow: 0px 0px 3px rgba(0,0,0,0.06);
}
.jFiler-items-grid .jFiler-item .jFiler-item-container .jFiler-item-thumb {
position: relative;
width: 160px;
height: 115px;
min-height: 115px;
border: 1px solid #e1e1e1;
overflow: hidden;
}
.jFiler-items-grid .jFiler-item .jFiler-item-container .jFiler-item-thumb .jFiler-item-thumb-image {
width: 100%;
height: 100%;
text-align: center;
}
.jFiler-item .jFiler-item-container .jFiler-item-thumb img {
max-width: none;
max-height: 100%;
}
.jFiler-items-grid .jFiler-item .jFiler-item-container .jFiler-item-thumb span.jFiler-icon-file {
margin-top: 20px;
}
.jFiler-items-grid .jFiler-item-thumb-image.fi-loading {
background: url('data:image/gif;base64,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') no-repeat center;
width: 100%;
height: 100%;
}
.jFiler-items-grid .jFiler-item .jFiler-item-container .jFiler-item-info {
position: absolute;
bottom: -10%;
left: 0;
width: 100%;
color: #fff;
padding: 6px 10px;
background: -moz-linear-gradient(bottom,rgba(0,0,0,1) 0,rgba(0,0,0,0) 100%);
background: -webkit-linear-gradient(bottom,rgba(0,0,0,1) 0,rgba(0,0,0,0) 100%);
background: -o-linear-gradient(bottom,rgba(0,0,0,1) 0,rgba(0,0,0,0) 100%);
background: -ms-linear-gradient(bottom,rgba(0,0,0,1) 0,rgba(0,0,0,0) 100%);
background: linear-gradient(to top,rgba(0,0,0,1) 0,rgba(0,0,0,0) 100%);
z-index: 9;
opacity: 0;
filter: alpha(opacity(0));
-webkit-transition: all 0.12s;
-moz-transition: all 0.12s;
transition: all 0.12s;
}
.jFiler-items-grid .jFiler-no-thumbnail.jFiler-item .jFiler-item-container .jFiler-item-info {
background: rgba(0,0,0,0.55);
}
.jFiler-items-grid .jFiler-item .jFiler-item-container .jFiler-item-thumb:hover .jFiler-item-info {
bottom: 0;
opacity: 1;
filter: aplpha(opacity(100));
}
.jFiler-items-grid .jFiler-item .jFiler-item-container .jFiler-item-info .jFiler-item-title {
display: block;
font-weight: bold;
word-break: break-all;
line-height: 1;
}
.jFiler-items-grid .jFiler-item .jFiler-item-container .jFiler-item-info .jFiler-item-others {
display: inline-block;
font-size: 10px;
}
.jFiler-items-grid .jFiler-item .jFiler-item-container .jFiler-item-assets {
margin-top: 10px;
color: #999;
}
.jFiler-items-grid .jFiler-item .jFiler-item-container .jFiler-item-assets .text-success {
color: #3C763D
}
.jFiler-items-grid .jFiler-items-grid .jFiler-item .jFiler-item-container .jFiler-item-assets .text-error {
color: #A94442
}
.jFiler-items-grid .jFiler-item .jFiler-item-container .jFiler-item-assets .jFiler-jProgressBar {
width: 120px;
margin-left: -5px;
}
.jFiler-items-grid .jFiler-item .jFiler-item-container .jFiler-item-assets .jFiler-item-others {
font-size: 12px;
}
.jFiler-items-grid .jFiler-item-trash-action:hover {
cursor: pointer;
color: #d9534f;
}

991
resource/web/js/jquery.filer.js Executable file
View file

@ -0,0 +1,991 @@
/*!
* jQuery.filer
* Copyright (c) 2015 CreativeDream
* Website: https://github.com/CreativeDream/jquery.filer
* Version: 1.0.5 (19-Nov-2015)
* Requires: jQuery v1.7.1 or later
*/
(function($) {
"use strict";
$.fn.filer = function(q) {
return this.each(function(t, r) {
var s = $(r),
b = '.jFiler',
p = $(),
o = $(),
l = $(),
sl = [],
n_f = $.isFunction(q) ? q(s, $.fn.filer.defaults) : q,
n = n_f && $.isPlainObject(n_f) ? $.extend(true, {}, $.fn.filer.defaults, n_f) : $.fn.filer.defaults,
f = {
init: function() {
s.wrap('<div class="jFiler"></div>');
f._set('props');
s.prop("jFiler").boxEl = p = s.closest(b);
f._changeInput();
},
_bindInput: function() {
if(n.changeInput && o.size() > 0) {
o.bind("click", f._clickHandler);
}
s.on({
"focus": function() {
o.addClass('focused');
},
"blur": function() {
o.removeClass('focused');
},
"change": function() {
f._onChange();
}
});
if(n.dragDrop) {
(o.length > 0 ? o : s)
.bind("drop", f._dragDrop.drop)
.bind("dragover", f._dragDrop.dragEnter)
.bind("dragleave", f._dragDrop.dragLeave);
}
if(n.uploadFile && n.clipBoardPaste) {
$(window)
.on("paste", f._clipboardPaste);
}
},
_unbindInput: function() {
if(n.changeInput && o.size() > 0) {
o.unbind("click", f._clickHandler);
}
},
_clickHandler: function() {
s.click()
},
_applyAttrSettings: function() {
var d = ["name", "limit", "maxSize", "extensions", "changeInput", "showThumbs", "appendTo", "theme", "addMore", "excludeName", "files", "uploadUrl", "uploadData", "options"];
for(var k in d) {
var j = "data-jfiler-" + d[k];
if(f._assets.hasAttr(j)) {
switch(d[k]) {
case "changeInput":
case "showThumbs":
case "addMore":
n[d[k]] = (["true", "false"].indexOf(s.attr(j)) > -1 ? s.attr(j) == "true" : s.attr(j));
break;
case "extensions":
n[d[k]] = s.attr(j)
.replace(/ /g, '')
.split(",");
break;
case "uploadUrl":
if(n.uploadFile) n.uploadFile.url = s.attr(j);
break;
case "uploadData":
if(n.uploadFile) n.uploadFile.data = JSON.parse(s.attr(j));
break;
case "files":
case "options":
n[d[k]] = JSON.parse(s.attr(j));
break;
default:
n[d[k]] = s.attr(j);
}
s.removeAttr(j);
}
}
},
_changeInput: function() {
f._applyAttrSettings();
n.beforeRender != null && typeof n.beforeRender == "function" ? n.beforeRender(p, s) : null;
if(n.theme) {
p.addClass('jFiler-theme-' + n.theme);
}
if(s.get(0)
.tagName.toLowerCase() != "input" && s.get(0)
.type != "file") {
o = s;
s = $("<input type=\"file\" name=\"" + n.name + "\" />");
s.css({
position: "absolute",
left: "-9999px",
top: "-9999px",
"z-index": "-9999"
});
p.prepend(s);
f._isGn = s;
} else {
if(n.changeInput) {
switch(typeof n.changeInput) {
case "boolean":
o = $('<div class="jFiler-input"><div class="jFiler-input-caption"><span>' + n.captions.feedback + '</span></div><div class="jFiler-input-button">' + n.captions.button + '</div></div>"');
break;
case "string":
case "object":
o = $(n.changeInput);
break;
case "function":
o = $(n.changeInput(p, s, n));
break;
}
s.after(o);
s.css({
position: "absolute",
left: "-9999px",
top: "-9999px",
"z-index": "-9999"
});
}
}
s.prop("jFiler").newInputEl = o;
if(!n.limit || (n.limit && n.limit >= 2)) {
s.attr("multiple", "multiple");
s.attr("name")
.slice(-2) != "[]" ? s.attr("name", s.attr("name") + "[]") : null;
}
f._bindInput();
if(n.files) {
f._append(false, {
files: n.files
});
}
n.afterRender != null && typeof n.afterRender == "function" ? n.afterRender(l, p, o, s) : null;
},
_clear: function() {
f.files = null;
s.prop("jFiler")
.files = null;
if(!n.uploadFile && !n.addMore) {
f._reset();
}
f._set('feedback', (f._itFl && f._itFl.length > 0 ? f._itFl.length + ' ' + n.captions.feedback2 : n.captions.feedback));
n.onEmpty != null && typeof n.onEmpty == "function" ? n.onEmpty(p, o, s) : null
},
_reset: function(a) {
if(!a) {
if(!n.uploadFile && n.addMore) {
for(var i = 0; i < sl.length; i++) {
sl[i].remove();
}
sl = [];
f._unbindInput();
if(f._isGn) {
s = f._isGn;
} else {
s = $(r);
}
f._bindInput();
}
f._set('input', '');
}
f._itFl = [];
f._itFc = null;
f._ajFc = 0;
f._set('props');
s.prop("jFiler")
.files_list = f._itFl;
s.prop("jFiler")
.current_file = f._itFc;
if(!f._prEr) {
f._itFr = [];
p.find("input[name^='jfiler-items-exclude-']:hidden")
.remove();
}
l.fadeOut("fast", function() {
$(this)
.remove();
});
s.prop("jFiler").listEl = l = $();
},
_set: function(element, value) {
switch(element) {
case 'input':
s.val("");
break;
case 'feedback':
if(o.length > 0) {
o.find('.jFiler-input-caption span')
.html(value);
}
break;
case 'props':
if(!s.prop("jFiler")){
s.prop("jFiler", {
options: n,
listEl: l,
boxEl: p,
newInputEl: o,
inputEl: s,
files: f.files,
files_list: f._itFl,
current_file: f._itFc,
append: function(data) {
return f._append(false, {
files: [data]
});
},
remove: function(id) {
f._remove(null, {
binded: true,
data: {
id: id
}
});
return true;
},
reset: function() {
f._reset();
f._clear();
return true;
},
retry: function(data) {
return f._retryUpload(data);
}
})
}
}
},
_filesCheck: function() {
var s = 0;
if(n.limit && f.files.length + f._itFl.length > n.limit) {
alert(f._assets.textParse(n.captions.errors.filesLimit));
return false
}
for(var t = 0; t < f.files.length; t++) {
var x = f.files[t].name.split(".")
.pop()
.toLowerCase(),
file = f.files[t],
m = {
name: file.name,
size: file.size,
size2: f._assets.bytesToSize(file.size),
type: file.type,
ext: x
};
if(n.extensions != null && $.inArray(x, n.extensions) == -1) {
alert(f._assets.textParse(n.captions.errors.filesType, m));
return false;
break
}
if(n.maxSize != null && f.files[t].size > n.maxSize * 1048576) {
alert(f._assets.textParse(n.captions.errors.filesSize, m));
return false;
break
}
if(file.size == 4096 && file.type.length == 0) {
return false;
break
}
s += f.files[t].size
}
if(n.maxSize != null && s >= Math.round(n.maxSize * 1048576)) {
alert(f._assets.textParse(n.captions.errors.filesSizeAll));
return false
}
if((n.addMore || n.uploadFile)) {
var m = f._itFl.filter(function(a, b) {
if(a.file.name == file.name && a.file.size == file.size && a.file.type == file.type && (file.lastModified ? a.file.lastModified == file.lastModified : true)) {
return true;
}
});
if(m.length > 0) {
return false
}
}
return true;
},
_thumbCreator: {
create: function(i) {
var file = f.files[i],
id = (f._itFc ? f._itFc.id : i),
name = file.name,
size = file.size,
type = file.type.split("/", 1)
.toString()
.toLowerCase(),
ext = name.indexOf(".") != -1 ? name.split(".")
.pop()
.toLowerCase() : "",
progressBar = n.uploadFile ? '<div class="jFiler-jProgressBar">' + n.templates.progressBar + '</div>' : '',
opts = {
id: id,
name: name,
size: size,
size2: f._assets.bytesToSize(size),
type: type,
extension: ext,
icon: f._assets.getIcon(ext, type),
icon2: f._thumbCreator.generateIcon({
type: type,
extension: ext
}),
image: '<div class="jFiler-item-thumb-image fi-loading"></div>',
progressBar: progressBar,
_appended: file._appended
},
html = "";
if(file.opts) {
opts = $.extend({}, file.opts, opts);
}
html = $(f._thumbCreator.renderContent(opts))
.attr("data-jfiler-index", id);
html.get(0)
.jfiler_id = id;
f._thumbCreator.renderFile(file, html, opts);
if(file.forList) {
return html;
}
f._itFc.html = html;
html.hide()[n.templates.itemAppendToEnd ? "appendTo" : "prependTo"](l.find(n.templates._selectors.list))
.show();
if(!file._appended) {
f._onSelect(i);
}
},
renderContent: function(opts) {
return f._assets.textParse((opts._appended ? n.templates.itemAppend : n.templates.item), opts);
},
renderFile: function(file, html, opts) {
if(html.find('.jFiler-item-thumb-image')
.size() == 0) {
return false;
}
if(file.file && opts.type == "image") {
var g = '<img src="' + file.file + '" draggable="false" />',
m = html.find('.jFiler-item-thumb-image.fi-loading');
$(g)
.error(function() {
g = f._thumbCreator.generateIcon(opts);
html.addClass('jFiler-no-thumbnail');
m.removeClass('fi-loading')
.html(g);
})
.load(function() {
m.removeClass('fi-loading')
.html(g);
});
return true;
}
if(window.File && window.FileList && window.FileReader && opts.type == "image" && opts.size < 6e+6) {
var y = new FileReader;
y.onload = function(e) {
var g = '<img src="' + e.target.result + '" draggable="false" />',
m = html.find('.jFiler-item-thumb-image.fi-loading');
$(g)
.error(function() {
g = f._thumbCreator.generateIcon(opts);
html.addClass('jFiler-no-thumbnail');
m.removeClass('fi-loading')
.html(g);
})
.load(function() {
m.removeClass('fi-loading')
.html(g);
});
};
y.readAsDataURL(file);
} else {
var g = f._thumbCreator.generateIcon(opts),
m = html.find('.jFiler-item-thumb-image.fi-loading');
html.addClass('jFiler-no-thumbnail');
m.removeClass('fi-loading')
.html(g);
}
},
generateIcon: function(obj) {
var m = new Array(3);
if(obj && obj.type && obj.extension) {
switch(obj.type) {
case "image":
m[0] = "f-image";
m[1] = "<i class=\"icon-jfi-file-image\"></i>"
break;
case "video":
m[0] = "f-video";
m[1] = "<i class=\"icon-jfi-file-video\"></i>"
break;
case "audio":
m[0] = "f-audio";
m[1] = "<i class=\"icon-jfi-file-audio\"></i>"
break;
default:
m[0] = "f-file f-file-ext-" + obj.extension;
m[1] = (obj.extension.length > 0 ? "." + obj.extension : "");
m[2] = 1
}
} else {
m[0] = "f-file";
m[1] = (obj.extension && obj.extension.length > 0 ? "." + obj.extension : "");
m[2] = 1
}
var el = '<span class="jFiler-icon-file ' + m[0] + '">' + m[1] + '</span>';
if(m[2] == 1) {
var c = f._assets.text2Color(obj.extension);
if(c) {
var j = $(el)
.appendTo("body"),
h = j.css("box-shadow");
h = c + h.substring(h.replace(/^.*(rgba?\([^)]+\)).*$/, '$1')
.length, h.length);
j.css({
'-webkit-box-shadow': h,
'-moz-box-shadow': h,
'box-shadow': h
})
.attr('style', '-webkit-box-shadow: ' + h + '; -moz-box-shadow: ' + h + '; box-shadow: ' + h + ';');
el = j.prop('outerHTML');
j.remove();
}
}
return el;
},
_box: function(params) {
if(n.beforeShow != null && typeof n.beforeShow == "function" ? !n.beforeShow(f.files, l, p, o, s) : false) {
return false
}
if(l.length < 1) {
if(n.appendTo) {
var appendTo = $(n.appendTo);
} else {
var appendTo = p;
}
appendTo.find('.jFiler-items')
.remove();
l = $('<div class="jFiler-items jFiler-row"></div>');
s.prop("jFiler").listEl = l;
l.append(f._assets.textParse(n.templates.box))
.appendTo(appendTo);
l.on('click', n.templates._selectors.remove, function(e) {
e.preventDefault();
var cf = n.templates.removeConfirmation ? confirm(n.captions.removeConfirmation) : true;
if(cf) {
f._remove(params ? params.remove.event : e, params ? params.remove.el : $(this)
.closest(n.templates._selectors.item));
}
});
}
for(var i = 0; i < f.files.length; i++) {
if(!f.files[i]._appended) f.files[i]._choosed = true;
f._addToMemory(i);
f._thumbCreator.create(i);
}
}
},
_upload: function(i) {
var el = f._itFc.html,
formData = new FormData();
formData.append(s.attr('name'), f._itFc.file, (f._itFc.file.name ? f._itFc.file.name : false));
if(n.uploadFile.data != null && $.isPlainObject(n.uploadFile.data)) {
for(var k in n.uploadFile.data) {
formData.append(k, n.uploadFile.data[k])
}
}
f._ajax.send(el, formData, f._itFc);
},
_ajax: {
send: function(el, formData, c) {
c.ajax = $.ajax({
url: n.uploadFile.url,
data: formData,
type: n.uploadFile.type,
enctype: n.uploadFile.enctype,
xhr: function() {
var myXhr = $.ajaxSettings.xhr();
if(myXhr.upload) {
myXhr.upload.addEventListener("progress", function(e) {
f._ajax.progressHandling(e, el)
}, false)
}
return myXhr
},
complete: function(jqXHR, textStatus) {
c.ajax = false;
f._ajFc++;
if(f._ajFc >= f.files.length) {
f._ajFc = 0;
n.uploadFile.onComplete != null && typeof n.uploadFile.onComplete == "function" ? n.uploadFile.onComplete(l, p, o, s, jqXHR, textStatus) : null;
}
},
beforeSend: function(jqXHR, settings) {
return n.uploadFile.beforeSend != null && typeof n.uploadFile.beforeSend == "function" ? n.uploadFile.beforeSend(el, l, p, o, s, c.id, jqXHR, settings) : true;
},
success: function(data, textStatus, jqXHR) {
c.uploaded = true;
n.uploadFile.success != null && typeof n.uploadFile.success == "function" ? n.uploadFile.success(data, el, l, p, o, s, c.id, textStatus, jqXHR) : null
},
error: function(jqXHR, textStatus, errorThrown) {
c.uploaded = false;
n.uploadFile.error != null && typeof n.uploadFile.error == "function" ? n.uploadFile.error(el, l, p, o, s, c.id, jqXHR, textStatus, errorThrown) : null
},
statusCode: n.uploadFile.statusCode,
cache: false,
contentType: false,
processData: false
});
return c.ajax;
},
progressHandling: function(e, el) {
if(e.lengthComputable) {
var t = Math.round(e.loaded * 100 / e.total)
.toString();
n.uploadFile.onProgress != null && typeof n.uploadFile.onProgress == "function" ? n.uploadFile.onProgress(t, el, l, p, o, s) : null;
el.find('.jFiler-jProgressBar')
.find(n.templates._selectors.progressBar)
.css("width", t + "%")
}
}
},
_dragDrop: {
dragEnter: function(e) {
e.preventDefault();
e.stopPropagation();
p.addClass('dragged');
f._set('feedback', n.captions.drop);
n.dragDrop.dragEnter != null && typeof n.dragDrop.dragEnter == "function" ? n.dragDrop.dragEnter(e, o, s, p) : null;
},
dragLeave: function(e) {
e.preventDefault();
e.stopPropagation();
if(!f._dragDrop._dragLeaveCheck(e)) {
return false
}
p.removeClass('dragged');
f._set('feedback', n.captions.feedback);
n.dragDrop.dragLeave != null && typeof n.dragDrop.dragLeave == "function" ? n.dragDrop.dragLeave(e, o, s, p) : null;
},
drop: function(e) {
e.preventDefault();
p.removeClass('dragged');
f._set('feedback', n.captions.feedback);
if(e && e.originalEvent && e.originalEvent.dataTransfer && e.originalEvent.dataTransfer.files && e.originalEvent.dataTransfer.files.length > 0) {
f._onChange(e, e.originalEvent.dataTransfer.files);
}
n.dragDrop.drop != null && typeof n.dragDrop.drop == "function" ? n.dragDrop.drop(e.originalEvent.dataTransfer.files, e, o, s, p) : null;
},
_dragLeaveCheck: function(e) {
var related = e.relatedTarget,
inside = false;
if(related !== o) {
if(related) {
inside = $.contains(o, related);
}
if(inside) {
return false;
}
}
return true;
}
},
_clipboardPaste: function(e, fromDrop) {
if(!fromDrop && (!e.originalEvent.clipboardData && !e.originalEvent.clipboardData.items)) {
return
}
if(fromDrop && (!e.originalEvent.dataTransfer && !e.originalEvent.dataTransfer.items)) {
return
}
if(f._clPsePre) {
return
}
var items = (fromDrop ? e.originalEvent.dataTransfer.items : e.originalEvent.clipboardData.items),
b64toBlob = function(b64Data, contentType, sliceSize) {
contentType = contentType || '';
sliceSize = sliceSize || 512;
var byteCharacters = atob(b64Data);
var byteArrays = [];
for(var offset = 0; offset < byteCharacters.length; offset += sliceSize) {
var slice = byteCharacters.slice(offset, offset + sliceSize);
var byteNumbers = new Array(slice.length);
for(var i = 0; i < slice.length; i++) {
byteNumbers[i] = slice.charCodeAt(i);
}
var byteArray = new Uint8Array(byteNumbers);
byteArrays.push(byteArray);
}
var blob = new Blob(byteArrays, {
type: contentType
});
return blob;
};
if(items) {
for(var i = 0; i < items.length; i++) {
if(items[i].type.indexOf("image") !== -1 || items[i].type.indexOf("text/uri-list") !== -1) {
if(fromDrop) {
try {
window.atob(e.originalEvent.dataTransfer.getData("text/uri-list")
.toString()
.split(',')[1]);
} catch(e) {
return;
}
}
var blob = (fromDrop ? b64toBlob(e.originalEvent.dataTransfer.getData("text/uri-list")
.toString()
.split(',')[1], "image/png") : items[i].getAsFile());
blob.name = Math.random()
.toString(36)
.substring(5);
blob.name += blob.type.indexOf("/") != -1 ? "." + blob.type.split("/")[1].toString()
.toLowerCase() : ".png";
f._onChange(e, [blob]);
f._clPsePre = setTimeout(function() {
delete f._clPsePre
}, 1000);
}
}
}
},
_onSelect: function(i) {
if(n.uploadFile && !$.isEmptyObject(n.uploadFile)) {
f._upload(i)
}
n.onSelect != null && typeof n.onSelect == "function" ? n.onSelect(f.files[i], f._itFc.html, l, p, o, s) : null;
if(i + 1 >= f.files.length) {
n.afterShow != null && typeof n.afterShow == "function" ? n.afterShow(l, p, o, s) : null
}
},
_onChange: function(e, d) {
if(!d) {
if(!s.get(0)
.files || typeof s.get(0)
.files == "undefined" || s.get(0)
.files.length == 0) {
if(!n.uploadFile && !n.addMore) {
f._set('input', '');
f._clear();
}
return false
}
f.files = s.get(0)
.files;
} else {
if(!d || d.length == 0) {
f._set('input', '');
f._clear();
return false
}
f.files = d;
}
if(!n.uploadFile && !n.addMore) {
f._reset(true);
}
s.prop("jFiler")
.files = f.files;
if(!f._filesCheck() || (n.beforeSelect != null && typeof n.beforeSelect == "function" ? !n.beforeSelect(f.files, l, p, o, s) : false)) {
f._set('input', '');
f._clear();
return false
}
f._set('feedback', f.files.length + f._itFl.length + ' ' + n.captions.feedback2);
if(n.showThumbs) {
f._thumbCreator._box();
} else {
for(var i = 0; i < f.files.length; i++) {
f.files[i]._choosed = true;
f._addToMemory(i);
f._onSelect(i);
}
}
if(!n.uploadFile && n.addMore) {
var elem = $('<input type="file" />');
var attributes = s.prop("attributes");
$.each(attributes, function() {
elem.attr(this.name, this.value);
});
s.after(elem);
f._unbindInput();
sl.push(elem);
s = elem;
f._bindInput();
f._set('props');
}
},
_append: function(e, data) {
var files = (!data ? false : data.files);
if(!files || files.length <= 0) {
return;
}
f.files = files;
s.prop("jFiler")
.files = f.files;
if(n.showThumbs) {
for(var i = 0; i < f.files.length; i++) {
f.files[i]._appended = true;
}
f._thumbCreator._box();
}
},
_getList: function(e, data) {
var files = (!data ? false : data.files);
if(!files || files.length <= 0) {
return;
}
f.files = files;
s.prop("jFiler")
.files = f.files;
if(n.showThumbs) {
var returnData = [];
for(var i = 0; i < f.files.length; i++) {
f.files[i].forList = true;
returnData.push(f._thumbCreator.create(i));
}
if(data.callback) {
data.callback(returnData, l, p, o, s);
}
}
},
_retryUpload: function(e, data) {
var id = parseInt(typeof data == "object" ? data.attr("data-jfiler-index") : data),
obj = f._itFl.filter(function(value, key) {
return value.id == id;
});
if(obj.length > 0) {
if(n.uploadFile && !$.isEmptyObject(n.uploadFile) && !obj[0].uploaded) {
f._itFc = obj[0];
s.prop("jFiler")
.current_file = f._itFc;
f._upload(id);
return true;
}
} else {
return false;
}
},
_remove: function(e, el) {
if(el.binded) {
if(typeof(el.data.id) != "undefined") {
el = l.find(n.templates._selectors.item + "[data-jfiler-index='" + el.data.id + "']");
if(el.size() == 0) {
return false
}
}
if(el.data.el) {
el = el.data.el;
}
}
var attrId = el.get(0)
.jfiler_id || el.attr('data-jfiler-index'),
id = null,
excl_input = function(id) {
var input = p.find("input[name^='jfiler-items-exclude-']:hidden")
.first(),
item = f._itFl[id],
val = [];
if(input.size() == 0) {
input = $('<input type="hidden" name="jfiler-items-exclude-' + (n.excludeName ? n.excludeName : (s.attr("name")
.slice(-2) != "[]" ? s.attr("name") : s.attr("name")
.substring(0, s.attr("name")
.length - 2)) + "-" + t) + '">');
input.appendTo(p);
}
if(item.file._choosed || item.file._appended || item.uploaded) {
f._prEr = true;
f._itFr.push(item);
if(n.addMore) {
var current_input = item.input,
count_same_input = 0;
f._itFl.filter(function(val, index) {
if(val.file._choosed && val.input.get(0) == current_input.get(0)) count_same_input++;
});
if(count_same_input == 1) {
f._itFr = f._itFr.filter(function(val, index) {
return val.file._choosed ? val.input.get(0) != current_input.get(0) : true;
});
current_input.val("");
f._prEr = false;
}
}
for(var i = 0; i < f._itFr.length; i++) {
val.push(f._itFr[i].file.name);
}
val = JSON.stringify(val);
input.val(val);
}
},
callback = function(el, id) {
excl_input(id);
f._itFl.splice(id, 1);
if(f._itFl.length < 1) {
f._reset();
f._clear();
} else {
f._set('feedback', f._itFl.length + ' ' + n.captions.feedback2);
}
el.fadeOut("fast", function() {
$(this)
.remove();
});
};
for(var key in f._itFl) {
if(key === 'length' || !f._itFl.hasOwnProperty(key)) continue;
if(f._itFl[key].id == attrId) {
id = key;
}
}
if(!f._itFl.hasOwnProperty(id)) {
return false
}
if(f._itFl[id].ajax) {
f._itFl[id].ajax.abort();
callback(el, id);
return;
}
n.onRemove != null && typeof n.onRemove == "function" ? n.onRemove(el, f._itFl[id].file, id, l, p, o, s) : null;
callback(el, id);
},
_addToMemory: function(i) {
f._itFl.push({
id: f._itFl.length,
file: f.files[i],
html: $(),
ajax: false,
uploaded: false,
});
if(n.addMore && !f.files[i]._appended) f._itFl[f._itFl.length - 1].input = s;
f._itFc = f._itFl[f._itFl.length - 1];
s.prop("jFiler")
.files_list = f._itFl;
s.prop("jFiler")
.current_file = f._itFc;
},
_assets: {
bytesToSize: function(bytes) {
if(bytes == 0) return '0 Byte';
var k = 1000;
var sizes = ['Bytes', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB'];
var i = Math.floor(Math.log(bytes) / Math.log(k));
return(bytes / Math.pow(k, i))
.toPrecision(3) + ' ' + sizes[i];
},
hasAttr: function(attr, el) {
var el = (!el ? s : el),
a = el.attr(attr);
if(!a || typeof a == "undefined") {
return false;
} else {
return true;
}
},
getIcon: function(ext, type) {
var types = ["audio", "image", "text", "video"];
if($.inArray(type, types) > -1) {
return '<i class="icon-jfi-file-' + type + ' jfi-file-ext-' + ext + '"></i>';
}
return '<i class="icon-jfi-file-o jfi-file-type-' + type + ' jfi-file-ext-' + ext + '"></i>';
},
textParse: function(text, opts) {
opts = $.extend({}, {
limit: n.limit,
maxSize: n.maxSize,
extensions: n.extensions ? n.extensions.join(',') : null,
}, (opts && $.isPlainObject(opts) ? opts : {}), n.options);
switch(typeof(text)) {
case "string":
return text.replace(/\{\{fi-(.*?)\}\}/g, function(match, a) {
a = a.replace(/ /g, '');
if(a.match(/(.*?)\|limitTo\:(\d+)/)) {
return a.replace(/(.*?)\|limitTo\:(\d+)/, function(match, a, b) {
var a = (opts[a] ? opts[a] : ""),
str = a.substring(0, b);
str = (a.length > str.length ? str.substring(0, str.length - 3) + "..." : str);
return str;
});
} else {
return(opts[a] ? opts[a] : "");
}
});
break;
case "function":
return text(opts);
break;
default:
return text;
}
},
text2Color: function(str) {
if(!str || str.length == 0) {
return false
}
for(var i = 0, hash = 0; i < str.length; hash = str.charCodeAt(i++) + ((hash << 5) - hash));
for(var i = 0, colour = "#"; i < 3; colour += ("00" + ((hash >> i++ * 2) & 0xFF)
.toString(16))
.slice(-2));
return colour;
}
},
files: null,
_itFl: [],
_itFc: null,
_itFr: [],
_ajFc: 0,
_prEr: false
}
s.on("filer.append", function(e, data) {
f._append(e, data)
}).on("filer.remove", function(e, data) {
data.binded = true;
f._remove(e, data);
}).on("filer.reset", function(e) {
f._reset();
f._clear();
return true;
}).on("filer.generateList", function(e, data) {
return f._getList(e, data)
}).on("filer.retry", function(e, data) {
return f._retryUpload(e, data)
});
f.init();
return this;
});
};
$.fn.filer.defaults = {
limit: null,
maxSize: null,
extensions: null,
changeInput: true,
showThumbs: false,
appendTo: null,
theme: 'default',
templates: {
box: '<ul class="jFiler-items-list jFiler-items-default"></ul>',
item: '<li class="jFiler-item"><div class="jFiler-item-container"><div class="jFiler-item-inner"><div class="jFiler-item-icon pull-left">{{fi-icon}}</div><div class="jFiler-item-info pull-left"><div class="jFiler-item-title" title="{{fi-name}}">{{fi-name | limitTo:30}}</div><div class="jFiler-item-others"><span>size: {{fi-size2}}</span><span>type: {{fi-extension}}</span><span class="jFiler-item-status">{{fi-progressBar}}</span></div><div class="jFiler-item-assets"><ul class="list-inline"><li><a class="icon-jfi-trash jFiler-item-trash-action"></a></li></ul></div></div></div></div></li>',
itemAppend: '<li class="jFiler-item"><div class="jFiler-item-container"><div class="jFiler-item-inner"><div class="jFiler-item-icon pull-left">{{fi-icon}}</div><div class="jFiler-item-info pull-left"><div class="jFiler-item-title">{{fi-name | limitTo:35}}</div><div class="jFiler-item-others"><span>size: {{fi-size2}}</span><span>type: {{fi-extension}}</span><span class="jFiler-item-status"></span></div><div class="jFiler-item-assets"><ul class="list-inline"><li><a class="icon-jfi-trash jFiler-item-trash-action"></a></li></ul></div></div></div></div></li>',
progressBar: '<div class="bar"></div>',
itemAppendToEnd: false,
removeConfirmation: true,
_selectors: {
list: '.jFiler-items-list',
item: '.jFiler-item',
progressBar: '.bar',
remove: '.jFiler-item-trash-action'
}
},
files: null,
uploadFile: null,
dragDrop: null,
addMore: false,
clipBoardPaste: true,
excludeName: null,
beforeRender: null,
afterRender: null,
beforeShow: null,
beforeSelect: null,
onSelect: null,
afterShow: null,
onRemove: null,
onEmpty: null,
options: null,
captions: {
button: "Choose Files",
feedback: "Choose files To Upload",
feedback2: "files were chosen",
drop: "Drop file here to Upload",
removeConfirmation: "Are you sure you want to remove this file?",
errors: {
filesLimit: "Only {{fi-limit}} files are allowed to be uploaded.",
filesType: "Only Images are allowed to be uploaded.",
filesSize: "{{fi-name}} is too large! Please upload file up to {{fi-maxSize}} MB.",
filesSizeAll: "Files you've choosed are too large! Please upload files up to {{fi-maxSize}} MB."
}
}
}
})(jQuery);

8
resource/web/js/jquery.filer.min.js vendored Executable file
View file

File diff suppressed because one or more lines are too long

64
resource/web/map.tmpl
View file

@ -1,4 +1,3 @@
<style> <style>
.view-mode { .view-mode {
display: block; display: block;
@ -43,8 +42,10 @@
</div> </div>
<script src="js/svg.js"></script> <script src="js/svg.min.js"></script>
<script src="js/svg.draggable.js"></script> <script src="js/svg.draggable.min.js"></script>
<script src="js/jquery.filer.min.js"></script>
<link href="css/jquery.filer.css" rel="stylesheet">
<script> <script>
var svg; var svg;
var editModeEnabled = false; var editModeEnabled = false;
@ -71,6 +72,36 @@
editMode(false); editMode(false);
drawMap(); drawMap();
}); });
// BG Upload
$("#button-bg").click(function() {
// Reset modal
//$('#bg-file-input').parent().show();
//$('#bg-file-progress').parent().hide();
});
$('#bg-file-input').filer({
limit: 1,
extensions: ['jpg','png','svg','gif'],
maxSize: 3, // in MB
uploadFile: {
url: "",
type: 'POST',
enctype: 'multipart/form-data',
beforeSend: function(){
$('#bg-file-input').parent().hide();
$('#bg-file-progress').parent().show();
},
success: function(data, el){
},
error: function(el){
$("bg-upload-progress").addClass("progress-bar-danger");
},
onProgress: function(t){
$("bg-upload-progress").css("width", t+"%");
},
}
});
}); });
@ -143,3 +174,30 @@
} }
</script> </script>
<!------------------ MODALS ---------------------->
<div class="modal fade" id="bgUploadModal" tabindex="-1">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">
<span aria-hidden="true">&times;</span>
</button>
<h4 class="modal-title">Upload Background Image</h4>
</div>
<div class="modal-body">
<center>
<div class="input-group">
<input type="file" name="files[]" multiple="multiple" id="bg-file-input">
</div>
<div class="progress">
<div id="bg-file-progress" class="progress-bar progress-bar-striped active" style="width: 45%"></div>
</div>
</center>
</div>
<div class="modal-footer">
<button type="reset" class="btn btn-danger" data-dismiss="modal">Cancel</button>
</div>
</div>
</div>
</div>