Example CSS
#wrap{margin:20px}
Code prettify wraps the whole line in .com
<span class="com">#wrap{margin:20px}</span>
Somebody has a similar issue here.
Where someone answers "Are you loading lang-css.js?".
Here's what I'm loading in the footer.
<script src="/js/google-code-prettify/lang-css.js"></script>
<script src="/js/google-code-prettify/prettify.js"></script>
I can see both of them with web inspector. I tried changing the order and loading them from the header. I'm using the latest version.
All help is greatly appreciated :)
Thanks!
The order you link to the javascript files matters. You need to call the base code (prettify.js) first followed by the css specific code (lang-css.js). You can place the script tags either in the head section or at the end of the document... both work but placing at the end of the document will speed up the page load.
<script src="/js/google-code-prettify/prettify.js"></script>
<script src="/js/google-code-prettify/lang-css.js"></script>
You will also need to ensure that you are linking the stylesheet in the head of your document.
<link rel="stylesheet" type="text/css" href="/css/prettify.css">
You also need to add the correct classes your pre tag(s). The syntax-highlighting functions contained in lang-css.js will not be called without adding the class "lang-css" to the <pre> tag.
<pre class="prettyprint lang-css linenums">
Finally, make sure you call the "prettyPrint()" function on page load.
<body onload="prettyPrint()">
Related
So I have this template in Thymeleaf:
<script th:src="#{|${#request.requestURI}ace-builds/src-noconflict/ace.js|}" type="text/javascript" charset="utf-8"></script>
What I want it to do is pull the current directory(?) it's in, and attach it to the front of the source. So if this is on the page www.mywebsite.com/mypage, it will generate the source tag /mypage/ace-builds/src-noconflict/ace.js.
From other posts here, it looks like that's what should happen, for me, I get this instead:
/mypage/mypage/ace-builds/src-noconflict/ace.js
I can't for the life of me figure out why this is happening. For those wondering why I'd want to do this in the first place, this program is running out of a WAR on a tomcat 9 server, and so the source tag needs to include the mypage war file name to pull from it, which I can hardcode to make work, and I can't pull static resources with just /ace-builds/src-noconflict/ace.js.
Never mind, I am a fool and missed the advise in one of the threads I was checking. Just needed to use:
<script th:src="#{ace-builds/src-noconflict/ace.js}" type="text/javascript" charset="utf-8"></script>
I was trying regular src before, without thymeleaf, and thought the leading / was necessary. Not the case.
Can I make the generated HTML page from my DDoc-marked-up D program use richer coloring and type-setting? The default is black-and-white.
I'm currently calling DMD as
dmd -debug -gc -unittest -D -Dd$OUTPUT_DIR
Well, you should probably read through http://dlang.org/ddoc.html to get some of the details, but ultimately, what you need is a css file which tells it how to present the page. That can be set via the DDOC macro.
What I'd suggest doing is taking a look at https://github.com/D-Programming-Language/dlang.org, which contains the code for dlang.org - including the ddoc stuff. In particular, you want to grab std.ddoc along with the css, images, and js folders (as they are all referenced by std.ddoc). If you then give std.ddoc to dmd as part of your documentation build and have those folders in the parent directory of the documentation, the generated documentation should end up looking like the documentation on dlang.org. If you want to put the folders elsewhere, then just tweak the paths to them in std.ddoc.
If you want to change what the documentation looks like, just adjust std.ddoc and the css files accordingly. At that point, it's html and css stuff that you're dealing with, so you'll have to have some clue how those work to make the necessary changes to either the macros in std.ddoc or to the css files themselves. And of course, if you want to do anything with the js files, you'll need to know javascript. You can strip out all of the js and images if you want to. They're just what's used for dlang.org, but again, you'll have to have some clue how html and friends work to know what to do with that. I'm not particularly well versed in any of that, so when I've generated documentation, I've typically made only minimal changes to what dlang.org uses, but all I've typically been looking for is to get more legible colors than the default rather than anything specific.
Sorry that I can't be more specific or helpful than that, but the best that I've done with it is stumble through it enough to get pages looking like dlang.org, since I know next to nothing about web development. Hopefully this will point you in the right direction though.
Something else that you might want to look into is ddox, which uses ddoc comments to generate better looking documentation than dmd does. And it's likely that dlang.org will be switching to using ddox-generated documentation sometime in the relatively near future (some of the details still need to be sorted out, so I don't know when exactly, but that's the current plan). So, using ddox may ultimately end up becoming more common than using dmd to generate the documentation.
You can create your own .ddoc config file in which you override or create new ddoc macros to use class names and id's. Then you can style the page using CSS.
Sample .ddoc file containing custom CSS, Notice the theme.css file in the head HTML section:
DDOC = <!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<link type="text/css" href="theme.css" rel="stylesheet" media="all" />
<title>$(TITLE)</title>
</head>
<body>
<h1>$(TITLE)</h1>
$(BODY)
</body>
</html>
H2 = <h2>$0</h2>
H3 = <h3>$0</h3>
STRONG = <strong>$0</strong>
EM = <em>$0</em>
DDOC_DECL = $(H2 $0)
DDOC_DECL_DD = <div class="declaration-description">$0</div>
DDOC_CLASS_MEMBERS = <div class="class-members">$0</div>
DDOC_SUMMARY = $(P $0)
DDOC_DESCRIPTION = $(P $0)
DDOC_MEMBERS = <div class="members">$0</div>
DDOC_ENUM_MEMBERS = <div class="enum-members">$0</div>
DDOC_MODULE_MEMBERS = <div class="module-members">$0</div>
DDOC_STRUCT_MEMBERS = <div class="struct-members">$0</div>
DDOC_TEMPLATE_MEMBERS = <div class="template-members">$0</div>
This file should be saved somewhere and added to the sc.ini file (in the case of Windows) or the dmd.conf file (in the case of Mac/Linux) like this:
DDOCFILE=myproject.ddoc
Then the next time you compile using -D, HTML is read from the custom ddoc macros instead of the built-in stuff and viola, you have style-able class names and id's to use with CSS.
Here's a preview of pretty documentation using a custom style-sheet and macros: http://htmlpreview.github.io/?https://github.com/kalekold/dunit/master/docs/dunit/toolkit.html
HTML files: https://github.com/nomad-software/dunit/tree/master/docs/dunit
Full ddoc macro listings can be found here: http://dlang.org/ddoc.html
Before asking I want to say that this is not a duplicated topic. I've already tried with:
Pwarelis' fork
Tcrosen's one
Gudbergur's code
...and many others, and I also read lots of Q&A, but none of them is what I am looking for.
All what I tried works with predefinite string sources, but when I do the next step: AJAX remote source, it is just showing no results on the dropdown list.
UPDATE - My code (don't understand why negative votes. Well written, well strucuted ;))
The html file
<html>
<head>
<link href="./bootstrap/css/bootstrap.css" rel="stylesheet" type="text/css" />
</head>
<body>
<input id="myElement" class="typeahead" type="text">
<script src="./js/jquery.js"></script>
<script src="./bootstrap/js/bootstrap-typeahead.js"></script>
<script language="javascript">
$('#myElement').typeahead({
ajax: '/php/ajax.php'
});
</script>
[...]
The ajax.php file:
<?php
echo "[{ id: 1, name: 'Terry'}, { id: 2, name: 'Mark'}, { id: 3, name: 'Jack'}]";
?>
It's not an AJAX issue, because it is working in other cases at the same machine.
What may I try to fix it?, I am really crashing up my head since a few days. Thanks for reading.
People who vote negative without even knowing the right answer should think a bit before acting. If someone needs a real nice/working/magic autocomplete script, here wo go:
Real good Autocomplete Script
Description: This adds a pulldown menu of suggested values to a text field. The user can either click directly on a suggestion to enter it into the field, or navigate the list using the up and down arrow keys, selecting a value using the enter key. The values for the suggestion list are to provided as XML, or as JSON (by a PHP script, or similar).
Thanks those who made negative points disappear ;)
hey set header of json in you php file
use header('Content-Type: application/json');
for more info on header plese visit here(stackoverflow question) ad for example visit here(www.funnenjoy.com)
I am creating a blocks in my controller using
$this->_addContent($this->getLayout()->createBlock('mymodule/mymodule_newpage')
Is there any way how I can embed js code into the addcontent function. I dont want to add complete js but a chunk of code.
Thanks
You can add that particular js file in your static block (mymodule/mymodule_newpage) by writing it under content tab.
<script type="text/javascript" src="http://your_site.com/js/your_js_file.js"></script>
Though I am not 100% sure.Give a try.Goodluck.
You can try:
$this->_addContent($this->getLayout()->createBlock('core/text')->setText('your script here'));
Obs: I could not make sintax highlight fpr PHP work anymore...
I'm restructuring a page for a client, and I'm having some issues with the jQuery code I implemented on the page.
There's a pop-up lightbox that uses Prototype which appears when the page loads, and then there's marquee/scrollers on the top and right that I put there that use jQuery. I'm really unsure about what's causing the error.
I'm familiar with jQuery's noConflict, but I've tried pretty much every variation of it on this page and I still get an error - after a few seconds the marquees stop - and IE displays that "Errors on page" dialog, referencing line 464 ("Array length must be assigned a finite positive number").
Here is the page: -link removed by author-
Here is prototype.js: -link removed by author-
I have absolutely no idea what is causing this error and JavaScript isn't my strongest side.
When I first started seeing this error, I was Googling around for more general "Prototype + jQuery" errors, when I should have been looking for a solution specific to the exact problem I was dealing with.
Adding the terms "array length" and "line 464" actually led me to the solution to this specific problem, and here it is:
Updated from prototype v1.4 to v1.5.1.2 (v1.7, the latest release,
didn't work right and even produced a stack overflow error).
Changed around the order of the scripts, and changed noConflict:
<script src="/scripts/jquery-1.5.2.js" type="text/javascript"></script>
<script src="/scripts/jquery.Scroller-1.0.src_4.js" type="text/javascript"></script><!-- all _$_'s replaced with _jQuery_ -->
<script type="text/javascript">
<!--
// more jquery, all $'s replaced with jQuery
-->
</script>
<script type="text/javascript">
<!--
jQuery.noConflict();
-->
</script>
<script src="scripts/prototype-1.5.1.2.js" type="text/javascript"></script>
<script type="text/javascript">
<!--
// everything else, including prototype scripts
-->
</script>
And that's it! Now I don't get the "Line 464" error and all scripts work fine.
Thank you #Ken and #Diodeus for leading me to the solution.
You may need to go through the plugins and replace $( with jQuery(, since you need to use "jQuery..." instead of "$..." in no-conflict mode.
Surround the code that uses jQuery with
(function ($) {
... // Your code
})(jQuery)
This way it uses local $ which is bound to jQuery and and jQuery only.
Also it is considered a bad idea to use both frameworks on the same website. You can find jQuery replacements for pretty much all of Prototype plugins.
I would find plugins in the same library. jQuery has all the plugins you mentioned, so there's no need to try using both. These two libraries can be difficult to get working together.
If you're set on using both libraries, try this ordering:
1) other lib
2) jquery
3) noconflict call
4) all plugins
<script src="scripts/prototype.js" type="text/javascript"></script>
<script src="/scripts/jquery-1.5.2.min.js" type="text/javascript"></script>
<script type="text/javascript">
<!--
$.noConflict();
-->
</script>
<script src="/scripts/jquery.Scroller-1.0.src_3.js" type="text/javascript"></script>
<script src="scripts/lightbox.js" type="text/javascript"></script>