Display File contents on the Web Browser UI - ruby

I am looking to deploy a Web Interface to display file that has log contents. I am collecting the log details and storing them on my WebServer. I have an Apache interface that lets user download/view the file from the browser.
However, the challenge here is that they don't look pretty. I want to show them in a UI that can highlight/color contents. I tried to simply pull the contents of the file and display in a Text Area which works but that would mean doing a lot of manual work to make it fancy. Wondering if something already exist that i could re-use ?
As a future enhancement I was also hoping that the UI would find for patterns in the file and highlight them in the UI. For example, If the file contains connection refused messages just highlight them in red etc..
I am not sure if I should build something from scratch or something already exist that i can re-use ?

I would use CKEditor and set to read-only or completely hide the editor controls.

Related

How to build WOPI validation application

http://wopi.readthedocs.io/en/latest/build_test_ship/validator.html
As per this documentation, we need to build some HTML host page.
In this document, they mention one point that I didn't understand completely
The simplest way to use the validation application is to use the view
action. To use the view action hosts should treat .wopitest files the
same way other Office documents are treated. In other words, hosts
should do the following:
Launch a host page pointed at the .wopitest file. Ideally, this should
be the same host page used to host regular Office Online sessions.
This will allow the validation application to test things like
PostMessage and do some validation on the way the Office Online iframe
was loaded.
What is .wopitest file and what I need to do exactly, Can anyone please guide me ? please explain stepwise
They mean that you have to call that action in the same way you call any other action (looking for the action url in the discovery, etc.).
For example, when you want to open a .docx for view, you look into the discovery.xml and you find that you have to call https://word-view.officeapps-df.live.com/wv/wordviewerframe.aspx?", and of course you must have ready the Rest services for that action (checkFileInfo, etc.) and the WOPISrc pointing to a file that in fact is a .docx . Well, for the validation application is exactly the same, but you should call to WopiTest app instead of Word app (inside the discovery) and your generated WOPISrc should point to a file called "xxxx.wopitest" instead "xxxx.docx". That's it! ;)

How to get data from grid and download them like .csv file in ExtJS 4.2

I have a Ext.grid.Panel and I fill it with store that is populated from database. And there is an export button. When the user click on the Export button, I want the data from grid should start downloading like .csv file
The best solution to creating any type of file (Excel, CSV, PDF, whatever) is going to be leveraging your application server to create and serve up the file for download. There are literally thousands of libraries across most of the popular server-side languages that can create just about any kind of file that you'd want to create.
So ultimately this has nothing to do with Ext JS or even JavaScript. All that your export button should do, IMO, is to create an AJAX request which triggers the process (query, transform results, publish to a correct content type, stream to browser) that will be needed to generate the content from your application server technology.
Sometimes you can't leverage an application server such as when your back end is a micro controller or you can't get the back end people to make the change.
I've not used this, but it looks nice:
http://www.sencha.com/forum/showthread.php?136598-Export-store-to-Excel

Retrieve the user response saved in a file in an app hosted on Cloudbees

I have hosted a Tomcat application on CloudBees which allows users to edit some XML and saves them. I need to download and save these files locally for my personal usage. However I could not find a way to do this. I tried the 'download source' option but it downloads the original files that I had uploaded and not the edited versions. However my application is able to access the edited versions (and so clearly everything is being saved all right). Getting these files back is extremely critical and necessary for me and is, in fact, the whole motive of this app. Kindly tell if there is some way to get back the files in CloudBees or any other free Java hosting site which would allow me to do it.
It's not very clear from your question how your app is currently dealing with these files, but I'll take a swing at providing some general info.
To support editing and downloading of files, your app design would need to address the following issues:
How do users edit/upload the changed XML?
Where does your app store the changed XML?
How does your app retrieve the edited XML and make it available for download?
For #1, you will need to provide an edit or upload interface in your app for manipulating the XML files. I'm assuming this is something your app has already solved using a form of some kind.
For #2, you need to pick an approach for storing the files that is appropriate for app's needs and the runtime environment where your app will be deployed. For instance, on CloudBees (or most other CLoud platforms), it's important to understand that the local filesystem of the app can be used for temporary storage, but it is not clustered and it will be wiped away each time the app is updated or restarted. If these XML files need to be available forever, you will need to store them in a persistent location that is external to the application's runtime instance. Most developers use databases (such as the CloudBees MySQL service) to store persistent data in this way. In general, your app can store these files anywhere, but your app needs to manage how to store them, and how to retrieve them later.
For #3, to allow a user to download the changed files, you will need to implement your own mechanism for retrieving the file from its persistent location, and then send it back to the user's browser. If you want something like right-click "Save As" to work, then your app will just need to support a URL that can display the edited XML file directly in the browser. If your app then provides a link to that URL, users can download it using RightClick+SaveAs. If you want the user to be able to click on a button/link and trigger a Save As dialog automatically, then you'd need to write a URL handler (Servlet) that serves the XML content up using a Content-Disposition header (see this StackOverflow article). This header will tell the browser that the file is supposed to be saved to disk, and allows you to provide a default file name.

Populate file list with previously uploaded files

Using the jQuery wrapped version of Fineuploader v3.3.
Is it possible to populate the file list with files already in the upload folder?
I think "_addToList(id, name)" should do the trick, but I can't get it to work. Any ideas?
Seems that they are currently working on this feature:
https://github.com/Widen/fine-uploader/issues/784
So, this will be available soon.
This is not a behavior that Fine Uploader currently supports. Fine Uploader only displays files that users have submitted to the uploader since the current uploader instance was created. It doesn't try to be an all-in-one web application. You could probably add your own item to the list/UI via javascript. That probably wouldn't be terribly difficult, but seems like an odd thing to do.
If you'd like to discuss your specific use case more, please open up a feature request in the Github issue tracker.
Generally, client side code cannot add stored or hard-coded path based file names for use in any type of POST or upload operation. Obviously this is a security measure, you can imagine if a malicious web page could add to a generic POST operation some type of baked in file name. So from what I understand, only the user can specify path based file names, via a file browser for the session that it is included in. This applies to HTML/JavaScript/jQuery but am unsure if Flash/Silverlight based solutions would also be limited. I think a Java based uploader would be free of this. But you are just moving closer and closer to installed software.

Logging image downloads

I'm trying to find a way of finding out who is downloading what image from an image gallery. Users can download using a button beside the thumbnail or right click and use the "save link as" Is it possible to relate a user session or ID to a "save link as" action from all browsers using either PHP or JavaScript.
Yes, my preferred way of doing this would be via PHP. You'd have to set up a script which would load up the file and send it to the user browser. This script would also be able to log the download somewhere (e.g. your database).
For example - in very rough pseudo-code:
download.php
$file = $_GET['file'];
updateFileCount($file);
header('Content-Type: image/jpeg');
sendFile($file);
Then, you just have your download link point to download.php instead of the actual file. (Note that updateFileCount and sendFile are functions that you would have to provide, of course - this script is an example of a download script which you could use)
Note: I highly recommend avoiding the use of $_GET['file'] to get the whole filename - malicious users could use it to retrieve sensitive files from your web server. But the safe use of PHP downloads is a topic for another question.
You need a gateway script, like ImageDownload.php?picture=me.jpg, or something like that.
That page whould return the image bytes, as well as logging that the image is downloaded.
Because the images being saved are on their computer locally there would be no way to get that kind of information as they have already retrieved the image from your system. Even with javascript the best I know that you could do is to log each time a user presses the second mousebutton using some kind of ajax'y stuff.
I don't really like the idea, but if you wanted to log everytime someone downloaded an image you could host the images inside a flash or java app that made it a requirement to click a download image button. That way the only way for them to get the image without doing that would be to either capture packets as they came into their side or take a screenshot.
Your server access logs should already have the request for the non-thumbnailed version of the file, so you just need to modify the log format to include the sessionid, which I presume you can map back to a user.
I agree strongly with the suggestion put forward by Phill Sacre. For what you are looking for this is the way to go.
It also has the benefit of being potentially able to keep the tracked files out of the direct web path so that they can't be direct linked to.
I use this method in a client site where the images are paid content so must be restricted access.

Resources