So I'm working a project of a Website. In it, there's an admin page where I can add or remove images that will be shown on the website. I created a Controller for the Main Admin page alone, and then I created a controller for every type of information that can be changed through that page (Porfolio, banner, etc). All the pages are styled by CSS. So when my AdmController returns the view with the main Admin page, everything works fine
The adress for the main Admin Page results in localhost:8000/adm
But once I try to open a view where I would add an image to be shown on the Main page, CSS simply won't work. To acess, say, the add banner page, I have a BannerController that will return a "form-banner" view, resulting in the adress localhost:8000/adm/banner. In this page CSS does not work.
I wanted to test further so I created a new Route that would take me directly to the create banner page without going through the admin page, and also not using any Controllers at all. I got the adress localhost:8000/banner. Now CSS works.
Any ideas why?
These are the routes including the one I created just to test the view:
Route::resource('adm', 'AdmController');
Route::resource('adm/banner', 'BannerController');
Route::get('banner', function () {
return view('admin/form-banner');
});
This is the AdmController:
namespace App\Http\Controllers;
use Illuminate\Http\Request;
class AdmController extends Controller
{
public function index()
{
return view('admin/index');
}
}
This is how the BannerController is returning the mal-functioning View:
public function create()
{
return view('admin/form-banner')
And this is the point in the Main Adm View (the one that works) where It calls the BannerController:
<ul class="nav-second-level" aria-expanded="false">
<li>Create new banner</li>
Add your CSS like below
<link href="{{ asset('css/app.css') }}" rel="stylesheet">
the absolute path after your public folder
Related
Is it possible to configure the route within a asp.net mvc project when redirecting to an external url?
for example
public ActionResult MyUrl()
{
return Redirect("http://www.myurl.com/");
}
I dont want the the url of http://www.myurl.com/ to be displayed in the address bar but
MyProject/MyUrl
I tried this
routes.MapRoute(null, "MyUrl", new { controller = "Home", action = "MyUrl" });
For external URL you could not use Server.TransferRequest. This method just works for same site. Use iframe to your view instead:
public ActionResult MyUrl()
{
return View();
}
In your view use iframe with external URL:
<body>
<iframe src="http://www.myurl.com/"></iframe>
</body>
By using this method user see MyProject/MyUrl in the address bar. But keep in mind user could easily discover actual URL by viewing source of HTML file.
I want to add css styles to my login page. The application works as:
ion-side-menus where is:
ion-side-menu-content inside of it is:
ion-nav-view name="content"
Controller looks like:
.state('myapp.login', {
url : "/login",
views: {
'content': {
templateUrl: "myApp-core.login.html",
controller : 'LoginController'
}
}
})
The problem is that when I changed a main css it causes on all sub pages but I want to change only my login page (myApp-core.login.html). Thanks for any help.
Simplest make your own css class "xxx-login" and apply it on html tag?
if you want to extend ionic class, you can use Less, ionic provide all tools to build it.
I have an application that have four modules in the front end, I'm trying to use as much as possible AngularJs in the front end I'm using an empty website asp.net project to host all the files and the REST serviceStack, my project have kind of the following structure:
~/ (web.config, global.asax and all the out of the box structure for an asp.net website)
- App <- AngularJs
- Users <- js controllers and views (static html files)
- Companies
- BackEnd
- Public
Index.html
IndexCtrl.js
App.js
- Content
- Js
I use angularjs service calls and the backend I'm using REST with servicestack.
the question is how can I restrict the access only to authenticated users to those static html files? let's say the ones that are inside inside Companies, Backend and users for example
Hi After doing some research this is the solution that worked for me:
Install razor markdown from nuget
Change the file structure to match the default behavior RM [Razor Markdown] to /views
Modify the web config following the approach described in this service stack example
Change all the static htmls files to .cshtml files, this by default creates the same route without the extension like /views/{Pagename} without the extension, I'm just using this approach to get the authorization logic simpler to implement (at least for me)
Update the service method with an authorize attribute you can find out more in this page
to illustrate a lit of bit more this is my route definition in so far:
'use strict';
angular.module('myApp', ['myApp.directives', 'myApp.services']).config(
['$routeProvider', function($routeProvider) {
$routeProvider.when('/Dashboard', {
controller: 'dashboardCtrl',
templateUrl: 'Views/dashboard'
}).when('/Payments', {
controller: 'paymentsCtrl',
templateUrl: 'Views/payments'
}).
when('/Login', {
controller: 'loginCtrl',
templateUrl: 'Views/login'
});
}]
);
Notice that the references are pointed now to the razor paths.
this is a small menu I've done in angular
<div class="container">
<div class="navbar" ng-controller="indexCtrl">
<div class="navbar-inner">
<a class="brand" href="#/">header menu</a>
<ul class="nav">
<li ng-class="{active: routeIs('/Dashboard')}">Dashboard</li>
<li ng-class="{active: routeIs('/Login')}">Login</li>
<li ng-class="{active: routeIs('/Payments')}">payments</li>
</ul>
</div>
</div>
<ng-view></ng-view>
</div>
let's say that the payments page is restricted, so every time I click on a the page I get a 401 unauthorized message.
Service host:
public override void Configure(Container container)
{
Plugins.Add(new AuthFeature(() => new AuthUserSession(), new IAuthProvider[] {
new FacebookAuthProvider(appSettings),
new TwitterAuthProvider(appSettings),
new BasicAuthProvider(appSettings),
new GoogleOpenIdOAuthProvider(appSettings),
new CredentialsAuthProvider()
})); //I'm going to support social auth as well.
Plugins.Add(new RegistrationFeature());
Routes.Add<UserRequest>("/Api/User/{Id}");
Routes.Add<LoginRequest>("/Api/User/login","POST");
Routes.Add<PaymentRequest>("/views/Payments");
}
I hope that helps
Create a CatchAllHander method to check for restricted routes and, for those static files that require authentication, return the ForbiddenFileHander if not authenticated, otherwise return null. Given an isAuthenticated method and restrictedDirs is defined somewhere - maybe your app or web config file, it can be as simple as:
appHost.CatchAllHandlers.Add((httpMethod, pathInfo, filePath) => {
if ( restrictedDirs.ContainsKey(pathInfo) && !isAuthenticated())
return new ForbiddenHttpHandler();
return null;
});
Why not use Forms Authentication? Simply add a few < location > tags to your web.config to allow/disallow different sections, you can even do it based on roles.
How to create a link to another page in hot towel ?
I know that to add a link to the menu, I have to add it here :
function boot() {
router.mapNav('home');
router.mapNav('details');
router.mapNav('about');
log('Hot Towel SPA Loaded!', null, true);
return router.activate('home');
}
But how to link to one of these links from an html page ?
From within your app, your link would be something like:
<a href='#/details'>go to details</a>
Otherwise you can use Durandal from your view model:
router.navigateTo('#/details');
For ex, if you want to add Session Link, add the javascript file in App/viewmodel/session.js Then add the html file in App/views/session.html and then in shell.js
function boot() {
router.mapNav('home');
router.mapNav('details');
router.mapNav('session');
log('Hot Towel SPA Loaded!', null, true);
return router.activate('home');
}
I built a custom module that manages appointments for a service-based company. All of the current functionality is contained in the admin section. I have not used a single ContentItem or ContentPart. All the models are just plain records.
I'm looking to create a widget to expose the ability to sign up for an appointment from the front end. I have a partial view and a controller that handles the display and form submit, but I'm not sure how to tie that into a widget that can be placed in one of the content zones of the front-end.
I've spent quite a bit of time researching this, and can't find a good path to follow. (I've tried a few and got sub-optimal results)
Any suggestions?
The best answer for me was to create a widget Type definition in the migration.cs file of the module:
ContentDefinitionManager.AlterTypeDefinition("CreateAppointmentWidget",
cfg => cfg
.WithPart("WidgetPart")
.WithPart("CommonPart")
.WithSetting("Stereotype", "Widget"));
Then create a handler for that widget at /MyModule/Handlers/CreateAppointmentWidgetHandler.cs:
public class CreateAppointmentWidgetHandler : ContentHandler
{
private readonly IRepository<FieldTechRecord> _repository;
public CreateAppointmentWidgetHandler(IRepository<FieldTechRecord> repository)
{
_repository = repository;
}
protected override void BuildDisplayShape(BuildDisplayContext context)
{
base.BuildDisplayShape(context);
if (context.ContentItem.ContentType == "CreateAppointmentWidget")
{
CreateAppointmentViewModel model = new CreateAppointmentViewModel(_repository.Fetch(x => x.IsActive));
context.Shape.AppointmentModel = model;
}
}
}
Then create a matching widget template at /MyModule/Views/Widget-CreateAppointmentWidget.cshtml that inserts the Partial View:
#Html.Partial("CreateAppointment", (MyModule.Models.Views.CreateAppointmentViewModel)Model.AppointmentModel)
The above code grabs the partial view /MyModule/Views/CreateAppointment.cshtml.
Thanks to Giscard's suggestion, I was able to correct the links rendered from CreateAppointment.cshtml by using #Url.RouteUrl() and defining named routes to point where I needed the action and ajax requests to go.
The nice thing about this solution is that it provided a way to create the widget without having to rework my models to use Orchards ContentPart functionality.
Something is not connecting in my head, because I have been able to create a theme with zones, and then dispatch a shape from my module into that zone without much more than doing #Display.Shape(). So I am curious if it's absolutely necessary to use a handler to override the BuildDisplayShape.
Again, this is in the scenario where you have models as plain records (not using ContentItem or ContentPart - and even if not using them, you've shown an example of creating one through migrations).
Something like this - Controller:
public ShapeResult MyShape()
{
var shape = _orchardServices.New.MyPath1_MyShape();
return new ShapeResult(this, shape);
}
Then create a MyShape.cshtml shape with whatever code I have (no need for example).
NOTE: I use a custom IShapeTemplateHarvester file which adds paths where I can store my shapes (instead of using "Views", "Views/Items", "Views/Parts", "Views/Fields", which is the stock in Orchard). It goes something like this:
NB: I hate that code doesn't automatically wrap in SO.
[OrchardSuppressDependency("Orchard.DisplayManagement
.Descriptors.ShapeTemplateStrategy.BasicShapeTemplateHarvester")]
public class MyShapeTemplateHarvester : BasicShapeTemplateHarvester,
IShapeTemplateHarvester
{
public new IEnumerable<string> SubPaths()
{
var paths = base.SubPaths().ToList();
paths.Add("Views/MyPath1");
paths.Add("Views/MyPath2");
return paths;
}
}
Say I have Index.cshtml in my Theme. I have two choices (I use both and use the Theme as the default presentation).
Index.cshtml in Theme folder:
#*Default Content*#
Index.cshtml in Module folder:
#*Special Content overriding Theme's Index.cshtml*#
Display.MyPath1_MyShape()
Even better for me is that I can do this in the Index.cshtml in Theme folder:
#*Whatever content*#
Display.MyPath1_MySecondShape()
There is no ~/MyPath1/MySecondShape.cshtml in the Theme, but there is one in the Module, which the Theme displays! This is great because I can have a special Theme and have multiple modules (that are placed on separate sites) go back and forth with the theme (think Dashboard for different services in the same profession on different sites).
NOTE: The above may only be possible with IThemeSelector implementation such as:
public class MyThemeSelector : IThemeSelector
{
public ThemeSelectorResult GetTheme(RequestContext context)
{
if (MyFilter.IsApplied(context))
{
return new ThemeSelectorResult { Priority = 200,
ThemeName = "MyDashboard" };
}
return null;
}
}
Just my two bits.