How to scroll down with PhantomjsCloud Api to load dynamic content - php

I want show all google review in my website. I am using phantomjscloud api.
Here the link it showing only 10 review. I need all review.
https://phantomjscloud.com/api/browser/v2/REDACTED-API-KEY/?request={url:%22https%3A%2F%2Fsearch.google.com%2Flocal%2Freviews%3Fplaceid%3DChIJF47RCZLBeUgRSpiTvcpPEfA%22,renderType:%22html%22}

I do support for PhantomJsCloud. You know, you can always email support#PhantomJsCloud.com to get help. I dare say it's a better than a place like SO for a niche SaaS product. Only Google Alerts saved you this time.
Anyway, to answer your question: you can look at the doc page at https://phantomjscloud.com/docs/http-api/, there is an example showing exactly this:
Scripts: LazyLoad then force render Scrolls 50px every 50ms, and
renders when done scrolling to the bottom. This eldiariomontanes.es
site lazy loads images only when it's shown in the browser, so if you
take a screenshot without the provided script, the bottom part will be
missing images. Important: This page takes aprox 25 seconds to load,
and weighs aprox 2mb in size. (Costs about 0.0047 credits)
HOWEVER you just pasted your private api key into a public message board! Sorry but I am going to have to delete your account. You can go ahead and sign up again though. Please read up on "Ops Sec" to avoid getting something important stolen in your future.

Related

Loading more images when reached bottom

I want to load more images in my website when I reach the bottom of my page. I'm using php and postgresql as my database.
For this post I simply load some text instead of image. I can write the code for it's equivalent.
So currently, I'm using a button at the bottom of my page, which when pressed re-loads the page and gives you more images(I'm displaying 50 images at a time).
But there are 2 problems with it, one being that the user will have to press the button again and again while I want it to happen automatically.
And the second one being that when new images are loaded, the previous ones are gone. I don't want to happen. For eg., if currently 1-50 images are present, my page later changes it to 51-100 while I want it to have all 1-100. I'm unable to solve this.
Please help. Thanks!
What you are looking for is commonly referred to as "infinite scroll pagination", while what you're asking for is techniclly possible using only PHP it would be a terrible user experience, as each reload would take the user to the top, and they would constantly have to continuously scroll further and further just to reach the location they were previously at.
Alternatively, handle this with JavaScript, an example: https://infinite-scroll.com/demo/full-page.
Doing simple Google searches reveals a plethora of options for JavaScript and JQuery plugins to achieve this.
An alternative, without the need for a plugin you can implement the answer to this:infinite-scroll jquery plugin
Simply call your PHP code in the form of an AJAX request when the bottom of the page is reached and append your new results. (this could be easily achieved with vanilla javascript as well).
Hope this helps.

Is PagePeeker updating the "screenshot" anytime? (used in TimelineJS)

I have implemented TimelineJS on my site, Pixic.se, using data from mySQL database and format it through PHP. Everything is working fine. But there is a feature in TimelineJS called PagePeeker, which is rendering a screenshot of links that aren't links to supported sites, such as
Youtube
Wikipedia
Google Map
Flickr
Twitter
Vimeo
SoundCloud
or writing a blockquote.
Problem
The first time I got the TimelineJS to work properly it rendered screenshots for the links I have in my timeline, including my own site.
Since then I have updated the layout and would like to have PagePeeker update the rendered screenshot, since at least on my computer, the screenshot still shows the old site design/layout (with a jumbotron that says "Welcome to Pixic.se, some smaller text and a btn-primary button) even though I have deleted cache/history.
I visited Pagepeeker.com and entered my URL and then it generates a preview with the timeline, i.e. the current design/layout, but it doesn't affect when I go back and check my own site. Also, the rendered screenshot at PagePeeker makes the Timeline look weird...the whole timeline only filling about 40% of the page width.
Questions
If you take a look at Pixic.se timeline's first story, do you see a grey navbar and the jumbotron described above or do you see the current design/layout?
Are PagePeeker screenshots stored at PagePeeker or only rendered if the visitor doesn't have it cached?
Is there any way to get PagePeeker render the sites again and perhaps even have it done regularly, by interval using META tags or similar?
Additionally, I tried to add a link to Google Charts, but it did not work. It only outputted the URL as a string where the PagePeeker screen would have been. Any idea why?
PagePeeker supports refreshing of the thumbnails via an API call, for premium accounts. Other accounts do not support it.
Thumbnails are cached 7 to 14 days, depending on how much they are used.
One way to force a refresh would be to add a random string after the URL like: http://pixic.se/?random=234234234

How to auto fill Text box in php (Similar to Facebook)

What I am trying to do is to make something similar to what I see all the time on almost any website. The button that says Share to facebook. The goal for me is to let my guests share the item they are viewing in my store (Ran on prestashop) on their blog I run (Running on Oxwall).
The goal is for the button to not only link to a blog post submission webpage but to already have the subject line filled out with the item they are sharing's name and the blog post to display the information about the item. I would like to try and do all this using PHP. I am not sure how to go about doing it but I am sure that I could pass the value. Please note that I can mod BOTH the blog site and the shop as I run both and want to connect them.
As an extra bonus I am also running a forum using phpbb3 if I could do the same thing but onto that as well I would greatly thank you. I am trying to interlink everything into one big network. I know its not an easy task but I am sure there is an easy way to pass data onto the other site so that this can be done.
Facebook a 2 tools to get items informations in the page, it parses the page looking for the most common tags and it uses OpenGraph.
You can also provide product informations in the head of your page (between head tags), then blog side, you retrieve only the contents and parse it as XML.
I advise you to cache this data to avoid useless connections between websites and awful overloads while parsing.
You can use your own specifications, Open Graph or another standard, but i advise to use a standard.

Dynamic "screenshots" for demonstrations in help page

I'd like to improve the "help" page of my website by adding screenshots of various sections of the site. I'm hesitant to make these static images since the site is still in development and is cosmetically changing constantly. In fact, I'm even thinking that creating images at all may be overkill.
Is it possible to load (via PHP or JQuery) a small section (with static size and x y) of another page and display it in a div?
We're doing a thing like that in our Help section, but I think that dynamically loading live screenshots is a waiste of resources.
Actually, we're doing this in our build process, just after our tests. A headless browser (selenium under xvfb) is used to take a full screen screenshot of our different pages, on our pre-deployed application.
Then, we a modification occured, the build process take care of including the modifications...
Load the Page you want the "screenshot" of into an <iframe> with the desired size and use an anchor or http://api.jquery.com/scroll/ to move the contents to the position, you want to show.
if you don't want the user to scroll away or interact with the iframe, just put a transparent layer over it.
It is also very helpful to make a GIF of the screen to show the user how to do something fast, instead of written explanations, so if there are cosmetics changes, the user can continue seeing how to do something, you can create the Screen recording GIFs with http://www.getcloudapp.com

Best way to create a kiosk app displaying a movie and a few contact links?

I'm trying to create a web based welcome display for a building entrance. The project would include:
1) A wmv movie play constantly on the digital display until some visitors touch the screen (this can be played either locally or on the internet, but it has to be able to go to number 2 when visitors touch the screen)
2) A couple of buttons with department names show up for visitors to choose who they are here to see
3) After the visitor touch on one button, an email is sent to the department
4) Thank you page, the site should go back to the number 1) again
My experience is html, css, php, javascript, and some Flash, but I'm open to learn new skills. Can someone please suggest some good ways to build this site? Is there any tutorials or good sites I can learn from, that would be a bonus.
Thanks very much.
Sam :)
Edit:
Thanks very much Vigrond and Lloyd! You guys' answers are equally helpful, so I'll use html5 and javascript.
I have a couple of further questions, I hope you guys or someone can help me. (Any part of questions' help is appreciated)
Since this is going to be a kiosk, the same movie is going to be played constantly, everytime after the customer has contacted us, the 'thank you' page is going to show briefly and go back to the first movie page. My question is how can I not let the movie load again and again everytime when there is a customer? Because the local data space for the display is going to be limited.
I've been thinking if I just create one page for the whole process and use a javascript slide to make each page as a div, so the movie div is going to be hiden so it doesn't need to be reloaded again, would that fix number 1) data space concern?
I'm thinking of using a horizontal slide like http://www.queness.com/post/356/create-a-vertical-horizontal-and-diagonal-sliding-content-website-with-jquery How can I make the last div (thank you) to show about 5 secs and go to the first div (movie) again?
Thanks very much! :)
This can be purely done using html5/javascript (+php for the email sending). Google Chrome also has a -kiosk mode, that will enable fullscreen.
I would probably use HTML5 video, along with something like the jQuery cycle plugin. On the video onclick handler, I would just cycle() to the next 'slide'. You can put in effects such as fadein, fadeout, slide, etc.
If you wanna get fancy, a mobile framework such as jQuery mobile or Sencha mobile may be right up your ally as well, (with aesthetic familiar interfaces and cool transitions)
beside some backend PHP to send email, this trivial app could be built using plain old HTML5, CSS and Javascript.. I wouldn't bloat it with jQuery or jQuery plug-ins unless necessary..
I don't recommend using WMV content, though - this proprietary format is not supported by any of the main browsers.. To ensure maximum browser support, encode you media using an open format like WebM:
http://www.webmproject.org/

Categories