Mathias Markl
7 years ago
4 changed files with 538 additions and 5 deletions
-
2muk_web_utils/__manifest__.py
-
416muk_web_utils/static/lib/bootstrap-notify/bootstrap-notify.js
-
113muk_web_utils/static/src/js/files.js
-
12muk_web_utils/template/assets.xml
@ -0,0 +1,416 @@ |
|||
/* |
|||
* Project: Bootstrap Notify = v3.1.5 |
|||
* Description: Turns standard Bootstrap alerts into "Growl-like" notifications. |
|||
* Author: Mouse0270 aka Robert McIntosh |
|||
* License: MIT License |
|||
* Website: https://github.com/mouse0270/bootstrap-growl
|
|||
*/ |
|||
|
|||
/* global define:false, require: false, jQuery:false */ |
|||
|
|||
(function (factory) { |
|||
if (typeof define === 'function' && define.amd) { |
|||
// AMD. Register as an anonymous module.
|
|||
define(['jquery'], factory); |
|||
} else if (typeof exports === 'object') { |
|||
// Node/CommonJS
|
|||
factory(require('jquery')); |
|||
} else { |
|||
// Browser globals
|
|||
factory(jQuery); |
|||
} |
|||
}(function ($) { |
|||
// Create the defaults once
|
|||
var defaults = { |
|||
element: 'body', |
|||
position: null, |
|||
type: "info", |
|||
allow_dismiss: true, |
|||
allow_duplicates: true, |
|||
newest_on_top: false, |
|||
showProgressbar: false, |
|||
placement: { |
|||
from: "top", |
|||
align: "right" |
|||
}, |
|||
offset: 20, |
|||
spacing: 10, |
|||
z_index: 1031, |
|||
delay: 5000, |
|||
timer: 1000, |
|||
url_target: '_blank', |
|||
mouse_over: null, |
|||
animate: { |
|||
enter: 'animated fadeInDown', |
|||
exit: 'animated fadeOutUp' |
|||
}, |
|||
onShow: null, |
|||
onShown: null, |
|||
onClose: null, |
|||
onClosed: null, |
|||
onClick: null, |
|||
icon_type: 'class', |
|||
template: '<div data-notify="container" class="col-xs-11 col-sm-4 alert alert-{0}" role="alert"><button type="button" aria-hidden="true" class="close" data-notify="dismiss">×</button><span data-notify="icon"></span> <span data-notify="title">{1}</span> <span data-notify="message">{2}</span><div class="progress" data-notify="progressbar"><div class="progress-bar progress-bar-{0}" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" style="width: 0%;"></div></div><a href="{3}" target="{4}" data-notify="url"></a></div>' |
|||
}; |
|||
|
|||
String.format = function () { |
|||
var args = arguments; |
|||
var str = arguments[0]; |
|||
return str.replace(/(\{\{\d\}\}|\{\d\})/g, function (str) { |
|||
if (str.substring(0, 2) === "{{") return str; |
|||
var num = parseInt(str.match(/\d/)[0]); |
|||
return args[num + 1]; |
|||
}); |
|||
}; |
|||
|
|||
function isDuplicateNotification(notification) { |
|||
var isDupe = false; |
|||
|
|||
$('[data-notify="container"]').each(function (i, el) { |
|||
var $el = $(el); |
|||
var title = $el.find('[data-notify="title"]').html().trim(); |
|||
var message = $el.find('[data-notify="message"]').html().trim(); |
|||
|
|||
// The input string might be different than the actual parsed HTML string!
|
|||
// (<br> vs <br /> for example)
|
|||
// So we have to force-parse this as HTML here!
|
|||
var isSameTitle = title === $("<div>" + notification.settings.content.title + "</div>").html().trim(); |
|||
var isSameMsg = message === $("<div>" + notification.settings.content.message + "</div>").html().trim(); |
|||
var isSameType = $el.hasClass('alert-' + notification.settings.type); |
|||
|
|||
if (isSameTitle && isSameMsg && isSameType) { |
|||
//we found the dupe. Set the var and stop checking.
|
|||
isDupe = true; |
|||
} |
|||
return !isDupe; |
|||
}); |
|||
|
|||
return isDupe; |
|||
} |
|||
|
|||
function Notify(element, content, options) { |
|||
// Setup Content of Notify
|
|||
var contentObj = { |
|||
content: { |
|||
message: typeof content === 'object' ? content.message : content, |
|||
title: content.title ? content.title : '', |
|||
icon: content.icon ? content.icon : '', |
|||
url: content.url ? content.url : '#', |
|||
target: content.target ? content.target : '-' |
|||
} |
|||
}; |
|||
|
|||
options = $.extend(true, {}, contentObj, options); |
|||
this.settings = $.extend(true, {}, defaults, options); |
|||
this._defaults = defaults; |
|||
if (this.settings.content.target === "-") { |
|||
this.settings.content.target = this.settings.url_target; |
|||
} |
|||
this.animations = { |
|||
start: 'webkitAnimationStart oanimationstart MSAnimationStart animationstart', |
|||
end: 'webkitAnimationEnd oanimationend MSAnimationEnd animationend' |
|||
}; |
|||
|
|||
if (typeof this.settings.offset === 'number') { |
|||
this.settings.offset = { |
|||
x: this.settings.offset, |
|||
y: this.settings.offset |
|||
}; |
|||
} |
|||
|
|||
//if duplicate messages are not allowed, then only continue if this new message is not a duplicate of one that it already showing
|
|||
if (this.settings.allow_duplicates || (!this.settings.allow_duplicates && !isDuplicateNotification(this))) { |
|||
this.init(); |
|||
} |
|||
} |
|||
|
|||
$.extend(Notify.prototype, { |
|||
init: function () { |
|||
var self = this; |
|||
|
|||
this.buildNotify(); |
|||
if (this.settings.content.icon) { |
|||
this.setIcon(); |
|||
} |
|||
if (this.settings.content.url != "#") { |
|||
this.styleURL(); |
|||
} |
|||
this.styleDismiss(); |
|||
this.placement(); |
|||
this.bind(); |
|||
|
|||
this.notify = { |
|||
$ele: this.$ele, |
|||
update: function (command, update) { |
|||
var commands = {}; |
|||
if (typeof command === "string") { |
|||
commands[command] = update; |
|||
} else { |
|||
commands = command; |
|||
} |
|||
for (var cmd in commands) { |
|||
switch (cmd) { |
|||
case "type": |
|||
this.$ele.removeClass('alert-' + self.settings.type); |
|||
this.$ele.find('[data-notify="progressbar"] > .progress-bar').removeClass('progress-bar-' + self.settings.type); |
|||
self.settings.type = commands[cmd]; |
|||
this.$ele.addClass('alert-' + commands[cmd]).find('[data-notify="progressbar"] > .progress-bar').addClass('progress-bar-' + commands[cmd]); |
|||
break; |
|||
case "icon": |
|||
var $icon = this.$ele.find('[data-notify="icon"]'); |
|||
if (self.settings.icon_type.toLowerCase() === 'class') { |
|||
$icon.removeClass(self.settings.content.icon).addClass(commands[cmd]); |
|||
} else { |
|||
if (!$icon.is('img')) { |
|||
$icon.find('img'); |
|||
} |
|||
$icon.attr('src', commands[cmd]); |
|||
} |
|||
self.settings.content.icon = commands[command]; |
|||
break; |
|||
case "progress": |
|||
var newDelay = self.settings.delay - (self.settings.delay * (commands[cmd] / 100)); |
|||
this.$ele.data('notify-delay', newDelay); |
|||
this.$ele.find('[data-notify="progressbar"] > div').attr('aria-valuenow', commands[cmd]).css('width', commands[cmd] + '%'); |
|||
break; |
|||
case "url": |
|||
this.$ele.find('[data-notify="url"]').attr('href', commands[cmd]); |
|||
break; |
|||
case "target": |
|||
this.$ele.find('[data-notify="url"]').attr('target', commands[cmd]); |
|||
break; |
|||
default: |
|||
this.$ele.find('[data-notify="' + cmd + '"]').html(commands[cmd]); |
|||
} |
|||
} |
|||
var posX = this.$ele.outerHeight() + parseInt(self.settings.spacing) + parseInt(self.settings.offset.y); |
|||
self.reposition(posX); |
|||
}, |
|||
close: function () { |
|||
self.close(); |
|||
} |
|||
}; |
|||
|
|||
}, |
|||
buildNotify: function () { |
|||
var content = this.settings.content; |
|||
this.$ele = $(String.format(this.settings.template, this.settings.type, content.title, content.message, content.url, content.target)); |
|||
this.$ele.attr('data-notify-position', this.settings.placement.from + '-' + this.settings.placement.align); |
|||
if (!this.settings.allow_dismiss) { |
|||
this.$ele.find('[data-notify="dismiss"]').css('display', 'none'); |
|||
} |
|||
if ((this.settings.delay <= 0 && !this.settings.showProgressbar) || !this.settings.showProgressbar) { |
|||
this.$ele.find('[data-notify="progressbar"]').remove(); |
|||
} |
|||
}, |
|||
setIcon: function () { |
|||
if (this.settings.icon_type.toLowerCase() === 'class') { |
|||
this.$ele.find('[data-notify="icon"]').addClass(this.settings.content.icon); |
|||
} else { |
|||
if (this.$ele.find('[data-notify="icon"]').is('img')) { |
|||
this.$ele.find('[data-notify="icon"]').attr('src', this.settings.content.icon); |
|||
} else { |
|||
this.$ele.find('[data-notify="icon"]').append('<img src="' + this.settings.content.icon + '" alt="Notify Icon" />'); |
|||
} |
|||
} |
|||
}, |
|||
styleDismiss: function () { |
|||
this.$ele.find('[data-notify="dismiss"]').css({ |
|||
position: 'absolute', |
|||
right: '10px', |
|||
top: '5px', |
|||
zIndex: this.settings.z_index + 2 |
|||
}); |
|||
}, |
|||
styleURL: function () { |
|||
this.$ele.find('[data-notify="url"]').css({ |
|||
backgroundImage: 'url(data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7)', |
|||
height: '100%', |
|||
left: 0, |
|||
position: 'absolute', |
|||
top: 0, |
|||
width: '100%', |
|||
zIndex: this.settings.z_index + 1 |
|||
}); |
|||
}, |
|||
placement: function () { |
|||
var self = this, |
|||
offsetAmt = this.settings.offset.y, |
|||
css = { |
|||
display: 'inline-block', |
|||
margin: '0px auto', |
|||
position: this.settings.position ? this.settings.position : (this.settings.element === 'body' ? 'fixed' : 'absolute'), |
|||
transition: 'all .5s ease-in-out', |
|||
zIndex: this.settings.z_index |
|||
}, |
|||
hasAnimation = false, |
|||
settings = this.settings; |
|||
|
|||
$('[data-notify-position="' + this.settings.placement.from + '-' + this.settings.placement.align + '"]:not([data-closing="true"])').each(function () { |
|||
offsetAmt = Math.max(offsetAmt, parseInt($(this).css(settings.placement.from)) + parseInt($(this).outerHeight()) + parseInt(settings.spacing)); |
|||
}); |
|||
if (this.settings.newest_on_top === true) { |
|||
offsetAmt = this.settings.offset.y; |
|||
} |
|||
css[this.settings.placement.from] = offsetAmt + 'px'; |
|||
|
|||
switch (this.settings.placement.align) { |
|||
case "left": |
|||
case "right": |
|||
css[this.settings.placement.align] = this.settings.offset.x + 'px'; |
|||
break; |
|||
case "center": |
|||
css.left = 0; |
|||
css.right = 0; |
|||
break; |
|||
} |
|||
this.$ele.css(css).addClass(this.settings.animate.enter); |
|||
$.each(Array('webkit-', 'moz-', 'o-', 'ms-', ''), function (index, prefix) { |
|||
self.$ele[0].style[prefix + 'AnimationIterationCount'] = 1; |
|||
}); |
|||
|
|||
$(this.settings.element).append(this.$ele); |
|||
|
|||
if (this.settings.newest_on_top === true) { |
|||
offsetAmt = (parseInt(offsetAmt) + parseInt(this.settings.spacing)) + this.$ele.outerHeight(); |
|||
this.reposition(offsetAmt); |
|||
} |
|||
|
|||
if ($.isFunction(self.settings.onShow)) { |
|||
self.settings.onShow.call(this.$ele); |
|||
} |
|||
|
|||
this.$ele.one(this.animations.start, function () { |
|||
hasAnimation = true; |
|||
}).one(this.animations.end, function () { |
|||
self.$ele.removeClass(self.settings.animate.enter); |
|||
if ($.isFunction(self.settings.onShown)) { |
|||
self.settings.onShown.call(this); |
|||
} |
|||
}); |
|||
|
|||
setTimeout(function () { |
|||
if (!hasAnimation) { |
|||
if ($.isFunction(self.settings.onShown)) { |
|||
self.settings.onShown.call(this); |
|||
} |
|||
} |
|||
}, 600); |
|||
}, |
|||
bind: function () { |
|||
var self = this; |
|||
|
|||
this.$ele.find('[data-notify="dismiss"]').on('click', function () { |
|||
self.close(); |
|||
}); |
|||
|
|||
if ($.isFunction(self.settings.onClick)) { |
|||
this.$ele.on('click', function (event) { |
|||
if (event.target != self.$ele.find('[data-notify="dismiss"]')[0]) { |
|||
self.settings.onClick.call(this, event); |
|||
} |
|||
}); |
|||
} |
|||
|
|||
this.$ele.mouseover(function () { |
|||
$(this).data('data-hover', "true"); |
|||
}).mouseout(function () { |
|||
$(this).data('data-hover', "false"); |
|||
}); |
|||
this.$ele.data('data-hover', "false"); |
|||
|
|||
if (this.settings.delay > 0) { |
|||
self.$ele.data('notify-delay', self.settings.delay); |
|||
var timer = setInterval(function () { |
|||
var delay = parseInt(self.$ele.data('notify-delay')) - self.settings.timer; |
|||
if ((self.$ele.data('data-hover') === 'false' && self.settings.mouse_over === "pause") || self.settings.mouse_over != "pause") { |
|||
var percent = ((self.settings.delay - delay) / self.settings.delay) * 100; |
|||
self.$ele.data('notify-delay', delay); |
|||
self.$ele.find('[data-notify="progressbar"] > div').attr('aria-valuenow', percent).css('width', percent + '%'); |
|||
} |
|||
if (delay <= -(self.settings.timer)) { |
|||
clearInterval(timer); |
|||
self.close(); |
|||
} |
|||
}, self.settings.timer); |
|||
} |
|||
}, |
|||
close: function () { |
|||
var self = this, |
|||
posX = parseInt(this.$ele.css(this.settings.placement.from)), |
|||
hasAnimation = false; |
|||
|
|||
this.$ele.attr('data-closing', 'true').addClass(this.settings.animate.exit); |
|||
self.reposition(posX); |
|||
|
|||
if ($.isFunction(self.settings.onClose)) { |
|||
self.settings.onClose.call(this.$ele); |
|||
} |
|||
|
|||
this.$ele.one(this.animations.start, function () { |
|||
hasAnimation = true; |
|||
}).one(this.animations.end, function () { |
|||
$(this).remove(); |
|||
if ($.isFunction(self.settings.onClosed)) { |
|||
self.settings.onClosed.call(this); |
|||
} |
|||
}); |
|||
|
|||
setTimeout(function () { |
|||
if (!hasAnimation) { |
|||
self.$ele.remove(); |
|||
if ($.isFunction(self.settings.onClosed)) { |
|||
self.settings.onClosed.call(this); |
|||
} |
|||
} |
|||
}, 600); |
|||
}, |
|||
reposition: function (posX) { |
|||
var self = this, |
|||
notifies = '[data-notify-position="' + this.settings.placement.from + '-' + this.settings.placement.align + '"]:not([data-closing="true"])', |
|||
$elements = this.$ele.nextAll(notifies); |
|||
if (this.settings.newest_on_top === true) { |
|||
$elements = this.$ele.prevAll(notifies); |
|||
} |
|||
$elements.each(function () { |
|||
$(this).css(self.settings.placement.from, posX); |
|||
posX = (parseInt(posX) + parseInt(self.settings.spacing)) + $(this).outerHeight(); |
|||
}); |
|||
} |
|||
}); |
|||
|
|||
$.notify = function (content, options) { |
|||
var plugin = new Notify(this, content, options); |
|||
return plugin.notify; |
|||
}; |
|||
$.notifyDefaults = function (options) { |
|||
defaults = $.extend(true, {}, defaults, options); |
|||
return defaults; |
|||
}; |
|||
|
|||
$.notifyClose = function (selector) { |
|||
|
|||
if (typeof selector === "undefined" || selector === "all") { |
|||
$('[data-notify]').find('[data-notify="dismiss"]').trigger('click'); |
|||
}else if(selector === 'success' || selector === 'info' || selector === 'warning' || selector === 'danger'){ |
|||
$('.alert-' + selector + '[data-notify]').find('[data-notify="dismiss"]').trigger('click'); |
|||
} else if(selector){ |
|||
$(selector + '[data-notify]').find('[data-notify="dismiss"]').trigger('click'); |
|||
} |
|||
else { |
|||
$('[data-notify-position="' + selector + '"]').find('[data-notify="dismiss"]').trigger('click'); |
|||
} |
|||
}; |
|||
|
|||
$.notifyCloseExcept = function (selector) { |
|||
|
|||
if(selector === 'success' || selector === 'info' || selector === 'warning' || selector === 'danger'){ |
|||
$('[data-notify]').not('.alert-' + selector).find('[data-notify="dismiss"]').trigger('click'); |
|||
} else{ |
|||
$('[data-notify]').not(selector).find('[data-notify="dismiss"]').trigger('click'); |
|||
} |
|||
}; |
|||
|
|||
|
|||
})); |
|||
|
|||
@ -0,0 +1,113 @@ |
|||
/********************************************************************************** |
|||
* |
|||
* Copyright (C) 2018 MuK IT GmbH |
|||
* |
|||
* This program is free software: you can redistribute it and/or modify |
|||
* it under the terms of the GNU Affero General Public License as |
|||
* published by the Free Software Foundation, either version 3 of the |
|||
* License, or (at your option) any later version. |
|||
* |
|||
* This program is distributed in the hope that it will be useful, |
|||
* but WITHOUT ANY WARRANTY; without even the implied warranty of |
|||
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the |
|||
* GNU Affero General Public License for more details. |
|||
* |
|||
* You should have received a copy of the GNU Affero General Public License |
|||
* along with this program. If not, see <http://www.gnu.org/licenses/>.
|
|||
* |
|||
**********************************************************************************/ |
|||
|
|||
odoo.define('muk_web_utils.files', function (require) { |
|||
"use strict"; |
|||
|
|||
var core = require('web.core'); |
|||
var utils = require('web.utils'); |
|||
|
|||
var QWeb = core.qweb; |
|||
var _t = core._t; |
|||
|
|||
var traverse_items = function(items, structure) { |
|||
var $result = $.Deferred(); |
|||
var files = []; |
|||
var events = []; |
|||
function traverse_item() { |
|||
var $get = $.Deferred(); |
|||
var item, file; |
|||
events.push($get); |
|||
if (items[i] instanceof DataTransferItem) { |
|||
item = items[i].webkitGetAsEntry(); |
|||
file = items[i].getAsFile(); |
|||
} else { |
|||
item = items[i]; |
|||
} |
|||
if (item) { |
|||
if (item.isFile) { |
|||
files.push(item); |
|||
$get.resolve(); |
|||
} else if (item.isDirectory) { |
|||
var dirReader = item.createReader(); |
|||
dirReader.readEntries(function (entries) { |
|||
traverse_items(entries, structure).then(function (result) { |
|||
if(structure) { |
|||
files.push({ |
|||
name: item.name, |
|||
fullPath: item.fullPath, |
|||
files: result |
|||
}); |
|||
} else { |
|||
files = _.union(files, result); |
|||
} |
|||
$get.resolve(); |
|||
}); |
|||
}); |
|||
} |
|||
} else if (file) { |
|||
files.push(file); |
|||
$get.resolve(); |
|||
} else { |
|||
console.warn("Your browser doesn't support Drag and Drop!"); |
|||
$get.resolve(); |
|||
} |
|||
}; |
|||
for (var i = 0; i < items.length; i++) { |
|||
traverse_item(); |
|||
} |
|||
$.when.apply($, events).then(function () { |
|||
$result.resolve(files); |
|||
}); |
|||
return $result; |
|||
}; |
|||
|
|||
var get_file_list = function(items) { |
|||
return traverse_items(items, false); |
|||
}; |
|||
|
|||
var get_file_structure = function(items) { |
|||
return traverse_items(items, true); |
|||
}; |
|||
|
|||
var load_file = function(file, callback) { |
|||
var fileReader = new FileReader(); |
|||
fileReader.readAsDataURL(file); |
|||
fileReader.onloadend = callback; |
|||
}; |
|||
|
|||
var read_file = function(file, callback) { |
|||
if(file.isFile) { |
|||
file.file(function(file) { |
|||
load_file(file, callback); |
|||
}); |
|||
} else { |
|||
load_file(file, callback); |
|||
} |
|||
}; |
|||
|
|||
return { |
|||
traverse_items: traverse_items, |
|||
get_file_list: get_file_list, |
|||
get_file_structure: get_file_structure, |
|||
load_file: load_file, |
|||
read_file: read_file, |
|||
}; |
|||
|
|||
}); |
|||
Write
Preview
Loading…
Cancel
Save
Reference in new issue