UI is created in Dart and the Dart code will be compiled to JavaScript. How to make them indexed by the search engines?
According to (http://www.forbes.com/sites/velocity/2010/06/25/google-isnt-just-reading-your-links-its-now-running-your-code/):
On Friday, a Google spokesperson confirmed to Forbes that Google does
indeed go beyond mere “parsing” of JavaScript. “Google can parse and
understand some JavaScript,” said the spokesperson.
However, tomyeh's answer is good too :)
If UI is written in pure Dart, they won't be indexed. However, you can use Rikulo EUL, a markup language, to embed UI in the HTML page. Because EUL can be written as a HTML fragment, they will be indexed by the search engines.
For example, in the following code snippet, "Rich widgets", which is a label, will be indexed by search engines.
<div data-layout="type: linear">
Rich widgets: <div class="Switch" data-value="true"/>
</div>
For a real example, please refer to the Scroll View example.
Related
What is the recommended way to pretty print HTML or code excerpts in AngularDart? Is there a package to help achieve this (have found none), or do developers simply use "external" packages like google-code-prettify?
I use this http://craig.is/making/rainbows/
You add a javascript tag and some classes to your tags containing your code - that's it.
If you want to include HTML including Angular markup you can use ng-non-bindable to prevent Angular processing tags and attributes it may have selectors for.
For example, I have a piece of code like this:
String_test="
<template>
<label> {{count2}} SSSSSSSSSSSSSSSSSSSSSSSSS </label>
<input id="input1" type='text' value='{{count2}}'>
</template>"
and I want to assign String_test to another element, like:
DivElement span2 = new Element.tag("div");
span2.setInnerHtml(String_test);
_content.nodes.add(span2);
However, the "< template >' tag is not recognized, nothing will show up.
NOTE: My purpose is to use setInnerHtml to dynamically add contents to the webpage with data-binding still OK.
Any ideas?
Thanks!
It appears that you are including raw html in your Dart program files. This is not how Dart works. Dart has code (kept in .dart files) that is referenced to via a tag in the HTML file. This very quick tutorial will show you how to do that: https://www.dartlang.org/docs/tutorials/connect-dart-html/
Templating is found in the Dart Polymer library. It is too long of a process to go into here but you can find a short tutorial at: https://www.dartlang.org/docs/tutorials/polymer-intro/
I would also mention that Angular comes in a Dart flavor and I find it more accessible than the Polymer libraries. The tutorials and documentation are also much better. Angular is a more comprehensive suite of libraries and it's tutorials can be found here: https://github.com/angular/angular.dart.tutorial/wiki
I've been writing some tutorials, and I'm trying to figure out an elegant way to add line-by-line annotations to the code in the tutorials.
For example, suppose I have some code like this:
<h1>Demo of web page</h1>
<p>This is a paragraph</p>
I'd like to be able to add something (maybe a tooltip or some kind of lightbox effect) that allows me to present an explanation of each line to the reader, while still letting them see the line in context. The best I've been able to come up with is prose explanations that say things like "The line that starts with <h1> is a headline."
Anyone ever seen something like this?
You might want to check out docco:
http://jashkenas.github.com/docco/
It's written in CoffeeScript and generates an HTML doc from a source file breaking up the comment sections and the code. It sets up the comments as annotations for each section in one column and the corresponding properly highlighted code in the other column. I think it's a great simple way to grok annotations while keeping the code in context. Oh, and it also knows markdown.
What about using title attributes?
<h1 title="your hover text">your text</h1>
I think I might have found something to rival Docco: the popover feature of Twitter Bootstrap: http://twitter.github.com/bootstrap/javascript.html#popover
I'm not sure that it will actually look good, but it seems like a good start.
Old but good question, I was searching for similar things when I found this. There are tons of ways of doing HTML annotation, see this article for a very nice listing and explanations.
If you want annotation that simply tells the user what each line does, I would write HTML comments for small pieces of code, and larger external annotations for large amounts of code. You could then parse them using custom JS to show prettier boxes if you so wish.
<h1>Heading</h1> <!-- A heading element -->
<p>paragraph</p> <!-- A paragraph element -->
<p>Paragraph with
<b>Bold</b> <!-- An inline Bold element -->
text</p>
For larger amounts of code, I would consider using something like the documentation that Docco creates. Sure, it's for JavaScript but who says a similar one can't be done for HTML. As this was tagged with jquery-UI, you also might be interested in a jQuery text annotater.
i'm trying to display html i.e. rich text within a wicket element dynamically. An example is like displaying a rich text email within a div tag. how can i get this done with wicket. the wicket Label component doesn't seem to support this. is there a component that does
Found this in the excellent Manning Wicket in Action:
add(new Label("markup", "<h1>Hello!</h1>").setEscapeModelStrings(false));
The call to setEscapeModelStrings tells Wicket not to escape the contents of the provided string, and to render the contents into the resulting markup. This does the trick, as you can see in the right screenshot in figure 5.4. Note that this setting is available on all Wicket components, but it’s primarily useful on labels.
As the book also notes however, you should be aware of script-injection attacks..
As the title said, I have some DOM manipulation tasks. For example, I want to:
- find all H1 element which have blue color.
- find all text which have size 12px.
- etc..
How can I do it with Rails?
Thank you.. :)
Update
I have been doing some research about extracting web page content based on this paper-> http://www.springerlink.com/index/A65708XMUR9KN9EA.pdf
The summary of the step is:
get the web url which I want to be extracted (single web page)
grab some elements from the web page based on some visual rules (Ex: grab all H1 which have blue color)
process the elements with my algorithm
save the result into my database.
-sorry for my bad english-
If what you're trying to do is manipulate HTML documents inside a rails application, you should take a look at Nokogiri.
It uses XPath to search through the document. With the following, you would find any h1 with the "blue" css class inside a document.
require 'nokogiri'
require 'open-uri'
doc = Nokogiri::HTML(open('http://www.stackoverflow.com'))
doc.xpath('//h1/a[#class="blue"]').each do |link|
puts link.content
end
After, if what you were trying to do was indeed parse the current page dom, you should take a look at JavaScript and JQuery. Rails can't do that.
http://railscasts.com/episodes/190-screen-scraping-with-nokogiri
To reliably sort out what color an arbitrary element on a webpage is, you would need to reverse engineer a browser (to accurately take into account stylesheets, markup hacks, broken tags, images, etc).
A far easier approach would be to embed an existing browser such as gecko into a custom application of your making.
As your spider would browse pages, it would pass them to your embedded instance of gecko where you could use getComputedStyle to pull what color an individual element happens to be.
You originally mentioned wanting to use Ruby on Rails for this project, Rails is a framework for writing presentational applications and really a bad fit for a project like this.
As a starting point, I'd recommend you check out RubyGnome, and in particular RubyGnome's Gtk::MozEmbed functionality.