Javascript: Get SharePoint Web Part - Objects to display on page - javascript

I am a young software engineer working on a mobile view for SharePoint 2013. For this, I have to access SharePoint Web Part - Objects with javascript.
The javascript should be linked in the Masterpage and starts after the page is done loading. Then, it should modify web parts.
For example, I want to resize web parts to fit to the max. available screen-resolution.
I want to turn the standard navigation into a drop down.
I want to fetch single informations out of different web parts and work with it.
I want to do change basically everything you can see on a standard page. :D If I am on the false road, pls tell me so.
I do not want anybody to post a link to a script or smth. - I wanna do the work ;)
But if you could give me a good hint or anything like that, I would highly appreciate it.
I already did a lot of research but due to the complex documentation of Microsoft's Products I did not find a proper solution. I think it's kind of a sad thing to be like that, because SharePoint is a great tool you could do so much with, if there would only be a document telling you how and where.

Have you thought of doing a different master page and layouts for mobile devices and have a redirection on the server side that when it detects the user agent of a mobile device that you're interested on redirecting it points the user to the mobile site? You wouldn't need to do the whole thing with JavaScript/jQuery since you could have the master and the layouts have the size that you want from the start. You could limit the width of the web part zones with some custom css as well.
Good luck!

Related

web app- Would it be possible to disable Windows+Printscreen?

I am trying to prevent users from taking screenshot in my web application written in Java.From my research,it seems highly unlikely.I did found a link below:
https://stackoverflow.com/questions/3130983/stop-user-from-using-print-scrn-printscreen-key-of-the-keyboard-for-any-we
It's able to disable the printscreen button but it doesn't disable if a user tries to use windows+printscreen.Now, I know even if I do managed to disable it, there's other third party application like snipping tools,camera,etc to take a screenshot but that's way beyond my control and I'm not looking into those.
I was just wondering is there a way to disable Win+Printscreen to prevent user from screenshotting?
If anyone has done it before, I appreciate any sort of suggestion.
Simple answer: No
Have a quick think about why you need to hide this info, does it really matter if other people see it? I assume that you have proof that you came up with your conclusion/process first? The information will never remain exclusive forever, especially not on the internet.
You normally do not have access to higher level controls so it is normally not possible with a web app. Having said that, there are several possible ideas:
Send your content directly to the graphics device/card via an API so that it is never visible to the operating system screen space (Where print screen works). However, with the right tools it is still possible to catch a graphics stream but it's a little harder for the average user.
Make your webapp launch a custom desktop application with more control over the OS (Download an exe and run it?)
Design a plugin/extension for a web browser that limits the use of printScreen, and then only show content on your webapp if your site can see that the plugin/extension is installed and running. This may not work with the way that Chrome and Firefox now manage plugins, it would need more investigation.
The best answer would be to only show limited info/conclusions on your webapp, and keep all the proof of concept hidden. Then you can make people sign-up to your app if they want more information, and then give a strict set of criteria that must be met.

How to change html content with URL?

I'm a beginner at coding, I know javascript but not super advanced objectd,
I'd like to know how to change html content with its URL. For example,I am on a website like GMAIL, it has different page of registring and logging in. These two pages have different URLs.
What I'd like to know is how do they change the URL along with HTML when I click on the button "Log in". Is this possible through server-side like node.js and express, or just with front-end javascript?
One last thing, do websites have multiple web pages or it's just in one single HTML file?
Well, I have set up a practice project, but I don't know what I am doing.
I changed HTML content with jQuery library but I don't know how to change URL.
First I made a homepage with some text and two links to two forms.
I showed registration form when click on "Sign in", and log in form on "Log in", and hid the homepage with the show() and hide(). The URL doesn't change in order to work with it with express. I tried it with history.pushState() but it messed up things: I can't return to homepage, and it didn't change the URL i wanted based on the form. So i deleted it, and I am stuck and don't know I could find some tutorials online.
My code doesn't contain anything other than what I described.
So, please can you explain to me how websites do that.
And one other thing, my express server now is very slow, it takes nearly 5min to start. I don't know if it's because my pc which is old and not super good unfortunately.
Can you please advice me with some tutorials and tips?
I agree that your question is too broad. Even there is many years invested in unversity to know these stuff well, I believe in self learning, so I will give you some light for your next steps in this world.
Here are some questions you may ask Google or research where ever you want:
There's both applications that hosts entire html documents in a server and reacts to http requirements responding with different ones. These are the first ones in existence.
Today the trend is to host information on distributed servers (Even cloud) as services to interact with just as information repositories, and entire client side applications that handles that information to show to the user in a more interaction friendly way.
So here are 4 first questions you can ask:
How does HTTP protocol works (with html documents e.g.)?
What's the difference between thin client and fat client applications?
What are web services?
How can I do a simple client side application with different routes using a public web service?
There is a lot of information to read about, and that's not the way I learned in university, so I can not tell you that's the right way or even a good one. Anyway, you should consider taking a web programmer beginner course, if you already know about basic algorithmic composition.
Wish you the best in this extensive path...

Determining the Order Files Are Run in a Website Built By Someone Else

Ok, this question is going to sound pretty dumb, but I'm an absolute novice when it comes to web development and have been tasked with fixing a website for my job (that has absolutely nothing in the way of documentation).
Basically, I'm wondering if there is any tool or method for tracking the order a website loads files when it is used. I just want to know a very high-level order of the pipeline. The app I've been tasked with maintaining is written in a mix of django, javascript, and HTML (none of which I really know, besides some basic django). I can understand how django works, and I kind of understand what's going on with HTML, but (for instance) I'm at a complete loss as to how the HTML code is calling javascript, and how that information is transfered back to HTML. I wish I could show the code I'm using, but it can't be released publicly.
I'm looking for what amounts to a debugger that will let me step through each file of code, but I don't think it works like that for web development.
Thank you
Try opening in the page in Chrome and hitting F12 - there's a tonne of developer tools and web page debuggers in there.
For your particular question about loading order, check the Network tab, then hit refresh on your page - it'll show you every file that the browser loads, starting with the HTML in your browsers address bar.
If you're trying to figure out javascript, check out the Sources tab. It even allows you to create break points -very handy for following along with a page is doing.

Take a screenshot of whole screen using html5/javascript?

I am looking to take a full screenshot through a webpage, outside of the browser window. Basically, I am trying to build a help tool for both web-based apps and offline programs, and as a part of this I would like to be able to take screenshots from a webpage so the user does not have to download a program to take a screenshot/upload it to our website.
I am aware there may not be a solution to this, but if there was that would be awesome!
Cheers in advance
There are ways to achieve what you want to do in part. However, it is important to know that they do require user permissions.
You also ask if a web page can take a screenshot outside of a browser window- this is a huge breach of privacy and I would advise against implementing anything that goes down this route. For what your trying to do, it is always best to have user consent.
If you interest is in saving the user time and giving the user a more seamless experience, consider one or more of these options:
You can use one of several JavaScript plugins/ API's to allow to user to select portions of what they see on the web page and then upload it to you. For instance, you can do this on YouTube. Go to youtube.com and scroll to the bottom of the page and click Help and then Send feedback. Here you can enter text as well as "highlight" portions of the page and send them to YouTube. To achieve something like this, look into something like html2canvas.
Give your user quick access to the download pages for tools like Snipping Tool for Windows. This way, if they don't have it on their machine already, at least they don't have to go looking for it.
From my experience in dealing with customers, many of them don't even know that things like Snipping Tool exist on their machine. Perhaps, an FAQ or help section that would guide the user would be useful.
In summary, it is possible through a web page to "screenshot" what is on a web page itself but nothing I have come across that allows you to capture anything outside of the web browsers context.
This is definitively not possible using only HTML5/JavaScript. You would have to involve a browser plugin such as Flash, a Java applet or perhaps a Firefox add-on.
Note: I'm assuming you mean taking a screenshot of the entire monitor, not just the browser window.

Where should a javascript developer start to create a desktop browser?

I have a project where I need to create a desktop app that acts like a browser, however, I need to be able to execute my own css and javascript on ANY page that a user goes to. The goal is to have a user be able to browse to a website, and then click on certain elements of the site and quickly pull information regarding that element (divID, classes, etc), then add some javascript inside the browser that will add some new functionality to the page (though only in the browser). I'll also need to sync this desktop app up to both an internal database as well as connect to a remote database online.
I'm a javascript developer, and so I really want to be able to use jquery to help build out the interaction with the site. I've played around with adobe air, and was able to build a browser using flex, but then I wasn't able to use jquery to manipulate the pages (maybe there's a way, but I don't know flex at all, and I couldn't figure it out and didn't want to waste too much time to discover that I couldn't do it). I then tried to create an HTML air app and have the browser essentially be an iframe. However, the cross domain scripting became an issue, and I don't think that the iframe sandBox solution is what I'm after because that looks like I would need to create a local version for each page that is browsed to, and then alter that local version.
So, I'm back to square one and am trying to find what technology I should be looking at where I can add my own javascript and css to a page within a browser? I'm familiar with javascript and PHP, but this will be my first desktop app. I'm willing to learn a new technology though I obviously want to be able to stick to what I'm most familiar with. I've thought about building a firefox plugin, but I'm hoping to sell this app, and I think a stand alone app would allow for a higher price tag.
Try Adobe Air. It's cross platform, has the ability to create "real" apps, can load and process HTML and CSS (has webkit built in), and allows for the creation of applications using HTML/CSS/JavaScript. If you're looking for something more freedom loving, check out Titanium, which is a similar framework.

Categories