Insert script into head part of the website using Greasyspoon - javascript

I have a javascript that I want to inject into a website header part using Greasyspoon. This javascript will take care of the mobile display of the website.
Is it possible to do so?

It's surely possible. I have inserted a simple alert() function into specific website. I think it proved you can make it with greasyspoon.

Related

Summernote editor and script tags

I am building a web app which uses Summernote to allow for HTML editing.
Users are allowed to add and edit JavaScript as well, using inline <script> tags. This works fine and can be done in the editor's "Code View" mode.
What I'd like to do is, in the preview/WYSIWYG mode, instead of having the script being executed, just display an image (or text) to let the user know that there's a script there.
Something like:
I looked around and I don't think this has been done before. Is it possible? Any pointers on how I could accomplish this?
Thanks!
https://github.com/summernote/summernote/issues/495 explains how to do it using CSS only.

Inserting Text Into HTML

What I Want: Very simply I have a C program that generates a variable periodically, I want to be able to display this value on a website.
Restrictions: The webpage is HTML, php does not work, javascript does [I have tried a few javascript solutions but they have all been long, tedious and in the end ineffective] I want it to be able to format the text so that it matches the rest of the webpage. Above all I'd really like to find something simple that works.
Freedoms: I can output the variable from my C program to just about any file type and content that I want, the file is hosted so is available locally to the server or online for the client.
Preferred Solutions: I am currently playing around with the object and iframe tags native to html. They give a nice simple input:
<object height=20 width=75 type='text/plain' border=0 data="URL/filename.txt"></object>
inserts the contents of my file, but it can't be formatted so I am stuck with 12pt Courier font which is not acceptable. Using
<iframe seamless height=20 width=75 scrolling='no' src="URL/filename.htm"></iframe>
and adding my desired font/colour/size etc to the htm file gets me the right text style, but htm has a large amount of white padding around it which I can't seem to get rid of so I have to make my iframe quite large for the text to be displayed, but then it doesn't fit smoothly with other text.
So anyone that can answer one of four questions:
How to remove excess padding from htm
How to format the style of a html object
Is there anything in Java as simple as the php [so apparently it doesn't show php code even when you quote it as code. But basically using echo and get_file_contents to insert the contents of a txt file into a html page]
Propose an alternate solution
Padding and style can be handled by css.
By java I assume you mean javascript - google-ing will help you. Without details of what your server is running and what is dispatching your pages we can't give you an exact answer. You might want something with ajax to keep it updating in the background.
Try googling your question, you'd be surprised how often this helps.
I'm not sure what you're trying to do once you get the variable into your web page, but I think something like the following could be useful.
Create a hidden div on your page
Have your C application write the variable to some file
Use jquery to execute an ajax call to pull that value into the div ( or whatever other container you want to use
using some type of timer, execute the ajax call every X period of time, which will then get your up to date variable
on your main page, have another timer that will then come in to that container, grab your value and then you are free to do what you want with it.
This is all off the top of my head without knowing much about what you're trying to accomplish. If you provide some further details we may be able to help you a little more.
You need AJAX... that's just a fancy buzz-word. It means you can tell JavaScript can get a file from the server without reloading the page and you can insert data from that file into your HTML.
AJAX is made much simpler by using a JavaScript library like jQuery, but it can be done without jQuery. There's a pretty decent Getting Started tutorial at Mozilla Developer Network if you want to do it the hard way, but I really recommend jQuery.
As far as formatting... any formatting... you need to use CSS. Just about everything about the appearance of anything on a web page is controlled by CSS. MDN has a Learn CSS section, too.
load jquery on you main html file
put a div with some id (example id="newvalue")
make you c program to write the output in a file (for example value.html)
on main html page header, after jquery include code add some javascript like
$( document ).ready(function() {
$("#newvalue").load('yoursiteurl/value.html');
});

OpenWebkitSharp for .NET -- any trick for getting Javascript to work with it in this scenario?

I am using the OpenWebkitSharp browser in a VB.NET project. What I am trying to do is use WebkitBrowser1.Navigate to display some HTML in the browser "on the fly". This works great for basic HTML, but Javascript does not appear to work at all in this scenario. For example, I have...
WebKitBrowser1.DocumentText = "<!DOCTYPE html><html><head><script>alert('This is an alert'); </script></head><body><p>This is some text</p></body></html>"
The body text appears just fine, but there is never a Javascript alert. I made sure that Javascript is enabled in the Webkit browser, so that's not the issue.
If I use the Navigate method to display a local page that contains Javascript (ie WebkitBrowser1.Navigate("path/to/local/file"), then the Javascript works perfectly. But it doesn't work at all when setting the HTML using WebKitBrowser1.DocumentText.
For this particular project, I need to generate the HTML code and display it "on the fly", so I can't use WebKitBrowser1.Navigate. I have to use WebkitBrowser1.DocumentText instead (or something similar).
Any ideas?
Or might there be a better way to accomplish this?
Thanks!
I ran into a similar situation recently, and while I'm still looking for that solution that allows what you're describing, here's what I decided to do as a workaround:
-Save HTML to temporary file
-Load temp file into WebKit control on form.
I'm considering making my own modifications to OpenWebKitSharp however, to see if I can make this happen. Basically, it seems like HTML loaded through DocumentText follows a different render path than loaded through Navigate.

How does one properly test a javascript widget?

So, I've written a little javascript widget. All a user has to do is paste a script tag into the page, and right below it I insert a div with all of the content the user has requested.
Many sites do similar things, such as Twitter, Delicious and even StackOverflow.
What I'm curious about is how to test this widget to make sure that it will work properly on everyone's webpage. I'm not using an iframe, so I really want to make sure that this code will work when inserted most places. I know it looks the same in all browsers.
Suggestions? Or should I just build one hundred web pages and insert my script tag and see if it works? I would hope there is an easier way than that.
Once you have confirmed that your javascript works cross-browser in a controlled environment, here are some things that might cause problems when used on an actual website:
CSS
You're using a CSS class that is already being used (for a different purpose) by the target website
You're using positioning that might interfere with the site's CSS
The elements you are using are being styled by the website's CSS (you might want to use some sort of "reset" CSS that applies only to your widget)
HTML
You're creating elements with the same id attribute as an element that already exists on the website
You're specifying a name attribute that is already being used (while name can be used for multiple elements, you may not be expecting that)
Javascript
What is the expected behaviour without Javascript enabled? If your script creates everything, is it acceptable for nothing to be present without JS?
At very basic you should make sure your widget works for following test-cases. I am sure then it will work on all web-pages -
http/https: There should not be any warning for HTTPS pages for unencrypted content.
<script> / <no-script>: What if JavaScript is disabled? Is your widget still visible?
What happens when third-party cookies are disabled? Does your widget still work?
Layout-box restrictions: When parent div element's size is less than your widget. Does your widget overflow the given size and destroys owners page?
By keeping all your Javascripts under a namespace (global object) with a very unique name, you should be pretty much OK. Also, you can simply use an anonymous function if you just want to print out something.
Similar question: How to avoid name clashes in JavaScript widgets

Decoupling HTML from JavaScript in bookmarklet

(Can't think of a good title :(( )
Hey all,
I'm developing a bookmarklet. When clicked on it creates a toolbar on the page the user is looking at. The above involves pulling various javascript and css files from my server and injecting them into the pages DOM.
I don't want to encode toolbar's HTML as a string inside one of my javascripts. So I've tried using hidden iframes to load my toolbar and then grabbing a fragment of html to insert, but immediately ran into cross-domain issues.
One solution spring to mind is sending my toolbar's html in JSON, but that seems a bit "hacky"?
What would be a good solution to the problem avoiding difficult-to-maintain html strings in javascript?
Thanks.
Don't know if it will help, here are 2 examples of toolbar bookmarklets:
diigolet : www.diigo.com/tools/diigolet
fytch it : fytch.com/about/get-started

Categories

Resources