I need one conformation about using epub reader.how to give input as .epub file in monocle epub reader.I saw more samples in monocle github. But cannot identify which one will works.
I need to know about Monocle Epub reader below specifications :
1. I have one .epub file
2.how to read .epub using monocle epub reader
i didn't get any solutions reading that.I saw monocle epub related link is :
https://github.com/joseph/Monocle#future-directions
I tries to below code :
<head>
<!-- Include the Monocle library and styles -->
<script src="scripts/monocore.js"></script>
<link rel="stylesheet" type="text/css" href="styles/monocore.css" />
<style>
#reader { width: 300px; height: 400px; border: 1px solid #000; }
</style>
</head>
<body>
<!-- The reader element, with all content to paginate inside it -->
<div id="reader">
<h1>Hello world.</h1>
</div>
<!-- Instantiate the reader when the containing element has loaded -->
<script>Monocle.Reader('reader');</script>
</body>
But can't get any idea about to give input file as epub file.
So can you please suggest me how to read .epub file using monocle epub redaer.It is very imaportant for me.or Is there any apis for epub readers for ios and android?
Thanks in advance.
Please try following step.
Convert .epub to zip file
Extract .zip file.
Load extracted content by using Monocle.
Related
Testing A Frame for use with augmented reality (AR)
I have read through documentation and tested a small a-box which displays fine on top of the marker, but when I add a gltf model it wont load, I have tried the model on an online gltf viewer and it works fine, but it wont work on A Frame code?
<!DOCTYPE html>
<html>
<head>
<script src="https://aframe.io/releases/1.3.0/aframe.min.js"></script>
<script
src="https://unpkg.com/aframe-physics-system#^1.4.x/dist/aframe-physics-system.min.js"
data-component-description="Physics system for A-Frame VR, built on Cannon.js"
data-component-names="dynamic-body,static-body,constraint"
data-component-url="https://npmjs.com/package/aframe-physics-system"
data-package-name="aframe-physics-system"
></script>
</head>
<!-- https://cdn.glitch.global/40131ca8-3d08-4bae-ad16-b96766757df7/kit.gltf?v=1668698450644 -->
<script src="https://aframe.io/releases/0.6.0/aframe.min.js"></script>
<!-- include ar.js for A-Frame -->
<script src="https://jeromeetienne.github.io/AR.js/aframe/build/aframe-ar.js"></script>
<body style="margin: 0px; overflow: hidden">
<a-scene embedded arjs>
<a-assets>
<a-asset-item id="tree" src="https://cdn.glitch.me/c7d0d4e9-d04a-4e56-989f-c554ae50c253%2Fwindmilmaster4.gltf"></a-asset-item>
</a-assets>
<!-- create your content here. just a box for now -->
<a-entity>
<a-box position="0 0 -2" material="opacity: 1;"></a-box>
<a-entity gltf-model="##tree" scale=".02 .02 .02"></a-entity>
</a-entity>
<!-- define a camera which will move according to the marker position -->
<a-marker-camera preset="hiro"></a-marker-camera>
</a-scene>
</body>
</html>
I would love to hear your thoughts
Apologies after some time I have noticed some of the script werent upto date and more importantly were not inside of the
Trying to get an ePub file to pass through Apple's ePub checker but get two errors multiple times.
(1) element "img" not allowed here; expected the element...
This is the coding on the page:
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<link href="../Styles/Style.css" type="text/css" rel="stylesheet"/>
<title></title>
</head>
<body>
<h2>Tokyo</h2>
<p>Japan is made up of five main islands: Hokkaido, Honshu, Shikoku, Kyushu, and Okinawa. Over three-quarters of the 127 million people in Japan live on Honshu, the largest and most developed island. Tokyo, the capital, lies on its eastern shore.</p>
<img alt="Tokyo Metropolis" src="../Images/Tokyo-Metropolis.jpg"/>
<p>Tokyo Metropolis, one of Japan’s 47 prefectures, is comprised of two areas: the <a class="hook" id="Special-Wards-23">23 special wards</a>, which together make up what most consider to be Tokyo, and the rest—the cities and towns that lie to the west. It is best thought of as a constellation of cities that have, over the course of time, merged into one vast urban sprawl which is home to over 13 million people.</p>
I have the alt tag inserted correctly and it displays correct in iBooks.
CSS for img is as follows:
img
{
display: block;
margin-left: auto;
margin-right: auto;
margin-top: 15px;
margin-bottom: 15px;
padding: 1px;
border: 1px solid #021a40;
background-color: #FFFFFF;
}
I've looked around at numerous forums but am none the wiser as to why I'm getting this error.
(2) Same error but in relation to tags ("element "ul" not allowed here; expected end-tag or element "li"...")
Html here...
<ul>
<li><b>Introduction</b></li>
<ul>
<li>Tokyo</li>
<li>A Brief History</li>
<ul>
<li>The Emergence of Japan</li>
[Html cut short as it is a table of contents and long].
I think this is because I have nested lists, but this works perfectly in iBooks so I don't know why it is causing an error at validation.
I'd be very grateful for some help!
The second one is clear: lists can only contain list items. That's how it is.
You say "this works perfectly in iBooks" but that's not true. It doesn't work perfectly. It's just that the app's error handling routines happen to handle this in such a way that the result looks roughly like what you expected. This will not be the same on other machines, other versions of the app etc. Avoid such errors.
The first error message is more subtle.
What version of HTML does the file identify itself as?
If it's XHTML 1.x or HTML 4.x strict, then plain text and inline elements are officially not allowed at the body level. Don't ask me why, I don't know.
If the file version is HTML 4.01 Transitional or HTML5 (or the XHTML equivalents) then images as children of the body are fine.
If anybody can tell me why this difference exists, I'd be delighted!
As for a solution, if you can't change the HTML version to HTML5 or XHTML5, then simply putting everything in the body in one big div will do the trick. Just put <div> right after the <body> and </div> just before the </body>.
I use bootstrap table in one of my web page.
Bootstrap table : link
I have a little and funny problem :
As you can see boostrap table texts are in chinese.
How to change the language ?
A mistake with cdn.
In bootstrap-table web site in Getting started the CDN link is :
<!-- Latest compiled and minified Locales -->
<script src="//cdnjs.cloudflare.com/ajax/libs/bootstrap-table/1.6.0/locale/bootstrap-table-zh-CN.min.js"></script>
It's the chinese CDN.
Others CDN are here : list of CDN
Add these below js files and css file.
<script src="//cdnjs.cloudflare.com/ajax/libs/bootstrap-table/1.11.1/bootstrap-table.min.js"></script>
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/bootstrap-table/1.11.1/bootstrap-table.min.css">
<script src="//cdnjs.cloudflare.com/ajax/libs/bootstrap-table/1.11.1/locale/bootstrap-table-zh-CN.min.js"></script>
you can also set the locale in bootstrap-table to 'en-US' e.g
height: 550,
locale: 'en-US',
where $table is the reference to the id of your bootstrapTable
I am trying to set up an integration using the SDK to create KB article records in CRM 2013, and so far haven't been able to figure out a good way to build the article xml. We want to use sharepoint as our document authoring tool , and then send those documents over to CRM. From the research I've done so far, I know that in order to create a new kb article I need to link it to a template. I created a very basic template with one section as a test to work with, then in a test app using the SDK I created a new KBArticle entity instance, set the necessary required fields and assigned the template to the new article. I tried building the xml for the ArticleXML attribute by starting with the StructureXML attribute of the template and filling in the content section with some test html content. I was able to create the kb article successfully and then load it up in CRM, but it doesn't look right yet. I also created a new kb article through the UI and then using the SDK I retrieved it and examined the ArticleXML attribute to compare with the one I'm trying to create programmatically.
Here's the basic structure of the ArticleXML for an article created in the UI:
<articledata>
<section id="0">
<content>
<![CDATA[<b>Article content located here</b>]]>
</content>
</section>
<section id="1">
<content>
<![CDATA[]]>
</content>
</section>
</articledata>
Now here is the StructureXML attribute value from the template I created:
<kbarticle>
<sections nextSectionId="1">
<section type="docprop" name="title"/>
<section type="docprop" name="number"/>
<section type="edit" id="0">
<![CDATA[Content]]>
<instructions>
<![CDATA[Place KB article content here]]>
/instructions>
</section>
</sections>
<stylesheet>
<article>
<style name="background-color" value="#ffffff"/>
<style name="font-family" value="verdana"/>
<style name="font-size" value="10pt"/>
</article>
<title>
<style name="font-family" value="verdana"/>
<style name="font-size" value="16pt"/>
</title>
<number>
<style name="color" value="#666666"/>
<style name="font-size" value="9pt"/>
</number>
<heading>
<style name="font-size" value="10pt"/>
<style name="font-weight" value="bold"/>
<style name="color" value="#000066"/>
<style name="border-bottom" value="1px solid #999999"/>
</heading>
</stylesheet>
</kbarticle>
That template XML is what I tried to use and assign to the new article, but obviously it doesn't look right when the article is viewed, the template content is there along with the content I added, its basically duplicated:
I did also see there is a FormatXML attribute on the template, which contains XSL to transform the XML, I tried using this but it produces HTML output that isn't what I want either. I'm struggling with how to get from the template to the ArticleXML that I need in order to create the new KB article. Any help with this is much appreciated!
Through my journey of dart, I stumbled upon a "blocker" in terms of loading a component.
While having my component defined as followed:
<!DOCTYPE html>
<element name="x-foo" constructor="FooComponent" extends="button">
<template>
<button type="button" class="btn {{classes}}"> {{text}} </button>
</template>
<script type="application/dart">
import 'package:web_ui/web_ui.dart';
String classes = '';
String text = '';
class FooComponent extends WebComponent {
}
</script>
</element>
and referencing the component as followed:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>example</title>
<link rel="stylesheet" href="assets/css/bootstrap.min.css">
<!-- '../web/foo.html' or '../web/out/foo.html.dart' -->
<link rel="components" href='foo.html'>
</head>
<body>
<h1>example</h1>
<p>Hello world from Dart!</p>
<x-foo></x-foo>
<script type="application/dart">void main() { }</script>
<script type="text/javascript" src="dart.js"></script>
</body>
</html>
and my build script not creating a html file (output folder: foo.html.dart), I'm not sure to which file I have to reference.
The manual is also not declarative enough to solve my issue:
http://www.dartlang.org/articles/dart-web-components/spec.html#loading-components
Referencing to either the definition of the component (foo.html) or it's generated output (foo.html.dart) is not working. I've also double checked the paths of both files through inspection, which just downloaded both files with chromium.
My concluding question:
Is this reference (link element href) pointing to an internal intelligence or to a "physical" available file at runtime? And if secondly, which one (generated (html/dart) or source)?
To avoid misunderstandings, I've added a list of my repo:
foo
packages
examples
assets
dart.js
example.html
web
out
foo.html.dart
foo.html
build.dart
Component file (foo.html) is missing the <html><body>...</body></html> tags:
<!DOCTYPE html>
<html>
<body>
<element name="x-foo" constructor="FooComponent" extends="button">
...
</element>
</html>
</body>
Both files (examples.html and foo.html) must be in the same base directory:
web
examples.html
foo.html
...
Then, examples.html need be used as argument inside build.dart:
build(new Options().arguments, ['web/example.html']);
And, finally, foo.html (that is, web/foo.html) must be the one to be linked:
<link rel="components" href='foo.html'>
The way you have it in your main HTML file is correct. You reference foo.html because the referencing HTML document needs to be compiled with dwc. dwc will take the main HTML file and compile it and all the the components it includes. The component are completely compiled to Dart and they .html files won't be used anymore.
If you're trying to edit example.html to include your component, you'll need to compile example.html, and not foo.html. You'll still generate foo.html.dart, but also example.html.dart and a bootstrap script to load everything up.