NJKWebViewProgress

Transcript

1. NJKWebViewProgress id:ninjinkun / @ninjinkun Thursday, May 30, 13

2. NJKWebVIewProgress is • UIWebView Progress Interface • UIWebView doesn't have

   official progress interface • Available with NJKWebVIewProgress https://github.com/ninjinkun/NJKWebViewProgress Thursday, May 30, 13

3. NJKWebVIewProgress is • Don’t use private methods • AppStore safe

   • Easy to integrate • Over 300ˑ on GitHub! https://github.com/ninjinkun/NJKWebViewProgress Thursday, May 30, 13

4. DEMO Thursday, May 30, 13

5. Count Loading Resources UIWebView Hacks • Hook UIWebViewDelegate - (void)webViewDidStartLoad:(UIWebView

   *)webView { _loadingCount++; _maxLoadCount = fmax(_maxLoadCount, _loadingCount); [self startProgress]; } - (void)webViewDidFinishLoad:(UIWebView *)webView { _loadingCount--; [self incrementProgress]; } Thursday, May 30, 13

6. Count Loading Resources UIWebView Hacks • Increment Progress based on

   loading count float remainPercent = (float)_loadingCount / (float)_maxLoadCount; float increment = (maxProgress - progress) * remainPercent; progress += increment; progress = fmin(progress, maxProgress); [self setProgress:progress]; Thursday, May 30, 13

7. WebView Running State UIWebView Hacks • document.readyState • “loading” =>

   Not represent • “interactive” => Represent, DOM access enable • “complete” => Finish • - (void)webViewDidFinishLoad:(UIWebView *)webView • Loading is not completed set “load” event hander Thursday, May 30, 13

8. UIWebView RPC UIWebView Hacks • ViewController → UIWebView • stringByEvaluatingJavaScriptFromString:

   • Simple! Thursday, May 30, 13

9. UIWebView RPC UIWebView Hacks • UIWebView→ ViewController • Use Iframe

   • Don’t use location.href • It changes mainDocumentURL • Inspired by Cordova • Iframe can detect in webView:shouldStartLoadWithRequest:navigationType: BOOL isTopLevelNavigation = [request.mainDocumentURL isEqual:request.URL]; window.addEventListener('load',function() { var iframe = document.createElement('iframe'); iframe.style.display = 'none'; iframe.src = '%@'; document.body.appendChild(iframe); }, false); Thursday, May 30, 13

10. Progress Property • Fit to user’s mental model • Try

    and error • Inspired by WebKit’s implementation • Start Loading. 0.1 • Document not represent. updating progress Max 0.5 • Document represent. updating progress Max 0.9 • Complete. 1.0 Thursday, May 30, 13

11. UIWebViewDelegate Proxy Easy to integrate • NJK needs UIWebViewDelegate hook

    • But my project already use UIWebViewDelegate • Needs easy integration • NJK perform as a proxy object progressProxy = [[NJKWebViewProgress alloc] init]; webView.delegate = progressProxy; progressProxy.webViewProxyDelegate = self; progressProxy.progressDelegate = self; Thursday, May 30, 13

12. UIWebViewDelegate Proxy Easy to integrate .delegate UIWebView ViewController Thursday, May

    30, 13

13. UIWebViewDelegate Proxy Easy to integrate • All messages forward to

    webViewProxyDelegate NJKWebView Progress .webViewProxy Delegate .delegate UIWebView ViewController .progressDelegate Thursday, May 30, 13

14. CocoaPods Easy to integrate • CocoaPods is awesome! • Easy

    to install • Add one line • Add .podspec file before git push • LICENSE file needed Thursday, May 30, 13

15. Method Forwarding Provide for future iOS • Generally called “Method

    Missing” • Prepare for appending UIWebViewDelegate methods • Can forward new method to webViewProxyDelegate - (NSMethodSignature *)methodSignatureForSelector:(SEL)selector { NSMethodSignature *signature = [super methodSignatureForSelector:selector]; if(!signature) { if([_webViewProxyDelegate respondsToSelector:selector]) { return [(NSObject *)_webViewProxyDelegate methodSignatureForSelector:selector]; } } return signature; } - (void)forwardInvocation:(NSInvocation*)invocation { if ([_webViewProxyDelegate respondsToSelector:[invocation selector]]) { [invocation invokeWithTarget:_webViewProxyDelegate]; } } Thursday, May 30, 13

16. Progress UI • NJK doesn’t takes “Progress UI” • UIProgressBar

    • Feel slow with animation • Kill animation or make your own progress UI • Sleipnir Mobile has interesting progress bar • They call “Psychological Representation” Thursday, May 30, 13

17. My First GitHub Hit • For Open Source Software •

    Portability • Easy Integration • Documentation • Solid code • Inspired by @_Ishkawa Thursday, May 30, 13

18. Wrap Up • NJKWebViewProgress is UIWebView Progress Interface • You

    can implement WebView Progress UI • Using several UIWebView hacks • But AppStore safe • Easy to integrate • Proxy Pattern, CocoaPods • NJK is my new signature • GitHubˑ is pleasure • I hope official progress interface!!! Thursday, May 30, 13

19. For Student Hatena Summer Internship • 8/12 - 9/6 @

    Hatena HQ, Kyoto • Learning • Web App basics (Perl, SQL, HTTP, WAF, HTML, JavaScript) • iOS App, Big Data, Service Design • Commit • Plan, design, implement your idea to actual services • Deploy, Release, Get feedback • Salary, Hotel, Free Launch, Free Drink • Due 6/16 Search with “͸ͯͳΠϯλʔϯ” Thursday, May 30, 13