I have a Scala template like this...
#()
import view.html.partials._header
import view.html.partials._footer
<!DOCTYPE html>
<html lang="en">
#_header()
/* Body of web page */
#_footer
</html>
Every single page has the same header and footer and a different body. I do not want to do this...
Page #1...
#()
import view.html.partials._header
import view.html.partials._footer
import view.html.partials._body1
<!DOCTYPE html>
<html lang="en">
#_header()
#_body1()
#_footer
</html>
Page #2...
#()
import view.html.partials._header
import view.html.partials._footer
import view.html.partials._body2
<!DOCTYPE html>
<html lang="en">
#_header()
#_body2()
#_footer
</html>
Page #3...
#()
import view.html.partials._header
import view.html.partials._footer
import view.html.partials._body3
<!DOCTYPE html>
<html lang="en">
#_header()
#_body3()
#_footer
</html>
Etc.
Is there a way to pass in the name of the partial template you want to render as a parameter? What is the solution to this problem?
p.s. I don't see the solution in... the play template documentation
Instead of having all these repetitions, you can create a main.scala.html file to be used as a default layout:
#(title: String)(content: Html)
#import view.html.partials._header
#import view.html.partials._footer
<!DOCTYPE html>
<html lang="en">
#_header()
<body>
#content
#_footer()
</body>
</html>
The first line says exactly "this view will receive a title argument and also a block of HTML". From that, you can do the following:
Page #1:
#(someParameter: String)
#main("The title of Page #1") {
<h1>Hello, I'm the body of Page #1</h1>
<p>As you can see, I'm calling the main view passing
a title and a block of HTML</p>
}
Page #2:
#(someParameter: String, anotherParameter: Long)
#main("This time Page #2") {
<h1>Hello, I'm the body of Page #2</h1>
<p>Just like Page #1, I'm passing a title
and a block of HTML to the main view.</p>
}
This is all explained at the docs, but in another page:
https://www.playframework.com/documentation/2.0/ScalaTemplateUseCases
Make a switch or case statement like this...
#(bodyCase: ClosedEnumType)
import view.html.partials._header
import view.html.partials._footer
import view.html.partials._body1
import view.html.partials._body2
<!DOCTYPE html>
<html lang="en">
#_header()
#bodyCase match {
case Body1() => {
#_body1()
}
case Body2() => {
#_body2()
}
}
#_footer
</html>
Related
i have a simple Vuejs projet that only have an index.html file :
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>test </title>
</head>
<body>
<div id="hello-vue" class="demo">
{{ message }}
</div>
<script src="https://unpkg.com/vue#next"></script>
<script src="app.js"></script>
</body>
</html>
and app.js File
const HelloVueApp = {
data() {
return {
message: 'Hello VueXYZ!!'
}
}
}
Vue.createApp(HelloVueApp).mount('#hello-vue')
The problem is that i dont have any IntelliSense for the code in
<script src="https://unpkg.com/vue#next"></script>
when i hover the mouse over a method of the Vue Object it only show (ANY)
This code display the textarea tag for console.log(abc) which is the ID, but for console.log(text) shows an error. Can anyone explain how value for console.log(abc) is getting executed and not for text class.
I haven't pass any argument to callback function. so how even for console.log(abc) it give an output.
Thank you.
document.querySelector(".text").addEventListener("keydown", () => {
console.log(abc);
//console.log(event);
console.log(text);
});
<!DOCTYPE html>
<html lang="en">
<head>
<title>demo</title>
</head>
<body>
<textarea name="ab" class="text" id="abc" cols="30" rows="10"></textarea>
<script src="script.js"></script>
</body>
</html>
The code segment document.querySelector("#abc") gets the html element with an id of "abc".
The code segment:
.addEventListener("keydown", () => {
console.log(abc);
})
is an event listener that listens for a keydown event and prints the html tag with the id of "abc"
I set up a very simple scala.js project with this very simple "application":
package example
import org.scalajs.dom._
import scala.scalajs.js.JSApp
class EverythingWorks extends JSApp {
def main() = {
console.log("It works!")
}
}
The corresponding HTML looks the following:
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>Test</title>
</head>
<body>
<script type="text/javascript" src="js/app.js"></script>
<script type="text/javascript">
example.EverythingWorks().main();
</script>
</body>
</html>
Now, I did sbt fastOptJS, copied the generated JS file to js/app.js and the js.map file next to app.js.
Instead of printing "It works!" on the console, I get ReferenceError: example is not defined. I double-checked that app.js is found from the HTML.
What am I missing?
Your main class should be object, not class.
The ScalaJS build process does "dead code elimination." This reduces the size of the build dramatically. However, unless you tell it that some of your top level stuff is NOT dead code, it will be eliminated.
That means you have to use the #JSExport annotation to tell ScalaJS not to remove your top level methods and objects.
From this introduction, the example code:
#JSExport
object ScalaJSExample {
#JSExport
def main(canvas: html.Canvas): Unit = {
I include the d3 javascript like this
<!doctype html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<script src="http://d3js.org/d3.v2.js"></script>
<script type="text/javascript" src="d3/d3.nocache.js"></script>
</head>
<body>
</body>
</html>
Then when I call it from the entry point d3 is null, why?
package com.example.client;
import com.google.gwt.core.client.EntryPoint;
public class D3 implements EntryPoint {
public void onModuleLoad() {
test();
}
private native void test()/*-{
$wnd.alert($wnd.d3);
}-*/;
}
Well, it seems that the problem was that I named the project D3. Need to call it something else because it seems that it overwrites the D3 of the javascript library.
I don't know what's wrong with my embed script, to my logic it should properly embed the video in the frame, but it loads a framed view of www.youtube.com instead of my video video.
There are 2 files in a single directory:
ClassMedia.php:
<?php
class Media {
public function embedYT($code){
echo "<iframe width='560' height='349' src='http://www.youtube.com/embed/".$code." frameborder='0' allowfullscreen></iframe>";
}}
Demo.php:
<?php include "classMedia.php"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Demo</title>
</head>
<body>
<?php
$media = new Media();
$code = "XSGBVzeBUbk";
$media-> embedYT($code);
?>
</body>
</html>
You're missing a single quote right after src='http://www.youtube.com/embed/".$code.", you want this:
echo "<iframe width='560' height='349' src='http://www.youtube.com/embed/".$code."' frameborder='0' allowfullscreen></iframe>";
Note the added single quote.
YouTube ends up seeing a bad URL (http://www.youtube.com/embed/$code frameborder= where $code is the real code) and hands you the homepage instead of what you think you were asking for.