I have been trying to use textastic with less (lesscss.org) and I have been unable to get it to preview the HTML file correctly.

12 years ago • updated by 12 years ago • 14

I have an HTML file that includes a .less file and then the JavaScript less compiler. When I preview with textastic, Iit appears that none of the JavaScript has executed.

Are there limits on js execution in the preview?

Vote

Replies 14
Oldest first
- Newest first
- Oldest first

12 years ago

There shouldn't be limits beside the restrictions iOS places on JavaScript execution.

See "Known iOS Resource Limits" at http://developer.apple.com/library/IOS/#documentation/AppleApplications/Reference/SafariWebContent/CreatingContentforSafarioniPhone/CreatingContentforSafarioniPhone.html

12 years ago

I think perhaps this is related to cross domain resources., a .less file might not be able to be sources locally.

12 years ago

If you send me an example, I can try to reproduce it on my iPad.

-1

12 years ago

You can try the basic samples from lesscss.org. I have the same problems with just their basic setup.

I doubt this is a textastic bug actually. More than likely a limitation of the uiwebview.

12 years ago

The basic sample works for me as described in my last comment.

12 years ago

I would love to see this fixed.
Unfortunately it is a Textastic limitation, since it works just fine with Koder and with iFile webview.

12 years ago

I've just tried it out and it works fine for me:

test.html:

<!DOCTYPE HTML>

<html>

<head>

<meta charset="utf-8">

<title>Less Test</title>

<link rel="stylesheet/less" href="style.less" type="text/css" />

<script src="lesscss.js" type="text/javascript"></script>

</head>

<body>

This is a test for lesscss. 

</body>

</html>

style.less:

@color: blue;

body {

color: @color;

}

I've put the lesscss.js in the same folder as text.html and style.less. This resulted in blue body text.

12 years ago

Thank you for your support!
I'm using Bootstrap from twitter and it works in Koder, and any webkitview app I've tested, but fails on my favorite editor (Textastic).
Please try it with the Bootstrap files:
https://github.com/twitter/bootstrap/
Or using the h5bp initializer with bootstrap, for fast checking: https://github.com/verekia/initializr-bootstrap/

I would love to see it working, I can compile it to css on the iPad ( with nodejs and Prompt) but live previewing quick changes is essential.
TY

12 years ago

The problem is in the "loadStyleSheet" function of LESS: https://github.com/cloudhead/less.js/blob/master/dist/less-1.2.2.js#L3079

Textastic uses the custom "preview://" protocol, not "file://". This is needed to work around a caching but in iOS 5.

So if you the change regular expression in this line:

if (! /^(https?|file):/.test(href)) {

if (! /^(https?|file|preview):/.test(href)) {

then it works for me in Textastic.

12 years ago

Note: it's just the @import directive that doesn't work for local files. If you enter a complete url like

@import "http://www.example.com/test.less"

then it does work without modification.

Unfortunately, there is not much I can do about it. This would need to be changed in LESS, so that it doesn't hard-code supported schemas but checks if the path starts with <schema>:/

12 years ago

I will make that suggestion to the dev.
Thank you again! Sincerely.

12 years ago

Thank you for so promptly take the time, especially on a Sunday, to have a look into this.
Consider it fixed! :)
But, btw and a little off topic, could this custom schema (preview://) be the cause I my unccessful tries at loading firebug lite? Just cossed my mind..
TY

12 years ago

Possibly. But I've added support for Firebug Lite in Textastic 4.0. I'm going to submit this version to Apple today.

12 years ago

Awesome! :D
Can't wait! Code completion and firebug integration will streamline the workflow on my side.

Customer support service by UserEcho