Compiling Latex with Javascript - javascript

I am working on a webapp(written with react-js) that generates a Latex code which contains information to give to the user. My goal is to let the user download the PDF file directly from my application.
I first tried using this library: texlive.js, that seemed to work but really it's impossible to recompile(their "Makefile" is not meant to handle new packages) if you try to add new packages(only some basic ones work).
So I thought about using the overleaf APIs but they don't let you obtain the pdf without sending the user to their website.
Any advice to make one of them work or any other way to achieve my goal?

You can install your package in texlive.js without using MakeFile
Sorry I am not expert in answering but here is how i made it work
I wanted to implement exam paper generation using javascript
Required Package/Class : exam
I created "\texlive.js\texlive\texmf-dist\tex\latex\exam\exam.cls"
Added this to
"\texlive.js\texlive\texmf-dist\ls-R"
./tex/latex/exam:
exam.cls
And Then \texlive.js\texlive.lst
/texmf-dist/tex/latex/exam/.
And
/texmf-dist/tex/latex/exam/exam.cls

I've recently found this project:
https://github.com/SwiftLaTeX/SwiftLaTeX
I've tested it with a few documents and it seems to work. It downloads the needed packages from the web, see available packages: https://www.ctan.org/. I haven't gone deeper into passing images to the engine but it should be possible. See the official demo: https://www.swiftlatex.com/#demo
Here is the official guide with the download link for the already compiled wasm files and with the js bindings: https://www.swiftlatex.com/#install

Related

How to use cv.pencilSketch method in Javascript. I know it works in Python, but it is not a function in javascript

I want to make image processing tool, and I have used cv2.pencilSketch() method in python. However, in JavaScript, it is not a function.
How do I do it in JavaScript? In my browser. (OpenCV js CDN)?
If it is not a function, I would like to make it a function with my own image processing, but I need help.
unfortunately, as of now, only a small subset of opencv is exposed to js.
you'll find the complete 'whitelist' here
(and no, pencilSketch() is not included, so you cannot use it)
IF you're able to build it locally, you could try to add the function to the photo section, and build your own.
and IF that works, please make a github PR with it, so others can profit from your effort !

GatsbyJS: Search based on markdown files

👋
Can anyone provide some hints how to solve the following problem with GatsbyJS:
I have a page, which is listing all the markdown files of the project, via this GraphQL query:
query ListQuery {
allMarkdownRemark(sort: {fields: frontmatter___date, order: DESC}) {
edges {
node {
id
html
frontmatter {
date(formatString: "DD.MM.YY")
docs
path
tag
title
}
}
}
}
}
If I'm right, it's not possible to set a dynamic filter which is binded to the search input field.
Later on I found this: https://www.gatsbyjs.org/docs/adding-search-with-js-search/
I thought js-search could be the solution, but then I need a big .json file. The problem: It's more comfortable to work with markdown files. So this doesn't look like the right solution either. 😞
I am thankful for help!
Quote from the docs
Before we go through the steps needed for adding client side search to
your Gatsby website, you should be familiar with the basics of Gatsby
Markdown and GraphQL are used during build phase, during creating your static site.
During run phase, during client search you don't have access GraphQL/Markdown. They are not exist during user interaction with your site.
So for client search, you should create need a big .json file. If you will follow the doc, it will not be problem for you.
Looks like I'm very late to answer this question, but it might be somewhat helpful for others looking for it.
Before adding search to gatsbyjs web app you should have some idea how gatsby builds the app. You can check it in the docs.
To add search you first need to create an index of all the markdown files. For creating an Index you can do it manually or can use search engines like aloglia, elastic search or lunr.js. If you want everything easy to manage you can go with aloglia which has a cap for free searches. If you want to go without spending any money you can go with lunrjs .
What these search engines will do is that they will create a data layer above the graphql data layer which can be used during the run time. You can then create node which can be used to query the posts in the app.This blogpost explains setting up search in gatsby with details.

Dart wrapper over js library and use it in flutter app

Put it simple I want to make small currency exchange app (pet project- I want free API( 1000 requests per month including more currency is a perfect option)). I dont like the free APIs I have found so far but I have found this website https://bg.coinmill.com/ and I wanna use it for my purpose. Reading an answer to similar question:
The only way to make use of JS in Flutter is using WebView.
Dart compiles to JS only for browser applications, for Flutter it compiles >to native machine code.
convert js code direcly to dart, using package js
package JS doesn't convert JS, it just creates proxies for JS functions to >be able to call them from Dart, but that is also only supported in Dart web >applications.
Put it simple it isn't possible without hitting some compilation errors and some workarounds. However https://github.com/pichillilorenzo/flutter_inappbrowser looks promissing. Embedding the webpage that will look ugly and I won't have any control over ui/settings. My options now are looking for another free currency API or trying to find a workaround. I incline for another API, but not sure which one. Any suggestions ?
So basically what you actually want to do is use that website to do the currency conversion in the background (enter value, press "Convert"), then display the result in your Flutter app? You don't need javascript for that.
After entering pressing the submit button, the site simply redirects you to a different page (GET request) with an URL like this:
https://bg.coinmill.com/CAD_USD.html?CAD=22
Use dart's http library to perform the same request with the right currency/value parameters. The result of the request contains the source code of the web page.
Instead of displaying the web page, you just need to read the value you need from the source code of the web page:
<div id="currencyBox1">
<input class="currencyField" ... value="16.46" ...>
САЩ долар (USD)
</div>
So, how I understand your question, you have some js library, and you want to use it from Dart?
If question so, yes, you can do it using Dart JS Intertop. The more information in the link.
Edit
Yes, you are right, you can call js from Flutter only using evalJavascript function from flutter_webview_plugin.
You can use Firebase Cloud Functions and wrap your function in a callable function. You'll have all node js environment and Dart code will only call a function.

How to import rows from .xlsx and write them in specific places in .docx using Electron?

Intro
Hi, I was looking for answer in the whole Internet (in some way I kind of feel that I know every question in Stack Overflow), but the answers were never appropriate to what I'm looking for. I was trying to avoid posting question here, but situation forced me to do this.
Sorry if the answer is simpler than I think.
I'm in the middle of building my first app in Electron using JavaScript. I think that I should describe it in few words, so flam:ngo™ (which is projects name) should work like this:
User will upload two files:
file with tables (like XLSX or DOC)
file with data and blank spaces (which will be used as a template)
App will import from tables.
Now app should let user choose which rows he's interested in and where in uploaded file he wants them to be placed.
flam:ngo save document in PDF (or DOC).
Clue
Right now I need solutions just for myself and in little simpler form. For now I need flam:ngo just to work with one specify XLSX and with one DOC template, but I stuck. I know which rows in document I will always need, but I don't know what should I write to specify in JS's code that I need exactly this ones (like hey, app, pick only this one, this one and maybe this one) while JS is reading file and I don't know how to create new DOC (or PDF) file, how to write data in specified blank spaces and then at the end: how to save it in direction which I should choose for every time I'm using an app - everything in one, maybe two, processes.
Ending
Could you, please, help me: for now I have implemented file uploader which is importing file in XLSX and which is saving it as CSV, XML oraz HTML. What should I do to keep moving forward?
I really appreciate your help!
PS. For better explanation:
For now this should look like this:
1. "template.docx" is uploaded in the core
2. user uploads .xlsx
3. app reads tables and select rows chosen in code
4. app puts data from chosen rows in specify places
5. app saves file > new life of the app :)
Ok, so it's been a while and app has been already written by me. Maybe this will help someone in the future:
Solution
Packages that helps me with this issue was:
js-xlsx which converts my file to simple HTML file, where cells from my XLSX template file have always the same ID (which was important for me to work with document templates).
officegen which helps me write brand new document based on earlier prepared template.
Rest of it was just Vanilla JS.

Processing export as javascript with a third-party library(peasycam)

I write a processing(2.1.1) project in java and now I want to export it as javascript.but there is a problem,I use the peasycam library,it is a third-party library and offer only jar file(peasycam.jar) and no js file(no peasycam.js).I read something about this in the official website of Processing,it seems to have no solution unless peasycam offer a peasycam.js.
Peasycam does not have a library for Processing.js. There's not much that can be done about that unless the original author or someone else (hint: you) wants to write one.
You have the option of using ArcBall which has a JS version that you can include with your projects.
You can see an example of how it works here: http://www.math.tamu.edu/~romwell/arcball_js/index.html
And see the ArcBall.pde here: https://github.com/motionbank/deborah-hay-processing/blob/master/marker-analysis/scene-probability/backbone_01/arcball.pde
If you don't want to worry about ArcBall then I suggest you learn about Quaternions and write your own code to handle 3D scenes.

Categories