Twitter auto shorten URL not working - javascript

I am trying to add custom tweet button to my website and all is well but it is not shortening the URL. I am using URL query string instead of javascript. Is that the case?
<a class="btn btn-tweet" target="_blank" href="https://twitter.com/share?text='.$title.'&url='.$url.'&via='.$user.'&wrap_links=true">Twitter</a>
I have read some API document and saying above 19 characters twitter shorten url itself. Just wonder why it is not converting with this.
I am also having trouble to open in popup instead of new window. Does this all possible without adding any separate javascript code but directly inline in anchor tag?

I was hung up on this and realized I was trying to shorten "http://localhost:5000/blog/url" which t.co is unable to do.
Change to a real, non-localhost URL and it worked fine.

It won't be visibly shortened in the compose window, but the compose window does detect URLs and adjusts the character count accordingly. Try pasting a huge long URL - it'll only use up 22 characters in the count.
Do note that Twitter shortens all URLs, even when "shortening" actually makes them longer. For example, "http://bit.ly" will use up 22 characters (not 19), not 13.

Related

Get the text fragment part of current URL from window.location

I wanted to have a custom layout for anyone visitsing my website with text fragment link.
eg. https://en.wikipedia.org/w/index.php?title=Cat&oldid=916388819#:~:text=Claws-,Like%20almost,the%20Felidae%2C,-cats
Here the part after :~: will be the text fragment. I wanted to get that part.
I have tried window.location.href and window.location.hash. But
window.location.href returns just the url without text fragment while window.location.hash returns an empty string.
To replicate this visit this https://en.wikipedia.org/w/index.php?title=Cat&oldid=916388819#:~:text=Claws-,Like%20almost,the%20Felidae%2C,-cats by copying and pasting it to new tab, and try getting the text fragment from window.location (markdown link seems to have problem with text fragment).
So is there any other way to get the text fragment part in address bar ?
You can get the text fragment via performance.getEntriesByType("navigation")[0].name (you can run a regular expression to get the actual value, like performance.getEntriesByType("navigation")[0].name.split('#:~:text=')[1] [but you probably want to make this more forgiving and error-resistent]).
It's currently different based on browser.
Firefox
window.location.href and window.location.hash work as they have worked since the dawn of Javascript and behave exactly as you would expect.
Chrome
Recent
changes have modified fragment behavior. Chrome will now remove parts of the URL if :~: appears in the URL. 😱
As #DenverCoder9 pointed out, the only guaranteed way to get the whole URL, what should be a simple task, is now only accomplishable in Chrome via the performance API, performance.getEntriesByType("navigation")[0].name. This task that used to be accomplishable via window.location.href, window.location.hash, and document.URL is no longer possible without this gotcha.
We hope Chrome's new behavior, requiring performance.getEntriesByType("navigation")[0].name compared to window.location.href, is reverted back. This new behavior of "removing parts of the URL" is unprecedented and we consider it harmful.
Worse, if using protocol file://, there is no way to get the URL as performance will not report the URL. 😱
Related, see issues:
https://github.com/WICG/scroll-to-text-fragment/issues/193
https://github.com/WICG/scroll-to-text-fragment/issues/74#issuecomment-1215767738
Keywords: "text fragments", "fragment directives"

Encoding URL vars in HREF versus onclick using JS window.location

I don't know why this link does not work, but I have a Javascript redirect (window.opener.location) that I am passing a number of variables through the URL and am having issues when those variables contain apostrophes. I am using URLENCODE() in PHP to build the link, which looks like it is doing what I need when I dump the source, but Safari and Chrome both throw "Unexpected identifier at 'www'" errors when I click the link.
This seems to tell me that the JS link is still being treated as if it has an apostrophe instead of the %27 equivalent of an apostrophe? I am using a dummy name "qqq'www qqq'www" with apostrophes in first and last name for my testing to break as much stuff as possible.
Here is the link I am having trouble with:
<em>Yes</em>
But if I change the link to use onclick instead of the HREF, it works? I realize this is the better coding method than href='javascript:...' too.
<em>Yes</em>
Everything is identical except where I make the JS call. Is this possibly due to the way the HREF and onclick are handled on encoding/decoding? Maybe the HREF is un-encoding the apostrophes prior to making the link call because the JS is embedded in the HREF call?
Any insight into this behavior would be appreciated so I can better understand what is really going on here. Yes it works, but not knowing why makes me feel like a worse developer...
Thanks!
Your links do not have a > to end the starting <a - and yes, do not use href="javascript:
Also if you need to encode, use encodeURIComponent and lastly do not try to close the window before changing the opener.
But why not name the opener and user a target and a setTimeout?
<a target="nameOfOpener"
href="../cust/maint_cust.php?action=del_are_you_sure&cust_id=249735&lname=Qqq%27www&fname=Qqq%27www"
onclick="setTimeout(function() {top.close()},100)"><em>Yes</em></a>
Browsers give a special treatment to href attributes starting with 'javascript:'. Any %xy encoding, as in your case the %27, will be decoded first before executing the Javascript code. I checked this for current versions of Firefox and Chrome. I would be curious to find a documentation of this feature.
The short answer is: Do not use 'javascript:' in a href, if your Javascript code contains %xy encodings.
In case you really have to use 'javacript:' in a href, put your URL into a javascript variable and then reference that variable in your href's Javascript code.
<script>
myURLwithEncodings = "../cust/maint_cust.php?action=del_are_you_sure&cust_id=249735&lname=Qqq%27www&fname=Qqq%27www";
</script>
<em>Yes</em>

GreaseMonkey: Redirect immediately to special web page

I know my way around in different programming languages, but I'm actually new to javascript and GreaseMonkey. After some searching (here and on the net), I could not find an answer to the following problem:
I want to have a local javascript that works on Zeit Online and forwards me automatically to the complete article view (that is not divided into several subpages).
Example:
When I call
www.zeit.de/wirtschaft/2015-02/griechenland-euro-schaeuble-varoufakis
I want to be redirected immediately to
www.zeit.de/wirtschaft/2015-02/griechenland-euro-schaeuble-varoufakis/komplettansicht
(note the /komplettansicht at the end).
Exemption:
On www.zeit.de/index I want to change nothing. One could say that extending the URL requires that the webpage URL consists of www.zeit.de and a subdirectory.
How do I do that in javascript/GreaseMonkey?
update:
var regex = /^(https?:\/\/.+\.zeit\.de\/.+\/.+)$/i;
and
.replace(regex, "$1/komplettansicht");
should surface in the code. But how do I replace the URL and call it?
Try this in the javascript console first:
window.location = window.location.href + "/komplettansicht";
maybe need to wrap this line of code in an if statement that checks that you aren't on the homepage of zeit.de any longer, and that the page does not end with "komplettansicht" (it would redirect forever to komplettansicht/komplettansicht/komplettansicht...)
But then a dialog box with a warning may open asking if you really want to leave the page. Not sure about that.
If it doesn't work, replace window. with unsafeWindow. (Greasemonkey wraps the raw window object with a new object of this name)

Twitter API Basic Timeline Operations

I have a website where I am using the Twitter API to get my three latest tweets. No problem there. However, if I post a retweet, when the call is made for the latest tweets, it shows the beginning "RT #DennisDMZ" and the retweets, but the return is truncated to 140 chars including the RT #DennisDMZ string.
Also, if there are links, the anchor tags are not created and the crypted url just shows as regular text. I set the parameter include_entities=1 in the API call, and it returns the url information, but it does not automatically add the anchor tags. It even shows the position of the link, so technically you could build the link dynamically but that would be difficult.
Is there a way to get around either of these problems?
I think they make it more difficult...I was able to look at the return object on Firebug with a console.log and see what is returned. The full text is under the 'reseller_status' property and the url under the 'entities' property, The url is given and the character positions as well, so I wrote an insert function to insert the anchor tags at the appropriate positions.

How to use page-mod to modify element loaded by JavaScript

I'm creating firefox addon to add onclick event to the specific button. ("input" element)
The button is placed in http://example.com/welcome#_pg=compose
but when I open the page, following error occures:
TypeError: document.querySelector("#send_top") is null
#send_top is id of the button which I want to modify. So, the button is not found.
This error occurs because http://example.com/welcome and http://example.com/welcome#_pg=compose is completely different pages.
In this case, the addon seems loading http://example.com/welcome but there is no button whose '#send_top' ID.
When #_pg=compose anchor is added, the button is loaded by JavaScript.
How can I load http://example.com/welcome#_pg=compose to modify the button?
Three thoughts to help you debug this:
to correctly match the url you should consider using a regular expression instead of the page-match syntax - this might allow you to react to the anchors in a more predictable way
I've found that when using content scripts with pages that are heavily modified by JS, you can run into timing issues. A hacky workaround might be to look for the element you want and, if it isn' there, do a setTimeout for a 100 milliseconds or so and then re-check. Ugly, yes, but it worked for some example code I used with the new twitter UI, for example.
You can use the unsafeWindow variable in your content script to directly access the page's window object - this object will contain any changes JS has made to the page and is not proxied. You should use unsafeWindow with great caution however as its use represent a possible security problem. In particular, you should never trust any data coming from unsafeWindow, ever.

Categories

Resources