I'm starting to work on a PhoneGap/Cordova project (focusing on Android for now). I'm trying to load a remote URL (and that seems to work fine, modified it in the Activity class (loadUrl("http://10.0.3.2");. However, there are certain files and drawables, if I modify in my Assets folder for instance, get reset back to their original state. For instance, in index.js I'm changing the onDeviceReady method to do this:
onDeviceReady: function() {
alert(navigator.userAgent); // I've added this line and it alerts null anyway?
app.receivedEvent('deviceready');
},
When I run phonegap run android, the build that gets made will include that alert function but when I go back to my Editor (PHPStorm in this case), it will inform me that the file has been editted outside the IDE and when it gets reloaded my alert is no longer there. I've googled this repeatedly (PhoneGap resetting code on build; as well as other queries) but I can't find an answer to what's going on.
Why is this happening?
You need to edit the files in the root www folders and not in the platform specific www folders (platforms/android/assets/www). Unless you code platform specific things. Java in this case.
When you build your app these platform specific folders and their content will be overwritten by the code from the root www folder.
Related
In one of the applications that I am working on for my company, I came across a weird behaviour or maybe it's just my misunderstanding and I hope I can get some clarification.
The application is served by Apache and the root is : /company/client. For every page that I visit, for example https://11.11.11.11/index.phtml, it will actually point to the file in the server /company/client/index.phtml and so on. In one of the modules of the application, it contains a move_uploaded_file php function, and the target directory is /images/example/, when the page is run, the app is trying to go to the absolute server root /images/example/ instead of /company/client/images/example/.
Also the a new windowed opened up by window.open has an img tag having src='/images/exmaple/', this points to the server root instead of /company/client/images/example/, is this expected?
Am I missing anything, or is it something to do with Apache configuration?
Additional info:
The application is served as a virtual host in conf file, with DocumentRoot "/company/client/".
The page that is executing window.open and php function is used as an Iframe inside /company/client/index.phtml
sorry for my mistake.
Thanks for the help from the everyone especially Chris G, the problem was that the code is using a GET variable incorrectly, as a result the image name isn't passed. And I got confused because someone made a mistake in the code by moving image relative to the root folder which is incorrect. That made me think that PHP is also treating path like the client side which is a mistake. I'm guessing I can conclude that the web server document root only applies to everything client side, like the url, JS, HTML?
I have a react application that I built that uses redux, react router v4 and d3 for visualization of data.
My app contains a force directed graph, a table and a histogram. Each one of these views contains clickable nodes, table cell and bars that when clicked, the file should download to user's machine. I recently updated firefox to the latest version 62.0.2 and the download no longer functions as expected, however it still works fine in Chrome.
The files sit on the same domain as the application and I've coded the download to function as so:
let newlink = document.createElement('a');
newlink.setAttribute('download',
'https://www.example.com/docs/xml/file1.xml');
newlink.setAttribute('href', 'https://www.example.com/docs/xml/file1.xml');
newlink.setAttribute('target', '_blank');
document.body.appendChild(newlink);
newlink.click();
What firefox is doing is downloading the index.html file at my app root rather than what is in the url variable (ex. https://www.example.com/docs/xml/file1.xml). The dialog shows that it is in fact trying to save the file with the correct name (Firefox has automatically replaced '/' with underscores to save the file. The domain is correct, but the location does not contain the full URL to the file. Is something happening with the full URL being chopped off somehow?
The type on the dialog box is HTML (which is incorrect, all my files are either xml or txt) and if user selects save or open, it saves index.html or opens up a blank/black webpage. I'm going crazy trying to figure out what is happening here. Please help!
What ended up fixing this in Firefox was unregistering the service worker from the application's domain by navigating to about:serviceworkers (in firefox). I then commented out the register service worker function in my UI code because I'm not using them for this application anyway. For whatever reason the service worker was intercepting the file download and causing the browser to download the index.html file rather than the text file it was supposed to. Once I did these two things, the file was downloaded correctly. If anyone would know why that would be, I'd love a comment.
I made a simple website. The site is fully functionable in my localhost (my computer). Everything working fine here.
But problem arises when I upload the files into the web server in order for running that in public domain. There, no content is showing except the layout. No link or tab is working, no paragraph inside the body is displaying. You may have a look here.
For what reason?
I uploaded all the files (with source code) associated my website except the images and videos (since there are a lots of images and I will upload it a bit later).
[NOTE: I have xampp local server installed in my computer. All the
sourse codes files are stored inside the htdocs folder. Inside the
htdocs folder I have a folder named jquery(which was installed with
the package). I saved my .JS file inside the JQuery folder (since I
used jquery code too). So when I upload file into the server do I need
to upload the whole htdocs folder? Or how about the JQuery folder
(which contains the JQuery source code)? Do I also need to upload it?
My paths set are the following:
C:\xampp\htdocs\jquery [contains the whole project's source file]
C:\xampp\htdocs\jquery\js [Contains only JavaScript&JQuery file]
If you inspect your page and look where you expect the content to be, you'll find <div id="home">. Looking at the CSS for this, it shows line 258 of your css file has this:
#all_contents >div {
display:none;
}
This is causing all of your contents to not display. Removing this will fix the problem.
Also, if you look on the browser's console when your page loads, you'll notice a lot of 404s trying to load various scripts, stylesheets, and images. That's potentially contributing to the problem. I'd focus on fixing those first, to make sure everything is loading properly.
I tried debugging the HTML on your website. I found the following code in design.css at line number 258
#all_contents >div {
display:none;
}
Once you remove this(display:none), all the content is available on the website link that you shared.
Also, I am not sure why this is working on your local. Are you sure that you have uploaded the same version which is running in your local?
You can debug your webpage by pressing F12 and then selecting the problematic area. On the right hand side, you can see the css rules associated with the selected element.
For getting the specific content in a page and not all, create a new file by the name who_im.html and put your content over there and then You should do something like
About Me
Like this you will have to make other pages as well and add the hyper links to the menu in every page.
I'm developing an extjs application which boots in two steps. At the start it pops up a login& password window, loading only the necessary js resources. If login successfully then it starts the viewport by loading all the remaing js files.
at the login time it loads ext-all.js and couple of app js file.
after the login, it loads the controllers that load the required js files.
the problem is that I want to minify and compress the js files, but when using the sencha cmd tool
>sencha create jsb -a index.html -p app.jsb3
>sencha build -p app.jsb3 -d .
>java -jar ycompressor.jar --type js -o app-all-compressed.js app-all.js
the resulting app-all.js and app-all-compressed.js contain only the resources needed at the login phase only.
Then I tried to build manually a jsb3 file that generates a minified and compressed post-all.js including by hands the required js by the viewport (second phase boot), then loaded this file after successfully passed login this way:
onLoginSuccess(){
Ext.Loader.loadScript({
url: 'post-all.js',
scope: me,
onLoad: function() {
//controllers loading
...
problem was that even if post-all.js is loaded, the resuorce are still loaded unminified.
Resources are minified and compressed correctly in post-all.js but it seems that requires[" ..."] loads the unminified copy of the resources, so I have each reasource loaded 2 times
Any idea?
thanks
It is a lot easier to load everything at once. There is no reason to load in two times.
Visual : Even if you load all javascript, you show only the login dialog. All the rest, you show only after successful login.
Security : If you secure the access to all server resource with the session, a malicious user might be able to display some parts of the user interface, but he could never get to view any data nor do anything else.
Loading time : Considering the size of the ExtJs library, the gain in loading time will be minimal.
Like this you've worked around your problem, and you can enjoy the simplicity of the regular ExtJs deployment with Sencha cmd.
I know about Workspaces recently introduced in DevTools but that is not that i need. For example: page uses jquery that is loaded from CDN, i modify jquery library code, press ctrl-s, reload page -> modifications are lost. Or i want to debug some site i don't have an ability to change files of.
I don't want only save changes as in save CSS - while browsing, how can I save the css files from inside chrome dev or firebug to local directory, i want them to persist between page reloads.
You got most of it, but here's the slight change:
Make a change in the Styles pane (or in Sources), then click over to Sources, and when your modified file is open, hit ctrl-s.
Then you can right-click the asset in the Sources list and hit Save As... and save the new modified file to disk.
There is no way to save a modified remote file without persisting it to disk and expect it to be changed on reload.
Workspaces allow you to edit files mapped to a local directory - but naturally, a pre-requisite is to be serving local files.
If you're playing with files you don't have direct/convenient access to (for whatever reason), I recommend setting up a tampering proxy like Burp. In a nutshell, you would be able to modify the server response and perform on-the-fly search and replace like cdn.example.com/jquery-library.js to localhost:8080/jquery-library.js in the html body. All you have to do afterwards is set up a local server (trivial) and edit the local instance of the script!
This is a handy pattern to preview local changes against production content, as long as it's not used in lieu of a test environment.
It is possible, but quite tricky:
open resources and right clik to the folder with styles\resources (fo
not forget to click "allow" on the dialog that appears below the
adress bar)
then right click on the concrete resource and choose "save as" (save
it to the working directory that you specified in the prev step)
then right click to the same resource and choose "Map to file system
resource" (write the same name as in prev. step, e.g. all.css but not
all.css?id=234234234, just in case)
modify the styles in the dev tools.
refresh the page (and realise that all you modifications doesn't
applied)
open resources, find your workspace folder and your resource in it
(e.g. all.css)
right click on that resource and choose "local modifications"
in opened console click to "apply original content" and realise that
you styles has been applied =)
It's quit a tricky way and the better idea is to use something like fiddler to replace resources to local files.
You could try it this way (for jquery):
-load the page first time and on the sources tab put a breakpoint on line number 1
-then reload the page modify the file and save ( you can see that the page has paused due to the breakpoint )
-press the play button and the page will start to load.
The modifications you made will work. The downside of this solution is that once you refresh again the page, the modifications will be lost.
Hope that helps!
As far as I can tell, there's no way to do this in Chrome's DevTools. You should look through the documentation about saving and making local changes. The only thing that seems to persist through reloads is snippets... but it doesn't seem like that's what you want.
If ever a solution for this is made... I want it. For now, it seems the best you can do is content scripts and the like.
I don't know if this qualifies as an answer, but it is what I am doing, and the closer that I have get to what you want.
I load the page in the browser, and the I do save as in a local file. Note that I am saving the full page, with HTML, js and CSS.
Now, if I want to modify the a CSS, I edit the HTML and direct these file (or files) to my development files.
I reload the page, and now I can work as you want (saving and reloading what I have saved).
Of course that means that you have full access to the files, and most probably they are local, but I don't think that you are really willing to edit the real web files on line.
When I am finished modifying the files, it's just a matter of syncing my dev files with the web files .
Just a tip, under Firefox i use Greasemonkey. I dont know if you know this tool, but it allows to run javascript scripts over a webpage for a website. Then, with an adapted javascript you can change css dynamically.
A little get started for greasemonkey:
http://www.webmonkey.com/2010/02/get_started_with_greasemonkey/
For chrome it is tampermonkey :
http://tampermonkey.net/faq.php
I use my apache in debug mode with eclipse so the cahnges are reflected to the site as soon as I save the page.
Note, Utilizes jQuery library (not required)
Try, at console
function restyle() {
$("*").css("color", "blue"); /* development elements, css, js */
$("head").append("<script>console.log(\"restyle\")</script>"); /* js */
var t = document.querySelectorAll("*"); /* modified document */
var outer = document.documentElement.outerHTML; /* modified document */
var inner = document.documentElement.innerHTML; /* modified document */
return $.ajax() /* `pseudo` `reload` */
.done(function(data) { /* original document */
document.documentElement.innerHTML = outer; /* `psuudo` `document` `reload` */
console.log(data, inner, outer, $(t)) /* options, `callbacks` */
/* $.each($(t), function(index, value) { console.log(value) }); */
})
};
restyle();
See https://stackoverflow.com/a/31585725/52817:
The Resource
Override
extension allows you to do exactly that:
create a file rule for the url you want to replace
edit the js/css/etc in the extension
reload as often as you want :)
You can even add a tab to the dev tools.