Browse Another Website Inside MVC Application - asp.net-mvc

I have an existing web application which I want to display inside my new application, so as to the complete application works inside the new application.
In the image i've attached google.com so on search of something is should show the result or even open the website.
I'm not sure how to achieve that.
One way I found is IFrame, so would I to know any other possibilities are their as I do want to use IFrame
Attaching an Image for an example
Thanks in advance.

Maybe you can use something like fancybox tools. http://fancyapps.com/fancybox/#examples
But usually these tools are also using iframes. Maybe you can find another way for fancybox.
edit:Embed an External Page Without an Iframe?
edit 2: did you try this?
http://www.felgall.com/noiframe.htm
<html>
<head>
<title>example</title>
</head>
<body>
Ilker Test
<br />
<!--[if lte IE 6]>
<object classid="CLSID:25336920-03F9-11CF-8FD0-00AA00686F13"
data="http://www.w3schools.com/html/html_examples.asp" style="height:800px; width:1200px; overflow:hidden;">
</object>
<![endif]-->
<!--[if gte IE 7]><!-->
<object type="text/html" data="http://www.w3schools.com/html/html_examples.asp"
style="height:800px; width:1200px;">
<p>Alternate text.</p>
</object>
<!--><![endif]-->
</object>
</body>

Related

moving photos from resource/static/images to local drive

I am moving photos from resource/static/images. in spring boot to local drive d:\images
while the photos were in resource/static/images I used the following code to display them in Thymeleaf.
<img th:src="#{/images/one.jpg}">
now I have moved the photos to "d:\images" folder this following code line does not work:
<resources mapping="/resources/**" location="d:/images/three.jpg/" />
the question is, how can I access the photos from local "d:\images" folder?
I am using spring boot with thymeleaf to build a basic web site, to practice the skills I have gained through online courses I have completed. since I am new to creating web site, I am not sure I have any XML file, Spring boot might have created one for me. I was thinking to put the photos in mysql table, but they might make the table heavy to load to web browser. I read somewhere that you can put the photos on the local desk drive such as c: or d: drive. or you put the photos in a folder in server, the problem is have no clue how to do it.
here my html:
<!DOCTYPE html>
<html>
<head>
<meta charset="ISO-8859-1">
<title>sport for all </title>
<a th:href="#{index}">Main Page</a>
</head>
<body>
<div>
<h1></h1>Hi
<p>
hello
hello
hello
</p>
<resources mapping="/resources/**" location="d:/images/three.jpg/" />
</div>
</body>
</html>
The simplest solution in Spring Boot would be to use the spring.resources.static-locations property:
spring.resources.static-locations=classpath:/META-INF/resources/,classpath:/resources/,classpath:/static/,classpath:/public/,file:///D:/images/
Documentation
Tutorial
Similar question on SO

PNG files not found in ASAR

I have an Electron (1.7.10) application that is reporting it can't find 5 of 7 PNG files in my ASAR. All 7 PNGs are in the same folder, and 2 of them are displayed on screen fine. The other 5 report net::ERR_FILE_NOT_FOUND.
All src attributes for the img tags are dynamically generated and use relative paths (assets/images/MyImage.png). If I extract the ASAR, I can see the files in there, in the correct folder (as referenced by the src attribute).
If I use the console to set the location of my browser to one of the images (document.location.href = "file:///path/to/app.asar/dist/assets/images/MyImage.png") I get the same results - 2 of 7 show OK.
Before packaging my application (with electron-builder), all images show correctly.
Let me guess, you are building a react SPA using react-router, and BrowserRouter?
If so, use HashRouter instead. Electron does not work with SPA's route by default, because a SPA route changes, but the resource path is always relative to index.html.
I haven't evaluated the other answers, but for my particular case, an extremely solution worked. I don't believe this is well documented, so it might be fairly common for people to still encounter this issue. For my particulars, the relevant problem and solution were identified here.
To address, add <base href='./' /> to the index.html (or whatever your starting html file is that hosts your SPA). This is a complete example of mine:
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<base href="./" />
<link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="theme-color" content="#000000" />
<meta
name="description"
content="Web site created using create-react-app"
/>
<meta
http-equiv="Content-Security-Policy"
content="script-src 'Self' 'unsafe-inline';"
/>
<link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
<!--
manifest.json provides metadata used when your web app is installed on a
user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
-->
<link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
<!--
Notice the use of %PUBLIC_URL% in the tags above.
It will be replaced with the URL of the `public` folder during the build.
Only files inside the `public` folder can be referenced from the HTML.
Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
work correctly both with client-side routing and a non-root public URL.
Learn how to configure a non-root public URL by running `npm run build`.
-->
<title>React App</title>
</head>
<body>
<noscript>You need to enable JavaScript to run this app.</noscript>
<div id="root"></div>
</body>
</html>
const path = require('path');
path.join(__dirname, 'assets/images/MyImage.png');

Omniture tag within frameset not working

I am implementing omniture tags in one of my projects. The omniture tags are being provided by a client. The problem is the web application loads a and the omniture tag is inside that . Now, for some reason the omniture tags are not being fired. I opened the omniture debugger and there are no tags being tracked. For testing purpose I remove the and the omniture tag started working.
Here is the sample of the problem HTML:
<frameset>
<frame id="pageFrame">
#document
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
</head>
<body>
<div id="somediv">
<script type="text/javascript" language="javascript" src="tracking.JS"></script>
<script type="text/javascript">
<!--
console.log("Testing");
s.channel="test";
s.prop50=s.channel+":INTERNET";
s.pageName=s.prop50+":User name";
//-->
</script>
<script type="text/javascript" language="javascript" src="morescript.JS"></script>
</div>
</body>
</html>
</frame>
</frameset>
Are there any known inherent issues with Omniture inside ? Any ideas?
Thanks.
The debugger often does not display image requests in frames. I would recommend in this instance to use a packet monitor, such as Chrome's Network tab in Developer Tools or HTTPFox.
The latest version of the debugger may prove useful as well, however your mileage may vary in respect to frames.

Facebook helper not appearing in MVC4

I created a new test project in MVC4 to test if I could use Facebook Helper from the Nuget gallery. I followed the instructions which are very simple, point and click to install the Facebook helper from Nuget, edit your page, and insert like button.
When I run the project I can actually see the facebook likebutton being generated when I view it through firebug, but it does not appear on the page.
Here is my default index page
#{
ViewBag.Title = "Home Page";
}
#section featured {
<section class="featured">
<div class="content-wrapper">
<hgroup class="title">
<h1>#ViewBag.Title.</h1>
<h2>#ViewBag.Message</h2>
</hgroup>
<p>
To learn more about ASP.NET MVC visit
http://asp.net/mvc.
The page features <mark>videos, tutorials, and samples</mark> to help you get the most from ASP.NET MVC.
If you have any questions about ASP.NET MVC visit
our forums.
</p>
</div>
</section>
}
<h3>We suggest the following:</h3>
<div>
#Facebook.LikeButton()
</div>
I´ve gone through several pages regarding Facebook helper and they all describe the process in the same way. Does anyone know if I should config any files before using this library?
Edited:
I will paste my html code that is loaded into the markup after execution. I will abbreviate some scripts and stuff since it has many hundreds of line of code :)
<html id="facebook" class="" lang="en">
<head>
<meta charset="utf-8">
<script>
<script>
<noscript><meta http-equiv="refresh" content="0; URL=/plugins/like.php?href=http%3A%2F%2Flocalhost%3A13876%2F&layout=standard&show_faces=src&width=450&action=like&colorscheme=light&height=80&font&locale=en_US&ref&_fb_noscript=1" /></noscript>
<meta content="noodp, noydir" name="robots">
<meta id="meta_referrer" content="default" name="referrer">
<meta content="Facebook is a social utility that connects people with friends and others who work, study and live around them. People use Facebook to keep up with friends, upload an unlimited number of photos, post links and videos, and learn more about the people they meet." name="description">
<link href="https://www.facebook.com/plugins/like.php?href=http%3A%2F%2Flocalhost%3A13876%2F&layout=standard&show_faces=src&width=450&action=like&colorscheme=light&height=80&font&locale=en_US&ref" media="handheld" rel="alternate">
<title>Facebook</title>
<link href="https://fbstatic-a.akamaihd.net/rsrc.php/v2/yc/r/-WUN6qLbp5n.css" rel="stylesheet">
<link href="https://fbstatic-a.akamaihd.net/rsrc.php/v2/yf/r/gd49XKRAMNQ.css" rel="stylesheet">
<link href="https://fbstatic-a.akamaihd.net/rsrc.php/v2/yc/r/XaOowWd9_Aq.css" rel="stylesheet">
<link href="https://fbstatic-a.akamaihd.net/rsrc.php/v2/yH/r/Dpn1SKTH3-z.css" rel="stylesheet">
<script src="https://fbstatic-a.akamaihd.net/rsrc.php/v2/yB/r/Vm1JnKckidu.js">
<script src="https://fbstatic-a.akamaihd.net/rsrc.php/v2/y-/r/ARN_8tuLdws.js">
<script src="https://fbstatic-a.akamaihd.net/rsrc.php/v2/yq/r/XboiPeV3jQI.js">
<script>
<script>
<script src="https://fbstatic-a.akamaihd.net/rsrc.php/v2/yP/r/eTzqwp1jxjF.js" async="">
<script src="https://fbstatic-a.akamaihd.net/rsrc.php/v2/yh/r/aTzvHAZI_Jd.js" async="">
</head>
<body class="plugin ff4 win Locale_en_US">
<div id="FB_HiddenContainer" style="position:absolute; top:-10000px; width:0px; height:0px;"></div>
<script>
<script>
<script>
</body>
</html>
See where in the Url it generates (link href="https://www.facebook...) it says "&show_faces=src"
That causes the problem; it should be "&show_faces=true"
Even though true is supposed to be the default, if you have this issue try changing it to: #Facebook.LikeButton(showFaces: false)
EDIT: this only helps if you set it to false. Same issue with LikeBox and all boolean properties.
If the HTML is being rendered I can only assume the problem it's a CSS problem, check the styling of the elements in FireBug and make sure they aren't being hidden e.g. check for display: none or visibility: hidden or make sure there isn't float applied which is taking it off the screen.

JQuery SimpleModel Plugin and MVC

Has anyone ever been successful at getting the SimpleModel jquery pluggin to work in asp.net mvc? If so how did you implement it, I can't seem to get the dialog to even display.
I am assuming you are talking about the SimpleModel jquery plugin found at http://www.ericmmartin.com/projects/simplemodal/ and that you've already got a basic ASP.NET MVC application setup.
I am going to run through how you can get the Basic Modal Dialog example working.
Get the plugin files into your ASP.NET MVC application
Download the example from the demos link on the link above and unzip it.
Copy the basic.css and basic_ie.css files into the Content folder of your ASP.NET MVC application.
Also copy the img folder into the Content folder of your ASP.NET MVC application.
Lastly, copy the javascript files in js folder into the Scripts folder of your ASP.NET MVC application.
Reference the stylesheet and javascript files in your application
Open your Site.Master file under Views\Shared and paste the code below before the </head> tag
<link type='text/css' href='../../Content/basic.css' rel='stylesheet' media='screen' />
<!-- IE 6 "fixes" -->
<!--[if lt IE 7]>
<link type='text/css' href='../../Content/basic_ie.css' rel='stylesheet' media='screen' />
<![endif]-->
<script type='text/javascript' src='../../Scripts/jquery.js'></script>
<script type='text/javascript' src='../../Scripts/jquery.simplemodal.js'></script>
<script type='text/javascript' src='../../Scripts/basic.js'></script>
Finally, call the dialog in your view
For example in Index.aspx, you can paste the following code:
<div id='basic-modal'><h2>Basic Modal Dialog</h2>
<p>A basic modal dialog with minimal styling and without any additional settings. There are a few CSS attributes set internally by SimpleModal, however, SimpleModal relies mostly on external CSS for the look and feel.</p>
<input type='button' name='basic' value='Demo' class='basic demo'/> or <a href='#' class='basic'>Demo</a>
</div>
<div id="basic-modal-content">
<h3>Basic Modal Dialog</h3>
<p>For this demo, SimpleModal is using this "hidden" data for its content. You can also populate the modal dialog with standard HTML or with DOM element(s).</p>
<p>Examples:</p>
<p><code>$('#basicModalContent').modal(); // jQuery object; this demo</code></p>
<p><code>$.modal(document.getElementById('basicModalContent')); // DOM</code></p>
<p><code>$.modal('<p><b>HTML</b> elements</p>'); // HTML</code></p>
<p><a href='http://www.ericmmartin.com/projects/simplemodal/'>More details...</a></p>
</div>
Hope that helps.
Matrich

Resources