• Hey, guest user. Hope you're enjoying NeoGAF! Have you considered registering for an account? Come join us and add your take to the daily discourse.

Google Chrome |OT|

ThatObviousUser

ὁ αἴσχιστος παῖς εἶ
Apparently Instant Pages has been axed:

"Starting in Chrome 16, the version of URL preloading that you're referring to as Instant Pages won't be part of the Chrome Instant feature anymore. We haven't yet announced this publicly, but as you've noticed, the text on the feature checkbox has changed. We'll be making changes to this Help Center article in the upcoming weeks as well: http://www.google.com/support/chrome/bin/answer.py?answer=177873."
 
Apparently Instant Pages has been axed:

"Starting in Chrome 16, the version of URL preloading that you're referring to as Instant Pages won't be part of the Chrome Instant feature anymore. We haven't yet announced this publicly, but as you've noticed, the text on the feature checkbox has changed. We'll be making changes to this Help Center article in the upcoming weeks as well: http://www.google.com/support/chrome/bin/answer.py?answer=177873."

Wow that sucks. I reinstalled Chrome today and it worked for a little bit, but now it doesn't. That really was one of my favorite parts of Chrome.
 

ScOULaris

Member
The Google Chat extension now works across all platforms (it used to be just Chromebooks). It uses the same "panels" functionality that it uses on Chromebooks, so your chat persists across all tabs. Just thought I'd share the good news. :)
 

SimleuqiR

Member
The Google Chat extension now works across all platforms (it used to be just Chromebooks). It uses the same "panels" functionality that it uses on Chromebooks, so your chat persists across all tabs. Just thought I'd share the good news. :)

Can't wait for the day that G+ Messenger and Gtalk merge. Hopefully soon.

Edit:

Dual monitor support doesn't seem to be available. Can't move it to my second monitor.
 

BlueMagic

Member
Andrex, throw me a rope here. I'm trying my hand at doing an extension for a vBulletin forum. I'm trying to get it to show more posts per page (since the max limit for that forum is 15 ppp and we all know that sucks). I guess I'll be using a content script. Up to here I had no problems; I created my extension and tested it a couple of times with alert() and whatnot to test that it injects the code in the sites that I want.

However, I need help on the difficult part: How do I get it to show more posts per page? I made a couple of breakpoints in the vbulletin scripts (via developer tools of chrome) to see if I could get a clue, but so far I have advanced very little.

Any hints?
 
So I installed the Growl extension for Chrome, but all my notifications are still using the built-in Chrome notifications. Any idea how I can fix this?
 

ThatObviousUser

ὁ αἴσχιστος παῖς εἶ
Andrex, throw me a rope here. I'm trying my hand at doing an extension for a vBulletin forum. I'm trying to get it to show more posts per page (since the max limit for that forum is 15 ppp and we all know that sucks). I guess I'll be using a content script. Up to here I had no problems; I created my extension and tested it a couple of times with alert() and whatnot to test that it injects the code in the sites that I want.

However, I need help on the difficult part: How do I get it to show more posts per page? I made a couple of breakpoints in the vbulletin scripts (via developer tools of chrome) to see if I could get a clue, but so far I have advanced very little.

Any hints?

Hrm without seriously digging into it anything I say would be very hacky at best.

That said, assuming jQuery, I would imagine you could do something using $.get() for the next page, parsing it, injecting it after the current page's posts, and then messing with the page links so they don't look weird.

Actually parsing it would of course be the hard part but using jQuery it wouldn't be too hard. Assuming the forum you're looking to do this for hews closely to the default vB skin, it would probably be like...

Code:
$(document).ready(function() {
	$.get('&page=2', function (data) {
		var posts = [], i;

		posts = $('.page', $(data));
		for (i = 0; i < posts.length; posts = posts + 1) {
			$('#posts').append(posts[i]);
		}
	});
});

No warranty or guarantee included! Also the URL is just a dummy, although there is a possibility it might work. Batteries, um, code for smoothing over the next/previous/page count URLs is not included.

Phew, it was quite the brain tease coming up with that. Hope this helps.

Edit- Hrm .page wouldn't work since there are also two other containers that use it, a more in depth selector for whole posts would be needed. Unless you made it so the for loop skips the first and last elements of posts[].
 

BlueMagic

Member
Hrm without seriously digging into it anything I say would be very hacky at best.

That said, assuming jQuery, I would imagine you could do something using $.get() for the next page, parsing it, injecting it after the current page's posts, and then messing with the page links so they don't look weird.

Actually parsing it would of course be the hard part but using jQuery it wouldn't be too hard. Assuming the forum you're looking to do this for hews closely to the default vB skin, it would probably be like...

Code:
$(document).ready(function() {
	$.get('&page=2', function (data) {
		var posts = [], i;

		posts = $('.page', $(data));
		for (i = 0; i < posts.length; posts = posts + 1) {
			$('#posts').append(posts[i]);
		}
	});
});

No warranty or guarantee included! Also the URL is just a dummy, although there is a possibility it might work. Batteries, um, code for smoothing over the next/previous/page count URLs is not included.

Phew, it was quite the brain tease coming up with that. Hope this helps.

Edit- Hrm .page wouldn't work since there are also two other containers that use it, a more in depth selector for whole posts would be needed. Unless you made it so the for loop skips the first and last elements of posts[].

This is extremely helpful for starting.
However when investigating what you did there (I understood only half of it), I tried this:

Code:
$(document).ready(function() {
       alert('test');
});

But that doesn't work. Am I doing something wrong? If I understood correctly, that should do the alert when the DOM is fully loaded, but it does nothing. As you can see, I am not familiar with javascript or jquery. However I understood the logic. Once again, I really appreciate the help.
 

ThatObviousUser

ὁ αἴσχιστος παῖς εἶ
So in order to work with jQuery you have to include it with the extension, it basically makes the $ sign into some awesome voodoo. That means firstly you'll have to download it (or add a line in the main script that creates a script element yada yada, but that's too complicated for something like this.)

Second is including it in your manifest.json so Chrome knows to look for it:

Code:
{
	"name": "Extension",
	"version": "1.0",
	"description": "This is an extension",
	"icons": { "48": "48.png", "128": "128.png" },
	"content_scripts": [
		{
			"matches": ["http://thesite.com*"],
			"js": ["jquery.js", "extension.js"]
		}
	]
}

Where the downloaded jQuery is named jquery.js and your main script to inject is extension.js.
 

Zeppu

Member
BlueMagic, in addition to the valid and correct suggestions Andrex is giving you, I suggest you start working through the developer tools, instead of creating/reloading the extension every time.

Open up the developer tools (CTRL+SHIFT+I) and there's a button on the bottom left 'Show Console'. That pops up and you can start coding js directly in the context of the current open page.

I suggest you first paste all of the jquery code in there, and then start messing around with it.

$(document).ready() will not work, since that's an onLoad event, but everything else will, and you get to examine all variables and stuff in the excellent dev tools. So try the following:

Code:
var data;
Code:
function callback(x) { 
   data = x; 
}
Code:
$.get(document.location.href+'&page=2', callback);

That, if done correctly should get you the HTML of the second page of a thread and store it in data. Once it's done, type 'data' in the console and you can see everything there. Mess around in the console some more, and when you've got a piece of functionality down, just copy/paste it to the extension (you can press 'up' to see previous statements you've written in the console).

Just a tip, feel free to ignore me :D
 

BlueMagic

Member
OK, so I 'installed' jquery and got the parsing done, kind of. Here's what a normal URL of the forum looks like:
http://foros.3dgames.com.ar/consolas.77/695195.mario-party-9-wii.8.html?t=695195&page=8
(Don't worry, safe for work. The name of the forum sucks, I know)

I realized that by changing the number before the ".html" part leads me to the page that I want, regardless of the '&page=x' at the end (so I'm guessing it's not as default as I would've wanted and that's why your code wouldn't work, Andrex). That also leads me to think that the forum is sort of badly set up? Because of the redundancy, I mean.

What I need to know in order to advance now is what $() is supposed to do, so I can 'customize' what Andrex showed me. Since google sucks at looking up stuff like that (and I don't know what I'm actually searching for other than "$()"), I couldn't really find anything useful. Specifically, this part:" posts = $('.page', $(data));"

Also, Zeppu, thanks for the tip, it helped me get the parsing done.

EDIT: By using the console I'm starting to understand what $ is in a purely practical way (gets elements with that name?), and I actually got to append a post in the end of the page. This is amazing, thank you very much guys.
 

Zeppu

Member
What do mean with your $() query?

If you are referring to the $(document) portion then this is the link for you: http://api.jquery.com/ready/

If you mean the general usage of $() you will need to have a look at the documentation. In general you can put css selectors (and more!) within $() to select specific parts of the page.

So $(".page") will look for all html elements within the current page which have class="page", $("#magic") will select id="magic", etc. You can also wrap any object with $() to be able to perform jquery commands on them. Again, I suggest you try out selectors in the console first because to get something specific sometimes it can be a pain in the ass. It's pretty powerful though, for example I use this in my extension to find quoted posts.

Code:
$('div[id^="post_message"] > div > div:contains(BlueMagic)')

Or did I miss your point completely?

Edit: Saw your edit, this is what you're looking for then: http://api.jquery.com/category/selectors/

I've become pretty good at these damn selectors, so let me know if you need any help with anything particular.
 

Baconbitz

Banned
Ok. I need a "no scripts" alternative for chrome. Whats the best? I've found the ones I've looked up are a little over complicated.
 

BlueMagic

Member
What do mean with your $() query?

If you are referring to the $(document) portion then this is the link for you: http://api.jquery.com/ready/

If you mean the general usage of $() you will need to have a look at the documentation. In general you can put css selectors (and more!) within $() to select specific parts of the page.

So $(".page") will look for all html elements within the current page which have class="page", $("#magic") will select id="magic", etc. You can also wrap any object with $() to be able to perform jquery commands on them. Again, I suggest you try out selectors in the console first because to get something specific sometimes it can be a pain in the ass. It's pretty powerful though, for example I use this in my extension to find quoted posts.

Code:
$('div[id^="post_message"] > div > div:contains(BlueMagic)')

Or did I miss your point completely?

Edit: Saw your edit, this is what you're looking for then: http://api.jquery.com/category/selectors/

I've become pretty good at these damn selectors, so let me know if you need any help with anything particular.

Thanks, I understand now. When testing this, however, I found another problem. In the console, if I type something like "$.get(document.location.href)" and immeadiatly expand the XMLHttpRequest, I either get this in status:
Code:
abort: function (){x&&h.call(x);
onabort: null
onerror: null
onload: null
onloadend: null
onloadstart: null
onprogress: null
onreadystatechange: function (q){if(!x||x.readyState===0||q==="abort"){E||
readyState: 1
response: ""
responseText: ""
responseType: ""
responseXML: null
status: [Exception: DOMException]
statusText: [Exception: DOMException]
upload: XMLHttpRequestUpload
withCredentials: false
__proto__: XMLHttpRequest
or this:
Code:
XMLHttpRequest
abort: function (){x&&h.call(x);
onabort: null
onerror: null
onload: null
onloadend: null
onloadstart: null
onprogress: null
onreadystatechange: function (){}
readyState: 4
response: ""
responseText: ""
responseType: ""
responseXML: null
status: 0
statusText: ""
upload: XMLHttpRequestUpload
withCredentials: false
__proto__: XMLHttpRequest


Or the proper response, depending on how much time I wait until I expand the XMLHttpRequest. I don't know if I'm explaining myself correctly or if this makes sense to you at all lol.
And in the script that Andrex wrote, the function of the $.get('.page',etc) never gets to happen (ie, if I write an alert in the body of that function it is never executed).
 

D4Danger

Unconfirmed Member
Ok. I need a "no scripts" alternative for chrome. Whats the best? I've found the ones I've looked up are a little over complicated.

Settings > Content Settings > JavaScript > "Do not allow any site to run JavaScript"

Or the proper response, depending on how much time I wait until I expand the XMLHttpRequest. I don't know if I'm explaining myself correctly or if this makes sense to you at all lol.

XMLHttpRequest is asynchronous which means it will call the function and listen for a response instead of sending a request and blocking the rest of your script. This happens in stages which is why you'll get different results depending on when you check it.

anyway, if you were using the XMLHttpRequest object outside jQuery you'd need to attach an event to the onload or onreadystatechange methods.

for jquery I think you just need to provide a callback. something like

Code:
$.get(url_goes_here, function (response) {
    console.log(response);
}
 

Zeppu

Member
BlueMagic, why are you getting the current page again though? In any case, the best way would be to use a callback which would be called when the async function returns. You can also chain different callbacks by using .success(callback1).error(callback2);

So either $.get("url", callback) or $.get("url").success(successFunction).error(failureFunction).

As D4 said basically. I don't like inline functions unless absolutely necessary though.
 

BlueMagic

Member
BlueMagic, why are you getting the current page again though?
I was just testing the usage of $.get().

In any case, the best way would be to use a callback which would be called when the async function returns. You can also chain different callbacks by using .success(callback1).error(callback2);

So either $.get("url", callback) or $.get("url").success(successFunction).error(failureFunction).

As D4 said basically. I don't like inline functions unless absolutely necessary though.
Yeah, that makes sense. Thanks (both Zeppu and D4). However what still doesn't make sense to me is that if I put an alert() in the body of the function that Andrex wrote it doesn't get executed.

If I'm derailing the thread too much let me know and I'll make another thread or just stop.
 

ScOULaris

Member
Sorry to butt in on this fast-moving conversation, but I need help.

Could one of my fellow Chrome GAFers please PM a couple of mods for me?

Ever since yesterday morning, I have inexplicably lost the ability to start threads or send/receive PM's. I don't know why or how this has happened, but not being able to send PM's has made it nearly impossible to contact anyone with the power to help me.

This is what I get when trying to start a thread now:

gLqZC.png


When I try to send PM's, it tells me that my storage quota is full. I only have 91 PM's.

I hate to quasi-derail the discussion here, but I have resorted to pleading for help from people in threads that I frequent. If someone could just PM a few mods with my situation, I would be extremely grateful.
 

Somnid

Member
Blue Magic: You'll need to pass in a success callback to catch the response when it returns as the process is asynchronous.
 

ThatObviousUser

ὁ αἴσχιστος παῖς εἶ
OK, so I 'installed' jquery and got the parsing done, kind of. Here's what a normal URL of the forum looks like:
http://foros.3dgames.com.ar/consolas.77/695195.mario-party-9-wii.8.html?t=695195&page=8
(Don't worry, safe for work. The name of the forum sucks, I know)

I realized that by changing the number before the ".html" part leads me to the page that I want, regardless of the '&page=x' at the end (so I'm guessing it's not as default as I would've wanted and that's why your code wouldn't work, Andrex). That also leads me to think that the forum is sort of badly set up? Because of the redundancy, I mean.

What I need to know in order to advance now is what $() is supposed to do, so I can 'customize' what Andrex showed me. Since google sucks at looking up stuff like that (and I don't know what I'm actually searching for other than "$()"), I couldn't really find anything useful. Specifically, this part:" posts = $('.page', $(data));"

The $ syntax is shorthand for the main jQuery() object. Everything on that page can work for both $() and jQuery(), they're interchangeable.

As for posts = $('.page', $(data)); I'll break it down for you.

posts as we know is an array. This is important because the right side of the equation will return an array of objects, and these objects are the posts (mostly, as my edit says.)

The first supplied variable, '.page', tells jQuery we want all the elements that have the class page. The period is the class selector, the same way the # sign is the ID selector. It's the same as CSS.

The second variable is what was returned by the $.get() request for the next page, data. You can see this as a parameter: $.get('&page=2', function (data) {...

Now, we could have just plopped data into things without wrapping it in $(), and jQuery probably wouldn't have complained, but I wanted to make sure things work smoothly and so I wrapped it. What does this do? It turns data (which is the entire raw HTML of page=2) into a jQuery object, making it easier to work with.

Usually, when you use $() you only supply one argument, which causes it to act on the current page. However in this case we don't want it to act on the current page, we want it to act on the next page, or $(data). jQuery thus allows you to specify a second argument as a context for what the first argument should act on.

Put it all together, and you get an array of posts from data which were selected based on having the class page.
 

BlueMagic

Member
The $ syntax is shorthand for the main jQuery() object. Everything on that page can work for both $() and jQuery(), they're interchangeable.

As for posts = $('.page', $(data)); I'll break it down for you.

posts as we know is an array. This is important because the right side of the equation will return an array of objects, and these objects are the posts (mostly, as my edit says.)

The first supplied variable, '.page', tells jQuery we want all the elements that have the class page. The period is the class selector, the same way the # sign is the ID selector. It's the same as CSS.

The second variable is what was returned by the $.get() request for the next page, data. You can see this as a parameter: $.get('&page=2', function (data) {...

Now, we could have just plopped data into things without wrapping it in $(), and jQuery probably wouldn't have complained, but I wanted to make sure things work smoothly and so I wrapped it. What does this do? It turns data (which is the entire raw HTML of page=2) into a jQuery object, making it easier to work with.

Usually, when you use $() you only supply one argument, which causes it to act on the current page. However in this case we don't want it to act on the current page, we want it to act on the next page, or $(data). jQuery thus allows you to specify a second argument as a context for what the first argument should act on.

Put it all together, and you get an array of posts from data which were selected based on having the class page.

Thanks again for the incredible help, you guys rock. I understand pretty much everything in a basic level now (also I've been tinkering around with the console and managed to learn a couple of things too).

However, I'm finding that $.get() always fails. At first I thought it would be a stupid mistake, but after a while of trying and trying I couldn't fix it. See this code:

Code:
alert('extension starting');
function successFunction(data) {
		alert('success');
                //code to append
};

function errorFunction(data){
	alert('error');
};

$(document).ready(function() {
        alert('ready to append posts');
	$.get(document.location.href).success(successFunction).error(errorFunction);
});

I will always get 'extension starting', then 'ready to append posts' and then 'error', and I can't seem to get what I'm doing wrong, which is quite frustrating.
 

Somnid

Member
Thanks again for the incredible help, you guys rock. I understand pretty much everything in a basic level now (also I've been tinkering around with the console and managed to learn a couple of things too).

However, I'm finding that $.get() always fails. At first I thought it would be a stupid mistake, but after a while of trying and trying I couldn't fix it. See this code:

I will always get 'extension starting', then 'ready to append posts' and then 'error', and I can't seem to get what I'm doing wrong, which is quite frustrating.

Dump the data object to the console, see what it says. I don't know what context you are running this in but if you are doing it off the file system (file://) then chrome will need a command line argument to work.
 

BlueMagic

Member
Do this:

var url = document.location.href;
alert (url);
$get(url);

That way you see that the value of url is, since it seems to be incorrect.

Code:
var url = document.location.href;
alert (url);
$get(url);
ReferenceError: $get is not defined

You meant for me to do it in the console, right? It throws that error.

@SimleuqiR: Yes, I feel like I derailed the thread and I'm very sorry, should I make a new thread for this? I never meant for this to take this much space.
 

SimleuqiR

Member
@SimleuqiR: Yes, I feel like I derailed the thread and I'm very sorry, should I make a new thread for this? I never meant for this to take this much space.

Just pointing it out. I really don't mind.
I believe Andrex had a developer thread, at least for Android, but it didn't get much traffic.
 

Somnid

Member
Code:
var url = document.location.href;
alert (url);
$get(url);
ReferenceError: $get is not defined

You meant for me to do it in the console, right? It throws that error.

@SimleuqiR: Yes, I feel like I derailed the thread and I'm very sorry, should I make a new thread for this? I never meant for this to take this much space.

Yeah probably better off in a new thread. Also you need a dot between the $ and get().

$.get()
 

Zeppu

Member
Code:
var url = document.location.href;
alert (url);
$get(url);
ReferenceError: $get is not defined

You meant for me to do it in the console, right? It throws that error.

no, no, in the extension put these:

var url = document.location.href;
alert (url);

after
alert('ready to append posts');
then use the url variable instead of document.location.href.

Just debugging, to see why the url ends with [object Object].

Edit: Go ahead, create a chrome dev thread. I'll join :D
 

ThatObviousUser

ὁ αἴσχιστος παῖς εἶ
window.location is also better than document.location, for the record. Might be causing trouble.
 

Cat Party

Member
I am having a bizarre problem with Chrome. Clicking on the back button generally just causes it to hang. It doesn't matter what website. If I click back, it doesn't load up the page. If I click it again, it will typically load up the page that was two pages back. Is it a cache issue?
 

ScOULaris

Member
Scoularis whatever happened with that extension I helped you with?

I ended up making a Userstyle instead of a Userscript, which worked alright enough. In the end, the old logo didn't look as good as I thought it would with the current site skin, so I just deleted it. Thanks for helping with that, though. Sky also gave me some tips when I decided to do it as a Userstyle.

Feel like helping me again by PM-ing a mod about my situation? I feel like everyone is ignoring me. &#3237;_&#3237;
 

kehs

Banned
I ended up making a Userstyle instead of a Userscript, which worked alright enough. In the end, the old logo didn't look as good as I thought it would with the current site skin, so I just deleted it. Thanks for helping with that, though. Sky also gave me some tips when I decided to do it as a Userstyle.

Feel like helping me again by PM-ing a mod about my situation? I feel like everyone is ignoring me. &#3237;_&#3237;

Check your PM.


(j/k I sent stump a PM for you)
 
Top Bottom