PhilippMeissner · May 17, 2016 13:04
diff --git a/Elm Stuff b/Elm Stuff
 module Main exposing (..)

 import Html exposing (..)
 import Html.App as Html
 import Html.Attributes exposing (class, type', href, attribute, placeholder, id, style)
 import Html.Events exposing (onInput)
 import Element exposing (toHtml, centered, container, middle)
 import Text exposing (fromString)


 main : Program (Maybe Model)
 main =
    Html.programWithFlags { init = init, view = view, update = update, subscriptions = \_ -> Sub.none }
    
    
 init : Maybe Model -> ( Model, Cmd.Cmd Msg )
 init passedModel =
    Maybe.withDefault initialModel passedModel ! []


 type alias Model =
    { location : String
    , height : Int
    , width : Int
    }


 initialModel : Model
 initialModel =
    { location = "", height = 0, width = 0 }

 type Msg
    = ChangeLocation String


 update : Msg -> Model -> ( Model, Cmd.Cmd Msg )
 -- Update


 view : Model -> Html.Html Msg
 -- View

 welcomeBlock : Model -> Html a
 welcomeBlock model =
    div 
    [ style [ ( "background-color", "red" ) ]]
    [ toHtml (container model.width model.height middle (centered (fromString "Hello World"))) ]





 -- Index.html:

 <html>
  <head>
    <title>Elm-Application</title>
    <!-- Bootstrap -->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
    <!-- jQuery-->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>

    <!-- Bootstrap JavaScript -->
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script>
    <script type="text/javascript" src="elm.js"></script>
  </head>

  <body style="padding-top: 51px;">
    <div class="container-fluid">
      <div id="elm-application"></div>
    </div>
  </body>

  <script type="text/javascript">
    var stamperDiv = document.getElementById('elm-application');
    app = Elm.Main.embed(stamperDiv, {location: "test", width: window.innerWidth, height: window.innerHeight});
  </script>
 </html>
	module Main exposing (..)

	import Html exposing (..)
	import Html.App as Html
	import Html.Attributes exposing (class, type', href, attribute, placeholder, id, style)
	import Html.Events exposing (onInput)
	import Element exposing (toHtml, centered, container, middle)
	import Text exposing (fromString)


	main : Program (Maybe Model)
	main =
	Html.programWithFlags { init = init, view = view, update = update, subscriptions = \_ -> Sub.none }


	init : Maybe Model -> ( Model, Cmd.Cmd Msg )
	init passedModel =
	Maybe.withDefault initialModel passedModel ! []


	type alias Model =
	{ location : String
	, height : Int
	, width : Int
	}


	initialModel : Model
	initialModel =
	{ location = "", height = 0, width = 0 }

	type Msg
	= ChangeLocation String


	update : Msg -> Model -> ( Model, Cmd.Cmd Msg )
	-- Update


	view : Model -> Html.Html Msg
	-- View

	welcomeBlock : Model -> Html a
	welcomeBlock model =
	div
	[ style [ ( "background-color", "red" ) ]]
	[ toHtml (container model.width model.height middle (centered (fromString "Hello World"))) ]





	-- Index.html:

	<html>
	<head>
	<title>Elm-Application</title>
	<!-- Bootstrap -->
	<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
	<!-- jQuery-->
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>

	<!-- Bootstrap JavaScript -->
	<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script>
	<script type="text/javascript" src="elm.js"></script>
	</head>

	<body style="padding-top: 51px;">
	<div class="container-fluid">
	<div id="elm-application"></div>
	</div>
	</body>

	<script type="text/javascript">
	var stamperDiv = document.getElementById('elm-application');
	app = Elm.Main.embed(stamperDiv, {location: "test", width: window.innerWidth, height: window.innerHeight});
	</script>
	</html>