MVC5: Site Web Digital Signage

J'essaie de créer un site Web d'affichage numérique qui sera diffusé sur les écrans de télévision de mon entreprise. Ma pensée était d'utiliser MVC pour rendre assez facile le partage de la couche de présentation et de la couche de données. J'ai besoin d'un site qui montre une variété de pages - certains auront des contrôles de style de tableau de style Google comme des jauges et des tableaux, des annonces, et un téléscripteur rampant sur le fond pendant que les pages se retournent. Le problème est que je ne suis pas trop familier avec MVC.MVC5: Site Web Digital Signage

J'ai eu beaucoup de problèmes pour obtenir un site Web qui passera à une nouvelle page toutes les 5 ou 10 secondes. Je suis confus avec la façon d'utiliser des pages de mise en page, des vues partielles et de rappeler dans le contrôleur. Je travaille sur ce sujet depuis quatre jours, j'ai donc beaucoup de code, mais je ne veux pas tout coller ici.

Juste les bases de ce que j'ai essayé (je vais laisser des trucs de passe-partout comme l'élément de tête et des choses où je ne fais rien de spécial):

_ViewStart

@{ 
Layout = "~/Views/Shared/_Layout.cshtml"; 
}

_Layout

<div class="container body-content"> 
    @RenderBody()   
</div> 

<footer> 
    <hr /> 
    <marquee behavior="scroll" direction="left"><img src="http://www.html.am/images/html-codes/marquees/fish-swimming.gif" width="94" height="88" alt="Swimming fish" /></marquee> 
    <p>&copy; @DateTime.Now.Year - My ASP.NET Application</p> 
</footer>

Company1_Layou t

@{ 
Layout = "~/Views/Shared/_Layout.cshtml"; 
} 
<body class="greybackground container"> 
<header> 
    <img src="~/images/homesafetymatters_header.png" alt="Home Safety Matters"/> 
</header> 
<div class="container body-content" style="height:100%"> 
    @RenderBody() 
</div>

Accueil (C'est là que je suis en train de démarrer le site, puis commencer à appeler de nouvelles pages à paraître)

@model DigitalSignsPages.Models.Home 

@{ 
    ViewBag.Title = "Home"; 
} 

<!DOCTYPE html> 
<html> 
<head> 
    <meta name="viewport" content="width=device-width" /> 
    <title>@ViewBag.Title</title> 
</head> 
<body> 
    <h2>Welcome to Digital Signage v2.0</h2> 


    <script> 
    window.setInterval(yourfunction, 5000); 

    function yourfunction() { 
     $.ajax({ 
      url: '/Gauge/GoToHSMGauge', 
      data: { id: 1 }, 
      success: function() { 
       console.log('Added'); 
      } 
     }); 
    } 
</script>

GaugeController

public ActionResult GoToBrooksGauge(int id) 
    { 
     decimal answer = repository.GetGaugeData("001", 1); 
     ViewBag.Title = "Gauge"; 
     ViewBag.Pct = answer; 
     return View("HSMGauge"); 
    }

problèmes J'ai eu je tentais d'appeler une action directement dans ma fonction javascript, et ce genre de travaillé, mais il semblait débusquer tout HTML après cet appel directement à la page afin il y aurait quelques parenthèses d'extrémité et demi-deux-points et autres. Je pense que je dois utiliser AJAX pour appeler la méthode d'action du contrôleur, et en effet, le point d'arrêt dans mon contrôleur est frappé toutes les 5 secondes, mais rien ne se passe. Non non La vue apparaît.

Je pense que je dois spécifier une zone pour que la nouvelle vue apparaisse, comme un, puis j'appelle $ ("# foo") ...... quoi? charge, ou html? Je ne suis pas sûr, ni ne semble faire quoi que ce soit. Mais il semble que je devrais utiliser une action Render, mais je ne suis pas sûr si je devrais utiliser RenderPartial() ... cela ne fait-il pas partie de la page Home.cshtml? Je veux qu'une nouvelle page apparaisse, HSMGauge.cshtml.

J'ai également essayé de mettre le timer dans la page _Layout, et ensuite de garder une variable javascript qui pourrait être transmise à un contrôleur, mais il semble y avoir un problème avec ça parce que j'obtiendrais une erreur que la variable hors de portée quand je fais ça. Alors maintenant, mon idée était d'avoir le Home.cshtml coup d'envoi du site, puis comme la méthode d'action dans chaque contrôleur est appelé, il renvoie une certaine vue à ouvrir. Mais comme je l'ai dit, rien ne se passe lorsque l'action dans le contrôleur est appelée. Pas d'erreurs, juste rien.Fondamentalement, si quelqu'un a le temps ou l'énergie, pourrait-il souligner certaines des choses que je fais mal, de bons exemples ou des sites qui m'enseignent comment faire ceci que je n'ai pas pu trouver avec Google, ou peut-être juste me dire que je aboie le mauvais arbre avec MVC?

Source

2014-06-17 Pete

De votre description je ferais un Single Page Application (SPA) en utilisant un framework JavaScript côté client quelque chose comme AngularJS contre un backend WebAPI. Si vous changez souvent de page et que vous utilisez des tableaux de bord, vous obtiendrez un effet sans flicker bien plus agréable. Vous pouvez utiliser des transitions entre les pages (comme Powerpoint) et les composants du tableau de bord peuvent également être chargés de manière asynchrone afin que les pages se chargent plus rapidement. Les données peuvent être mises en cache côté client en utilisant des outils comme Breeze

Pour l'apprentissage AngularJS - Je recommande de regarder John Pappas code camp PluarlSight formation. Je l'ai appris en quelques jours. A mon avis, le futur des applications web est en grande partie une application côté client appelant une API. De plus en plus d'applications vont dans ce sens. AngularJS est populaire avec une grande intégration avec d'autres frameworks etc. MS investit dans .Net WebAPI et MVC6 dans vNext donc je pense que c'est une bonne pile

Source

2014-06-17 21:29:27 GraemeMiller

Merci, c'est un bon conseil. Je rendais les choses trop compliquées, je suppose. Il a été suggéré que j'utilise MVC mais ce n'est peut-être pas le meilleur cadre pour ce que j'essaie de faire. J'aime ce que je vois d'Angular jusqu'ici. – Pete

Vous pouvez certainement combiner à la fois MVC et Angular que nous faisons. Cependant, je pensais que WebAPI rendrait la vie plus simple. Après cela, vous aurez également une API bien définie qui pourrait être utilisée par les applications mobiles, les clients ou toute autre chose à l'avenir – GraemeMiller

MVC5: Site Web Digital Signage

Répondre

Questions connexes