Add AngularUI to Umbraco backoffice - angularjs

I'm trying to add the AngularUI to use in the Umbraco backoffice, but i cant seem to get it working.
Can anyone shine some light to how should i achieve this?

You need to create a new package manifest file for this where you reference the AngularUI javascript file.
To do this, create a new folder under the App_Plugins folder called CustomBackoffice. There you put the Angular UI javascript file.
Then create a new file in this same folder called package.manifest and add following code:
{
javascript: [
'~/App_Plugins/CustomBackoffice/angular-ui.js'
]
}
See docs: https://our.umbraco.org/documentation/extending/property-editors/package-manifest

Related

For sencha app build , do we need to include all js files related to view in main.js(portal.js)?

I am using sencha cmd 6 for building my application.
my folder structure is
classic
src
model
view
account
jobs
portal
portal.js
controller
store
production build process execution is successful but when i load that build its giving .js file not found error.
So i include all js files in folder structure into main js portal.js then .js error is removed and build works.
But i dont want to include all these list of files in one single js, so can we skip the js include part from portal.js and use any property or attribute to include all js files ?
You can specify with * like 'Ext.chart.*' in requires section of Ext.app.Application.
Hope this helps.

Applozic Meteor integration

I cant able to run applozic-web fullview ui with meteor (1.4.2.6).
(https://github.com/AppLozic/Applozic-Web-Plugin)
I've put src folder under /client/compatiblity folder. I'm newbie and i'm not sure how exactly use jquery plugins. Here is my html code is on http://pastebin.com/6canHZnK
respective js code is nearly empty.
I got ui screen with no functionality.
Thanks in advance.

Add new library

I'm trying to figure out the right way to add any eventual new library (for example I need angularJS ui-router) in an onsen app.
I installed bower and then downloaded ui-router.
Since I do not know exactly the way Gulp is used, I got confused on what I'm suppose to do.
At the moment, I have the following folders:
bower_components, hooks, merges, node, modules, platforms, plugins, www
The index.html has the following reference:
What I suppose to do, now?
manually copy the ui-router js files in /www/lib/
configure gulp to copy the files automatically
change the script tag src and make the reference to the bower_component folder
change the Bower default folder
could you please guide me on sort it out?
tnx
At the end I chose the option 2.
I edited the file gulpfile.js adding a new custom task supposed to copy the missing bower libraries.
var mainBowerFiles = require('main-bower-files');
gulp.task('copy-bower-libs', function() {
return gulp.src(mainBowerFiles())
.pipe(gulp.dest(__dirname + "/www/lib/bower/js"))
});

how to add angular files on yeoman generator ionic

I'm using generator-ionic from link, and It made well, but I want to know how to add angular controllers or directives files.
It's not like app when I made with 'yo angular'
there is no views folder and files neither.
'yo angular:directive myDirective' not work.
do I have to make all files and folders by myself?
I found that the Angular Generator works fine with a project created by yo ionic. You are correct that the folder structure is different, but that may not a problem for you. You could always start with a completely blank ionic template, and then start adding the pieces you need. Your app.js and index.html files will be where the Angular Generator expects them to be.

ExtJS 4.2 - Ext.ux.Printer library/class does not work

Good day. Sorry but I've stumbled upon a problem that I can't seem to figure out for the past couple of hours. I downloaded this printing class to be able to print a Form that I have in my web application. I copied the Ext.ux.Printer folder in my scripts folder inside resources. The file path looks like: resources/scripts/Ext.ux.Printer and the resources folder is on the same level as the app folder.
My Loader looks like:
Ext.Loader.setConfig({
enabled: true,
paths: {
'Ext.ux.Printer': 'resources/scripts/Ext.ux.Printer/Printer'
}
});
And the Application looks like:
Ext.application({
requires: [
'Ext.Loader',
'Ext.layout.container.Absolute',
'resources.scripts.Notification',
'Ext.layout.container.Column',
'Ext.ux.Printer.Printer'
], //models, views, controllers, follow after
and I try to use it in my code as such:
Ext.ux.Printer.print(form);
However, I am given an Uncaught TypeError: Cannot read property 'Printer' of undefined whenever I try to execute the line of code above.
Can anyone help me? I'm a beginner in ExtJS4 and I'm just trying to follow examples I see around the internet - it is possible that I tried to appropriate my code incorrectly with something I saw online.
Any help is very much appreciated, thank you.
UPDATE 1
Upon discussion with Guilherme Lopes below we did the following steps:
Import the js files by adding it as a js resource in Sencha Architect. Make sure that the file path is correct.
Check the includeAfterAppJS checkbox. Due to a bug in Architect, sometimes the JS Files are added in before the ExtJS.
Open index.htmluse ext-all.js instead of ext-dev.js. Note that Sencha Architect overwrites/resets this file every time you save your project. A quick fix is to go to project settings and uncheck updating index.html.
Try Ext.ux.Print.print(form);
By the developer instructions, you should import the script files using your main html document, the same way you do with ExtJS classes (if you are not using the bootstrap).
These lines should be added after you import the ExtJS library:
<script type="text/javascript" src="Printer.js"></script>
<script type="text/javascript" src="renderers/Base.js"></script>
The library currently comes with renderers for Ext.grid.GridPanel, and Ext.tree.ColumnTree.
These can be included as required:
<script type="text/javascript" src="renderers/GridPanel.js"></script>
<script type="text/javascript" src="renderers/ColumnTree.js"></script>
And your calls to Ext.ux.Printer should start working.
If you are using Architect, add your external JS files clicking on: + => Resources => JS Resource
And then change the URL to the path you need (do this for every file you wish to add)
* I would just uncheck the x-compile and x-bootstrap

Resources