How to stop Uploadify from displaying progress box - javascript

Just as the title says, I can't seem to get Uploadify to stop displaying the progress box during upload. Here is what I have:
$('#imageupload').uploadify({
'swf' : 'scripts/uploadify/uploadify.swf',
'uploader' : 'scripts/uploadify/uploadify.php',
// Put your options here
'buttonText' : 'Select Image',
'uploadLimit' : 999,
'overrideEvents' : ['onUploadProgress'],
'multi' : false,
'formData' : {'yourid' : '<?=#(int)$_SESSION['user']?>'},
'fileSizeLimit' : '2MB',
'fileTypeExts' : '*.gif; *.jpg; *.png; *.JPG; *jpeg',
'fileTypeDesc' : 'Image Files',
'onUploadStart' : function(file) {
$("#imageupload").uploadify("settings", "formData", {'yourid' : $(".userid").attr("id")});
$(".imageuploadbox #imagepercent").css("display", "inline");
},
'onUploadSuccess' : function(file) {
var currenttime = new Date();
$("img#yourprofilepic").attr("src", "images/artist_pictures/thumbs/artist_8.jpg?"+currenttime);
},
'onUploadProgress' : function(file, bytesUploaded, bytesTotal, totalBytesUploaded, totalBytesTotal) {
var percentcomp = (100*(totalBytesTotal/totalBytesUploaded)).toFixed(0);
$('.imageuploadbox #imagepercent #percentcomplete').html(percentcomp);
}
});

It's simple try this:
Remove link to uploadify css and then add this in your css:
.uploadifyQueue
{
display:none;
}

It seems like the names have changed, this one worked for me:
#upload_pc-queue{
display:none;
}

Related

ExtJS callParent on messageBox show method not working

On ExtJS 6.02, I have this code:
Ext.define('MyDialog', {
extend : 'Ext.window.MessageBox'
, title : 'My title'
, closable : false
, buttonText : {
ok : 'Yes'
, yes : 'Yep'
, no : 'No way'
, cancel : 'Cancel'
}
, show: function(cfg) {
cfg = {
icon: Ext.Msg.QUESTION
, msg : 'test'
, buttons : Ext.Msg.OKCANCEL
};
this.callParent(cfg);
}
});
The popup appears in blank, it seems that cfg is not being passed to the parent class method!
Fiddle: https://fiddle.sencha.com/#view/editor&fiddle/3deb
Figured it out.
The parameter of callParent must be an arrayLike type because internally ExtJS uses Function.prototype.apply().
So this works:
Ext.define('MyDialog', {
extend : 'Ext.window.MessageBox'
, title : 'My title'
, closable : false
, buttonText : {
ok : 'Yes'
, yes : 'Yep'
, no : 'No way'
, cancel : 'Cancel'
}
, show: function(cfg) {
cfg = {
icon: Ext.Msg.QUESTION
, msg : 'test'
, buttons : Ext.Msg.OKCANCEL
};
this.callParent([cfg]);
}
});

The listener and callback in Ext

I'm new in Ext, I see some codes in Ext.onReady(...)
tabItems.push({
id : 'schema-${form.schema.id}',
title : '${form.description}',
tabTip : '${form.description}',
tooltipType: 'title',
xtype : 'ttpanel',
executeScripts : true,
listeners : { load : initObjs, unload : unloadObjs, activate : ... },
autoLoad : { url : 'selection.do',
params : ...,
scripts : true,
callback : cb1
}
}
);
My question is, of:
"load:initObjs",
"callback:cb1",
page is rendered and user can operate it,
which of these three runs first? Why?
Thanks a million!

How to turn this static init into a dynamic one

I have this fancybox plugin wich is great, but I don't think there is enough examples on the documentation
$(document).ready(function(){
$('nav.main a#gallery').live('click',function() {
$.fancybox([
{href : 'img/galeria/fondo1.jpg', title : 'Title1','nextEffect' : 'fade', 'prevEffect' : 'fade'},
{href : 'img/galeria/fondo2.jpg', title : 'Title2','nextEffect' : 'fade', 'prevEffect' : 'fade'},
{href : 'img/galeria/fondo3.jpg', title : 'Title3','nextEffect' : 'fade', 'prevEffect' : 'fade'},
{href : 'img/galeria/fondo4.jpg', title : 'Title4','nextEffect' : 'fade', 'prevEffect' : 'fade'}
]);
});
});
Well as you can see this loads a few images in the fancybox.
I would like to be able to do it by passing a javascript object to it so I don't need to know which, or how many images there are (in the init) and manage that updating the object, but I just don't see how to do this.
Can anyone help.
Have you tried to pass a valid json object?
function getGaleriaObject()
{
// do your database / what ever stuff here
var obj = [
{href : 'img/galeria/fondo1.jpg', title : 'Title1','nextEffect' : 'fade', 'prevEffect' : 'fade'},
{href : 'img/galeria/fondo2.jpg', title : 'Title2','nextEffect' : 'fade', 'prevEffect' : 'fade'},
{href : 'img/galeria/fondo3.jpg', title : 'Title3','nextEffect' : 'fade', 'prevEffect' : 'fade'},
{href : 'img/galeria/fondo4.jpg', title : 'Title4','nextEffect' : 'fade', 'prevEffect' : 'fade'}
];
return obj;
}
$(document).ready(function(){
$('nav.main a#gallery').live('click',function() {
var obj = getGaleriaObject();
$.fancybox(obj);
});
});
Examle: JsFiddle

swfupload ie9 error

I'm using swfupload into fancybox window. i m coding php.
my code:
var upload1, upload2;
upload1 = new SWFUpload({
// Backend Settings
upload_url: "_upload.php",
post_params: {
"PHPSESSID" : "<?php echo session_id(); ?>",
"sayfa":"YeniYazi",
"nereye":"Downloads"
},
// File Upload Settings
file_size_limit : "102400", // 100MB
file_types : "*.*",
file_types_description : "All Files",
file_upload_limit : "102400",
file_queue_limit : "0",
// Event Handler Settings (all my handlers are in the Handler.js file)
file_dialog_start_handler : fileDialogStart,
file_queued_handler : fileQueued,
file_queue_error_handler : fileQueueError,
file_dialog_complete_handler : fileDialogComplete,
upload_start_handler : uploadStart,
upload_progress_handler : uploadProgress,
upload_error_handler : uploadError,
upload_success_handler : uploadSuccess,
upload_complete_handler : uploadComplete,
// Button Settings
button_image_url : "images/XPButtonUploadText_61x22.png",
button_placeholder_id : "spanButtonPlaceholder1",
button_width: 61,
button_height: 22,
// Flash Settings
**flash_url : "swfupload/swfupload.swf",**
custom_settings : {
progressTarget : "fsUploadProgress1",
cancelButtonId : "btnCancel1"
},
// Debug Settings
debug: false
});
my problem is with swfupload. it's run ie 8, when i upgrade ie8 to ie9 starting this problem.
when i remove flash_url : "swfupload/swfupload.swf", code, works for me.
i can't upload image sorry.
help me.

How I can add multi TinyMCE editors with different config for each one?

I want to add multi TinyMCE editors and each one has its own configuration in one page?
How I can do it?
You could do something like this:
jQuery version:
$('textarea.editor1').tinymce(
{
script_url : '../admin/tiny_mce/tiny_mce.js',
theme : "simple",
plugins : "", // put plugins here
setup : function(ed)
{
ed.onInit.add(function(ed)
{
});
}
});
$('textarea.editor2').tinymce(
{
script_url : '../admin/tiny_mce/tiny_mce.js',
theme : "simple",
plugins : "", // put plugins here
setup : function(ed)
{
ed.onInit.add(function(ed)
{
});
}
});
Non-jQuery version:
tinyMCE.init(
{
mode : "textareas",
theme : "simple",
editor_selector : "editor1"
});
tinyMCE.init(
{
mode : "textareas",
theme : "simple",
editor_selector : "editor2"
});
This is easy to achieve. I use the jQuery lib to save code, but it is easy to create this code without jQuery. Supposed you have html elements (i.e. textareas) with ids "my_id1" and "my_id1", that you wish to get a tinymce for all you need to do is:
var config_tinymce_1 = {
plugins :"save",
theme_advanced_buttons1 : "bold,italic,underline,save",
theme_advanced_buttons2 : "",
...
};
var config_tinymce_2 = {
plugins :"save",
theme_advanced_buttons1 : "save",
theme_advanced_buttons2 : "",
...
};
$(document).ready(function(){
init_obj_1 = {element_id:'my_id1', window: window};
$.extend(true, init_obj_1, config_tinymce_1);
tinyMCE.execCommand('mceAddFrameControl',false, init_obj_1);
init_obj_2 = {element_id:'my_id2', window: window};
$.extend(true, init_obj_2, config_tinymce_2);
tinyMCE.execCommand('mceAddFrameControl',false, init_obj_2);
});

Categories