1. #1
    Sencha Premium Member
    Join Date
    Aug 2011
    Posts
    168
    Answers
    1
    Vote Rating
    2
    GertBoers is on a distinguished road

      0  

    Default Unanswered: make button open safari window instead of the embedded (fullscreen) browser

    Unanswered: make button open safari window instead of the embedded (fullscreen) browser


    Hey there,

    i've got a button which redirects to an image location with this handler:

    Code:
        	handler: function() {
        		var img = document.getElementById('imgID');
        		var imgUrl = img.getAttribute('src');
        		window.open ("mydomain.com/"+imgUrl, '_blank');
        	}
    If i press this button in safari, it will open a new safari window, which is fine.

    But when i save this app to my homescreen, and then press this button, it goes to the image location, but in the embedded browser (without the toolbar(s) from safari and thus without a back button), so i get stuck at that location. I can't close this window or go back to the previous screen in my app.

    i tried using "_blank", "_top", "_parent" and "_self", but none of them do the trick.
    I kinda need a '_safari' target

    Any ideas?

  2. #2
    Sencha User
    Join Date
    Oct 2011
    Location
    Pakistan
    Posts
    229
    Answers
    10
    Vote Rating
    1
    umr.ashrf is on a distinguished road

      0  

    Default


    I think it's a more of Phonegap thing. Google for ChildBrowser plugin for iOS.

  3. #3
    Sencha User
    Join Date
    Aug 2011
    Posts
    11
    Vote Rating
    0
    ppalaciosm is on a distinguished road

      0  

    Default


    i had the same problem, my solution was to integrate image into a new panel, i access the image when press a link that delegate event

    my code

    The Link
    Code:
    <a class="dctos" href="#|'+record.get('linkBL')+'">'+record.get('bl')+'</a>
    tap on link with class "dctos"
    Code:
    myApp.views.documentsDetailsCard = new Ext.Panel({
    			id: 'documentsDetailsCard',
    			layout: 'card',
    			scroll: true,
    			dockedItems: [myApp.views.documentsDetailCardTopBar],
    			listeners: {
    				el: {
    					tap: function(evt, el) {
    						Ext.getBody().mask('Loading...', 'x-mask-loading', false);
    						var ur = el.getAttribute('href').substr(2);
    						var uu = ur.split('|');
    						var item_html = '';
    						for(i=0;i<uu.length;i++) {
    							item_html = item_html+'<div><img class="lala" id="'+i+'" src="'+uu[i]+'" width="300px" /></div>';
    						//	console.log(uu[i]);
    						}
    						var popup = new Ext.Panel({
    							floating: true,
    							centered: true,
    							modal: true,
    							scroll: 'both',
    							width: '310',
    							height: '400',
    							dockedItems: [{xtype: 'toolbar', title: 'Documents', items: [{iconCls: 'search', iconMask: true},{xtype: 'spacer'},{xtype: 'button', text: 'Close', handler: function() {popup.destroy();}}]}],
    							items: [{ 
    								html: item_html
    							}],
    							listeners: {
    								el: {
    									tap: function(evt, el) {
    											var id = el.getAttribute('id');
    											imgplus(id);
    											popup.doLayout();
    									}
    								},
    								delegate: '.lala'
    							}
    						});
    						popup.show();
    						Ext.getBody().unmask();
    					},
    					delegate: '.dctos'
    				}
    			}
    		});

  4. #4
    Sencha User
    Join Date
    Oct 2011
    Location
    Noida, India
    Posts
    78
    Answers
    2
    Vote Rating
    2
    jiindal1988 is on a distinguished road

      0  

    Default


    window.open will not open a new window in mobile devices.

    Try anchor instead.

    Check following example:

    this.actions = new Ext.ActionSheet({
    items: [


    {
    html:'<html><body><div id="x-button"><a id="popup" href="javascript:openTrend();" target="_blank">Click</a></div></body></html>',
    scope:this,
    floating: floating,
    handler : function(){
    this.actions.hide();
    }
    },
    ]
    });

    function openTrend()
    {
    window.open("http://www.google.co.in/");
    }

    Hope this helps.

  5. #5
    Sencha Premium Member
    Join Date
    Aug 2011
    Posts
    168
    Answers
    1
    Vote Rating
    2
    GertBoers is on a distinguished road

      0  

    Default


    Thanks for your replies,

    but it's not really what i'm looking for...
    One of the reasons i want it the new window to actually open in safari instead of the embedded browser is because this will allow users to tap and hold to save the image to their phone...

    The funny thing is, when trying jiindal's solution, a google window opened in the embedded browser but then i noticed that whenever i press a link on the google page, it opens a window in safari, which is exactly what i'm trying to do
    Maybe i should ask google how they do it... Their source isn't really helping either.

    Code:
    <a class="og_k og_2" target="_top" href="/m?site=images&source=mog&gl=be" onclick="og.l.p(this,'\x2Fsearch?tbm=isch\x26source=mog\x26gl=be')">
    They use target as well as onclick.

    I'll try it with phonegap and update this thread if i find something.