Interesting aspect of the Issues app

25 views
Skip to first unread message

jonnyram

unread,
May 17, 2010, 8:51:14 AM5/17/10
to Cappuccino & Objective-J
Beautiful work on this web app, guys. I took a cursory look at the
code, because I was curious how you implemented the "bottom pane" view
where the issue is shown. It looks like you actually have a CPWebView
load an html file with the whole design written in HTML/CSS. Was there
a particular reason for this, and is it a common approach for
Cappuccino apps? I hadn't considered it before, but with the lack of a
mature CPTextView it may be the best way to show paragraphs of text
and get an overall webpagy-feel within a Cappuccino app.

--
You received this message because you are subscribed to the Google Groups "Cappuccino & Objective-J" group.
To post to this group, send email to objec...@googlegroups.com.
To unsubscribe from this group, send email to objectivej+...@googlegroups.com.
For more options, visit this group at http://groups.google.com/group/objectivej?hl=en.

klaaspieter

unread,
May 17, 2010, 3:06:41 PM5/17/10
to Cappuccino & Objective-J
I don't know if it's common practice in Cappuccino. I do know that in
Cocoa this is done fairly often. In my experience it's mostly done if
something requires fairly complex layout. In Cappuccino (or Cocoa)
this would require lot's of custom drawing and / or view layout. HTML/
CSS is perfect for complex layouts and templating engines make it
fairly easy to also get your data to display.

Ross Boucher

unread,
May 17, 2010, 3:53:37 PM5/17/10
to objec...@googlegroups.com
I'd like to write a blog post someday about the design decisions, but Klaas nails this one. Cappuccino views are great at interaction, and at certain kinds of layout. They are pretty bad at dynamic text content and inline images, characteristic features of a document.

Except for the comment box (something which we should arguably move into the Cappuccino level), the issue display is entirely static. There's no interaction, just content layout. Precisely the kind of thing HTML and CSS are good at. Part of the goal of this app is to demonstrate how to choose the right technology for the job, and I think this is a good example.

Ralph Dratman

unread,
May 17, 2010, 9:07:15 PM5/17/10
to objec...@googlegroups.com
In that vein, what's the best way in Cappuccino to create a read/write
data grid, say for a business database application?

Thanks

jonnyram

unread,
May 17, 2010, 9:42:07 PM5/17/10
to Cappuccino & Objective-J
Thanks for the reply. I think the separation of functions makes good
sense, but my previous rendezvous with CPWebView leaves me a little
apprehensive. I can easily get it to load an external HTML file via
CFHTTPRequest, but it always seems to show only the bare minimum
dimensions of the HTML -- until I resize it.

For example, if I init a CPWebView the size of my window and tell it
[webView loadHTMLString:"<html><body>Hello</body></html>"], it
displays a tiny white rectangle just large enough to fit that word.
Then if I try resizing it, it fills the window as intended! Not sure
if I'm doing something wrong or what. Perhaps I should make this a
separate thread.

Elias

unread,
May 17, 2010, 10:52:23 PM5/17/10
to Cappuccino & Objective-J
I think there's a long tradition in using html/css in objective-c
apps. I got a lot of webview-using-apps on my iPhone.
Like Ross said, Cocoa / Cappuccino is for dynamic behaviours, html is
for layout.
But you should use webviews with html wisely because it will be static
with no objective-J goodness.
But in the Issues.app case thats no problem because the webview gots
loaded only once you click on a issue or post a comment.
There is no need for further dynamic behaviours.

Mason Mark

unread,
May 18, 2010, 2:23:02 AM5/18/10
to objec...@googlegroups.com
Our app also uses this hybrid Cappuccino-controls-and-views for this, web-views-for-that approach. (It's a human resources application used to manage employee files.)

The list of employees is a basic CPTableView (the very-improved table view, thanks so much Randy!) with some widgets to filter by group or search criteria.

To edit an employee record, you get a big form with a bunch of CPTextFields and CPPopUpButtons and whatnot. But to just view a record, we use a web view that displays the data in a nice simple HTML/CSS way.

The initial reason we did this is because selecting and copying text was a required use case, and this doesn't work with CPTextField and friends. But after we went with CPWebView, we realized this was significantly easier to implement, and also looked nicer.

Regarding the visual problems you are having, I initially had similar problems and was afraid CPWebView wasn't going to work out--different gitchy look and behavior in different browsers, including the web view getting somehow shrunk down to tiny size.

Then JesusPerez suggested that I stop using -loadHTMLString: (which I had been using, since I was just trying to test whether using a CPWebView would work) and feed the web view a real URL. Once I did that, and made my backend serve up an HTML page at that URL, everything works great.

I didn't really dig into WHY that difference occurs, you can search this group for the thread "CPWebView funkiness with non-WebKit browsers" to for that discussion.

jonnyram

unread,
May 18, 2010, 8:02:29 AM5/18/10
to Cappuccino & Objective-J
Thank you for the tip, I will try this when I get home. I should note
though, it looks like the Issues app uses loadHTMLString and doesn't
appear to have any problems -- see the _loadIssue method at line 100:

http://github.com/280north/issues/blob/master/Client/IssueWebView.j
> For more options, visit this group athttp://groups.google.com/group/objectivej?hl=en.- Hide quoted text -
>
> - Show quoted text -

jonnyram

unread,
May 18, 2010, 5:24:42 PM5/18/10
to Cappuccino & Objective-J
I just tried using setMainFrameURL and it works great! Thank you Mason
for passing on that advice. The only downside is that, for some
reason, I lose the Cappuccino-style scrollers and see the traditional
aqua scrollers instead. Not sure why, but for now I'll have to
tolerate it. Thanks again.
> > For more options, visit this group athttp://groups.google.com/group/objectivej?hl=en.-Hide quoted text -
>
> > - Show quoted text -
>
> --
> You received this message because you are subscribed to the Google Groups "Cappuccino & Objective-J" group.
> To post to this group, send email to objec...@googlegroups.com.
> To unsubscribe from this group, send email to objectivej+...@googlegroups.com.

jonnyram

unread,
May 21, 2010, 9:25:59 PM5/21/10
to Cappuccino & Objective-J
I realized after writing this that I *need* to use "loadHTMLString"
because I'm interesting in mimicking the mustache.js method that
Issues uses. So if anyone has *any* idea why CPWebView seems to not
show the content at the correct width when loadHTMLString is used, I'd
appreciate it.
> > > For more options, visit this group athttp://groups.google.com/group/objectivej?hl=en.-Hidequoted text -

Mike Fellows

unread,
May 21, 2010, 9:52:26 PM5/21/10
to Cappuccino & Objective-J

I recently used loadHTMLString in a test application seemingly without
any width issues. I wasn't really testing CPWebView so perhaps I'm
missing what you were talking about. I've been using the nightly
builds of Cappuccino to test.

What version of Cappuccino are you using? There have been a lot of
changes to CPWebView lately, some of which affected loadHTMLString
directly.

If you want to see how I've been using CPWebView, have a look at this:

http://github.com/MCF/FileUpload/blob/master/AppController.j

Regards,
Mike


On May 21, 6:25 pm, jonnyram <tiredash...@gmail.com> wrote:
> I realized after writing this that I *need* to use "loadHTMLString"
> because I'm interesting in mimicking the mustache.js method that
> Issues uses. So if anyone has *any* idea why CPWebView seems to not
> show the content at the correct width when loadHTMLString is used, I'd
> appreciate it.

jonnyram

unread,
May 22, 2010, 12:17:18 AM5/22/10
to Cappuccino & Objective-J
I looked into it more and found that it may just be a bug in my code.
I can't tell why, but the order in which I add the CPWebView as a
subview affects whether this occurs or not, so I'll have to spend some
time to figure out why. Thanks for your help!

Alexander Ljungberg

unread,
May 22, 2010, 11:35:55 AM5/22/10
to Cappuccino & Objective-J
On May 18, 5:24 pm, jonnyram <tiredash...@gmail.com> wrote:
> I just tried using setMainFrameURL and it works great! Thank you Mason
> for passing on that advice. The only downside is that, for some
> reason, I lose the Cappuccino-style scrollers and see the traditional
> aqua scrollers instead. Not sure why, but for now I'll have to
> tolerate it. Thanks again.
>

I know you have already switched back to loadHTMLString, but just in
case someone else comes across this. The setMainFrameURL message
actually causes the scrollbar style to be switched to
CPWebViewScrollNative. You have to override the implementation to
change this.

Regards,
Alexander

Ralph Dratman

unread,
May 23, 2010, 8:00:03 PM5/23/10
to objec...@googlegroups.com
Mike,

I cloned your FileUpload repository from
http://github.com/MCF/FileUpload.git, and opened index-debug.html in
Firefox for Windows 3.6.3. Unfortunately Firefox just displays
"Loading FileUpload Test Application..." forever.

Okay, not really forever. Five minutes. I am probably doing something wrong.

Firebug did not complain while I was trying this, but that may not
mean anything as I don't know how I should set it up for this test.


Ralph

Mike Fellows

unread,
May 23, 2010, 9:12:56 PM5/23/10
to Cappuccino & Objective-J

> I cloned your FileUpload repository fromhttp://github.com/MCF/FileUpload.git, and opened index-debug.html in
> Firefox for Windows 3.6.3. Unfortunately Firefox just displays
> "Loading FileUpload Test Application..." forever.
>
> Okay, not really forever. Five minutes. I am probably doing something wrong.

If you are serving the files from a nearby machine it should take
about 10 to 30 seconds to load them, then a simple screen with a
single button in the upper left corner is displayed with some text
below showing the post URL. I've just re-run the test app with
Firefox 3.6.3 on Windows using a Frameworks directory from last
nights nightly build. It works fine for me.

> Firebug did not complain while I was trying this, but that may not
> mean anything as I don't know how I should set it up for this test.

To simply get the app to display there is nothing to set up other than
adding a recent build of the Frameworks directory. You don't even
need to serve the files form a web-server to get the initial display.
Just open the index.html file (or index-debug.html) in your browser,
it should load up in 10 to 30 seconds (it gets faster as the files are
cached).

Did you place a copy of the Frameworks directory into the directory
holding the cloned project? If you didn't you might get the symptoms
you describe. If you did what version is it and where did it come
from (e.g. capp gen or some other technique)? You will need a recent
build of Frameworks for the CPWebView to work correctly - sometime in
the last couple of weeks should be fine.

Regards,
Mike

jonnyram

unread,
May 23, 2010, 9:47:21 PM5/23/10
to Cappuccino & Objective-J
Just as an update, I think I have tracked down the CPWebView problem
and filed an issue with sample code on github:

http://github.com/280north/cappuccino/issues/issue/684

Ralph Dratman

unread,
May 24, 2010, 4:09:58 PM5/24/10
to objec...@googlegroups.com
Thanks -- I didn't realize Frameworks had to be added! Now it works.

Ralph

jonnyram

unread,
May 26, 2010, 5:30:48 PM5/26/10
to Cappuccino & Objective-J
I found a workaround to the CPWebView issue, and would like to put it
here in case anyone comes across the same problem. Instead of doing
this:

[webview loadHTMLString:"<html><body>Hello World!</body></html>"];

Do this:

[webview setMainFrameURL:"javascript:document.write('<html><body>Hello
World!</body></html>')"];

This allows you to still load dynamically generated HTML (from
mustache.js, for example) without using loadHTMLString, thus avoiding
the (potential) bug I reported.

Cody Haines

unread,
May 26, 2010, 5:49:55 PM5/26/10
to objec...@googlegroups.com
That's a very hackish workaround, as the javascript pseudo-protocol isn't in any sort of specification, and thus may be removed from future browsers, without even documenting the removal. Better to figure out the cause of the actual bug/figure out how the Issues app handles it.

jonnyram

unread,
May 26, 2010, 8:24:08 PM5/26/10
to Cappuccino & Objective-J
The problem is I already know how the issues app handles it. The bug
only appears when using loadHTMLString while the CPWebView is hidden,
which the Issues app never has to do. My app has to, for various
reasons, so this workaround is the only solution I've found. I agree
it is very hacky, though.

> > objectivej+...@googlegroups.com<objectivej%2Bunsubscribe@googlegrou ps.com>


> > .
> > > > > For more options, visit this group athttp://
> > groups.google.com/group/objectivej?hl=en.
>
> > > > --
> > > > You received this message because you are subscribed to the Google
> > Groups "Cappuccino & Objective-J" group.
> > > > To post to this group, send email to objec...@googlegroups.com.
> > > > To unsubscribe from this group, send email to

> > objectivej+...@googlegroups.com<objectivej%2Bunsubscribe@googlegrou ps.com>


> > .
> > > > For more options, visit this group athttp://
> > groups.google.com/group/objectivej?hl=en.
>
> > > --
> > > You received this message because you are subscribed to the Google Groups
> > "Cappuccino & Objective-J" group.
> > > To post to this group, send email to objec...@googlegroups.com.
> > > To unsubscribe from this group, send email to

> > objectivej+...@googlegroups.com<objectivej%2Bunsubscribe@googlegrou ps.com>


> > .
> > > For more options, visit this group athttp://
> > groups.google.com/group/objectivej?hl=en.
>
> > --
> > You received this message because you are subscribed to the Google Groups
> > "Cappuccino & Objective-J" group.
> > To post to this group, send email to objec...@googlegroups.com.
> > To unsubscribe from this group, send email to

> > objectivej+...@googlegroups.com<objectivej%2Bunsubscribe@googlegrou ps.com>

Reply all
Reply to author
Forward
0 new messages