How to hide the source code of a HTML page - html

I created an HTML page and now would like to hide the source code and encrypt it.
How can I do that?


You can disable the right click, but that's a bad idea because expert minds can read anything from your page.
You cannot totally hide the page source - this is not possible. Nothing is secure enough on the Internet.
In any case, you can encrypt it and set a password.
You can utilise this link - it will encrypt your HTML page with a password.
First up, disable the right click, by writing out this script, right after the tag.
<SCRIPT language=JavaScript>
<!-- http://www.spacegun.co.uk -->
var message = "function disabled";
function rtclickcheck(keyp){ if (navigator.appName == "Netscape" && keyp.which == 3){ alert(message); return false; }
if (navigator.appVersion.indexOf("MSIE") != -1 && event.button == 2) { alert(message); return false; } }
document.onmousedown = rtclickcheck;
</SCRIPT>
Then, encrypt all of it, in this website, called 'AES encryption'.
Link - http://aesencryption.net/
You need to set a password to decrypt it ....you choose the password.
After encrypting it, you can just write a basic HTML page just putting into the <head> tag once again the script to disable the right click, into the <body> tag you code and hide everything just writing at top of the page <html hidden>.
Example
<!DOCTYPE html>
<html hidden>
<head>
<SCRIPT language=JavaScript>
<!-- http://www.spacegun.co.uk -->
var message = "function disabled";
function rtclickcheck(keyp){ if (navigator.appName == "Netscape" && keyp.which == 3){ alert(message); return false; }
if (navigator.appVersion.indexOf("MSIE") != -1 && event.button == 2) { alert(message); return false; } }
document.onmousedown = rtclickcheck;
</SCRIPT>
</head>
<body>
--here, you put the encrypted code from the link above--
</body>
</html>
Where it is written var message = "function disabled"; you can write for example something like 'This page cannot be viewed' or something which will annoy most of the users and will just leave. ['This page is unavailable' and so on ....].
Finally, you will see a blank page with a message coming up as soon as you right click the page. The message will be something like 'This page is no longer active'.
Example
<SCRIPT language=JavaScript>
<!-- http://www.spacegun.co.uk -->
var message = "**This page is no longer active**";
function rtclickcheck(keyp){ if (navigator.appName == "Netscape" && keyp.which == 3){ alert(message); return false; }
if (navigator.appVersion.indexOf("MSIE") != -1 && event.button == 2) { alert(message); return false; } }
document.onmousedown = rtclickcheck;
</SCRIPT>
I do know that one can remove the <html hidden> or the Javascript script with some add-ons such as Firebug but anyway you will need to decrypt the code with a password in order to see the real page.
Expert users might view the source code with a Brute Force attack, I think.
So, nothing is safe.
I found out an application that you need to instal on your computer.
There is a feature in the Enterprise version but you must pay to get it. This feature is a tool which encrypt your HTML page creating an ultra-strong password encryption for HTML files using up to 384 bit keys for encryption [the link I wrote above uses up to 256 bit keys for encryption].
I have never tried it out, though, because it is not for free.
Anyway, the link of the software 'HTML Guardian' - http://www.protware.com/default.htm
For the feature about the encryption, merely click on 'Ultra-Strong HTML password protection' in the page.


You cannot hide the source code, but you can add some difficulties to see your source code by following way
1. Disable right-click:
<body oncontextmenu="return false">
2.Disable ctrl, u, F12 keys:
<script type="text/javascript">
function mousehandler(e) {
var myevent = (isNS) ? e : event;
var eventbutton = (isNS) ? myevent.which : myevent.button;
if ((eventbutton == 2) || (eventbutton == 3)) return false;
}
document.oncontextmenu = mischandler;
document.onmousedown = mousehandler;
document.onmouseup = mousehandler;
function disableCtrlKeyCombination(e) {
var forbiddenKeys = new Array("a", "s", "c", "x","u");
var key;
var isCtrl;
if (window.event) {
key = window.event.keyCode;
//IE
if (window.event.ctrlKey)
isCtrl = true;
else
isCtrl = false;
}
else {
key = e.which;
//firefox
if (e.ctrlKey)
isCtrl = true;
else
isCtrl = false;
}
if (isCtrl) {
for (i = 0; i < forbiddenKeys.length; i++) {
//case-insensitive comparation
if (forbiddenKeys[i].toLowerCase() == String.fromCharCode(key).toLowerCase()) {
return false;
}
}
}
return true;
}
</script>
3. Add to lots of white spaces to before you staring your codes
it may fool someone


There isn't really anyway to do it that would stop a someone who is sophisticated.


There isn't really a way to do that. Perhaps the only thing you could do is to disable the right click feature via JavaScript, but still that wouldn't stop a user who's experienced enough to copy it. However, check this out.


for php, separate the code you don't want seen from the rest of your code with:
<?php
for($i=0;$i<1000000;$i++){
echo "\n";
}
?>
<some html="what you want to hide">
<?php
for($i=0;$i<1000000;$i++){
echo "\n";
}
?>
This will effectively kill the view source aspect (at least for a few minutes)
if it is a viewing source, he will not wait for the results.
Also, this does not seem to slow the page load


I know, it's a little late, but I guess you are looking for something called obfuscation. For Javascript files for example are many obfuscation tools available that you can use for the build process of your webpage. The code is transferred in an unreadable format. Some VPS providers are offers plugins that run during the build process and do that job for you.


As many have said, there's no real way to hide source code. There's been some good suggestions but I haven't seen this. This will encode it so nobody can read it, and it will 100% work for HTML. Only thing is anyone smarter than a light bulb will be able to decode it the same way it was encoded. You also cannot encode JavaScript or PHP; HTML only. developers.evrsoft.com offers a free encoder. But again, it can be decoded as quickly as it was encoded.
It'll look like this:
<h1>This will be encoded</h1>
Will be:
<script>
<!--
document.write(unescape("%3Ch1%3EThis%20will%20be%20encoded%3C/h1%3E"));
//-->
</script>
Again, don't encode PHP or JS.

Related

Why does text input in form fields become disabled when I switch from a web browser to another window and then back again?

I have a web application that uses a lot of text input. In some cases it's form input and a Submit / POST action and in others the input text is processed using JavaScript / Ajax.
If I begin typing into, for example, a textarea and then switch to another window (e.g. Outlook) to copy some content to the clipboard, and then switch back to the browser to paste it, the textarea no longer accepts keyboard input.
This only appears to happen on my Windows 10 Pro laptop. On Mac OS it works fine.
I've used multiple browsers.
Is there something in the Windows setup that disables form input as a security measure?
Here is an example of a form declaration in the markup:
<form method="post" action="<?php echo __SITE_URL; ?>admin/_editcandidate.php" autocomplete="off">
I don't use any JavaScript events that are triggered when the focus changes.
Appreciate any insights.

I'm not sure this adds any value to anyone other than it's worth double checking your code for rogue event handlers.
I found this buried in an included file:
window.addEventListener('keyup', function(evt) { keyboardUp(evt); }, false);
and the associated function had a scenario where it could return false:
function keyboardUp(e)
{
var key;
if (window.event) // IE
{
key = e.keyCode;
}
else if(e.which)
{
key = e.which;
}
if (key === 18 && g.altkey === false) { g.altkey = true; return; }
if (g.altkey === false) return;
...
}
Pretty sloppy on my part.
Not sure why this should be an issue switching focus but it does at least solve my problem.

Code to Start and Stop a broadcasting script on a schedule

I am somewhat new to coding.
I work for a sports complex and I have set up live streaming.
Currently I have to manually go into the streaming platform and click "start broadcasting" and "stop broadcasting" when I want those things to happen.
I am wondering if I can add code to the HTML to do these functions automatically on a scheduled timer I specify?
Thanks,
Jade

Your code is not specific, but I am going to assume you have javascript functions defined somewhere that can start and stop broadcasting. Something like this:
function startBroadcasting() {
// do whatever it takes to start broadcasting
}
function stopBroadcasting() {
// do whatever it takes to stop broadcasting
}
What you need then, is to call, in a script tag at the bottom of the body, something like this:
var running = false;
function myScheduler() {
var now = new Date();
var dow = now.getDay();
var hr = now.getHours();
var min = now.getMinutes();
var sec = now.getSeconds();
if (dow === 6 && hr === 7 && min === 0 && !running) {
setTimeout(startBroadcasting, 0);
}
if (dow === 9 && hr === 21 && min === 0 && running) {
setTimeout(stopBroadcasting, 0);
}
}
setInterval(myScheduler, 1000);

The embedded code for the player on the website is below. Where and how would I implement the schedule into this?
<!--SVP embed code begin-->
<div id="svp_player5zen1ooango4" style="width:720px;height:405px;position:relative;">
<a class="svp_embed_link" style="color:#000;cursor:default;" href="http://www.streamingvideoprovider.com/how_to_create_tv_channel.html" title="create tv channel" >create tv channel</a>
</div>
<script language="javascript" type="text/javascript" src="http://play.streamingvideoprovider.com/js/dplayer.js"></script>
<script language="javascript">
<!--
var vars = {clip_id:"5zen1ooango4",transparent:"false",pause:"1",repeat:"",bg_color:"#FFFFFF",fs_mode:"2",no_controls:"",start_img:"1",start_volume:"100",close_button:"",brand_new_window:"1",auto_hide:"1",stretch_video:"",player_align:"NONE",offset_x:"",offset_y:"",player_color_ratio:0.6,skinAlpha:"80",colorBase:"#202020",colorIcon:"#FFFFFF",colorHighlight:"#fcad37",direct:"true",is_responsive:"false",viewers_limit:0,cc_position:"bottom",cc_positionOffset:70,cc_multiplier:0.03,cc_textColor:"#ffffff",cc_textOutlineColor:"#000000",cc_bkgColor:"#000000",cc_bkgAlpha:0.7};
var svp_player = new SVPDynamicPlayer("svp_player5zen1ooango4", "", "720", "405", {use_div:"svp_player5zen1ooango4",skin:"3"}, vars);
svp_player.execute();
//-->
</script>
<noscript>Your browser does not support JavaScript! JavaScript is needed to display this video player.</noscript>
<!--SVP embed code end-->

As you can see form their page StreamingVideoProvider has an API to control your broadcast, which is explained here.
First of all you need to get an access token by requesting the svp_auth_get_token service.
After that you can start/stop your broadcast by calling svp_start_broadcast/svp_stop_broadcast where you need to pass your token and the video ID (in your case it's 5zen1ooango4).
At the top of the API docs there is an download link for some example code which may help you.

HTML5 Progress Element Scripting

I'm trying to display a HTML5 progress element to show the download progress of a large image file.
I've checked a few answers to similar questions already posted on this forum but they don't seem to directly answer the question (or more likely it's just my ignorance) or they get very technical and therefore way beyond me.
I've downloaded a HTML5 / JavaScript example file that shows the basic method (see code below) but I can't figure out how to link this script to my image download.
Any advice would be greatly appreciated.
<!DOCTYPE html>
<html>
<head>
<title>Developer Drive | Displaying the Progress of Tasks with HTML5 | Demo</title>
<script type="text/javascript">
var currProgress = 0;
var done = false;
var total = 100;
function startProgress() {
var prBar = document.getElementById("prog");
var startButt = document.getElementById("startBtn");
var val = document.getElementById("numValue");
startButt.disabled=true;
prBar.value = currProgress;
val.innerHTML = Math.round((currProgress/total)*100)+"%";
currProgress++;
if(currProgress>100) done=true;
if(!done)
setTimeout("startProgress()", 100);
else
{
document.getElementById("startBtn").disabled = false;
done = false;
currProgress = 0;
}
}
</script>
</head>
<body>
<p>Task progress:</p>
<progress id="prog" value="0" max="100"></progress>
<input id="startBtn" type="button" value="start" onclick="startProgress()"/>
<div id="numValue">0%</div>
</body>
</html>

If you are looking to track the progress of an XMLHttpRequest (which could be loading an image, or anything else), Adobe has a great example there. Ctrl+U is your friend :)
Basically, you'll want to do that:
var xhr = new XMLHttpRequest();
xhr.onprogress = function(e){
// This tests whether the server gave you the total number of bytes that were
// about to be sent; some servers don't (this is config-dependend), and
// without that information you can't know how far along you are
if (e.lengthComputable)
{
// e.loaded contains how much was loaded, while e.total contains
// the total size of the file, so you'll want to get the quotient:
progressBar.value = e.loaded / e.total * 100;
}
else
{
// You can't know the progress in term of percents, but you could still
// do something with `e.loaded`
}
};
Mozilla's Developer site has some more details, if you want to see what can be done.
Hope that's enough for you :)
PS: Now that I think about it, I see no reason not to use the e.total as progressBar.max, and simply push e.loaded into progressBar.value

IE9 HTML5 placeholder - how are people achieving this?

I'm trying to use the placeholder="xxx" attribute in my web application, and I don't want to have a special visual for IE9. Can people throw out some good suggestions for achieving this functionality in IE9?
I've found a couple links on here but none of the suggested scripts were sufficient... and the answers were from mid-2011, so I figured maybe there is a better solution out there. Perhaps with a widely-adopted jQuery plugin? I do not want to use anything that requires intrusive code such as requiring a certain css class or something.
Thanks.
EDIT - I also need this to work for password input fields.
// the below snippet should work, but isn't.
$(document).ready(function() {
initPlaceholders()();
}
function initPlaceholders() {
$.support.placeholder = false;
var test = document.createElement('input');
if ('placeholder' in test) {
$.support.placeholder = true;
return function() { }
} else {
return function() {
$(function() {
var active = document.activeElement;
$('form').delegate(':text, :password', 'focus', function() {
var _placeholder = $(this).attr('placeholder'),
_val = $(this).val();
if (_placeholder != '' && _val == _placeholder) {
$(this).val('').removeClass('hasPlaceholder');
}
}).delegate(':text, :password', 'blur', function() {
var _placeholder = $(this).attr('placeholder'),
_val = $(this).val();
if (_placeholder != '' && (_val == '' || _val == _placeholder)) {
$(this).val(_placeholder).addClass('hasPlaceholder');
}
}).submit(function() {
$(this).find('.hasPlaceholder').each(function() { $(this).val(''); });
});
$(':text, :password').blur();
$(active).focus();
});
}
}
}

We just researched the same thing. We decided on reusing this gist, by Aaron McCall, after making some minor changes. The main advantage is that it's simple, easy to understand code:
Remove the kernel and setup_placeholders parts. Just call it immediately in an anonymous function.
Add var before test.
For browsers that support placeholder, it simply falls back to that. It also handles new input elements (note the use of delegate) in existing forms. But does not handle dynamic new form elements. It could probably be modified to do so with jQuery.on.
If you don't like this one, you can use one of the ones here. However, some of them are overcomplicated, or have questionable design decisions like setTimeout for detecting new elements.
Note that it needs to use two pairs of parens, since you're calling an anonymous function, then calling the returned function (this could be factored out differently):
(function () {
// ...
})()();

I wrote a jquery plugin a while back that adds the placeholder support to any browser that does not support it and does nothing in those that do.
Placeholder Plugin

Here's a jQuery plugin that works with password fields as well. It's not as tiny as the code suggested by Matthew but it has a few more fixes in it. I've used this successfully together with H5Validate as well.
http://webcloud.se/code/jQuery-Placeholder/

SSRS Report Viewer Control Browser Compatibility

How compatible is the MS Report Viewer Control with browsers like Firefox and Safari?
Please also post if you know any 3rd party report viewers for SSRS.

Edit - 2016/2017 Update
SSRS 2016+ can be said to be cross-browser compatible.
Table borders aren't displaying right in IE10, but IE10 is dying out anyway.
In the rest of the browsers, it's fine.
You still need to register add_pageLoaded to translate the parameter prompts.
Sys.WebForms.PageRequestManager.getInstance().add_pageLoaded(function () { fixReportingServices('rpt-container'); });
Also, like in versions < 2016, you need to add PageCountMode="Actual" to RS:ReportViewerHost control.
<RS:ReportViewerHost ID="ReportViewerControl" PageCountMode="Actual" runat="server" />
if you want to have meaningful paging numbers.
Also, there's a problem when you set the language in the query string with datepickers (with SSRS < 2016 as well). You need to set context.Request.UserLanguages[i] to the language specified in the query-string in context.BeginRequest in a HTTP-Module, if you want datepicker to work with a non-browser language.
Also, you need to add the X-Frame-Options and Content-Security-Policy HTTP-headers in each HTTP-response, if you want to use SSRS in an iframe in the internet securely. See my github-repository for details.
</EndEdit>
Pre-2016:
I can tell you, I have 9 years experience with the damn thing (SSRS 2005, SSRS 2008 R1 & R2, 2012, and SSRS 2014).
Let me assure you that because SSRS HTML reports depend on IE5-Quirksmode, there is no chance in hell they will ever render correctly in any browser other than Internet Explorer (IE < 10 I might be inclined to add).
IF you have admin access to the reportserver, and I stress the IF, you can add jQuery routines and CSS on the ReportViewer page to correct the most basic problems (like that you don't see more than 1cm of the report), but otherwise, the HTML rendering will still look absolutely horrible (margins, table borders, picture paddings, column size, textfield-size, title and/or pagenumber-alignment, etc., in short - just about anything)
Of course, the ActiveX printer control can only ever work in InternetExplorer (on Windows), because only there ActiveX are supported.
Let me also assure you, there is absolutely no way in hell to get ReportManager working in any other browser than IE.
As for Internet Explorer support, it should be mentioned, that starting as of IE version 10, IE defaults to webkit-quirksmode (for compatibility reasons) instead of IE5 quirksmode, so the HTML rendered will look equally horrible as in Chrome/Firefox/Safari for IE 10+, unless you added meta xua-compatible IE5 in the ReportViewer.aspx page.
The latter might not apply for Intranet, as IE automatically falls back to IE 7 compatibility mode when it's on an intranet site (but only in any Windows version < 8).
In Windows 8, localhost links and computername links (can't add the http:// in stackoverflow posts) are not assigned to the local intranet zone (probably as quick hack so IE doesn't fall back to IE7 compatibility mode), and therefore, Windows authentication will FAIL.
It should also be mentioned that it's not possible to add meta xua-compatible IE5 for ReportManager, because there is no page you can edit (compiled non-updateable ASP.NET website-project... ).
And that short of using the dev-tools to switch reportmanager in quirksmode, it's not possible to use ReportManager in IE 10+.
Then, another thing to mention is, that starting as of IE9, IE inherits the doctype of iframe elements from the parent page, and there is no way in hell to change that either (without changing the parent page to the desired child-page doc-mode).
So if you were clever enough to use iframes for the reports, because there is no way in hell any sane person wants popups in the age of popup-blockers, the report page will inherit the parent page's doctype. If that isn't IE5-QuirksMode, it will render the reports equally horrible as on Safari/Chrome/Firefox/Opera for any IE > 8, irrespecive of any possible meta xua-compatible ie5 tag in ReportViewer.aspx.
As for alternatives, for free and with a similar feature-set, there is only Eclipse BIRT (fortunately, the HTML rendering isn't similar).
It should be mentioned that BIRT, although licensed under the Eclipse Public License, uses SUN Java and therefore you are using Oracle technology, which is subject to its respective licensing terms.
Also, you are using non-Microsoft technology, and the Excel-Sheets BIRT renders are actually XML files, which will produce (who would have guessed) a rather alarming warning when opening in Office 2010+.
Then, for a rather large fee, there is http://www.stimulsoft.com reports, and Telerik reports.
From the technical looks of it, I'd recommend stimulsoft reports, but: disclaimer, i haven't used either of these, because they aren't free.
As for alternative SSRS rendering engines (not viewers btw), there is only www.fyireporting.com/‎, which has a fork here http://www.codeproject.com/Articles/138271/An-Open-Source-RDL-Engine.
But fyiReporting is incomplete and work in progress (if not abandoned), so I would refrain from using it.
Bottom line, if your product is IE & windows only, with windows version < 8 (and no - not <= just in case you haven't been paying attention), in intranet, called from pop-ups and not iframes, then go with SSRS.
For anything else, use stimulsoft reports (the problem is, you have to redo all your reports, as there is no automated migration - not even a non-working one).
PS:
And by adding "a little javascript", i mean the below thing(2008 R1 Edition, won't work on 2008R2+, may work on 2005, and note that you need to embed jQuery and jQuery Migrate in an inline-script tag, if the client PC's don't have access to http(s)://ajax.aspnetcdn.com [note: putting the scripts into the Pages folder and adding a relative or absolute link won't work...]):
<%# Register TagPrefix="RS" Namespace="Microsoft.ReportingServices.WebServer" Assembly="ReportingServicesWebServer" %>
<%# Page Language="C#" AutoEventWireup="true" Inherits="Microsoft.ReportingServices.WebServer.ReportViewerPage" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<%= System.Web.HttpContext.Current.Request.Browser.Browser == "IE" && System.Globalization.CultureInfo.InvariantCulture.CompareInfo.IndexOf(System.Convert.ToString(System.Web.HttpContext.Current.Request.QueryString), "stylesheet", System.Globalization.CompareOptions.IgnoreCase) == -1 ? (System.Web.HttpContext.Current.Request.Browser.Browser != "IE" ? "": "<meta http-equiv=\"X-UA-Compatible\" content=\"IE=5\">") : "<meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge,chrome=1\">" %>
<head id="headID" runat="server">
<title>Report Viewer</title>
<script type="text/javascript" src="//ajax.aspnetcdn.com/ajax/jQuery/jquery-1.9.1.min.js"></script>
<script type="text/javascript" src="//ajax.aspnetcdn.com/ajax/jquery.migrate/jquery-migrate-1.1.0.min.js"></script>
<script type="text/javascript">
var bInFrameOrIframe = false;
var iLanguageIndex = 0;
var language = "DE_LOL";
var UpdateLock = false;
if (window.self === window.top) {
// alert("true");
// not in a frame
// Use IE5 quirksmode
//document.writeln('<meta http-equiv="X-UA-Compatible" content="IE=5" />');
bInFrameOrIframe = false
}
else {
// in a frame, FMS
bInFrameOrIframe = true;
}
function TranslateParameterPrompts() {
//mTo = false;
$("table[id^='ParametersGridReportViewerControl'] span").each(function(index) {
var strText = $(this).text();
if (strText != null && strText.indexOf('/') != -1) {
strText = strText.split('/');
if (iLanguageIndex < strText.length)
strText = strText[iLanguageIndex];
else {
if (strText.length > 0)
strText = strText[0];
}
$(this).text(strText);
}
});
//setTimeout(function(){mTo = true}, 5000);
}
function setTableSize() {
//$("[id$='ReportViewerControl']")
$(
$(
$("#ReportFrameReportViewerControl")[0].contentWindow.document
)
.find("[id$='report']")[0].contentWindow.document.body
).find('*')
.each(function() {
//console.log("Processing an element");
//var cls = $(this).attr("class");
try {
// Don't add a border to sort-arrow
if ($(this).is('img')) {
return;
}
var anywidth = $(this).css('width');
var anywidth = parseFloat(anywidth);
//console.log("anywidth: " + anywidth);
//var lol = $(this).css('borderLeftWidth');
var blw = $(this).css('border-left-width');
var brw = $(this).css('border-right-width');
var btw = $(this).css('border-top-width');
var bbw = $(this).css('border-bottom-width');
var borls = $(this).css('border-left-style') == "solid";
var borrs = $(this).css('border-right-style') == "solid";
var borts = $(this).css('border-top-style') == "solid";
var borbs = $(this).css('border-bottom-style') == "solid";
var blw = parseFloat(blw);
var brw = parseFloat(brw);
var btw = parseFloat(btw);
var bbw = parseFloat(bbw);
//parseInt($(this).css("borderRightWidth"))
//console.log(parseInt($(this).css("borderLeftWidth")));
UpdateLock = true;
// Set width to 1px where 0px
if (anywidth == 0)
$(this).css('width', '1px');
if (borls && blw == 0.0 || (blw > 0.0 && blw < 1.0)) {
//console.log("setting border width");
$(this).css('border-left-width', '1px');
}
if (borrs && brw == 0.0 || (brw > 0.0 && brw < 1.0)) {
$(this).css('border-right-width', '1px');
}
if (borts && btw == 0.0 || (btw > 0.0 && btw < 1.0)) {
$(this).css('border-top-width', '1px');
}
if (borbs && bbw == 0.0 || (bbw > 0.0 && bbw < 1.0)) {
$(this).css('border-bottom-width', '1px');
}
UpdateLock = false;
}
catch (ex) {
UpdateLock = false;
//console.log(ex);
}
}); // End $('*').each
// console.log("loop");
var $img = $("img[onload^='this.fitproportional=true']");
if ($img == null) {
// console.log("img is null");
return;
}
var $div = $img.parent();
if ($div == null) {
// console.log("div is null");
return;
}
UpdateLock = true;
{
$img.removeAttr("height");
$img.css('max-width', '100%')
$img.css('max-height', '100%')
$div.css('text-align', 'right');
var divMinWidth = parseFloat($div.css('min-width'));
var divWidth = parseFloat($div.css('width'));
var divMinHeight = parseFloat($div.css('min-height'));
var divHeight = parseFloat($div.css('height'));
// console.log("width: " + divWidth);
// console.log("height: " + divHeight);
// console.log("min-width: " + divMinWidth);
// console.log("min-height: " + divMinHeight);
if (divMinWidth != 0)
$div.css('width', $div.css('min-width'));
if (divMinHeight != 0)
$div.css('height', $div.css('min-height'));
}
UpdateLock = false;
}
$(document).ready(function() {
switch (language) {
case "fr":
iLanguageIndex = 1;
break;
case "it":
iLanguageIndex = 2;
break;
case "en":
iLanguageIndex = 3;
break;
default: // "DE"
iLanguageIndex = 0;
}
TranslateParameterPrompts();
// setInterval(function() { TranslateParameterPrompts() }, 100);
if ($.browser.msie && !bInFrameOrIframe)
return;
// if ($.browser.webkit)
//setTableSize();
$("[id$='ReportFrameReportViewerControl']").load(function() {
//setNewHeight();
//alert("Loading");
setTableSize();
$(
$("[id$='ReportFrameReportViewerControl']")[0].contentWindow.document
)
.find("[id$='report']").load(function() {
//alert("load report");
setTableSize();
}
); // End load #report
}); // End Function load #ReportFrameReportViewerControl
}); // End Function document.ready
</script>
</head>
<body style="margin: 0px; overflow: auto">
<form style="width:100%;height:100%" runat="server" ID="ReportViewerForm">
<RS:ReportViewerHost ID="ReportViewerControl" runat="server" />
</form>
</body>
</html>
Note: UpdateLock stems from 2012 backport and is not really used here, and language stems from backport too, setInterval on TranslateParameterPrompts is necessary in 2012
and function
for 2012 has only the little addition of "label" in the jQuery selector...
function TranslateParameterPrompts() {
//mTo = false;
$("table[id^='ParametersGridReportViewerControl'] label span").each(function(index) {
var strText = $(this).text();
if (strText != null && strText.indexOf('/') != -1) {
strText = strText.split('/');
if (iLanguageIndex < strText.length)
strText = strText[iLanguageIndex];
else
{
if(strText.length > 0)
strText = strText[0];
}
$(this).text(strText);
}
});
//setTimeout(function(){mTo = true}, 5000);
}
Infering the language from the browser language goes like this, btw:
<script type="text/javascript">
language = <%= System.Web.HttpContext.Current.Request.UserLanguages != null ? "\"" + System.Convert.ToString(System.Web.HttpContext.Current.Request.UserLanguages[0]) + "\"" : "null" %>;
if(language == null)
language = window.navigator.userLanguage || window.navigator.language;
if(language != null)
language = language.substr(0,2).toLowerCase();
</script>
And in 2012 you need to Dispose of the session cookies, otherwise you get "HTTP 400: Header too long" after opening about 120 reports:
<script type="text/C#" runat="server">
protected string ClearSessionKeepAliveCookiesToPreventHttp400HeaderTooLong()
{
if(Request == null || Request.Cookies == null)
return "";
if(Request.Cookies.Count < 60)
return "";
// System.Web.HttpContext.Current.Response.Write("<h1>"+Request.Cookies.Count.ToString()+"</h1>");
for(int i = 0; i < System.Web.HttpContext.Current.Request.Cookies.Count; ++i)
{
if(StringComparer.OrdinalIgnoreCase.Equals(Request.Cookies[i].Name, System.Web.Security.FormsAuthentication.FormsCookieName))
continue;
if(!Request.Cookies[i].Name.EndsWith("_SKA", System.StringComparison.OrdinalIgnoreCase))
continue;
if(i > 60)
break;
//System.Web.HttpContext.Current.Response.Write("<h1>"+Request.Cookies[i].Name+"</h1>");
System.Web.HttpCookie c = new System.Web.HttpCookie( Request.Cookies[i].Name );
//c.Expires = System.DateTime.Now.AddDays( -1 );
c.Expires = new System.DateTime(1970, 1 ,1);
c.Path = Request.ApplicationPath + "/Pages";
c.Secure = false;
c.HttpOnly = true;
// http://stackoverflow.com/questions/5517273/httpcookiecollection-add-vs-httpcookiecollection-set-does-the-request-cookies
//Response.Cookies[Request.Cookies[i].Name] = c;
//Response.Cookies.Add(c);
Response.Cookies.Set(c);
}
return "";
}
</script>
And on 2012, you need to listen to content update, because it uses Microsoft Ajax controls
function cbOnContentUpdate() {
//console.log("content update");
alterTableBorderWidth();
// TranslateParameterPrompts();
} // End Callback cbOnContentUpdate
var hLastTimeout = null;
function queueUpdate() {
if (UpdateLock)
return;
if (hLastTimeout != null)
clearTimeout(hLastTimeout);
hLastTimeout = window.setTimeout(function() { cbOnContentUpdate(); }, 50);
//window.setTimeout(function() { cbOnContentUpdate(); }, 3000);
} // End Function queueUpdate
$(document).ready(function() {
switch (language) {
case "fr":
iLanguageIndex = 1;
break;
case "it":
iLanguageIndex = 2;
break;
case "en":
iLanguageIndex = 3;
break;
default: // "DE"
iLanguageIndex = 0;
}
setInterval(function() { TranslateParameterPrompts() }, 100);
// opt-out for non-framed IE, because that crook supports IE5-Quirks (framed takes parent-doctype in IE >= 9)
if ($.browser.msie && !areWeInFrame())
return;
// if ($.browser.webkit)
// console.log('Setting event listener!');
// http://stackoverflow.com/questions/4979738/fire-jquery-event-on-div-change
//$("[id$='ReportViewerControl']").bind('DOMNodeInserted DOMNodeRemoved', function(event) {
//$("[id$='ReportArea']")
$("body")
.bind('DOMNodeInserted DOMNodeRemoved DOMSubtreeModified', function(event) {
if (event.type == 'DOMNodeInserted') {
//console.log('Content added! Current content:' + '\n\n' + this.innerHTML);
//console.log('Content added!');
queueUpdate();
}
else {
//console.log('Content removed! Current content:' + '\n\n' + this.innerHTML);
//console.log('Content removed!');
queueUpdate();
}
}); // End Bind IRM
}); // End Function $(document).ready
And note that for 2012, setTableSize is alterTableBorderWidth, and the selector goes like this:
function alterTableBorderWidth()
{
//$('*')
$("[id$='ReportViewerControl']").find('*')
.each(function() {
Btw, if you want to remove the PRINT icon, because it's only a source of sorrow, that goes like this (for German, English, French and Italian [the languages spoken in Switzerland + English]).
This CSS is for 2008 R1, don't know and care if it's the same in 2012.
input[type="image"][title="Drucken"], input[type="image"][title="Print"], input[type="image"][title="Imprimer"], input[type="image"][title="Stampa"]
{
display: none !important;
}
And if that still doesn't deter you, then go right ahead and use forms authentication in SSRS 2012 (hint 1: there is no ms-provied sample as for 2005-2008R2, you need to write it yourself) ;)
Hint2: if you followed hint1, forms authentication redirect doesn't work when you have a colon in the URL [bug?], you can steal the code from mono and write your own redirect.
Hint3: if you followed hint2 and got forms authentication working, then you probably want to change the upload tool you're going to write, because you won't like to do manually "for each report browse-directory - check allow override checkbox - upload report - set datasource) for 120 reports or so, then you will be inheriting a class from ReportingService2005 and override GetWebRequest and GetWebResponse
''' <summary>
''' Overriding the method defined in the base class.
''' </summary>
''' <param name="uri"></param>
''' <returns></returns>
Protected Overrides Function GetWebRequest(uri As Uri) As System.Net.WebRequest
Dim request As System.Net.HttpWebRequest
request = DirectCast(System.Net.HttpWebRequest.Create(uri), System.Net.HttpWebRequest)
request.Credentials = MyBase.Credentials
request.CookieContainer = New System.Net.CookieContainer()
If m_authCookie IsNot Nothing Then
request.CookieContainer.Add(m_authCookie)
End If
Return request
End Function ' GetWebRequest
''' <summary>
''' Overriding the method defined in the base class.
''' </summary>
''' <param name="request"></param>
''' <returns></returns>
Protected Overrides Function GetWebResponse(request As System.Net.WebRequest) As System.Net.WebResponse
Dim response As System.Net.WebResponse = MyBase.GetWebResponse(request)
' http://social.msdn.microsoft.com/Forums/sqlserver/en-US/f68c3f2f-c498-4566-8ba4-ffd5070b8f7f/problem-with-ssrs-forms-authentication
Dim cookieName As String = response.Headers("RSAuthenticationHeader")
If cookieName IsNot Nothing Then
m_authCookieName = cookieName
Dim webResponse As System.Net.HttpWebResponse = DirectCast(response, System.Net.HttpWebResponse)
Dim authCookie As System.Net.Cookie = webResponse.Cookies(cookieName)
' Save it for future reference and use.
m_authCookie = authCookie
End If
Return response
End Function ' GetWebResponse
Hint 4: The above methods won't work if you haven't installed service pack 1 + 2 on SSRS 2008 R2...
Hint 5: The TranslateParameters method is there because you cannot (by design) translate the parameter prompts to multiple languages by SSRS, so you write:
Raum / Local / Locale / Room
which uses schema:
Text_DE / Text_FR / Text_IT / Text_EN
And then do split by '/' on the text (which is a little error prone if your prompt text contains '/' somewhere), and then select the right text by index of the language, by choosing MIN(splitarray.length, index) btw, just in case somewhere you only have Text_DE / Text_FR or whatever, first checking if the text contains a '/' at all, of course.
Hint 6:
Need I go on ? (i could still expand this post to tenfold size, but I think I should go back to work now :) )
If you want to see just how f*up it looks, this is how vanilla ssrs renders in chrome
This is what it looks like in IE11, with IE5 compatibility set via xua
And this is what it should be, and what you can get it to render with much tinkering with javascript and CSS
Addendum:
Oh, and it gets even better
If you want to run reportviewer in a language specified by your application (which is NOT identical to the browser language), you need to set the culture of reportviewer to the culture specified in your query string...
<script type="text/C#" runat="server">
protected override void InitializeCulture()
{
string sprache = System.Web.HttpContext.Current.Request.QueryString["in_sprache"];
// System.Web.HttpContext.Current.Response.Write(sprache);
switch(System.Globalization.CultureInfo.InvariantCulture.TextInfo.ToLower(sprache))
{
case "fr":
sprache = "fr-CH";
break;
case "it":
sprache = "it-CH";
break;
case "en":
sprache = "en-US";
break;
default:
sprache = "de-CH";
break;
}
// System.Web.HttpContext.Current.Response.Write(sprache);
System.Threading.Thread.CurrentThread.CurrentCulture = System.Globalization.CultureInfo.CreateSpecificCulture(sprache);
System.Threading.Thread.CurrentThread.CurrentUICulture = new System.Globalization.CultureInfo(sprache);
base.InitializeCulture();
}
</script>
If you want to set a static culture, you can do so in the page declaration
<%# Page UICulture="de" Culture="de-CH" %>
And if you try to remove the the print icon and the atom-feed, doing it with styles, no matter how, it only works in Chrome...
input[type="image"][title="Drucken"], input[type="image"][title="Print"], input[type="image"][title="Imprimer"], input[type="image"][title="Stampa"]
{
display: none !important;
}
input[type="image"][title="In Datenfeed exportieren"], input[type="image"][title="Exporter vers un flux de données"], input[type="image"][title="Esporta in feed di dati"], input[type="image"][title="Export to Data Feed"]
{
display: none !important;
}
*/
input[type="image"][src$="Microsoft.Reporting.WebForms.Icons.Print.gif"] {
display: none !important;
}
input[type="image"][src$="Microsoft.Reporting.WebForms.Icons.AtomDataFeed.gif"] {
display: none !important;
}
But you can actually remove at least the print icon in internet-explorer by adding ShowPrintButton="false" to the reportviewer control:
<RS:ReportViewerHost ID="ReportViewerControl" ShowPrintButton="false" runat="server" />
Another idea: in SSRS 2012 & 2014 (and possibly 2008R2), you can also add your SSRS-fixing javaScript method into add_pageLoaded of ScriptManager. Like this:
Sys.WebForms.PageRequestManager.getInstance().add_pageLoaded(function () { fixReportingServices('rpt-container'); });
Then you don't have to listen to page change events, which speeds things up, because loaded is only called once at the end of each update.
WARNING
Because in the Internet, IE doesn't default to compatibility view,
<meta http-equiv="X-UA-Compatible" content="IE=5">
won't help you with certain issues either (rotate270 text/vertical text).
Even in IE, it only works properly when you are in the intranet, because only then it uses "compatibility view". While the meta-tag sets the brower into IE5-Quirksmode, it doesn't enable "compatibility view", so it isn't the true quirksmode...

MS Report Viewer Control will work fine in IE only.
You can see the Reports from other browsers but you cannot able to view Zoom Option

See the following MSDN articles for browser compabilities and the ReportViewer controls:
Browser Support for ReportViewer Web Server Controls
Browser Support in Reporting Services

I have not noticed any real issue with it being displayed in Firefox or Safari. At times I think it might be getting rendered better in Firefox, but I don't have any actual benchmarks to back that up.

From the hip and perhaps a little stale. ASP.NET used to treat any non IE browser as a box of rocks. May be worth looking into if your experience problems.
http://weblogs.asp.net/fmarguerie/archive/2005/01/04/346222.aspx

SSRS works perfectly on IE6,7,8. It works on Firefox and Safari, but with displaying issues.
There are two possible solutions to fix those, test and see whichever works for you.
Solution 1
Go to
C:\Program Files\Microsoft SQL
Server\MSSQL.(your report server
instance)\Reporting
Services\ReportServer\Pages\reportviewer.aspx
Update style as
<body style="margin: 0px; overflow: auto"> ... <RS:ReportViewerHost style="display:table;" ID="ReportViewerControl" runat="server" />
Solution 2
Add following changes to stylesheet:
.DocMapAndReportFrame { min-height: 660px; min-width: 1280px; }
.MenuBarBkGnd { min-width:1000px; }

Rendering issues exist with Firefox, Chrome and Safari. I know for Firefox and Chrome, there are IE Add-ins that allow you to run the report in a Firefox/Chrome tab.