I’m a big fan of Stack Overflow and I tend to contribute regularly (am currently in the top 0.X%). In this category (stackoverflow) of posts, I will be posting my top rated questions and answers. This, btw, is allowed as explained in the meta thread here.

As you may be aware of, lately I’m really into Ionic framework and am helping out on StackOverflow with the knowledge I gained so far with the framework. In the last 30 days, I’m the top answerer in the ionic tag, and am currently #6 All time answerer:

I answered this question by user user1365697:

We want to build a simple application that use a lot of videos and images. The application should run on different mobile devices running Andriod and iPhone operating systems. Does Ionic also convert each application to all mobiles options? What do you suggest to use Cordova or Ionic?

My answer was:

Disclamer: This will sound like advertisement, so I have to say I’m in no way affiliated with Ionic, I just happen to like it so much that I’m sharing the love for it.

Ionic is so much more than “just” an UI framework. Ionic allows you to:

• generate icons and splash screens for all devices and device sizes with a single command: ionic resources. This alone saves you at least a day of image preparing for various sizes.
• instantly update your apps with code changes, even when running directly on your device with ionic run --livereload
• build and test iOS and Android versions side-by-side and see changes instantly with ionic serve --lab
• share your Ionic apps with clients, customers, and testers all around the world without ever going through the App Store with ionic share
• easily accessing the full native functionality of the device using ngCordova (here you get to use any Cordova plugin – so Ionic is indeed much more than Cordova per se)

Also, they’re building a full-stack backend services and tools for your Ionic app like Deploy (for deploying a new version without going through Apple review process!), Analytics, Push notifications.

Ionic CLI (command line interface) uses Cordova in the backend and allows you to build (directly using Ionic CLI) apps for iOS and Android (you by doing ionic build ios or ionic build androidand woila).

Ionic uses Angular as a frontend framework so if you’re familiar with it it will come as a bonus. They’reworking closely with the Angular 2.0 team too.

All in all, I personally think Ionic has a bright future, so if nothing else – give it a try I bet you’ll like the ease of making an app with it.

I’m a big fan of Stack Overflow and I tend to contribute regularly (am currently in the top 0.X%). In this category (stackoverflow) of posts I will will be posting my top rated questions and answers. This, btw, is allowed as explained in the meta thread here.

I actually answered this question by userArlind a:

I’m using AdMob plugin in Ionic and with this code I show an Interstital ad:

function initAd(){

 // it will display smart banner at top center, using the default options
 if(AdMob) AdMob.createBanner( {
                          adId: admobid.banner,
                          bannerId: admobid.banner,
                          position:AdMob.AD_POSITION.BOTTOM_CENTER,
                          autoShow: true,
                          isTesting: false,
                          success: function(){
                          console.log('banner created');
                          },
                          error: function(){
                         console.log('failed to create banner');
                          }
                          } );

                                       window.AdMob.prepareInterstitial( 
                           {adId:admobid.interstitial, autoShow:false} );
    window.AdMob.showInterstitial();

 }

Is there a way to show intersitial ad every 2 minutes? Someone told me to add this:

setInterval(showInterstitial,1*60*1000)

but I don’t know where to add?

My answer was:

If you would like to show it every 2 minutes you should use:

setInterval(window.AdMob.showInterstitial, 2*60*1000);

and you should add it just before the closing bracket of your initAdd function:

function initAd(){


 // it will display smart banner at top center, using the default options
 if(AdMob) AdMob.createBanner( {
                          adId: admobid.banner,
                          bannerId: admobid.banner,
                          position:AdMob.AD_POSITION.BOTTOM_CENTER,
                          autoShow: true,
                          isTesting: false,
                          success: function(){
                          console.log('banner created');
                          },
                          error: function(){
                         console.log('failed to create banner');
                          }
                          } );

                                       window.AdMob.prepareInterstitial( 
                           {adId:admobid.interstitial, autoShow:false} );
    window.AdMob.showInterstitial();
  
  
  
  //!!!add the code here!!! - so, just paste what I wrote above:
  setInterval(window.AdMob.showInterstitial, 2*60*1000);

 }

You can see a simple setInterval usage on this jsFiddle example:

function a(){
    alert("hi every 2 seconds");
};

setInterval(a, 2*1000);

The reason why you shouldn’t call it like this (note the brackets after a): setInterval(a(), 2*1000); is that then your function would be called only once (you would see only one alert popping up). Example on jsFiddle:

function a(){
    alert("hi every 2 seconds");
};

setInterval(a(), 2*1000);

I’m a big fan of Stack Overflow and I tend to contribute regularly (am currently in the top 0.X%). In this category (stackoverflow) of posts I will will be posting my top rated questions and answers. This, btw, is allowed as explained in the meta thread here.

My question was:

The problem I’m facing, as outlined in the code, is that I can’t seem to find out how to bind the second checkboxes (created with ng-repeat) to some model which I would then be able to use further down the code (showing/hiding yet another set of options). Also, I managed to show the additional number of inputs based on the count parameter in the $scope.availableOptions by using the $scope.getItterator function, but now I don’t see how would I access the values of these checkboxes? I know I have to somehow use the option “ng-model” but am failing to do so, so any help appreciated.

My code is here, but am showing it here too:

HTML:

<div ng-controller='MyCtrl'>
    Show additional options <input type="checkbox" ng-model="additionalOptions">
    <div ng-show="additionalOptions">
        <ul>
            <li ng-repeat="option in availableOptions">
                <label class="checkbox" for="opt_{{option.id}}">
                    <input type="checkbox" name="opt_{{option.id}}" id="opt_{{option.}}" />
                    {{option.name}}

                    <ul ng-show="if the upper checkbox is clicked">
                        <li>
                            <input type="text" ng-repeat="i in getItterator(option.count)" ng-model="SOME_VALUE_TO_BE_USED_BELOW"/>
                            Output the value based on what's entered above in the textboxes (SOME_VALUE_TO_BE_USED_BELOW)
                        </li>   
                    </ul>
                </label>
            </li>
        </ul>
    </div>
</div>

and my js:

function MyCtrl($scope) {
    $scope.availableOptions = [{"id":"1","name":"easy","count":"2"},{"id":"2","name":"medium","count":"3"},{"id":"3","name":"hard","count":"2"}];

    $scope.getItterator=function(n){
        var a = new Array();

        for(var i=1; i <= n; i++)
            a.push(i);

        return a;       
    };
}

The answer, by user Khanh TO, was:

Try ng-model="option.checked":

<input type="checkbox" name="opt_{{option.id}}" id="opt_{{option.}}" ng-model="option.checked"/>

And then you can access this property further below like this:

<ul ng-show="option.checked">

DEMO

If you need to also reference the text box inputs. You create a new property (values) on the option. Like this:

{"id":"1","name":"easy","count":"2",values:[]}

Html:

<div ng-repeat="i in getItterator(option.count)">
     <input type="text"  ng-model="option.values[$index]"/>
      {{option.values[$index]}}
</div>

DEMO

I’m a big fan of Stack Overflow and I tend to contribute regularly (am currently in the top 0.X%). In this category (stackoverflow) of posts I will will be posting my top rated questions and answers. This, btw, is allowed as explained in the meta thread here.

My question was:

I tried to run this code: cordova plugin add cordova-plugin-whitelist but what I keep getting is this:

Fetching plugin "cordova-plugin-whitelist" via plugin registry Error: 404 Not Found: cordova-plugin-whitelist at RegClient.<anonymous> (/usr/local/lib/node_modules/cordova/node_modules/cordova-lib/node_modules/npm/node_modules/npm-registry-client/lib/request.js:304:14) at Request._callback (/usr/local/lib/node_modules/cordova/node_modules/cordova-lib/node_modules/npm/node_modules/npm-registry-client/lib/request.js:246:65) at Request.self.callback (/usr/local/lib/node_modules/cordova/node_modules/cordova-lib/node_modules/npm/node_modules/request/request.js:236:22) at Request.emit (events.js:98:17) at Request.<anonymous> (/usr/local/lib/node_modules/cordova/node_modules/cordova-lib/node_modules/npm/node_modules/request/request.js:1142:14) at Request.emit (events.js:117:20) at IncomingMessage.<anonymous> (/usr/local/lib/node_modules/cordova/node_modules/cordova-lib/node_modules/npm/node_modules/request/request.js:1096:12) at IncomingMessage.emit (events.js:117:20) at _stream_readable.js:943:16 at process._tickCallback (node.js:419:13)

Any ideas?

I actually found the answer to this myself:

From an official blog post, Cordova is moving their plugins to npm.

I installed the cordova-plugin-whitelist easily now with npm:

npm install cordova-plugin-whitelist

I’m a big fan of Stack Overflow and I tend to contribute regularly (am currently in the top 0.X%). In this category (stackoverflow) of posts I will will be posting my top rated questions and answers. This, btw, is allowed as explained in the meta thread here.

My question was:

I uploaded a test app to Ionic (don’t know the exact name for this) with the command ionic upload from the command line, and I can access them nicely with the Ionic View application I have installed on my iPhone.

However, I remember that they have a web interface for this too, but can’t find the link for the life of me. I searched the website, went through my emails, googled, but nothing. I even found the same question on the official forum – sadly unanswered.

I actually found the answer to this myself:

And, sure enough, after going through my deleted emails I found a welcome email from Ionic stating that the login is at https://apps.ionic.io/login. Will reply to that official post too…

I’m a big fan of Stack Overflow and I tend to contribute regularly (am currently in the top 0.X%). In this category (stackoverflow) of posts I will will be posting my top rated questions and answers. This, btw, is allowed as explained in the meta thread here.

My question was:

I have this as the style template:

<Style x:Key="myDogToggleButton1" TargetType="ToggleButton" BasedOn="{x:Null}">
    <Setter Property="FocusVisualStyle" Value="{x:Null}"/>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="ToggleButton">
                <Grid>
                    <Image Name="Normal" Source="/images/dogs/dog1.png"/>
                    <Image Name="Pressed" Source="/images/dogs/dog3.png" Visibility="Hidden"/>
                    <Image Name="Disabled" Source="images/dogs/dog5.png" Visibility="Hidden"/>
                </Grid>
                <ControlTemplate.Triggers>
                    <Trigger Property="IsPressed" Value="True">
                        <Setter TargetName="Normal" Property="Visibility" Value="Hidden"/>
                        <Setter TargetName="Pressed" Property="Visibility" Value="Visible"/>
                    </Trigger>
                    <Trigger Property="IsEnabled" Value="False">
                        <Setter TargetName="Normal" Property="Visibility" Value="Hidden"/>
                        <Setter TargetName="Disabled" Property="Visibility" Value="Visible"/>
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

And now I want another one which is based on the upper one, and this doesn’t work:

<Style x:Key="myDogToggleButton2" TargetType="ToggleButton" BasedOn="{DynamicResource myDogToggleButton1}">
    <Setter Property="Normal" Value="/images/dogs/dog2.png" />
    <Setter Property="Pressed" Value="/images/dogs/dog2.png" />
    <Setter Property="Disabled" Value="/images/dogs/dog2.png" />
</Style>

The error message I get is:

The member "Pressed" is not recognized or is not accessible.
The member "Normal" is not recognized or is not accessible.
The member "Disabled" is not recognized or is not accessible.

I suspect that my different style calling is wrong, so please point out the error.

The answer, by user Heena Patil, was:

Try this

Resource

<Window.Resources>
    <Style x:Key="myDogToggleButton1" TargetType="ToggleButton">
        <Style.Resources>
            <BitmapImage x:Key="Normal" UriSource="Images/darblue_tab.png"/>
            <BitmapImage x:Key="Pressed" UriSource="Images/img-whitebg.png" />
            <BitmapImage x:Key="Disabled" UriSource="Images/img-greenbg.png"/>
        </Style.Resources>
        <Setter Property="FocusVisualStyle" Value="{x:Null}"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="ToggleButton">
                    <Grid>
                        <Image Name="Normal" Source="{DynamicResource ResourceKey=Normal}" Stretch="Fill"/>
                        <Image Name="Pressed" Source="{DynamicResource ResourceKey=Pressed}" Visibility="Hidden"/>
                        <Image Name="Disabled" Source="{DynamicResource ResourceKey=Disabled}" Visibility="Hidden"/>
                    </Grid>
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsPressed" Value="True">
                            <Setter TargetName="Normal" Property="Visibility" Value="Hidden"/>
                            <Setter TargetName="Pressed" Property="Visibility" Value="Visible"/>
                        </Trigger>
                        <Trigger Property="IsEnabled" Value="False">
                            <Setter TargetName="Normal" Property="Visibility" Value="Hidden"/>
                            <Setter TargetName="Disabled" Property="Visibility" Value="Visible"/>
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
    <Style x:Key="myDogToggleButton2" TargetType="ToggleButton" BasedOn="{StaticResource myDogToggleButton1}">
        <Style.Resources>
            <BitmapImage x:Key="Normal" UriSource="Images/img-darkbg.png" />
            <BitmapImage x:Key="Pressed" UriSource="Images/Screenshot_5.png"/>
            <BitmapImage x:Key="Disabled" UriSource="Images/img-bluebg.png"/>
        </Style.Resources>
    </Style>
</Window.Resources>

Xaml

<Grid>
    <ToggleButton HorizontalAlignment="Left" Style="{StaticResource myDogToggleButton1}"/>
    <ToggleButton  HorizontalAlignment="Right" Style="{StaticResource myDogToggleButton2}"/>
</Grid>

Update Using single style.

<Grid>
    <ToggleButton Height="300" Width="300" HorizontalAlignment="Left" Style="{StaticResource myDogToggleButton1}"/>
    <ToggleButton  Height="300" Width="300" Style="{StaticResource myDogToggleButton1}" HorizontalAlignment="Right">
        <ToggleButton.Resources>
            <BitmapImage x:Key="Normal" UriSource="Images/img-darkbg.png" />
            <BitmapImage x:Key="Pressed" UriSource="Images/Screenshot_5.png"/>
            <BitmapImage x:Key="Disabled" UriSource="Images/img-bluebg.png"/>
        </ToggleButton.Resources>
    </ToggleButton>
</Grid>

I’m a big fan of Stack Overflow and I tend to contribute regularly (am currently in the top 0.X%). In this category (stackoverflow) of posts I will will be posting my top rated questions and answers. This, btw, is allowed as explained in the meta thread here.

My question was:

How to hide the cursor in Awesomium – I tried this:

<awe:WebControl x:Name="webBrowser" Cursor="None" Source="http://example.com/"/>

but the cursor still shows.

I figured that I could alter the CSS of the page by adding the following line:

*{
    cursor: none;
}

But, is there a solution for when I don’t have the access to the actual page that I’m showing?

The answer, by user Sjoerd2228888, was:

You can use a ResouceInterceptor and manipulate the page on the fly to insert custom CSS.

EDIT:

The following implementation should do the job. (It assumes there is a text.css file)

class ManipulatingResourceInterceptor : IResourceInterceptor
{
    public ResourceResponse OnRequest(ResourceRequest request)
    {
        Stream stream = null;

        //do stream manipulation
        if (request.Url.ToString() == "http://your.web.url/test.css")
        {
            WebRequest myRequest;
            myRequest = WebRequest.Create(request.Url);
            Stream webStream = myRequest.GetResponse().GetResponseStream();
            StreamReader webStreamReader = new StreamReader(webStream);
            string webStreamContent = webStreamReader.ReadToEnd();

            stream = webStream;

            string extraContent = "*{cursor: none;}";

            webStreamContent += extraContent;
            byte[] responseBuffer = Encoding.UTF8.GetBytes(webStreamContent);

            // Initialize unmanaged memory to hold the array.
            int responseSize = Marshal.SizeOf(responseBuffer[0]) * responseBuffer.Length;
            IntPtr pointer = Marshal.AllocHGlobal(responseSize);
            try
            {
                // Copy the array to unmanaged memory.
                Marshal.Copy(responseBuffer, 0, pointer, responseBuffer.Length);
                return ResourceResponse.Create((uint)responseBuffer.Length, pointer, "text/css");
            }
            finally
            {
                // Data is not owned by the ResourceResponse. A copy is made 
                // of the supplied buffer. We can safely free the unmanaged memory.
                Marshal.FreeHGlobal(pointer);
                stream.Close();
            }
        }
        return null;
    }

    public bool OnFilterNavigation(NavigationRequest request)
    {
        return false;
    }
}

I’m a big fan of Stack Overflow and I tend to contribute regularly (am currently in the top 0.X%). In this category (stackoverflow) of posts I will will be posting my top rated questions and answers. This, btw, is allowed as explained in the meta thread here.

My question was:

I see few rows like this in my table:

     id  | val
 --------+------------
    1    | {}
    2    | {}

Of course not all are equal to {}, and I would like to query them out and then update them to {0}. However, trying the following fails:

UPDATE table SET val={0} WHERE val={};

I must be missing something obvious, please point out what.

The answer, by user sandipon, was:

UPDATE table SET val='{0}' WHERE val='{}';

I’m a big fan of Stack Overflow and I tend to contribute regularly (am currently in the top 0.X%). In this category (stackoverflow) of posts I will will be posting my top rated questions and answers. This, btw, is allowed as explained in the meta thread here.

My question was:

Well, the question is in the title. I searched SO (obviously) but nothing similar came up. Additional reading material (if you happen to know one) will be helpful to solve this mystery for me.

The answer, by user Eike Pierstorff, was:

No, not by default at least.

It is technically possible to contrive a serverside solution that measures referenced assets. But usually (i.e. when you use the javascript tracking code) Google Analytics will only measure documents that have the tracking code embedded. Since you cannot embed javascript code in image files they will not be tracked.

If you want to see which images have been called from other domains you can instead have a look in your webservers access logs which keeps track of all requests to your server and usually includes the address of the referring site.

I’m a big fan of Stack Overflow and I tend to contribute regularly (am currently in the top 0.X%). In this category (stackoverflow) of posts I will will be posting my top rated questions and answers. This, btw, is allowed as explained in the meta thread here.

My question was:

I am wondering how to rewrite this code to work with qq:

  $containerRight = <<<qq
    <div class="container_right">
        {echoLikeBox()}

        <div class="join_us"><a href="#"><img src="images/join_us.png" width="304" height="44" alt=""></a></div>

        <div class="box2"><a href="#"><img src="images/twitter_big.gif" width="304" height="292" alt=""></a></div>

        <div class="box3"><a href="#"><img src="images/facebook.jpg" width="304" height="257" alt=""></a></div>

        <div class="box4"><a href="#"><img src="images/google_ads.gif" width="304" height="164" alt=""></a></div>
    <!-- container_right end --></div>;
    qq;
    echo $containerRight;

The problem is that I don’t know how to echo function inside the <<<. The code for the echoLikBox() is this:

function echoLikeBox()
{
    $likeBox = <<<qq
    <div class="box1">
            <div class="box1_lft"><a href="#"><img src="images/tweet.jpg" width="108" height="20" alt=""></a></div>
            <div class="box1_rht"><a href="#"><img src="images/like.jpg" width="82" height="20" alt=""></a></div>
            <div class="clear"></div>
    </div><!-- box1 end -->
    qq;
    echo $likeBox;
}

edit: found the solution here: Calling PHP functions within HEREDOC strings

The answer, by user Gavin Anderegg, was:

You may want to change the “echoLikeBox()” function to, instead of echoing its contents, store them as a string. You can’t make a call to a function inside of heredoc strings, but you can output variables. So, for example, you could have:

function echoLikeBox()
{
    $likeBox = <<<qq
    <div class="box1">
            <div class="box1_lft"><a href="#"><img src="images/tweet.jpg" width="108" height="20" alt=""></a></div>
            <div class="box1_rht"><a href="#"><img src="images/like.jpg" width="82" height="20" alt=""></a></div>
            <div class="clear"></div>
    </div><!-- box1 end -->
qq;
    return $likeBox;
}

and then just

$likeBox = echoLikeBox();

$containerRight = <<<qq
    <div class="container_right">
        $likeBox

        ...

inside of the main body.