How to do override uploadifive method? - javascript

Please give me code example for override any method of uploadifive.
Here i have putted my js code, please have your look. i want to check duplicate file from backend. I have already method in controller.
If you give any sample for how i can override method then i can try ahead.
$('#file_upload').uploadifive({
'auto' : true,
'buttonText' : 'Select File',
'checkScript' : false,
'queueSizeLimit' : 10,
'fileSizeLimit' : 10737418240,
'dnd' : false,
'multi' : true,
'removeCompleted' : true,
'queueID' : 'queue',
'simUploadLimit' : 30,
'uploadLimit' : 30,
'overrideEvents' : ['onProgress'],
'uploadScript' : '/files/pending',
// Triggered for each file that is added to the queue
'onAddQueueItem' : function(file) {
console.log(file.name + "file that is added to the queue");
var folder = files.currentItemData();
this.data('uploadifive').settings.formData = {
'timestamp' : current_date_time(),
'authenticity_token' : token(),
'attachment[folder_id]' : folder.id,
'attachment[context_code]' : current_context_code(),
'attachment[language]' : uploadifive_language_code(),
'success_action_status' : "201",
//'attachment[duplicate_handling]': file.duplicate_handling,
};
},
// Triggered when a file is cancelled or removed from the queue
'onCancel' : function() {},
// Triggered when the server is checked for an existing file
'onCheck' : function() {},
// Triggered during the clearQueue function
'onClearQueue' : function() {},
// Triggered when files are dropped into the file queue
'onDrop' : function() {},
// Triggered when an error occurs
'onError' : function(file, fileType, data) {},
// Triggered if the HTML5 File API is not supported by the browser
'onFallback' : function() {},
// Triggered when UploadiFive if initialized
'onInit' : function() {},
// Triggered once when an upload queue is done
'onQueueComplete' : function(file, data) {},
// Triggered during each progress update of an upload
'onProgress' : function(file, e) {
if (e.lengthComputable) {
var percent = Math.round((e.loaded / e.total) * 100);
}
$('.uploadifive-queue-item').find('.fileinfo').html(' - ' + percent + '%');
$('.uploadifive-queue-item').find('.progress-bar').css('width', percent + '%');
},
// Triggered once when files are selected from a dialog box
'onSelect' : function(file) {
console.log(file.queued + ' files were added to the queue.');
return;
},
// Triggered when an upload queue is started
'onUpload' : function(file) {
console.log(file + ' files will be uploaded.');
file_select_done();
},
// Triggered when a file is successfully uploaded
'onUploadComplete' : function(file, data) {
res_data = JSON.parse(data);
$.ajaxJSON(res_data.success_url,'GET',{"authenticity_token" : authenticity_token},function(data) {
if (data && data["attachment"]){
var file_id = data["attachment"]["id"];
var file_name = data["attachment"]["display_name"];
generate_li(file_name, file_id);
qutaUpdate();
}
});
console.log('The file ' + file.name + ' uploaded successfully.');
},
// Triggered for each file being uploaded
'onUploadFile' : function(file) {
console.log('The file ' + file.name + ' is being uploaded.');
}
});});

I found answer of my above question: :)
$('#file_upload').uploadifive({
'overrideEvents' : ['onProgress','onCheck'],
});
I putted uploadifive method in array and now all my code calling here not uploadifive's code.
Thanks!

Related

Titanium with how to run some code when user click on the notification? (Android)

how to run some code when user click on the notification? if user click push notification i want understand coming from push notification.
How can i do?
Thanks
-Gcm Module-
//my gcm module
var gcm = require("nl.vanvianen.android.gcm");
/* If the app is started or resumed act on pending data saved when the notification was received */
var lastData = gcm.getLastData();
if (lastData) {
Ti.API.info("Last notification received " + JSON.stringify(lastData));
gcm.clearLastData();
}
gcm.registerPush({
senderId : 'xxxxxxxx',
notificationSettings : {
sound : 'mysound.mp3',
smallIcon : 'notification_icon.png',
largeIcon : 'appicon.png',
vibrate : true
},
//Push registration success
success : function(event) {
Ti.API.info("Push registration success: " + JSON.stringify(event));
},
//Push registration error
error : function(event) {
Ti.API.info("Push registration error = " + JSON.stringify(event));
alert(event.error);
},
//i want this function Coming from push
data : function(event) {
// console.log(" ******* Coming from push : " + JSON.stringify(event));
},
//my callback funtion call device token
callback : function(event) {
Ti.API.info("Push callback = " + JSON.stringify(event));
var dialog = Ti.UI.createAlertDialog({
title : 'Push received',
message : JSON.stringify(event.data)
// buttonNames: ['View'],
// cancel: 1
});
dialog.addEventListener("click", function(event) {
dialog.hide();
if (event.index == 0) {
/* Do stuff to view the notification */
}
});
dialog.show();
},
});
Titanium.UI.setBackgroundColor('#000');
var win = Ti.UI.createWindow({
backgroundColor : '#ccc',
title : 'Android Cloud Push Notification'
});
var CloudPush = require('ti.cloudpush');
CloudPush.debug = true;
CloudPush.enabled = true;
CloudPush.showTrayNotification = true;
CloudPush.showTrayNotificationsWhenFocused = true;
CloudPush.focusAppOnPush = false;
var deviceToken;
var Cloud = require('ti.cloud');
Cloud.debug = true;
var submit = Ti.UI.createButton({
title : 'Register For Push Notification',
color : '#000',
height : 53,
width : 200,
top : 100,
});
win.add(submit);
submit.addEventListener('click', function(e) {
CloudPush.retrieveDeviceToken({
success : function deviceTokenSuccess(e) {
alert('Device Token: ' + e.deviceToken);
deviceToken = e.deviceToken;
loginDefault();
},
error : function deviceTokenError(e) {
alert('Failed to register for push! ' + e.error);
}
});
});
function loginDefault(e) {
// At first you need to create an user from the application dashboard
// Then login that email and password
Cloud.Users.login({
login : '.....',
password : '....'
}, function(e) {
if (e.success) {
alert("login success");
defaultSubscribe();
} else {
alert('Error: ' + ((e.error && e.message) || JSON.stringify(e)));
}
});
}
function defaultSubscribe() {
Cloud.PushNotifications.subscribe({
channel : 'alert',
device_token : deviceToken,
type : 'android'
}, function(e) {
if (e.success) {
alert('Subscribed for Push Notification!');
} else {
alert('Error:' + ((e.error && e.message) || JSON.stringify(e)));
}
});
}
CloudPush.addEventListener('callback', function(evt) {
//alert(evt);
//alert(evt.payload);
});
CloudPush.addEventListener('trayClickLaunchedApp', function(evt) {
Ti.API.info('Tray Click Launched App (app was not running)');
//alert('Tray Click Launched App (app was not running');
});
CloudPush.addEventListener('trayClickFocusedApp', function(evt) {
Ti.API.info('Tray Click Focused App (app was already running)');
//alert('Tray Click Focused App (app was already running)');
});
win.open();

Cancel uploads in onStatusChange

In our system we only allow uploads up to a specific number which can be done in multiple upload sessions. When the number of images in an upload session exceed this maximum number we are currently cancelling uploads in onStatusChange() instead of adjusting itemLimit:
thumbnailuploader = new qq.FineUploader({
element: document.getElementById('thumbnail-fine-uploader'),
template: "qq-simple-thumbnails-template",
request: {
endpoint: 'uploader/uploader.php'
},
thumbnails: {
placeholders: {
waitingPath: "uploader/waiting-generic.png",
notAvailablePath: "uploader/not_available-generic.png"
}
},
validation: {
allowedExtensions: ['jpeg', 'jpg', 'gif', 'png', 'bmp'],
itemLimit: 6
},
callbacks: {
onSubmit: function(id, fileName){
// console.log("submitting..." + id);
},
onStatusChange: function (id, oldStatus, newStatus) {
// This will check to see if a file that has been cancelled
// would equate to all uploads being 'completed'.
if(parseInt(galleryImages) + id + 1 > MaxUploads && newStatus !== qq.status.CANCELLED){
this.cancel(id);
return;
}
if (newStatus === qq.status.CANCELLED) {
check_done();
return;
}
},
onComplete: check_done,
onUpload: StartUpload
}
});
This seems to work well, but when switching on the debugger I get:
Error: [Fine Uploader 5.0.3] 1 is not a valid file ID to upload!
in
now: function(id) {
var name = options.getName(id);
if (!controller.isValid(id)) {
throw new qq.Error(id + " is not a valid file ID to upload!");
}
and a bunch of:
"[Fine Uploader 5.0.3] Caught exception in 'onStatusChange' callback - element is undefined"
Can this be fixed or are these messages harmless?
Thanks!

Fineuploader cancel upload after user response on file submit

I am trying to get user response on file submit to cancel or not to cancel file upload but it doesn't seem to stop file upload may be I am missing something pls suggest
onSubmit: function(id, name) {
doc_status = $('#doc_attach_status').val();
if (doc_status == "true" ) {
if(confirm("Please note, if you upload a new PDF, old one will be replaced") == false){
manualuploader.cancelAll(); // tried but does not work
cancelAll();// tried but does not work
cancel(id);// tried but does not work
$(this).cancelAll();// tried but does not work
}
}
},
And yes I am able to successfully upload files ......
And this is complete function I am using ...
var manualuploader = new qq.FineUploader({
callbacks : {
onComplete : function(id, name, response) {
}
},
element : $('#pdf-fine-uploader')[0],
request : {
endpoint : "/UploadPdf",
params : {
variant_id : $('#variant_id').val(),
}
},
multiple : false,
autoUpload : true,
text : {
uploadButton : '<i class="icon-plus icon-white"></i> Select File </br> Maximum upload size less than 2 MB'
},
validation : {
allowedExtensions : ['pdf', 'txt'],
//sizeLimit: 51200, // 50 kB = 50 * 1024 bytes
sizeLimit : 2097152//, // 2 MB = 2 * 1024 * 1024 bytes
//itemLimit : 6
},
callbacks : {
onSubmit: function(id, name) {
doc_status = $('#doc_attach_status').val();
// var answer = confirm("Please note, if you upload a new PDF, your current Tasting Notes PDF will be replaced");
if (doc_status == "true" ) {
if(confirm("Please note, if you upload a new PDF, your current Tasting Notes PDF will be replaced") == false){
manualuploader.cancelAll();
}
}
},
onComplete : function(id, fileName, responseJSON) {
if (responseJSON.success) {
$('.doc_link').html(responseJSON.docurl);
$('#doc_delete_link').addClass('icon-remove-sign');
$('.doc_description_head').show();
$('#doc_pdf_head').show();
$('.doc_description_div').show();
$('.description_save').show();
$('#doc_delete_link').show();
}
}
}
});
$('#triggerUpload').click(function() {
manualuploader.uploadStoredFiles();
});
});
Finally got very simple solution ...
just use
retrun true or false after getting user response ....
onSubmit: function(id, name) {
doc_status = $('#doc_attach_status').val();
if (doc_status == "true" ) {
if(confirm("Please note, if you upload a new PDF, old one will be replaced") == false){
retutn false;
}
}
},

Plupload Automatically start upload when files added

When files are added i want to start the upload process automatically. I called the start function at the end of FilesAdded but it doesn't start the upload.
uploader.bind('FilesAdded', function(up, files) {
var str = "";
for (var i in files) {
str += '<div id="' + files[i].id + '">' + files[i].name + ' (' + plupload.formatSize(files[i].size) + ') <b></b></div>';
}
$('#filelist').html(str);
up.refresh();
up.start();
});
Here is my creation code
var uploader = new plupload.Uploader({
runtimes: 'html5,flash,silverlight',
autostart : true,
url: '<%= images_path %>',
max_file_size: '10mb',
multipart: true,
browse_button: "pickfiles",
container: "the-uploader",
drop_element : "drop-area",
multipart_params: {
'_http_accept': 'application/javascript',
'<%=request_forgery_protection_token%>': '<%=form_authenticity_token%>',
'<%=request.session_options[:key]%>': '<%=request.session_options[:id]%>'
},
filters: [
{title: "Images", extensions: "avi,jpg,jpeg,png,zip"}
],
});
Adding up.start() in your FilesAdded bind should start the upload when a file is added. I've gone down the route of calling my uploader like so (I had problems doing it the way you are trying to call it):
$(function() {
// Setup html5 version
$("#html5_uploader").pluploadQueue({
// General settings
runtimes : 'html5',
url : 'upload.php',
max_file_size : '10mb',
chunk_size : '1mb',
unique_names : true,
dragdrop : true,
multiple_queues : false,
multi_selection : false,
max_file_count : 1,
// Specify what files to browse for
filters : [
{title : "Text files", extensions : "txt"}
],
init : {
FilesAdded: function(up, files) {
up.start();
},
UploadComplete: function(up, files) {
$.each(files, function(i, file) {
// Do stuff with the file. There will only be one file as it uploaded straight after adding!
});
}
}
});
});
"Make sure you bind it after the init since it binds default handlers."
So your code:
uploader.bind('FilesAdded', function(up, files) {...});
after your
uploader.init();
more information
For me it didn't work your version but did work :
FilesAdded: function(up, files) {
setTimeout(function () { up.start(); }, 100);
},
So set a timer after 100 ms to execute the start.
I am using the jquery ui version while testing and got this error :
g("#" + l.id).position() is null
/js/plupload/js/jquery.ui.plupload/jquery.ui.plupload.js
I was also wanting same for me and found below way to do it.
A new way to automatically start file uploading after adding file is just need to set true to autostart property like below
$("#uploader").plupload({
.....
autostart: true,
.....
});
Just trigger the Start Upload button by this way
FilesAdded: function(up, files) {
$('#fileupload_start').click();
},
This will upload the file without waiting for 100 ms.

CKEditor Plugin - OK Button Permission Error

Hi i have created the following ckeditor plugin to insert a youtube video:
(function() {
CKEDITOR.plugins.add('youtube', {
requires : ['iframedialog'],
init : function(editor) {
var iframeWindow = null;
CKEDITOR.dialog.add('youtube_dialog', function() {
return {
title : 'YouTube Movie Properties',
minWidth : 550,
minHeight : 200,
contents : [{
id : 'iframe',
label : 'Insert YouTube Movie',
expand : true,
elements : [{
type : 'iframe',
src : me.path + 'dialogs/youtube.html',
width : '100%',
height : '100%',
onContentLoad : function() {
iframeWindow = document.getElementById(this._.frameId).contentWindow;
}
}]
}],
onOk : function() {
this._.editor.insertHtml('<cke:youtube url="' + iframeWindow.document.getElementById('url').value + '">YouTube Video Place Marker</cke:youtube>');
}
};
});
editor.addCommand('youtube', new CKEDITOR.dialogCommand('youtube_dialog'));
editor.ui.addButton('YouTube', {
label : 'Insert YouTube Movie',
command : 'youtube',
icon : this.path + 'images/icon.gif'
});
}
});
})();
This was working fine but i recently moved my ckeditor files to a CDN. Now when i click the "OK" button i get a permission error. I was looking at the source of the existing plugins to get an idea of how they work but whatever i have tried doesn't seem to work. To get something basic working I tried changing my okOk event to:
onOk : function() {
var hr = new CKEDITOR.dom.element('hr', editor.document );
editor.insertElement(hr);
}
But this gave me a null reference exception.
I'd really appreciate it if someone could show me what i am doing wrong. Thanks
Problem fixed! The solution is to change:
CKEDITOR.dialog.add('youtube_dialog', function()
to:
CKEDITOR.dialog.add('youtube_dialog', function(editor)
and change:
this._.editor
to:
editor
Hope this helps.

Categories

Resources