Sutty/trabajo-afectivo
5
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

Moved to new versions of file uploader.

Browse source
This commit is contained in:
Martin Edenhofer 2012-12-11 00:16:05 +01:00
parent a97736b958
commit f0d6197524
10 changed files with 2382 additions and 1325 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

29
app/assets/javascripts/app/controllers/_application_controller_form.js.coffee
View file

@ -290,14 +290,24 @@ class App.ControllerForm extends App.Controller
# add file uploader # add file uploader
u = => u = =>
uploader = new qq.FileUploader( @el.find('#' + fileUploaderId ).fineUploader(
element: document.getElementById(fileUploaderId) request:
action: '/api/ticket_attachment_new' endpoint: '/api/ticket_attachment_new'
debug: false params:
params: form_id: @form_id
form_id: @form_id text:
uploadButton: '<i class="icon-attachment"></i>'
template: '<div class="qq-uploader">' +
'<pre class="btn qq-upload-icon qq-upload-drop-area"><span>{dragZoneText}</span></pre>' +
'<div class="btn qq-upload-icon qq-upload-button pull-right" style="">{uploadButtonText}</div>' +
'<ul class="qq-upload-list span5" style="margin-top: 10px;"></ul>' +
'</div>',
classes:
success: ''
fail: ''
debug: false
) )
@delay( u, 100 ) @delay( u, 80 )
# tag # tag
else if attribute.tag is 'tag' else if attribute.tag is 'tag'
@ -316,6 +326,7 @@ class App.ControllerForm extends App.Controller
onRemoveTag = => onRemoveTag = =>
siteUpdate(true) siteUpdate(true)
$('#' + attribute.id + '_tagsinput').remove()
w = $('#' + attribute.id).width() w = $('#' + attribute.id).width()
h = $('#' + attribute.id).height() h = $('#' + attribute.id).height()
$('#' + attribute.id).tagsInput( $('#' + attribute.id).tagsInput(
@ -326,7 +337,7 @@ class App.ControllerForm extends App.Controller
) )
siteUpdate(true) siteUpdate(true)
@delay( a, 100 ) @delay( a, 80 )
# autocompletion # autocompletion
@ -369,7 +380,7 @@ class App.ControllerForm extends App.Controller
# @log 'selected', event, ui # @log 'selected', event, ui
b(event, ui.item.id) b(event, ui.item.id)
) )
@delay( a, 100 ) @delay( a, 80 )
# input # input
else else

91
app/assets/javascripts/app/controllers/agent_ticket_create.js.coffee
View file

@ -2,10 +2,11 @@ $ = jQuery.sub()
class Index extends App.Controller class Index extends App.Controller
events: events:
'click .customer_new': 'user_new' 'click .customer_new': 'userNew'
'submit form': 'submit', 'submit form': 'submit'
'click .submit': 'submit', 'click .submit': 'submit'
'click .cancel': 'cancel', 'click .cancel': 'cancel'
'click .article-type': 'articleTypeSelect'
constructor: (params) -> constructor: (params) ->
super super
@ -16,14 +17,19 @@ class Index extends App.Controller
# set title # set title
@title 'New Ticket' @title 'New Ticket'
@form_id = App.ControllerForm.formId() @form_id = App.ControllerForm.formId()
@fetch(params)
@navupdate '#ticket_create' @navupdate '#ticket_create'
@edit_form = undefined @edit_form = undefined
@article_type = 'phone'
@article_type_map =
'phone': 'Customer'
'email': 'Agent'
@fetch(params)
# lisen if view need to be rerendert # lisen if view need to be rerendert
App.Event.bind 'ticket_create_rerender', (defaults) => App.Event.bind 'ticket_create_rerender', (defaults) =>
@log 'rerender', defaults @log 'AgentTicketPhone', 'error', defaults
@render(defaults) @render(defaults)
# get data / in case also ticket data for split # get data / in case also ticket data for split
@ -43,14 +49,13 @@ class Index extends App.Controller
@render() @render()
else else
App.Com.ajax( App.Com.ajax(
id: 'ticket_create', id: 'ticket_create'
type: 'GET', type: 'GET'
url: '/api/ticket_create', url: '/api/ticket_create'
data: { data:
ticket_id: params.ticket_id, ticket_id: params.ticket_id
article_id: params.article_id, article_id: params.article_id
}, processData: true
processData: true,
success: (data, status, xhr) => success: (data, status, xhr) =>
# cache request # cache request
@ -122,6 +127,12 @@ class Index extends App.Controller
form_data: @edit_form form_data: @edit_form
) )
# send chanel type
if defaults['article_type']
@articleTypeSet( defaults['article_type'] )
else
@articleTypeSet( @article_type )
# add elastic to textarea # add elastic to textarea
@el.find('textarea').elastic() @el.find('textarea').elastic()
@ -148,7 +159,22 @@ class Index extends App.Controller
localUserInfo: (params) => localUserInfo: (params) =>
@userInfo( user_id: params.customer_id ) @userInfo( user_id: params.customer_id )
user_new: (e) => articleTypeSet: (name) =>
console.log 'SET', name
@el.find('.article-type').removeClass('active')
@el.find('.article-type[data-type="' + name + '"]').addClass('active')
@el.find('[name="article_type"]').val(name)
articleTypeSelect: (e) =>
console.log 'SELECT', e
e.preventDefault()
article_type = $(e.target).parent().data('type')
if !article_type
article_type = $(e.target).data('type')
@articleTypeSet( article_type )
@article_type = article_type
userNew: (e) =>
e.preventDefault() e.preventDefault()
new UserNew() new UserNew()
@ -167,24 +193,35 @@ class Index extends App.Controller
# create ticket # create ticket
object = new App.Ticket object = new App.Ticket
@log 'updateAttributes', params @log 'updateAttributes', params, @article_type, @article_type_map[@article_type]
# find sender_id # find sender_id
sender = App.Collection.findByAttribute( 'TicketArticleSender', 'name', 'Customer' ) sender = App.Collection.findByAttribute( 'TicketArticleSender', 'name', @article_type_map[@article_type] )
type = App.Collection.findByAttribute( 'TicketArticleType', 'name', 'phone' ) type = App.Collection.findByAttribute( 'TicketArticleType', 'name', @article_type )
if params.group_id if params.group_id
group = App.Collection.find( 'Group', params.group_id ) group = App.Collection.find( 'Group', params.group_id )
# create article # create article
params['article'] = { if sender.name is 'Customer'
from: params.customer_id_autocompletion params['article'] = {
to: (group && group.name) || '' to: (group && group.name) || ''
subject: params.subject from: params.customer_id_autocompletion
body: params.body subject: params.subject
ticket_article_type_id: type.id body: params.body
ticket_article_sender_id: sender.id ticket_article_type_id: type.id
form_id: @form_id ticket_article_sender_id: sender.id
} form_id: @form_id
}
else
params['article'] = {
from: (group && group.name) || ''
to: params.customer_id_autocompletion
subject: params.subject
body: params.body
ticket_article_type_id: type.id
ticket_article_sender_id: sender.id
form_id: @form_id
}
object.load(params) object.load(params)

1251
app/assets/javascripts/app/lib/base/fileuploader.js
View file

File diff suppressed because it is too large Load diff

2124
app/assets/javascripts/app/lib/base/jquery.fineuploader-3.0.js Normal file
View file

File diff suppressed because it is too large Load diff

5
app/assets/javascripts/app/views/agent_ticket_create.jst.eco
View file

@ -5,13 +5,14 @@
</div> </div>
<div class="span3"> <div class="span3">
<div class="btn-group pull-right" data-toggle="buttons-radio"> <div class="btn-group pull-right" data-toggle="buttons-radio">
<button type="button" class="btn article-type-phone active"><i class="icon-headphones"></i></button> <button type="button" class="btn article-type" data-type="phone"><i class="icon-headphones"></i></button>
<button type="button" class="btn article-type-email"><i class="icon-envelope"></i></button> <button type="button" class="btn article-type" data-type="email"><i class="icon-envelope"></i></button>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<form class="form-horizontal"> <form class="form-horizontal">
<input type="hidden" value="" name="article_type"/>
<div class="row"> <div class="row">
<div class="span9" id="form_create"></div> <div class="span9" id="form_create"></div>
<div class="span3"> <div class="span3">

2
app/assets/stylesheets/application.css
View file

@ -4,7 +4,7 @@
* the top of the compiled file, but it's generally better to create a new file per style scope. * the top of the compiled file, but it's generally better to create a new file per style scope.
*= require_self *= require_self
*= require ./bootstrap.css *= require ./bootstrap.css
*= require ./fileuploader.css *= require ./fineuploader.css
*= require ./ui-lightness/jquery-ui-1.8.23.custom.css *= require ./ui-lightness/jquery-ui-1.8.23.custom.css
*= require ./jquery.noty.css *= require ./jquery.noty.css
*= require ./jquery.tagsinput.css *= require ./jquery.tagsinput.css

31
app/assets/stylesheets/fileuploader.css
View file

@ -1,31 +0,0 @@
.qq-uploader { position:relative; width: 100%;}
.qq-upload-button {
/*display:block; /* or inline-block */
/*width: 105px; padding: 7px 0; text-align:center;
background:#880000; border-bottom:1px solid #ddd;color:#fff;*/
}
.qq-upload-button-hover {background:#cc0000;}
.qq-upload-button-focus {outline:1px dotted black;}
.qq-upload-drop-area {
/*position:absolute; top:0; left:0; width:100%; height:100%; min-height: 70px; z-index:2;
background:#FF9797; text-align:center; */
}
.qq-upload-drop-area span {
/*display:block; position:absolute; top: 50%; width:100%; margin-top:-8px; font-size:16px;*/
}
.qq-upload-drop-area-active {}
.qq-upload-list {margin:15px 35px; padding:0; list-style:disc;}
.qq-upload-list li { margin:0; padding:0; line-height:15px; font-size:12px;}
.qq-upload-file, .qq-upload-spinner, .qq-upload-size, .qq-upload-cancel, .qq-upload-failed-text {
margin-right: 7px;
}
.qq-upload-file {}
.qq-upload-spinner {display:inline-block; background: url("loading.gif"); width:15px; height:15px; vertical-align:text-bottom;}
.qq-upload-size,.qq-upload-cancel {font-size:11px;}
.qq-upload-failed-text {display:none;}
.qq-upload-fail .qq-upload-failed-text {display:inline;}

149
app/assets/stylesheets/fineuploader.css Normal file
View file

@ -0,0 +1,149 @@
/*
* Original version: 1.0 © 2010 Andrew Valums ( andrew(at)valums.com )
* Current Maintainer (2.0+): 2012, Ray Nicholus ( fineuploader(at)garstasio.com )
*
* Licensed under MIT license, GNU GPL 2 or later, GNU LGPL 2 or later, see license.txt.
*/
.qq-uploader {
position: relative;
width: 100%;
}
.qq-upload-button {
display: block;
/*or inline-block*/
width: 105px;
padding: 7px 0;
text-align: center;
/*
background: #880000;
border-bottom: 1px solid #DDD;
color: #FFF;
*/
}
.qq-upload-button-hover {
/*
background: #CC0000;
*/
}
.qq-upload-button-focus {
outline: 1px dotted #000000;
}
.qq-upload-drop-area, .qq-upload-extra-drop-area {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
min-height: 30px;
z-index: 2;
/*
background: #FF9797;
*/
text-align: center;
}
.qq-upload-drop-area span {
display: block;
position: absolute;
top: 50%;
width: 100%;
margin-top: -8px;
/*
font-size: 16px;
*/
}
.qq-upload-extra-drop-area {
position: relative;
margin-top: 50px;
/*
font-size: 16px;
*/
padding-top: 30px;
height: 20px;
min-height: 40px;
}
.qq-upload-drop-area-active {
background: #FF7171;
}
.qq-upload-list {
margin: 0;
padding: 0;
list-style: none;
}
.qq-upload-list li {
margin: 0;
padding: 9px;
line-height: 15px;
font-size: 16px;
background-color: #FFF0BD;
}
.qq-upload-file, .qq-upload-spinner, .qq-upload-size, .qq-upload-cancel, .qq-upload-retry, .qq-upload-failed-text, .qq-upload-finished {
margin-right: 12px;
}
.qq-upload-file {
}
.qq-upload-spinner {
display: inline-block;
background: url("loading.gif");
width: 15px;
height: 15px;
vertical-align: text-bottom;
}
.qq-upload-finished {
display:none;
width:15px;
height:15px;
vertical-align:text-bottom;
}
.qq-upload-retry {
display: none;
color: #000000;
}
.qq-upload-cancel {
color: #000000;
}
.qq-upload-retryable .qq-upload-retry {
display: inline;
}
.qq-upload-size, .qq-upload-cancel, .qq-upload-retry {
font-size: 12px;
font-weight: normal;
}
.qq-upload-failed-text {
display: none;
font-style: italic;
font-weight: bold;
}
.qq-upload-failed-icon {
display:none;
width:15px;
height:15px;
vertical-align:text-bottom;
}
.qq-upload-fail .qq-upload-failed-text {
display: inline;
}
.qq-upload-retrying .qq-upload-failed-text {
display: inline;
color: #D60000;
}
.qq-upload-list li.qq-upload-success {
background-color: #5DA30C;
color: #FFFFFF;
}
.qq-upload-list li.qq-upload-fail {
background-color: #D60000;
color: #FFFFFF;
}
.qq-progress-bar {
background: -moz-linear-gradient(top, rgba(30,87,153,1) 0%, rgba(41,137,216,1) 50%, rgba(32,124,202,1) 51%, rgba(125,185,232,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(30,87,153,1)), color-stop(50%,rgba(41,137,216,1)), color-stop(51%,rgba(32,124,202,1)), color-stop(100%,rgba(125,185,232,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, rgba(30,87,153,1) 0%,rgba(41,137,216,1) 50%,rgba(32,124,202,1) 51%,rgba(125,185,232,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, rgba(30,87,153,1) 0%,rgba(41,137,216,1) 50%,rgba(32,124,202,1) 51%,rgba(125,185,232,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, rgba(30,87,153,1) 0%,rgba(41,137,216,1) 50%,rgba(32,124,202,1) 51%,rgba(125,185,232,1) 100%); /* IE10+ */
background: linear-gradient(to bottom, rgba(30,87,153,1) 0%,rgba(41,137,216,1) 50%,rgba(32,124,202,1) 51%,rgba(125,185,232,1) 100%); /* W3C */
width: 0%;
height: 15px;
border-radius: 6px;
margin-bottom: 3px;
display: none;
}

21
app/assets/stylesheets/zzz.css
View file

@ -359,11 +359,28 @@ footer {
opacity: 0.9; opacity: 0.9;
} }
.qq-upload-icon {
margin: 6px 20px 0px 0px;
height: 18px;
}
.qq-upload-button {
display: block;
/*or inline-block*/
width: 40px;
padding: 7px 0;
text-align: center;
}
.qq-upload-list { .qq-upload-list {
text-align: left;
margin: 5px 10px 0px; margin: 5px 10px 0px;
padding: 0; padding: 0;
list-style: disc; list-style: disc;
} }
.qq-upload-icon {
margin: 0px 20px; .qq-upload-list li {
font-size: 14px;
padding: 5px;
background-color: transparent;
} }