[Text On Canvas]

Ok, I have an idea, I will use a DIV. I will set it to contenteditable = true. Then I will write my text in it using document.execcomand. After that, I will drag and drop the text written to place it on the Canvas.

 

I think its a good idea. I want to know now, how to drag and drop only the content in a DIV? Not the entire DIV but only the content like the text for instance. I know how how to make the drag and drop using JQuery UI, but not something in a container.

[Text On Canvas]

Hi, I have an IFrame. Good. And I have a Canvas as well. Good again!

 

The user can write on the IFrame as I set the design mode ON. I am using document.execcomand to do the stuff, just like a simple text editor. I do not have issues on this. Here are my questions:

 

1/ What I want is, how to make the text written in the IFrame, appears on the Canvas? I mean, when the user is typing in the IFrame, the text is appearing simultaneously on the Canvas. If the user changes the text color, font color, bold, italic or whatever, of course the text also changes on the Canvas simultaneously. How to do that?

 

2/ Can I make all the elements draggable and resizable in the Canvas? I mean the text or anything but NOT the canvas?

 

 

Help!

[Write On A Div Or Canvas]

Well, I am planning to make something complex. Ok, I still have not done it but I want to know how to proceed to do it. Suppose there is a Canvas, and I am dragging and dropping images in it which can resize. The issue is not on the drag/drop and resize stuffs.

 

What I want is, once an image is in the Canvas, how to write on it by double click? I mean if I double click, the cursor turn to text and people can write. How to proceed to do this?

 

The canvas will be saved in image format later. All I want to know now, is this writing stuff, the rest I do not care too much now!

Thank

[File Upload Security And Others]

Hello people! I want to know some security features for file upload in PHP. I did read many stuffs, but not all have answered my questions.

 

To start, I am more on front-end than back-end, so I am not a professional in PHP, but I do know several things in PHP (Procedural). I did create a file upload system before, which was to upload image, including security and validation. Anyway, I am planning to create a similar system again but I want to know more on things which I have applied before. Here are my questions:

 

1/ When validating file formats, which is better, validating by MIME or regular expression? I used regular expression before, because I have read MIME can be changed, even that I am curious. Here is an example of regular expression which accepts only JPG and GIF files: /\.(gif|jpg)$/i

 

2/ Can we upload file like EXE without affecting the server? I do not want the EXE file to execute now on the server, or simply, if it is infected, it can ruin the server. Is there a solution to tackle this or it is not recommended? Because many file hosting let you upload EX, RAR, ZIP, script formats etc...

 

3/ What other security measures should I take into account on file upload? All uploaded files will be in a folder, and the user will get their links to download.

 

4/ This question is not on security but mostly on cron job. Normally, file uploaded will be stored in a folder but not forever on the sever. I want that each 3 days, each file which has been uploaded, is deleted from the folder. I am not saying all files have to be deleted simultaneously, but each file which is more than 3 days. For example, I upload one today, on Sunday it will be deleted. If I upload another one tomorrow, on Monday it will be deleted. For this, a person told me to store the timestamps in a database and the name of the file. How to proceed the deletion with cron job?

 

Thank!

[Jquery Plugin, Worth To Create?]

I agree partly with you...because many will modify the codes if they want additional functionality which the methods of the JQuery plugin do not provide. Recently, I made a rich text editor. I made it good, but it is just a script, where you will have to call the function in your website to work, and adding the HTML codes with CSS. It is not a JQuery plugin even it has been made in JQuery and raw Javascript. Now if you want to customize, simply modify it.All I did is to make it for you freely, with a default functionality. Here is a screenshot of it below:

[Jquery Plugin, Worth To Create?]

Ok, I think I have not written the subject correctly. I think instead of saying "plugin", I should say "script" only.

 

What I was saying is, instead of creating JQuery plugins etc..why not creating scripts, and then make people to use freely. If they find the script good and want to modify, they can do it freely. For example, a script in Javascript/JQuery, including CSS and HTML for a contact form with validations. To use the script, you just have to embed the CSS file and copy the HTML codes and to make it in action, just call the function of the script, that's all. Now, if you want to modify the default functionality, you can. You can add features/remove as well, customize designs etc...freely.

 

JQuery plugins are different. They provide methods so that people can add/remove features. JQuery plugins are good particularly for people who have poor programming knowledge. However, many JQuery pugis are lame, they provide methods which you may never use, or simply, lack of methods. Instead of doing this, why not creating free scripts, and let the people customize? It will be good!

 

Of course, I am not against plugins, but I think, scripts are good as well.

[Jquery Plugin, Worth To Create?]

Ok, this is not a question where I am having issues, but seeking an advise from you on JQuery plugin development. We have to agree, there are many JQuery plugins in different categories such as image gallery, form validations, effects and so on. I was about to create a basic JQuery plugin with methods. I am new in JQuery plugin development, but I do have my required tutorials to create one and I did make one before when learning.

 

The question is:

 

Is it worth to create a JQuery plugin with methods, or simply create an open source script plugin, where a user can modify freely and embed it in their websites?

 

In other words, I do not see a huge difference, by creating a JQuery plugin with methods, with an open source JQuery or Javascript plugin without methods where you can customize freely. For example, there is TinyMCE, a rich text editor, it is a plugin in pure Javascript and does not propose methods for people to modify. If you want to modify to add/remove features, simply do it by coding as it is open source. TinyMCE just propose you a default functionality.

 

However, the only advantage a JQuery plugin with methods will have is to let people who have poor knowledge on web to configure their plugin easily while an open source script plugin like TinyMCE for instance, you need to code by yourself if you want to ameliorate.

 

What do you think?

[Preview Source Code In Iframe]

I have made a simple rich text editor project but very good one. I will upload it later and make people to download and use. It is my first open source project.

 

I have already made everything but one thing I cannot do, I mean I don't know how to proceed to do it or begin to do it, is how to preview the source code that the user has typed in the editor?

 

I hope you know what I mean here... Just like any rich text editor, there is a button to preview in HTML codes what the user has written.. If you can, give me a beginning..I will try to manage.. Thank!

 

 

----------- Mergeed from double posted thread ------

Well, I have an iframe, I want to know how to preview the text in HTML when user writes in it?

 

 

You can see an example here,

 

http://freetextbox.com/demos/

 

Click on HTML at the end of the text editor below...

[Insertimage In Document.execcommand Not Appearing]

So I made a function to insert image through document.execcommand in Javascript..

function images() {
var img = prompt ("Enter the image link", "");
if (img != null) {
lol.document.execCommand("insertImage", false, img);
}
};

The image is not appearing, even on live server.. It shows the broken image icon. This code is supported by all browsers. The rest of my execcommand functions are working well.. I checked the code in Inspect element in Firefox and Chrome, they are displaying the image with the tags and link well, but still show the broken image icon.

[Text Align Not Working Javascriptpt]

thank its working

[Text Align Not Working Javascriptpt]

I want that when the user click on a button, the text align to the center.. This function of document.execCommand is supported to all browsers, but do not know if the syntax is correct. Here the function below:

 

function centeralign() {
lol.document.execCommand('formatDoc', false, 'justifycenter');
};

 

Not sure what is wrong... Other document.execcomand functions are working well, except this one...alignment...

[Jquery Check If Objects Are Hidden]

well i think it is working now..thank you if i get some issues, i will come back later...

[Jquery Check If Objects Are Hidden]

Thank you for responding, but it is executing two alert boxes after hiding. I want that when all images are hidden, then it executes the alert box, and of course only one time..

[Jquery Check If Objects Are Hidden]

I did this, I want it like this, but the alert box is not appearing..

 

http://jsfiddle.net/angelali2013/TAmNX/1/

[Jquery Check If Objects Are Hidden]

Hello, I have an issue. I have 10 images in a div. The images' names are in a second div. So, there are 10 images and 10 names.

 

When a user will click on an image, it will hide as well as its respective name. So, if the user clicks on the second image, it will hide as well as its name until everything is hidden.

 

Once the user has clicked all images, an alert box will appear. Refer to the code now for a single image:

 

$(document).ready (function() {
$("#image").click(function() {
$("#image, #name").hide("slow");
if ($("#image").is(":hidden")) {
alert("Ok");
};
});
});

 

As you see, when the user will click an image, it will hide as well as well the name.

This goes the same for all images. The alert box will be displayed once the image is hidden else not,

so I have to verify if the image is hidden. I could give them a single class instead of an ID,

but the user can click only on the image div. Bear in mind, the above example is just for one image only.

I have 10 images, but decided to include example for one in general to make you understand.

The image and the name are hiding, but the alert box is not displayed!

[Onkeyup With Iframe In Javascript]

I am planning to use a DIV lol, because textarea doesa not work with Javascript execcommand

[Onkeyup With Iframe In Javascript]

It will still affect man.. Moreover, I have been asked to place a textarea then produce the result in an IFrame. I will try this solution...

[Onkeyup With Iframe In Javascript]

I badly need help... I am making a basic text editor of my own. I have an Iframe where users can type their code in it.

 

Below the Iframe, there is a div which is hidden. This div normally will capture what is written in the IFrame, in other words, every HTML and CSS codes the user will type in the Iframe above, it will take action "onkeyup" in the div below.

 

Now the div below, as it is hidden, it will only be previewed if the user click on a button. As a result, this will pop up in a JQuery dialog box. In short, the div will be pop up through a dialog box of JQuery UI to show the user the result he/she is coding.

 

I know we can do this in textarea, it is just a matter of "value" but I am not getting it with Iframe. I made this:

 

function pcode () {
   	var frame = document.getElementById('code').value;
   	var div = document.getElementById('preview');
   	divout.innerHTML = frameout;	
   }

 

The above code, is just to grab the value written in the Iframe, then preview it in the div below on onkeyup. Now, the code to preview the div in a JQuery UI dialog box once the user clicks on a button:

 

function preview() {
   $('#preview').dialog({modal:true, height:600, width:1280, title:"Preview", show:"slow", hide:"fast"});
   }
   $('#previewbutton').click(function() {
   	preview();
   });

 

The problem is nothing is working. If you have not understood the issue, you can ask me some questions, I am myself stressed with this. Everything would be OK if it was a textarea as I did this before with textarea and was fine.

 

In the same line of thought, I have been advised to use IFrame when coding a text editor, because if I do this with a textarea, the user's code can have conflicts with my own CSS codes of the page. I want to know if there a possibility to use textarea alone instead of Iframe, in case there is no solution, but the user CSS and HTML codes must not have conflicts with my own CSS codes. For example, if I have declared a class or ID or made all Heading 1 blue for instance, and if the user is typing Heading 1 tag in a textarea, the CSS codes of mine will apply to the user as well, so I don't want this.

 

Thank!