How to build an app from javascript source files in GitHub app-catalog repository? - rally

How do I take the JS and CSS source for an app like the Iteration Tracking Board (https://github.com/RallyApps/app-catalog/tree/master/src/apps/iterationtrackingboard) or Release Burndown (https://github.com/RallyApps/app-catalog/tree/master/src/apps/charts/burndown) and turn that into HTML source that can be used as a Custom HTML app in a page in Rally?

Prerequisites:
Node.js
rally-app-builder
After source files are copied to a local directory (you may either fork the app-catalog repo, or download zip from the same location):
in terminal, cd to the app
call this command: rally-app-builder build.
As a result a deploy folder is created with App.html and App-uncompressed.html inside, and App-debug.html is created in the root folder of the app.
Copy/paste App.html or App-uncompressed.html file from deploy folder to the HTML section of the custom page in Rally.

Related

Vue.js files in public folder not being copied to dist folder

I'm working on a portfolio in Vue.js. I added a button that allows the user to download a copy of my resume (a PDF file). The button works great in development. The file is in my public folder, which is supposed to be the static directory where all files are copied to the dist folder from. When I run the command vue build, the only thing copied from that folder is the index.html page. I have tried adding images to that folder and they are also not being copied over. My vue.config.js file looks like this:
module.exports = {
publicPath: '.'
};
So the relative paths are correct for the deployed files.
I have a similar setup working perfectly fine at my job, with the same version of Vue and vue-cli-service (both 6.14.11). I'm relatively new to Vue so any help would be greatly appreciated.
Edit: I've also noticed that even though I changed the <title> tag in public/index.html to "James Bell's Portfolio", the title in the production code is "Vue CLI App".
Here's the github repo: https://github.com/jamesthedev/portfolio
I figured it out! I was running vue build from the src folder. I needed to run vue-cli-service build from the root directory. Once I did that, all my static assets were copied to dist.

unable to include external files in a project

I have created the default play application in IntelliJ in directory P. I have over-written the default index.scala.html with my own html code. The html code refers to some css and js files which are outside the directory P. To include these external files, I added the directory of these files using project configuration settings.
My webpage doesn't load properly as the server returns 404 for the css and js files. What am I doing wrong?
When you added your directory using project structure, you only say:
Hey, IDEA, please consider this folder part of my project, consider
its contents source code and display it when I open my project.
However, when you deploy or run your app, you only deploy the usual folders to the server, which contain the resources which will be available for clients to access.
The external directory is not part of these directories and will not be deployed.
What you can do is to copy the file from the external directory as a part of your build process before deploying the application.
EDIT: Detailed answer here: What is intellij's build process for play applications

load local files outside NWJS app

When I work locally I want to share code among two or more (nwjs and other kinds of) projects. Folder structure:
-project 1
-project 2
-shared code
When releasing the apps I build the external files into a file inside each project app.
But I cannot access files outside the node-webkit/nwjs app folder.
I tried things like:
Setting "chromium-args": "--allow-file-access-from-files" in the manifest file but I think this is default now.
Using file:/// and chromium-extension:/// prepending the relative paths but I think this is only for absolute paths?
Load files dynamically and using path.relative( process.cwd(), "../shared_code/scripts/controllers/searchController.js" );
The user of the app will be able to put it anywhere on his computer.
Is it possible to load js and css files and images from outside the nwjs project folder locally?
nwjs sdk version 0.19.5
I had a similar problem trying to load images outside of the NW.js application. I found that this fixed my issues. Try adding this to your JSON manifest file. This worked for me...
"chromium-args": "--allow-file-access-from-files --allow-file-access --user-data-dir"
Just so you know, I had originally tried this...
"chromium-args": "--allow-file-access-from-files --allow-file-access --user-data-dir --mixed-context"
But it stopped jquery loading.
You can then access files with file:/// and use absolute paths anywhere on the machine.
I hope that helps.
For sharing code, when the code is (or can be) a node module, it's very helpful to be able to npm link it into your project. (It works the same with NW.js apps as for Node.js:)
cd shared-code
npm link
cd ../project-1
npm link shared-code
cd ../project-2
npm link shared-code

Require locally packaged assets in remotely downloaded js bundle

I used this solution to download js bundle each time my app starts because I want an easy way to deploy minor changes during development stage.
The downloaded file is the one I exract from built apk. However, no images required in js (like require('../grapic/pic.png')) show up when application is run in this mode.
I save the js file like this:
File jsCodeDir = getApplicationContext().getDir("assets", Context.MODE_PRIVATE);
File f = new File(jsCodeDir, "remote.android.jsbundle");
// ... download file and put it into f
It seems that the problem is with paths: js isn't able to require images when it is stored in assets/ folder of internal storage, as opposed to when it is run from default assets/ folder from within apk.
So the question: is there a way to make a bundle such that it is able to use locally packaged resources (images from within apk just like locally packaged js does).

Rally - clone existing app

I'm trying to create a custom release burnup app for my group. There is an existing app called 'Release Burnup' in Rally, and based on the instructions for rally-app-builder I thought I would be able to clone this app as a starting point.
However, when I use the rally-app-builder clone RallyApps ReleaseBurnup command, it doesn't seem to do anything except change the title in the output html files to "Son of ReleaseBurnup". When I tried the same thing with the example from the github page (which uses rally-app-builder clone RallyApps StoryBoard) then it seems to be successfully cloning an app, with updates to the App.js file, etc.
I'm guessing that I might be using the wrong name to clone, but I'm not sure how to know what names are valid for this command to clone the app I want.
Unfortunately rally-app-builder clone functionality predates newer developments and the availability of source code of catalog apps from RallyApps/app-catalog, so it does not support drilling down those directories.
clone RallyApps StoryBoard works because there is a StoryBoard app at that location. There is no ReleaseBurnup there. ReleaseBurnup code is not available.
Here are the steps to build an app from javascript source files from GitHub app-catalog repository
Prerequisites:
Node.js
rally-app-builder
Get the source to a local directory (you may either fork the
app-catalog repo, or download zip from the same location):
in terminal, cd to the directory of the app you want to work on, and call this command:
rally-app-builder build.
As a result a deploy folder is created with App.html and
App-uncompressed.html inside, and App-debug.html is created in the
root folder of the app.
These steps make sense only if you intent to customize the catalog app and want to use the source as basis. If you want to use a catalog app as it was designed, install the app directly from the AppCatalog as described in this help document.