Chrome-Extension: Running Content Editor on Client Side - javascript

I'm working on a very simple form filler with Chrome Extension to a spcific site.
I'm getting the name, subject and the message from the user, and just put it in the right places.
I've got a problem with the message part, because it uses an HTML editor. I want to be able to let the user create text message with href links using Microsoft Word or even Front Page and of course a content editor, and just copy the content the user made into the extension, and it will fill it in the right place on the site.
I tried using http://ckeditor.com/ but it can't work without a server. (Use the 1 Visual Studio create to test it).
Is there a content editor like ckeditor, that can work on client side too, and that I can use Javascript to get the info from the user?
I know this is a weird request, and even sound illogical, but is for a friend (and for learning).
(sorry for my english)

Afther some days for serching the web i found this: http://html5demos.com/contenteditable
it work only for html 5, and it amazing feature!
if any 1 have this wierd request too, this simple code with get your start:
<div contenteditable="true">this is a smaple</div>
this attribute is what make the megic happend: contenteditable="true"
in that div, you can throw any thing from out side your work space. meaning, you can do a href with WORD, and just copy it to the div, and it will set it up for you!
1 thing that is still wierd, if you dont have borders to the div, it will not set 1 for you like normal text field or textarea. so if u dont see it, it dosnt mean is not there!
enjoy.

Related

HTML / CSS / JS --> Syntax Error: Animated SignUp Form

I followed advice from this site on how to embed
the code that i found on how to recreate the
Animated Sign In Form … shown here:
https://youtu.be/5uANWpkuPww
I was hoping to modify it, so that one face of the
animated circle contained text inviting people to
subscribe to my mailing list … with the clickable
link causing the circle to rotate, allowing people
to then enter their name and email address.
In any case, I got the code from:
https://github.com/DaftCreation/Animated-Sign-In---Sign-Up-Form
and tried it out on w3schools.com
Here is the result:
https://www.w3schools.com/code/tryit.asp?filename=G15FD7XT1JF6
If anybody will be kind enough to get it to work,
please save it on w3schools.com … and post the link / URL
here on stackoverflow.com
I am guessing that the guy that created it, may have left out
a character or two, when he cut and pasted it, which has
resulting in the code not working correctly ... and be sure to
let me know what was wrong with it, so that i can learn from this.
Thanks : )
Your code is fine - the only real problem with is that you didn't wrap your jQuery in between <script></script> tags. Use the link below and you can see it working.
https://www.w3schools.com/code/tryit.asp?filename=G15LTVZCBB4R
Also you need to make sure your jQuery link is valid (just copy and paste the one from my code - it is via Google CDN).

Is it posiible to add html in clipboard data?

When you select some elements on the webpage by mouse and then paste it in new email (for example in gmail) you still see html elements. But when I add html code to clipboard from js I still see html code after pasting. Is there any way to add some html code from js and see generated elements after pasting?
That is not possible because of the way gmail handles this (the right way). Just imagine if you were able to send javascript tags to anyone with codes that would send cookie info back to you. This is called escaping html and google (and everyone else who does it does it right). Cheers

Is there a way to customise Kampyle, UserVoice, GetSatisfaction or OpinionLab to display the form inline (e.g: not Lightbox)?

The part of the website that I am working on is limited to HTML files only and my customer wants to add a "Was This Helpful - Yes / No " type of feedback message at the end of every help page.
I found a lot of third party scripts but they are all on the fixed either on the left hand side or on the right hand side of the page and the input field is made using Lightbox.
Is there a way to use these scripts and add the form inline something like a flash object or iframe embed code?
( Here I am talking about tools such us: webengage, Kampyle, UserVoice, GetSatisfaction or OpinionLab and so on ).
Kampyle can certainly do this and the feedback button can be easily customized to be a regular HTML link rather than the floating button image. You can get the standard (floating button) tag from the 'embed URL' page and then customize it like this:
Was This Helpful - <a href='https://www.kampyle.com/feedback_form/ff-feedback-form.php?site_code=<YOUR_ACCOUNT_ID>&form_id=<YOUR_FORM_ID>&lang=en' target='myFrame'>Yes</a>
You could even have links to two different forms – one for Yes and another for No. Each form could then be tailored to establish the reasons behind the different responses.
For a Kampyle account, you can either request a demo on the Kampyle site (http://www.kampyle.com/l/) or email your request to sales#kampyle.com.
Declaration: I work on the Support Helpdesk Team at Kampyle

Chrome extension for manipulating webpage by adding an icon next to matched links

Hello i want to write an extension myself and looking for guides/tutorials. I have never created one but i am good with js and html/php.
I need a tutorial/sample code, and here is what i want to do:
when an extension is loaded, i want to add icon next to the google search results (matched links). What it would do is, it will check all the link in a webpage by matching them with a database (php server mysql) and if a match of a domain is found, then it will simply add an icon next to that link (by ofcourse manipulating dom).
Seems like a fairly simple task to do. So if anybody can help me by showing me a correct path or if there is any similar extension already available to learn from, then please advice.
I would be very grateful, thanks!
http://developer.chrome.com/extensions/getstarted.html
Have a browse through this. You'll likely get the hand of it if you're proficient with JS.

Wordlike Input screen in website (docs.google or hotmail) javascript php

I believe the title already says it all, but here is my question:
what I want to know is how to realize a Office Wordlike "piece of paper" inputscreen.
I want to build a some kind of "newsletter renderer" which I want to show such an screen for the user.
only solution I could think of was an big <textarea> with some CSS styling.
(I already searched on the web but I still found nothing)
Excuse my writing, I'm not so great in English.
I have used the JavaScript-based "WYSIWYG editor" now. It 'works' , but for my own emailing backend (to come) I need to get the value out of there Iframe.
id of iframe is: #content_ifr .
in the iframe (what i've found) there is a < p > element where my/your submitted text is put in.
But if I put the following code in console, I get "an empty string" back:
console.debug($("#content_ifr").contents().find("p").contents().val());
or "undefined" :
console.debug($("#content_ifr").contents().find("p").contents().value);
what to do? :O
I will put latest version online asap: http://dominiquedebrabander.nl/nieuwsbrief
update:
console.debug(tinyMCE.get('content').startContent) is the way to get the content out of the iframe. (is it?) thanks (2 thirtydot ;))
I think i'm helped here, but I have 1 small question left (just because I am curious), how do they get the selected text? (to achieve underlines and bold on selected text).
"window.getSelection()" doesn't seem to work? or am I doing something wrong? :O
what I want to know is how to realize a Office Wordlike "piece of paper" inputscreen
It sounds like you're looking for a JavaScript-based "WYSIWYG editor".
Try TinyMCE, here's a relevant demo.

Categories

Resources