lundi 29 février 2016

Apps deep links and Universal links

(Example) I have a mobile application and website. My app has a homepage, Section A, Section B, Section C, and Section D. Every section is offer a different service. Imagine I am renting every section to a different person.

If a want a single link to open my app, I know this is possible. But this will open the app itself, and homepage.

What about if I want to open dircetly a single section? such as the link open the app and going to section D direct?

http://ift.tt/1TN5YAD when this link is shared on whatapp or instagram it is open the section needed directly, not only opening the app homepage.

Can this be done?




Implement html multiple select in jsp

<select multiple>
  <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="opel">Opel</option>
  <option value="audi">Audi</option>
</select>

I need to implement a multiple select list. How would i do it? I would be getting a list from backend whose size can vary.




Microsoft.Owin.Security.Oauth Bearer Token Authorization Interception

I am in the process of implementing OAuth 2 on a web API with Microsoft.Owin.Security.Oauth. I would like to keep the bearer token small and keep private data out of it. To do this, I'd like to store a session ID in it and then fill out the ClaimsIdentity programatically once the session ID has been received and processed. This would also give me greater flexibility related to how logging out, role changes, and other things can be handled.

This should be a matter of intercepting the right event and adding a delegate. However, I can't find an event that gets fired on my authorization provider, a subclass of "OAuthAuthorizationServerProvider". I thought that "AuthorizeEndpoint" would do it, but it does NOT get fired for API methods decorated with the [Authorize] attribute, even though these methods clearly get checked for a valid bearer token. When I overrode "MatchEndpoint", all I found is that a call to a method that was decorated with [Authorize] showed up with "IsAuthorizeEndpoint" and "IsTokenEndpoint" both set to false. The latter makes sense to me, the former does not.

I am very confused. Can somebody who knows this library tell me what's going on and what I need to do to accomplish this seemingly simple idea?




Apache with php on subdirectory of main site

My current configuration consists of this, where :8000 is a nodejs app with express.

<VirtualHost *:80>
    ServerName example.com
    ServerAlias www.example.com

    Alias /old /var/www/php-site
    <Directory "/var/www/php-site">
        Options Indexes FollowSymLinks
        AllowOverride All
        Order allow,deny
        Allow from all
        Require all granted
    </Directory>

    ProxyRequests on
    <Location />
        ProxyPass http://localhost:8000/
        ProxyPassReverse http://localhost:8000/
    </Location>

</VirtualHost>

How do I get this to work where /old directs to the old site? For some reason it wont recognize it. Or even better, how do I keep both at the "/" level where "/page" will go to the app with a matching directory. For instance, if php-site has the page /intro but the express site doesn't, it will pull the page from the php site. And if the express site has the page "/about" it will pull it from there?




ecommerce for website that doesn't have physical product

I have just finished a website that needs to have the ecommerce set up. My site has no physical product just more access on the site. For example if the user pays to become a premium user then i want the site upon successful payment to get the response and unlock certain access in real time. If anybody has a suggestion for the best 3rd party to meet my needs i would really appreciate it.




How to automatic navigate on a website

I want to know how can we with a programing language, and which one is the best, to automatically navigate in a website, knowing the website structure, like the buttons and input text boxes, how can we type and click automatically without any user interference

Ty




How can I parse column on web site with json?

Firstly hi; i am using following codes with my some project for parsing elements but it did not work in this web site. How can i parse AKTIF MADDE column in this site ?

    Document doc;
    try {
        doc = Jsoup.connect("http://ift.tt/1KAh620").get();
        Elements links = doc.select("body > div.container-fluid > div.container.body-content > div.panel.panel-primary > table > thead > tr > th:nth-child(2)");
        tv.setText(links.text());
    } catch (IOException ex) {
        tv.setText("Error");
    }
}

}




Why do I get a Unexpected Token?

I'm making a website with a sort of javascript application. I worked on it very long, but in the end it all worked. So as I was cleaning up all my code of comments, I refreshed my site and tested this application one more time, but it didn't work anymore. The error that I get says:

Uncaught SyntaxError: Unexpected token }

Down here at line 13 is where the error occurs.

<table class="calculator" id="calculator">
        <tr>
            <th>Materiaal</th>
            <th>Waarde(&euro;/kg)</th>
            <th>Hoeveelheid(kg)</th>
            <th>Subtotaal</th>
        </tr>
        <tr>
            <td>IJzer</td>
            <td>0,15</td>
            <td>
                <input type="number" min="0" id="ironinput" onchange=calculator( "iron") onkeyup=calculator( "iron") value=0>
            </td> <!--This is where the error occurs-->
            <td id="ironoutput">0.00</td>
        </tr>

This is my javascript:

var materials = ["iron", "copper", "aluminum"];

var iron = 0.15;
var copper = 4.00;
var aluminum = 0.70;

function calculator(material) {
    var input = document.getElementById(material + "input").value;

    switch (material) {
        case "iron":
            document.getElementById(material + "output").innerHTML = (input * iron).toFixed(2);
            break;
        case "copper":
            document.getElementById(material + "output").innerHTML = (input * copper).toFixed(2);
            break;
        case "aluminum":
            document.getElementById(material + "output").innerHTML = (input * aluminum).toFixed(2);
            break;
    }
    document.getElementById("total").innerHTML = getTotal().toFixed(2);
};

function getTotal() {
    var total = 0;
    for (var i = 0; i < materials.length; i++ ) {
        total += Number(document.getElementById(materials[i] + "output").innerHTML);
    }
    return total;
};

I hope someone can help me, I'm a beginner at web development so I hope I can get a relativily easy solution and a explanation why this happens. Thank you guys.




Is it possible to generate a bundle for a C# web project ? Simplest route?

I currently have a C# web project that I modified and finalized. I am not so familiar with C# . I would like to deploy that project to a fresh PC that does not have dnx installed. My web project uses dnx to run with its arguments stored in project.json. My question is how would I go about doing that is there a way for me to create a bundle of my application along with its dependencies ? I wanted to know what would be the easiest route to accomplish this task any suggestions or links would be highly appreciated




Particular resolution in media queries

I want to change the CSS of a div in a particular resolution.

For example:

@media only (width: 320px){do something}

I tried with that code but didn't work.

Thanks!




How to test web app performance from a variety of geographical regions?

I have a web app in Canada and it works well.

I have a co-worker in Arizona who says it takes 10 seconds for the web app to load, and even longer for two images.

Is there an easy way to test the performance of the web application from a variety of geographical regions?

Any suggestions are useful!!




Best language for back end web development [on hold]

I am Computer science student. I know basic c++ and some c. I want to jump into web development. Have some knowledge in html and css. I want to which language to choose for back end development. MY projects are coming soon in college and I want to ace it. Tried PHP in codecademy but too clutered. So anything except PHP




Push Notifications - Android

I am working on a small project that involves a web interface that can send information to my android app which will display such information as Push Notifications.

But here is the thing, I am a bit confused with how to do that. As in what step will i have to take.

So I have a web interface in HTML which has a Textfield for notification Title, Content, and a submit button. I want it that when the user clicks the Submit button, the webpage will send the text that s in the Title and Content fields to my android app and then the app will just display them as push notifications.

So far on the app i have it that when you click a button on your device then it just shows a notification on the Actionbar. This is great for testing but It would be better that you can just compose your notification through a web interface.

My test Push Notification code for the app:

button.setOnClickListener(new View.OnClickListener()
        {
            @Override
            public void onClick(View v)
            {
                Intent intent = new Intent();
                PendingIntent pIntent = PendingIntent.getActivity(MainActivity.this, 0, intent, 0);

                // TODO: Make this accessible to exterior projects, such as web interface.
                Notification notification = new Notification.Builder(MainActivity.this)
                        .setTicker("Notification")
                        .setContentTitle("Important Message")
                        .setContentText("This is an example of a push notification using a Navigation Manager")
                        .setSmallIcon(R.mipmap.ic_launcher)
                        .setContentIntent(pIntent)
                        .build();

                notification.flags = Notification.FLAG_AUTO_CANCEL;

                NotificationManager nManager = (NotificationManager)getSystemService(NOTIFICATION_SERVICE);

                nManager.notify(0, notification);
            }
        });

If anyone could be so kind to give me a hand, it would be much appreciated.




cloud foundry is providing same instance of my web page to every device

Lets say there is some static variables in a class and when user on device 1 store some data on it and at the same time some other user on device 2 open the web page the he/she gets the same data store in that variable. I think cloud Foundry provide different isolated environment to every user that goes on the website. Please do tell if this behavior what cloud foundry really provide or i am missing something .




Recommendation for a platform to make a web classroom without install a software?

I am making some search to do a web classroom online with :

  • responsive (so without Flash)
  • Without install a software
  • chat
  • LaTex
  • waiting line
  • one student at a time
  • Video conference
  • White board

Any idea? Thanks




Web Audio API latency on Android

I can only find one similar question to this on SO and it doesn't have an answer, so I'm hoping someone can shed some light on this!

I'm using the Web Audio API in my Intel XDK project but have found that although it works without any latency in desktop Chrome and on iPad (presumably iPhone too although I can't test this), there is very noticeable latency on Android - by latency I mean a delay of around 300ms between user initiation of a sound and playback. It's a consistent delay and affects all sound generated through the Web Audio API.

I was wondering whether there's some sort of parameter to set the latency? Usually it's set by how slow the processor is (i.e., slower processor = bigger buffer) but I have no idea how the Web Audio API actually works on that level.

Any help would be appreciated!

var context = new (window.AudioContext || window.webkitAudioContext)();

var bgs=[];var samps=[

  'sound/ting.mp3',
  'sound/ratchet1.mp3',
  'sound/blip.mp3',
  'sound/blipback.mp3',
  'sound/TelTing1.mp3',
  'sound/TelTing2.mp3',
  'sound/TelTing3.mp3',
  'sound/TelTing4.mp3',
  'sound/TelDialReturn.mp3',
  'sound/TelDialStop.mp3',
  'sound/TelDialSlow2.mp3',
  'sound/sea1.mp3'

];

var bufferLoader;

window.onload=function(){

  bufferLoader = new BufferLoader(
    context,samps,
    finishedLoading
    );

  bufferLoader.load();

  function finishedLoading(bufferList) {
  debug("Audio Loaded")
  soundloop=1;
  for(i=0;i<samps.length;i++){bgs[i]=bufferList[i]}
  play(0)
  }
}

var sourceA = null;
var gainNodeA = context.createGain()

function play(x) {
  sourceA = context.createBufferSource();
  sourceA.buffer = bgs[x];
  sourceA.connect(gainNodeA);
  gainNodeA.connect(context.destination)
  gainNodeA.gain.value=1;
  sourceA.start(0);
}




href and nf-click in angularjs

I have this line at the code:

<a href="/blabla/topQues.html#{{m}}"data-ng-click="$event.preventDefault(); getQues()"></a>

The function getQues() pars the URL and do somthing, But the getQues() call befre the URL really changed.

What can i do to solve it?




Unable to download Excel file in iOS

How can you trigger a download in ASP.NET (C#) of an Excel document on an iOS device. All other devices just download the export right now. But iOS keeps giving the following response:

Screenshot of iOS

Right now I'm using the following code:

    [HttpGet]
    public ActionResult ExportList(string ds)
    {
        //Generating the Excel file
        ...

        //return the file
        var fileName = Config.GetFileName("xlsx");
        return File(tempFile, MimeMapping.GetMimeMapping(fileName), fileName);
    }




Implement python shell game on website

I recently wrote a text adventure in python 3, which can be run as a shell game, and the user interacts with it via input() and all output is in print().

Now i would like to transfer this game onto a website (on my self hosted apache web server on my raspberry pi), also using a text output box and an input line, so it is actually playable by any user, and not only my friends which need to install python on their machine as well, even to play the game.
I have done some research, tried out cgi , django etc. but haven't found a compatible option, in which i don't have to rewrite my whole game, using POST or whatnot.

Any help or suggestions is greatly appreciated, thanks in advance.




haskell wreq param list

In the excellent wreq Haskell library is easy to add one or more query parameters to a url just like so: opts = defaults & param "key" .~ ["value"]

but what I'm struggling to do is adding a list of parameters in one go, something like: params = [("key1", "value1"), ("key2", "value2"), ("key3", "value3")]

I know that there is function params but I could not find any example on how to use it.




Which is the best way to remove references of Thread Local objects

I have a static ThreadLocal object in my web application, where I am initializing with some default value in a web servlet filter class before processing the request. In the application, several other classes (like processors) uses and update its value. I have read in some articles that objects created with ThreadLocal are still associated with threads though the request process is completed as threads are maintained in a pool managed by container. This leads to memory leaks if the objects are not removed from ThreadLocal variable.

I have two questions in this context.

  1. Among the below options, which one is the best and proper way to remove its reference to prevent memory leaks.

    ThreadLocal obj;
    1) obj.remove(); // remove the contents of ThreadLocal.
    2) obj.set(""); // set some default value
    3) obj.set(null); // set null
    
    
  2. Are all options make the object eligible for garbage collection that is created in the processors.




dimanche 28 février 2016

Chrome push Notification

Hi I am trying to build push notification, i tried to implementing a random code which is referred from web. the code goes as follows :

**notification.html**-->

    
        function shows(){

        var notify= webkitNotifications.createNotification('icon48.png','My notification',
        'hi buddy');    
        notify.show();
        }
        if(webkitNotifications){
            setInterval(function()
            {
                shows();
                }, 1000);
        }else{
        chrome.tabs.create({url : "error.html"})
        }

        

    error.html--->
    

there is an error in your extension



    manifest.JSON -->

         {
            "manifest_version": 2,
          "name": "My Extension",
          "version": "1",
            "description" : "Display every 5 sec",
            "icons" : {"48" :"icon48.png"},
            "permissions" : ["tabs","notifications"],
            "background": {"page": "notifications.html"}
        }

 

The problem is Extension is loaded in chrome but it doesn't responds to the code and the notification is now shown. :( please help.




Running PHP (server-side scripting) in a Netbeans module that is designed for client-side scripting

I'm using the HTML5Application module in Netbeans IDE. My code has HTML, Javascript and PHP, this module doesn't run PHP because this module is only a client-side scripting module (or am I missing something?). Is there a module in Netbeans IDE that is able to run both client and server-side code? Rather than me using two editors i.e. a PHP editor and my Netbeans IDE?

Actually, would it be beneficial if I use 2 programs? If say I run something, how would I ensure that both programs work together? Or am I getting this entirely wrong?

Netbeans does actually have a PHP project module, which is a module designed for server-side scripting.

Thanks,

Henry




Why would this div lag when animated on an Android Cordova app? Other elements animate fine in Android

position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
width: 100%;
height: 100%;
background-color: #fff;
overflow: hidden;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
-webkit-animation-delay: 0;
animation-delay: 0;
-webkit-backface-visibility: hidden;
-webkit-transform: translate3d(0, 0, 0);
-webkit-transform-style: preserve-3d;
-webkit-perspective: 1000;

Why would a with the above css applied to it experience lag when animated? This is inside a Cordova app, the animation is extremely clean and smooth on iOS, but seriously lags in Android. Other elements in my app on Android are animating very smooth, its just this element. I'm hardware accelerating, using transforms etc... but just no luck. Here is the animation being used on the elements:

@keyframes slideInRight {
  from {
    z-index: 10;
    transform: translate3d(100%, 0, 0);
    visibility: visible;
  }

  to {
    z-index: 10;
    transform: translate3d(0, 0, 0);
  }
}




embed Python3 applets into HTML (web)

I have a lot of Python 3 applets written in IDLE and I would like to embed that into my HTML code (so I can include it in my website for users to run my code) - How can I do that? Also I would like the design for the running of my code to be coded with CSS. If it is not possible to do that with Python, what are the other options?




Retrieve a list value from request jsp

<%
        if(tableauData != null && tableauData.size() > 0 ) {
        for (int i=0;i<tableauData.size();i++) {
        Tableaujs tableaujs = (Tableaujs)tableauData.elementAt(i);
    %>

    <tr>
    <td bgcolor="#FFFFFF" align="center"> <%=tableaujs.getColonne()%> </td>
    <td bgcolor="#FFFFFF" align="center"> <magl:champTexte _nom="taux" valeur="<%=tableaujs.getTaux().toString()%>"  _size="3" _editable="true" /> </td>
    <td bgcolor="#FFFFFF" align="center"> <magl:listeMultiChamps _nom="fcwc06e0TableauDataItems"
            valeursInitiales="true" monospace="false" size="1">

            <magl:champListe _nom="liblidc" _size="30" />
            </magl:listeMultiChamps>
             </td>
    <td bgcolor="#FFFFFF" align="center"> </td>
    </tr>

    <% } 
    }   
    %>

I need to fetch the entire list of tableaujs.getColonne() on submit. When I do request.getParameter(taux), I just get one column value. How can I fetch the entire list from request.




Prevent Unknown robot (identified by 'bot' followed by a space or one of the following characters _+:,.;/\-)

I have a drupal operated small website. It is not commercial, ie: no income from it. The site is in shared host, so has limited bandwidth and resource. This site encounters "Bandwidth exceed" problem every month because more than 60% of bandwidth is being used by bots and spiders. The maximum is gone to:

Unknown robot (identified by 'bot' followed by a space or one of the following characters _+:,.;/-)

How could I identify or block the bad bots? Please suggest me some way to prevent it.




is it ok to change data in a GET request?

I'm adding email confirmation and when users click an email activation link, it does a get request to get the signup page and populate the signup form. However, I would like to also update my user's email_confirmed attribute to true in this action. I've heard to never change data on a get request but I'm not sure how else to do this.




Anchors: Scroll to position on page minus the height of the header

I have a webpage http://ift.tt/1KVVmy2

As you will see it has a fixed navigation. When you use the navigation it scrolls down the page for you automatically. My issue is that I need it to scroll to a position, for example the 'ABOUT' section, minus the height of the header.

If you look at the page currently you will see that because of the header it overlaps the about title.

Any suggestions or can anybody point me in the correct direction?

Thanks, Alex




Web page on refresh, mysql update

Hello i have been having a little problem with my web page which have a db connection with an update statement. Now i have a button submit to which i should click the button and then updates the field in database. But on either entering the specific page or refreshing the page, it automatically updates the database. I have not set any function or anything else. Any help

I have the php code :

<?php 

$connect=mysqli_connect('127.0.0.1', 'root', 'root',"web");
if (isset($_GET['submit'])){
    $query = "UPDATE student AS t1 INNER JOIN employer AS t2 ON t1.stud_location = t2.emp_location SET t1.emp_id = t2.emp_id";
    $search_result =mysqli_query($connect,$query); 
} else { 
    $query = "UPDATE student AS t1 INNER JOIN employer AS t2 ON t1.stud_location = t2.emp_location SET t1.emp_id = t2.emp_id";
    $search_result =mysqli_query($connect,$query);
}
?>




writing interactive widget in javascript

I'm new to javascript / html, and was wondering if there are any good resources or books on how to write an interactive web widget using javascript, html, or any browser api, etc. Just like to get an idea how to get started on this. Thanks.




Mysql Join Query 9

Ive the following code :

INSERT INTO table student

SELECT employee_id

FROM table employee WHERE emp_location == student_location

i want to insert a employee_id into table student which also an employee_id as foreign key where the location of a student matched the ones of the employee location.




If in one homepage, I click 2 links sequentially in a fast way, what the results will be?

If in one homepage, I click 2 links sequentially in a fast way, what the results will be?

I find different homepage process this situation in different ways.

For some websites, if I click link A, then link B in a timely, the link B will show up. But if I click link B a little slower, then link A will show up.

For some websites, the first link clicked always shows up.

I am new to web. Any explanation and knowledge links would be appreciated.




how to get link with special word from webpage using selenium and python?

i working in a python script to get all links from webpage that have certain word for example

http://ift.tt/1TIrHJN

http://ift.tt/1n8DAfh

http://ift.tt/1TIrHJP

so the code should get only links that have "about" word in ther links that's are my code put that's give me this error

"AttributeError: 'WebElement' object has no attribute 'get' "

driver.get("http://ift.tt/1lPoTpb")
time.sleep(20)
links = driver.find_elements_by_tag_name("a")
for link in links:
  if '/about/' in link.get( 'href' ):
     print (link.get_attribute("href"))




How to Send post response as image from python requests

i am trying to get my image hosted online and for that i am using python

import requests 
url = 'http://imgup.net/'
data = {'image[image][]':'http://ift.tt/1VLQmMG'}
r = requests.post(url, files=data)

i am not able to get the response url of the hosted image from the response . Please help !




Start developing a website [on hold]

I want to start developing a website. I know HTML, CSS, a little bit of PHP and JavaScript, I have my idea how the website should look like, it is just a personal website to start, howerver to combine the programming language and the design together and make something real is quite difficult, i'm just confused where to start.

Hence, i have a few questions to ask: 1. What is the IDE you use for PHP, JavaScript, HTML and CSS? 2. How can you find available resources and new technologies to apply to your website (I read books about PHP, JavaScript, all about HTML & CSS, i followed their intruction, able to understand their work but feel struggle to build something i want for myself) 3. Other recommendations you can give me to proceed my web development skill futher?

I look forward to hearing from you Many thanks, David




Implementing JqMath Android to display Formulas

I have read about JqMath and how to implement it here at Stackoverflow, but I cannot get it to work correctly.

What I want Display math equations, constants and formulas

What I've done 1. Added these files to my assets folder: jqmath-0.4.3.css jqmath-0.4.3.js jqmath-etc-0.4.3.min.js jquery-1.4.3.js jquery-1.4.3.min.js jscurry-0.4.0.js jscurry-0.4.0.min.js

  1. Written this code:

    private WebView webView;
    private WebSettings webSettings;
    
    //In the constructor
    webView = (WebView) findViewById(R.id.webView);
    webSettings = webView.getSettings();
    webSettings.setJavaScriptEnabled(true);
    path = "file:///android_asset/";
    
    // In the method where I want to set the content
    js = "<html><head>"
            + "<link rel='stylesheet' href='"+path+"jqmath-0.4.3.css'>"
            + "<script src='"+path+"jquery-1.4.3.min.js'></script>"
            + "<script src='"+path+"jqmath-etc-0.4.3.min.js'></script>"
            + "</head><body>"
            + "$$x={-b±√{b^2-4ac}}/{2a}$$</body></html>";
    webView.loadData(js,  "text/html",  "UTF-8");
    
    

The problem According to the logcat:

    E/WifiStateMachine: CMD_START_SCAN : connected mode and no configuration
    4306-4306/com.fredrikandcasper.matteguide I/chromium: [INFO:CONSOLE(1)]                 
    "Not allowed to load local resource: file:///android_asset/jqmath-
    0.4.3.css", source: data:text/html,<html><head><link rel='stylesheet' 
    href='file:///android_asset/jqmath-0.4.3.css'><script 
    src='file:///android_asset/jquery-1.4.3.min.js'></script><script 
    src='file:///android_asset/jqmath-etc-0.4.3.min.js'></script></head>
    <body>$$x={-b%C2%B1%E2%88%9A{b^2-4ac}}/{2a}$$</body></html> (1)

And the same error for the other files: jquery-1.4.3.min.js & jqmath-etc-0.4.3.min.js

How can I solve this?

Thanks in advance!




acestream webplugin not wotk correctly

I'm trying to change audio track in acestream webplugin.

Here http://ift.tt/1KUY2Mj we can see that audioTrack("tracknumber"); should do it but this not work, I also tried audioCount(); to see how many different audio track haves, but nothing (I know that there 3 diffrent audio tracks on my stream).

But when I open stream with aceplayer on windows desktop(not webplugin), then I can edit audiotrack, so the number of languages is surely exists but in webplugin just dont work language change.

My code is:

<div id="tv-player-wrapper" style="width: 100%; height: 543px; float: left; clear: both; position: relative; overflow: hidden;">
<div class="tv-player" id="tvplayer" style="width: 100%; height: 543px; position: relative;">
<script type="text/javascript">
var player_context;
var torrent_player;
function init() {
console.log("init start");
var controls = new TorrentStream.Controls("tvplayer", {
style: "internal",
debug: false
});
console.log(controls);
try {
// Assign player_context in onLoad handler because it can differ
// from return value of TorrentStream.Player. For example,
// TorrentStream.FlashPlayer can be returned.
new TorrentStream.FlashPlayer(controls.getPluginContainer(), {
debug: true,
useInternalControls: true,
bgColor: "#000000",
fontColor: "#ffffff",
onLoad: function () {
this.registerEventHandler(controls);
controls.attachPlayer(this);
torrent_player = this;
try {
this.loadPlayer("mystreamhere",{autoplay: true});
this.audioTrack("2");
}
catch (e) {
console.log("init: " + e);
}
},
onError: function(err) {
console.log("init: error: " + err);
controls.onSystemMessage(err);
}
});
}
catch (e) {
controls.onSystemMessage(e);
} 
}

init(); 
</script>
<div class="tv-loading" id="TVLoading" style="display: none; width: 100%; height: 543px; text-align: center;"><img src="images/tv-loading.gif" style="vertical-align: middle; margin-right: 10px;">oota natukene, meie film hakkab kohe..</div>
</div>
</div>




Excel to Javascript web conversion

I have an Excel sheet calculation I'm trying to convert to a Javascript with web output. I'm rather new to Javascript but Im having some trouble with a function of the sheet I'm trying to implement.

The sheet is a Helium volume calculator that will take a given balloon type, multiply by a quantity then suggest the best value for which helium tanks are required to fill the given volume.

Here's the spreadsheet for reference:

http://ift.tt/1oHthjh

Here's my JSFiddle attempt at a short and simple web app:

http://ift.tt/1QlCpF7

var $ = document.getElementById.bind(document);

$('btn').addEventListener('click', function() {

  var

    tanks = {
      0: {
        name: 'HEL550',
        volume: 292
      },
      1: {
        name: 'HEL450',
        volume: 225
      },
      2: {
        name: 'HEL250',
        volume: 125
      },
      3: {
        name: 'HEL160',
        volume: 125
      },
      4: {
        name: 'HEL110',
        volume: 55
      },
      5: {
        name: 'HEL50',
        volume: 27.5
      },
      6: {
        name: 'BT 326502',
        volume: 14.9
      },

      7: {
        name: 'BT 306472',
        volume: 8.9
      }
    },

    balloonModel = $('balloon_model').value,
    qantity = $('qty').value,
    finalResult = balloonModel * qantity,
    finalResultRounded = finalResult.toFixed(2),
    tankCalc = tanks[7].name;

  $('result').value = finalResultRounded;
  $('tankyouneed').value = tankCalc;


}, false);

Basic volume calculation is easy enough and working. But I can't get my head around trying to use an array and loop to do the other stuff.

In the spreadsheet all the balloon types are listed but I really only need to chose a single one at a time, hence the dropdown. I don't need the tank calculations displayed, just which tank to chose as suggested by the spreadsheet result. To the right are 3 tank suggestions: actual tank(s) needed, maximum transportability or one-time use for those who don't want to ever buy again.

Can anyone help? Thanks!




IP to world region

Is there an easy way to detect user region using IP address? I'd assume that each region will have a specific IPv4 range assigned.

  • I don't want to rely on any 3rd party service (except initial data import)
  • Precision does not need to be 100%, but should be reasonably high (at least ~80%)
  • I only want to guess users region (Europe, Asia, Africa, ...). No need for city/country.



ng-reapet and textarea focused

I have ng reapet and inside the loop i have:

<button class="btn btn-default" id="ans_button" data-ng-click="textareashow = !textareashow">Answer</button>
<textarea  cols="65" rows="7" data-ng-model="texta" autofocus="autofocus" data-ng-focus="focus()" data-ng-blur="blur()"></textarea>

I want that if the user click on Anser button the testarea will show. Its work, But only once, if i click on it and close, and after that click on another answer button - the textarea is not in focus.




tomcat-use rorg.apache.tomcat.util.http.fileupload.servlet.ServletFileUpload

I find something interesting, when I use myeclipse to deploy web project, I can upload picture successfully, but when I put .war  to tomcat/webapps and startup tomcat, I can't upload picture. And this is tomcat's log:

java.lang.NoSuchMethodError: org.apache.tomcat.util.http.fileupload.servlet.ServletFileUpload.parseRequest(Ljavax/servlet/http/HttpServletRequest;)Ljava/util/List; at dao.ImageUploadDao.upload(ImageUploadDao.java:32) at servlet.imageUploadServlet.doPost(imageUploadServlet.java:42) at javax.servlet.http.HttpServlet.service(HttpServlet.java:644) at javax.servlet.http.HttpServlet.service(HttpServlet.java:725) at org.apache.catalina.core.ApplicationFilterChain.internalDoFilter(ApplicationFilterChain.java:291) at org.apache.catalina.core.ApplicationFilterChain.doFilter(ApplicationFilterChain.java:206) at org.apache.tomcat.websocket.server.WsFilter.doFilter(WsFilter.java:52) at org.apache.catalina.core.ApplicationFilterChain.internalDoFilter(ApplicationFilterChain.java:239) at org.apache.catalina.core.ApplicationFilterChain.doFilter(ApplicationFilterChain.java:206) at org.apache.catalina.core.StandardWrapperValve.invoke(StandardWrapperValve.java:219) at org.apache.catalina.core.StandardContextValve.invoke(StandardContextValve.java:106) at org.apache.catalina.authenticator.AuthenticatorBase.invoke(AuthenticatorBase.java:501) at org.apache.catalina.core.StandardHostValve.invoke(StandardHostValve.java:142) at org.apache.catalina.valves.ErrorReportValve.invoke(ErrorReportValve.java:79) at org.apache.catalina.valves.AbstractAccessLogValve.invoke(AbstractAccessLogValve.java:610) at org.apache.catalina.core.StandardEngineValve.invoke(StandardEngineValve.java:88) at org.apache.catalina.connector.CoyoteAdapter.service(CoyoteAdapter.java:537) at org.apache.coyote.http11.AbstractHttp11Processor.process(AbstractHttp11Processor.java:1085) at org.apache.coyote.AbstractProtocol$AbstractConnectionHandler.process(AbstractProtocol.java:658) at org.apache.coyote.http11.Http11AprProtocol$Http11ConnectionHandler.process(Http11AprProtocol.java:277) at org.apache.tomcat.util.net.AprEndpoint$SocketProcessor.doRun(AprEndpoint.java:2407) at org.apache.tomcat.util.net.AprEndpoint$SocketProcessor.run(AprEndpoint.java:2396) at java.util.concurrent.ThreadPoolExecutor.runWorker(ThreadPoolExecutor.java:1142) at java.util.concurrent.ThreadPoolExecutor$Worker.run(ThreadPoolExecutor.java:617) at org.apache.tomcat.util.threads.TaskThread$WrappingRunnable.run(TaskThread.java:61) at java.lang.Thread.run(Thread.java:744)

So can somebody tell me why? I think myeclipse may do something in addition. And I have the solution that to use org.apache.commons.fileupload.jar to instead of org.apache.tomcat.util.http.fileupload.servlet.ServletFileUpload.jar, the latter is belong to tomcat lib. But I think the solution is to hide the fact,because when I don't export org.apache.commons.fileupload.jar,I use myeclipse to deploy project,is also ok, that illustrates org.apache.tomcat.util.http.fileupload.servlet.ServletFileUpload.jar is also ok.




samedi 27 février 2016

Multiple http request in one request to different domain

May be this is an awkward question due to my lack of knowledge and I don't know which topic I should search to know about this, but I kind of hope/wish there was a solution.

What I mean is there any way I could send http requests to multiple domains ?

For eg: If I send an http request for a page http://ift.tt/1QcsK28. I want a simple info that this link is clicked by someone by sending a message to my domain also.The URL can be changed to anything with primary URL still as main source.

What I mean plainly is

http://ift.tt/1QPtBcN way a request to my website also }




Default: ensuring autocomplete is correct on the user's browser?

How do I be sure that when a user browses to my site and signs up, her username is saved rather than her phone number or email address? Are there default textfield names that work better with browsers, or should I use custom JS: can someone direct me to a library, iff JS?




Same hyperlink works in one JSFiddle, but not in another

I'm trying to create a hyperlink that adds a bookmark when clicked by the user running Firefox.

As you can see, the code works to do so here, as seen in this plain JSFiddle: http://ift.tt/1RwAFrw

i.e., <a href="http://ift.tt/gbk8l4" id="linkclick" title="Stack Overflow" rel="sidebar">Bookmark me test</a>

But when I then cut and paste this very same link over here: http://ift.tt/1KTSGku, then it fails to do anything at all, and no matter where I put it. Why might this be? I've checked Google, and nobody seems to have any input on the matter. Thank you ahead of time for any insight.

Second JSFiddle: i.e., <a href="http://ift.tt/gbk8l4" id="linkclick" title="Stack Overflow" rel="sidebar">Bookmark me test</a>




jQuery or javascript Source code to make image on the same size when you uploaded to your website

i need source code (javascript or jquery) that makes uploded image to the website on the same size like the facebook cover image, thank you




What transmission protocol are used in google drive?

I wonder what transmission protocol are used in google drive or apple could drive.

  • For the web version, I think it would be http. In this case, if I download a file, is the file data stored in HTTP response message body?

  • What would be the case when use desktop version?




Google Polymer elements doesn't show Unicode characters well

When I use Spanish characters like: ñ or á ó etc... they are displayed correctly if they are in index.html. But if they are in an element inside it, why are they displayed badly? :(

Thanks




Launch video from web page

I am trying to serve video files from my home web-server to my Kindle. I have no interest in streaming the video outside of my LAN. I can hit the web page and browse to the test video which is a MP4 of the movie LUCY (which I purchased) but the video will no play. The same thing occurs with when using a PC.

I made certain to install the h.264 module in Apache.

Obviously I am working towards a personal "Netflix" site for home.

Any tips or advice will be warmly accepted!




Understanding middleware and route handler in Express.js

I am trying to understand how middleware and route handlers work in Express. In Web Development with Node and Express, the author gives and example of a interesting route and middleware in action, but does not give the actual details.

Can some one please help me understand what happens at each step in the following example so that I can be sure that I thinking correctly about it? Here's the example:

var app = require('express')();
app.use(function(req, res, next){ console.log('\n\nALLWAYS');
next(); });
app.get('/a', function(req, res){ console.log('/a: route terminated'); res.send('a');
});

app.get('/a', function(req, res){
            console.log('/a: never called');
});

app.get('/b', function(req, res, next){
            console.log('/b: route not terminated');
next(); });

app.use(function(req, res, next){ console.log('SOMETIMES');
next(); });

app.get('/b', function(req, res, next){ console.log('/b (part 2): error thrown' ); throw new Error('b failed');
});

app.use('/b', function(err, req, res, next){ console.log('/b error detected and passed on'); next(err);
});

app.get('/c', function(err, req){
console.log('/c: error thrown'); throw new Error('c failed');
});

app.use('/c', function(err, req, res, next){
            console.log('/c: error deteccted but not passed on');
next(); });

app.use(function(err, req, res, next){
console.log('unhandled error detected: ' + err.message); res.send('500 - server error');
});

app.use(function(req, res){ console.log('route not handled'); res.send('404 - not found');
});

app.listen(3000, function(){
            console.log('listening on 3000');
});




ASP.NET MVC is from "Make it Very Complicated"?

I am too stupid for such complex architecture...

ASP.NET MVC, Model, View, Controller, ViewModel, Entity Framework, Bootstrap, JavaScript, Razor, Repository pattern, Unit of Work, Unit test…and many more – the list of “things” that I have read and learn about in the last few months.

First, I am not considering myself a well experimented programmer, started with VBA, after Visual Basic, then C# on Windows and Web (ASP.NET web forms). Small/medium apps for my work that are ok and some used even today after years…

Now because I want to use that new technologies I have started to learn about them:

And the “nightmare begins”….i just want to learn one concept/pattern whatever (MVC), not to get crazy and try to complicate things and feel that my brain will explode soon. The guru’s speak about “KISS”, “DRY” ,“Patterns” and “Good practices” etc., if I don’t use this … I am a nobody, without that I am a bad programmer. They tell me about “Unit tests”, and UML and Entity Framework …. Really!!!!???

In real life 80% of the applications are not so big, so complex! In general, ASP.NET apps are just CRUD apps in a way or another. Why we like to complicate things in this manner? I don’t understand, maybe I am too stupid for “MVC” concept.

99% of the courses/videos out there start simple, with the promise that you will learn this MVC concept quick and easy. They start to explain the basic concepts and you are very happy because you finally, finally …finally understand!!! Noooo don’t be a dreamer is not so simple: the instructor/author change his mind and start complicate things allot… and begin to tell you that is not good to pass Model directly to View (via Controller) no..no.. is a bad thing and explain how you need to add another “thing” … View Model.. and you start to feel pain in your head. You start to learn, to find the need and use of this View Model and … they tell that you need another “thing” AutoMaper in order to map your ViewModel objects with your Model Objects. Then… Entity Framework and Code First with migrations and….finally you think that you managed all and you are with your head ready to explode, but happy…you feel that have learned something…

You think this is over?!! NO! The guru’s/the men that know all/the best of the best … look at you with arrogance and ask you: “what? you don’t use Repository pattern or other many "...patterns", with Unit of Work…you are a loser/a beginner”. And you look in the mirror and you are ashamed that your small web app (that works fine, do what she need to do) is not good, she needs some “patterns” and Unit of Test…and ..and..and…

And i start and add many of what guru’s tell me to add…and after some time my app is so complex and use so many “pattrerns” and “frameworks” and “good practices” and other “guru stuff”, that is so hard to manage and I am LOST!!!

I just wanted to make a CRUD app in MVC, to learn this new concept, that allow me to collect some data via web, app that in ASP.NET webform “time” and ADO.NET, was so easy to do… But NOOO that webform is not good anymore…is bad, very bad…violate the golden rule of “stateless” http protocol and don’t have that “separation of concern”. I have web form apps from 2004 that work so fine even now, no problem!

I don’t know what to say, maybe my brain has a limit and I can’t manage such complex architectures, but I don’t see that “KISS” here, that “DRY”… I just see Make it Very Complicated or write much more code, I see only more work and too much complexity! This is my point after months of reading/videos/courses…

Sorry for my bad English, hope you understand me

All the best to you!




Javascript code cannot immediately changed in Python web application when debuging

I use Flask to build a web application. I run the .py file and then change the code for debugging in real time. I found if I write Javascript in HTML file, the change will be committed immediately. But if I put the Javascript in independent .js file, the change can not be committed immediately. I need to create a "private window" in Firefox, so there is no cache, no cookies, and I can see the change committed. What is the problem? What is the correct way to debug such python-javascript web application?




Web page does not send an e-mail using PHP [duplicate]

This question already has an answer here:

I'm trying to make a web page that sends a message to a specific e-mail, in this example i used 'YourEmail@yahoo.com'. The problem is that when i click on the send button to send the e-mail, the email does not send. What am i doing wrong?

Note: contact.html is the webpage that has the text-boxes and buttons to send the e-mail.

<?php

 $message = "Name: ".$_POST["Name"]."\n";
 $message = "Email: ".$_POST["Email"]."\n";
 $message = "Phone: ".$_POST["Phone"]."\n";
 $message = "Message: ".$_POST["Message"];


mail('YourEmail@yahoo.com', 'Contact this place', $message, null,
  'noreply@egovinc.com');

?>

<!--Above code is in my header tag-->

<!--Below code is in my body tag-->

    <form class="required-form" action="contact.html" method="post" enctype="text/plain" >
        <ol class="forms">

              <li>              
              <label for="name"><em class="required">*</em> Name</label>
              <input type="text" name="Name " value="" class="required"><br>
              <br>
              </li>

              <li>
              <label for="email"><em class="required">*</em> Email</label>
              <input type="text" name="E-Mail " value="" class="required"><br>
              <br>
              </li>

              <li>
              <label for="phone">Phone</label>
              <input type="text" name="Phone " id="phone" />
              <br>
              </li>

            <li>
              <label for="message"><em class="required">*</em> Message</label>
              <textarea name="Message "  class="required" ></textarea>
            </li>

            <li>
              <input class="submit" type="submit" value="Send">
              <input class="resetbtn" type="reset" value="Reset"> 
            </li>

        </ol>
      </form>

enter image description here




error 404 " CO-founder " NOT FOUND

I Have already build a social network of art with so much creative ideas am currently searching a Pro dev who have idea about art because my probleme mostly when I talk to someone about the project he don't see the site with our future user vision , the percentage and our type of work we can discuss it via mail welcome




How to add images that were searched to an array then present them one by one in a slideshow?

I am looking to add images to an array by appending the outputted images based on what was searched. Before I implemented the array code, all of the photos would appear on the page, 15 or so. I hope to add them to an array and them show one at a time by adding a side. That is what I am trying to accomplish now.

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <script src="http://ift.tt/eSWUvL"></script>
    <link rel="stylesheet" href="http://ift.tt/1K1B2rp">
    <!-- Optional theme -->
    <link rel="stylesheet" href="http://ift.tt/1QMqYrP">
    <link rel="stylesheet" href="imageSearch.css">
</head>
<body>
<form class="form-inline"  id="myForm" action="" method="post">

    <div class="form-group">

        <input type="text" class="form-control " id="item" name="imageSearch" placeholder="Search for an Image">
    </div> <br> <br>
    <input class="btn btn-default" type="submit" value="Submit">    <input class="btn btn-default" id="clear" type="button" value="Clear"> <br>
</form>
<div id="output"></div>

<script>
    $('#myForm').on('submit', function(e){
        e.preventDefault();
        search();
        return false;
    });
    function search() {
      var images =  new Array();
        var apiKey = 'dw9dkau79tppfdkx9vknxqu7';
        $.ajax(
                {
                    type:'GET',
                    url:"http://ift.tt/1oP0IRS" + $('#item').val(),
                    beforeSend: function (request)
                    {
                        request.setRequestHeader("Api-Key", apiKey);
                    }})
                .done(function(data){
                    console.log("Success with data")
                    for(var i = 0;i<data.images.length;i++)
                    {


                        images[i].src = " <img src='" + data.images[i].display_sizes[0].uri + "'/>" ;
                        $("#output").append(images[i]);

                    }
                })
                function nextImage(output)
{
    var img = document.getElementById("output");

    for(var i = 0; i < images.length;i++)
    {
        if(images[i].src == img.src) // << check this
        {
            if(i === images.length){
                document.getElementById("output").src = images[0].src;
                break;
            }
            document.getElementById("output").src = images[i+1].src;
            break;
        }
    }
}

                .fail(function(data){
                    alert(JSON.stringify(data,2))
                });
        return false;
    }
</script>
<script type="text/javascript">
  $("#clear").click(function()
  {
      $("#output").empty();

  });
</script>
</body>
</html>




DISTINCT SQL Command

i trying to execute this line:

SELECT DISTINCT QID FROM "USERNAME"."ANSWER" WHERE Nickname =? ORDER BY Time DESC
OFFSET 0 ROWS FETCH NEXT 5 ROWS ONLY

And I get this error msg:

The ORDER BY clause may not contain column 'TIME', since the query specifies DISTINCT and that column does not appear in the query result.

What would be the problem?




Error -1073741515 when executing C++ from PHP

I'm trying to execute a C++ executable from php in Windows Server 2012 R2. The php code that I have is:

<?php
$return = -1;
$file = 'helloworld.exe';
if (!file_exists($file)) echo 'File does not exists';
exec($file, $out, $return);
if($return == 0) print_r($out);
else echo "Return value: $return\n";
?>

When I try to execute it, I get

Return value: -1073741515

I am compiling the code with MinGW and when I run it from the command line it works. I've been doing some research and the only answer I could find is that my application is missing DLLs, but I couldn't find any actual solution to the problem. I don't have much experience in this field and I would appreciate any help.




Angular JS - the common issue of two apps using the same route provider

Hey all and thanks for reading. I have a client side set of text blurb I wanted to feed through views using ng. My problem is that although I feel I have this set up correctly, I only ever see a repetition of the first view on the second view and have lost functionality on the first view anchors to change the text blurbs. I was wondering if anyone could shed some light on it for me at all. It been a while since I did anything angularJS, I forgot how fun yet brick walling it can be. I post the app.js code below

var animateDesign = angular.module('animateDesign', ["ngAnimate", "ngRoute"]);
  animateDesign.config(['$routeProvider', function($routeProvider){
  $routeProvider.
      when('/background', {templateUrl: './assets/views/design/background.html',
                                                          css: ['./assets/vendor/bootstrap-3.2.0-dist/css/bootstrap.min.css', 'assets/css/after_bs.css']}).
      when('/logo', {templateUrl: './assets/views/design/logo.html',
                                                          css: ['./assets/vendor/bootstrap-3.2.0-dist/css/bootstrap.min.css', 'assets/css/after_bs.css']}).
      when('/branding', {templateUrl: './assets/views/design/branding.html',
                                                          css: ['./assets/vendor/bootstrap-3.2.0-dist/css/bootstrap.min.css', 'assets/css/after_bs.css']}).
         when('/illustration', {templateUrl: './assets/views/design/illustration.html',
                                                          css: ['./assets/vendor/bootstrap-3.2.0-dist/css/bootstrap.min.css', 'assets/css/after_bs.css']}).
      when('/print', {templateUrl: './assets/views/design/print.html',
                                                          css: ['./assets/vendor/bootstrap-3.2.0-dist/css/bootstrap.min.css', 'assets/css/after_bs.css']}).
      when('/web', {templateUrl: './assets/views/design/web.html',
                                                          css: ['./assets/vendor/bootstrap-3.2.0-dist/css/bootstrap.min.css', 'assets/css/after_bs.css']}). 
      otherwise({redirectTo: '/background'});
}])
.animation('.reveal-animation-design', function($scope) {
  return {
    enter: function(element, done) {
      element.css('display', 'none');
      element.fadeIn(1500, done);
      return function() {
        element.stop();
      }
    },
    leave: function(element, done) {
      element.fadeOut(1500, done)
      return function() {
        element.stop();
      }
    }
  }
});

angular.bootstrap(document.getElementById("animatePrint"), ['animatePrint']);

var animatePrint = angular.module('animatePrint', ["ngAnimate", "ngRoute"]);
  animatePrint.config(['$routeProvider', function($routeProvider) {
  $routeProvider.
      when('/litho', {templateUrl: './assets/views/print/litho.html',
                                                          css: ['./assets/vendor/bootstrap-3.2.0-dist/css/bootstrap.min.css', 'assets/css/after_bs.css']}).
      when('/digital', {templateUrl: './assets/views/print/digital.html',
                                                          css: ['./assets/vendor/bootstrap-3.2.0-dist/css/bootstrap.min.css', 'assets/css/after_bs.css']}).
          when('/other', {templateUrl: './assets/views/print/other.html',
                                                          css: ['./assets/vendor/bootstrap-3.2.0-dist/css/bootstrap.min.css', 'assets/css/after_bs.css']}).
      otherwise({redirectTo: '/litho'});
}])
.animation('.reveal-animation-print', function() {
  return {
    enter: function(element, done) {
      element.css('display', 'none');
      element.fadeIn(1500, done);
      return function() {
        element.stop();
      }
    },
    leave: function(element, done) {
      element.fadeOut(1500, done)
      return function() {
        element.stop();
      }
    }
  }
});

I will also post the html implementation too, as it could just be debugging blindness and likely the simplest thing

    <div class="col-md-6">
                    <div class="container">
                        <div ng-app="animateDesign">
                            <div class="wrapper">
                                <div ng-view class="reveal-animation-design"> 
                                This is the background area                 
                                </div>
                            </div>
                        </div>
                    </div>        
                </div>
            </div>
    </div>
        <!--/.container-->
        </div>
    <!--/#design-->
    
    <div id="print" class="page-section">
        <div class="container">
        <h2> Print </h2>
            <div class="row">
                <div class="col-md-3 no-float">
                     <!--start Vertical Header Test-->
                     <nav class="navbar navbar-left" role="navigation">
                              <!-- Brand and toggle get grouped for better mobile display -->
                           <div class="navbar-nav">
                                <button type="button" id="nav-toggle" class="navbar-toggle" data-toggle="collapse" data-target="#alt-nav">
                                <span class="sr-only">Toggle navigation</span>
                                <span class="icon-bar"><img src="assets/img/png/dd-logo-basic-sm.png"/></span>
                                </button>
                           </div>                            
                              <!-- Collect the nav links, forms, and other content for toggling -->
                           <div id="alt-nav" class="collapse navbar-collapse">
                                <ul class="nav navbar-left">                  
                                   <li><a href="#/litho">litho</a></li>
                                   <li><a href="#/digital">digital</a></li>
                                   <li><a href="#/other">other</a></li>
                                </ul>
                           </div><!-- /.navbar-collapse -->
                     </nav>        
                </div>
                <div class="col-md-6 no-float">
                     <div class="container">
                     <!--this is not showing on the page TODO: animatePrint needs to show on page, before using id="animatePrint" and having a default otherwise call to be the background-->
                          <div id="animatePrint">
                              <div class="wrapper">
                                    <div ng-view class="reveal-animation-print">                  
                                    </div>
                              </div>
                          </div>
                     </div>        
                </div>
            </div>
            <!--/.row-->
        </div>
        <!--/.container-->
     </div>
     <!--/.print-->

Thank you in advance for any help shedding light on this. Cheers all and thanks again for reading:)

P.S> Could someone please help me/ guide me to format the code too, it seems like it wont accept the code line after my first declared line - sry still a bit new. I had to add as a snippet, to get any success posting - (me noob)

Gruffy :)




How to load a specific div/class in a file using ajax?

I have a file called main.html that contains several div's each with 2 classes: 1st is their specific class 2nd is a class called menu-item which I use to determine if an event will triggered when clicked.

The file contains this:

<div id="load-here">

</div>

<div class="item-1 menu-item">
    click this
</div>

I also have a gallery.html file which I want to be loaded into the main.html file in the #load-here div, and let's say it contains this:

<div class="menu-item>
    // some image here
    <img href="img/1.jpg />
</div>

The script I have is this:

$(document).ready(function() {
    $( "div" ).click(function() {

        if ( $( this ).hasClass( "menu-item" ) ) {
            $("#load-here").load("gallery.html" + this.class);
        }

    });
});

The problem: It's not working. I've tried various changes. Somehow it's not loading into the #load-here div




Delay loading of a hidden element until you change their properties in javascript to visible?

I have an element say, an image and other texts inside a div. Initially, this div has a property of visibility: hidden; or display: none;

How do I prevent the browser to load the contents of this div until I change the property to visible or display: block;




Coding an online discussion forum [on hold]

How can i code an online discussion, and question-answer forum-website. I know basic php and mySQL. What all other prerequisites do I require? Thank you.




Server side rendering vs client side rendering and how does web sites used to work before angular

Im kinda new to the whole web applicaiton , and web sites world, but i started to programming and build my own web , using angular and i feel very comfortable with the idea of client side rendering , and the using of AJAX in angular($HTTP / $RESOURCE) , but i didnt use the "legacy" apporach to building web sites , because i jump on angular because it was sound like the best new !

but as i learned i got alot of obstacles in my path because lack of knowledage in the tradionial web site technoligoes and how all developes , i was like to know how the web sites has started , and what are the attuidue toward this world , and how does the server side rendering works , because as i understand all of this , is that simple i have templates , and the JS in the side client do all of the manipulation , add/delete divs etc , and there is no any connection to the server side about rendering the DOMS at all , only get information by using http or resources.. i want to know how does php server side works .




Mysql Matching web

I've a database with table student (ID-Primary), student location as fields and an employer table with location also. I want to match the employer's location with the student's location and copy the student id and paste it to the employer's table where student location= employer' location. I have the following code.

Form: Student ID

    <th style='border: solid 1px black;'>Field Of Study</th>
    <th style='border: solid 1px black;'>Location</th>

</tr>
<?php $count = mysqli_num_rows($search_result);

    while($row = mysqli_fetch_array($search_result)):?>
    <tr>
        <td align="center" style='border: solid 1px black;'><?php echo $row['stud_ID'];?></td>
        <td align="center" style='border: solid 1px black;'><?php echo $row['stud_FIELDOFSTUDY'];?></td>
        <td align="center" style='border: solid 1px black;'><?php echo $row['stud_location'];?></td>


    </tr>
<?php endwhile;?>
</table>
<table style='border: solid 1px black;'>
<tr style='border: solid 1px black;'>

    <th style='border: solid 1px black;'>Location Of Employer</th>

</tr>
<?php $count = mysqli_num_rows($search_result);
while($row = mysqli_fetch_array($search_result2)):?>
    <tr>

        <td align="center" style='border: solid 1px black;'><?php echo $row['emp_location'];?></td>

    </tr>
<?php endwhile;?>

    </table>
    <?php echo ("$count") ." ". ("Students");?>
</div>
<div>
<form action="allocation.php" method="post">
<p style="margin-left: 600px; height: 30px; width: 400px;">
<input type="submit" value="Gereate Allocation"/>
</p>
</form>
</div>

And Database:

<?php

    if (isset($_REQUEST['submit'])){
        $query = "SELECT * FROM student";
        $search_result =filterTable($query);


    }
    else {
        $query = "SELECT * FROM `student`";
        $search_result =filterTable($query);


    }
    if (isset($_REQUEST['submit2'])){
        $query2 = "SELECT * FROM employer";
        $search_result2 =filterTable($query2);


    }
    else {
        $query2 = "SELECT * FROM `employer`";
        $search_result2 =filterTable($query2);


    }

    function filterTable($query)
    {
        $connect=mysqli_connect('127.0.0.1', 'root', 'root',"web");
        $filter_Result = mysqli_query($connect,$query);
        return $filter_Result;
    }
    function filterTable2($query2)
    {
        $connect=mysqli_connect('127.0.0.1', 'root', 'root',"web");
        $filter_Result2 = mysqli_query($connect,$query2);
        return $filter_Result2;
    }
?>




How to remove a tab completely in a web template

I recently downloaded a free web template & I did some modifications as i wished, So there is one thing that i cannot manage,can any one help me to delete an unwanted tab from my template completely.. --Task--

001:"Price List" Tab need to be completely deleted. 002:Web Template




Raspberry pi Python click buttons on a webpage

I usually turn off my wifi if i don't need it (e.g over night).

I have a 433mhz Remote and a 433mhz receiver lying around and want to use them for turning the wifi on/off. If I click the off button on the remote, it sends a signal to the Pi which should trigger the script.

The script must do following things:

  1. Open the Webpage for the Router webinterface
  2. Type in the Username and Password and click login
  3. Go to the Wifi tab and click Wifi off button
  4. Click submit and then log out of the webinterface

Can i do this with a python or bash script, If yes how?

Thanks for your help.

-Luke




vendredi 26 février 2016

Echo divs inside Foreach loop

Im developing a web page which contains a posting section. I have an Array called $posts which contains Title, body, date, and name of the image from the post (rows come from a data base). This array is filled with all postings in the page, and when I use a foreach I want to echo these variables inside this block of code when running a foreache:

<div class="col-lg-12 text-center">
   <img class="img-responsive img-border img-full" src="../img/NAME.jpg" alt="">
     <h2>TITLE
        <br>
        <small>DATE</small>
          </h2>
          <p>BODY</p>
           <a href="#" class="btn btn-default btn-lg">Button</a>
           <hr>
</div>

This is the structure of the array:

$post= [
    "title",
    "date",
    "body",
    "name"
];




Paper-Button is not working in polymer..?

I created Paper-button but its not working on my web-browser.I tried many ways to solve but didn't work.Here are snaps Of all code and library. Thanks. [![ImageofCode][1]][1] [![ImageOfSource][2]][2] [![OutPutofpaper-button][3]][3] [1]: http://ift.tt/21oRf4F [2]: http://ift.tt/1R9e81j [3]: http://ift.tt/21oRcGa




Ajax request doesn't works in Firefox

I was developing a web page but when I try to use it on firefox, i receive an error, the problem is in ajax, when i try to get any information using AJAX I receive "FALSE" in a white screen of firefox, here is the code.

var url = 'aplication/modules/editarData.php';
$.ajax(
{
    type:'POST',
    url:url,
    data:'id='+id,
    success: function(valores)
    {
        var datos = eval(valores);
        $('#cd-name2').val(datos[0]);
        $('#prese2').val(datos[2]);
        $('#clasi2').val(datos[3]);
        $('#quantity2').val(datos[4]);
        $('#distquantityorumos2').val(datos[5]);
        $('#distquantityorumos2a').val(datos[5]);
        $('#distquantityorumitos2').val(datos[6]);
        $('#distquantityorumitos2a').val(datos[6]);
        $('#distquantitydaca2').val(datos[7]);
        $('#distquantitydaca2a').val(datos[7]);
        $('#cd-textarea2').val(datos[8]);
        $("#cd-id").val(datos[9]);
        return false;
    }
});
return false;




Import more than one css file to html page

I trying to import 2 css files as follows:

<link rel="stylesheet" href="css/general.css">
<link rel="stylesheet" href="css/bootstrap.css">

And for some reson its doesnt working, What would be the problem?




How to configure httpd for browser caching

I have ported a WIN CE 6.0 application to WEC2013 which also has a web portal. The web pages on the new port comes very slowly. To give you an example the one which took 1 secs to load now takes 30 to 60 seconds! I found the problem. I seems that the web browser tries to load all the png image files every time they are opened. It is not caching the images.

My question is how do I configure httpd server to enable to cache the images and other redundant files?

Thanks in advance. Arif




Java SSL Client/Server Pair: Certificates and TrustStores

Okay, so I recently developed a simple Client/Server API, which sends packets back and forth. As of right now, the system is completely unsecured, and I want to use SSL. I know that Java has SSLSocket and SSLServerSocket, but when I query the factory to get them, the Client/Server fails. I'm reasonably certain this is because the certificate of localhost is not trusted, and I understand that I need to get an SSLContext and give it a KeyStore, but I have some questions:

  1. In java, does the SSLSockets provide everything? As in, do they handshake, as well as encrypt interaction?
  2. How do I trust a public key? Can I simply add it to a keystore, or do I need to make a certificate.
  3. How do I set what private/public key-pair the server uses?

Put simply, I want to be able to pass a Collection of public keys to the Client, and use those to verify certificates.

My code is on github, the classes that specifically deal with Sockets are the ClientThread and ListenerThread, and the class I'm using to test is here. Within the ClientThread and ListenerThread, the SSLSocket creation code is commented out. I've verified, using the test class, that they are otherwise functional; if I instead comment out the regular socket, and use SSLSockets, the test class simply ends.

Notes:

  • Please ignore the pour code style in the test class, I know it sucks, I just needed to write something quickly to test with
  • Please try to ignore the use of other parts of my API (i.e. IntRange, @EventListener, etc.), as aforementioned, I've made sure everything else works, it is only the commented out code that doesn't function
  • Please don't recommend I use some API, this project is mostly for my own learning experience

Output of the Test class is as follows:

With Regular Sockets

Server received packet: Server received packet: com.gmail.socraticphoenix.plasma.net.packet.ClientIdentity{private.uuid=d4024136-7541-4acf-8b8a-d0e9f0021a18, private.pass=pass, hashcode=189813093} Client received packet: com.gmail.socraticphoenix.plasma.math.IntRange{private.min=312, private.max=421432, hashcode=344227682}

With SSL Sockets

Thanks very much for any help!




Transfer data form one browser tab to another [duplicate]

This question already has an answer here:

I would like to capture data from one tab and use it to prefill my form in another tab.

Let's say a loan officer has their property data sheet open in one tab and they want to order a property inspection. If the property inspector's order system is not integrated with the bank's system they would then need to type the relevant data into a new order form or copy/past a field at a time.

I would like the Property Inspector's order form to be pre-populated somehow from the bank property sheet. Can one tab read another? Can I somehow drag/drop one tab onto another? Can I do this in straight javascript or would I need to create a plugin?

How would I crack this nut, preferably in a secure and cross browser fashion?

Thanks.




Why ng-model doesn't work with input type "file"?

I see that angular doesn't support ng-model in the <input type="file">, I am curious what may be the issue and what is the alternate solution?

Ref:

  1. ng-model for <input type="file"/>
  2. http://ift.tt/1cXec0C



MAMP Pro configuration—only partially working

I am testing out MAMP Pro as a stating server of sorts for a LAN. I have a lot of web projects that I keep in a folder in my home directory under /Development/web/project-title and with MAMP free it was easy enough to go to localhost, click on a project and get to work. With MAMP Pro I want to maintain the ability to go to localhost for myself, but also set up a server or two with a static IP address that other people in the office can view.

The latter part is working for one project but not the other, and setting up the server that can be viewed by everyone has broken localhost viewing of the Dev/web directory with a "Forbidden" error. How is it possible that a server can reach "dev/web/project-A" without a Forbidden error, but localhost servers a forbidden error? I don't like it, but I've made every folder up to root drwxrwxr-x and that doesn't help.

the localhost settings are:

Server name: localhost
IP address: *
Port number: 8888
No name resolution
Document root: /Users/Russell/Development/web

The server that IS working is set to:

Server name: nameofsite.stage
IP address: *.*.*.* (my personal static IP address)
Port number: 777
Name resolution:
via /etc/hosts file - yes
via Xip.io (LAN only) - yes
http://ift.tt/1LiOvOT

Like I said, the configuration above works great, but localhost is broken. If I duplicate that latter configuration to create a second server, that second server gives "Forbidden".

Thanks in advance for any help. This will seriously determine if I buy MAMP Pro or not.




Return 404 for the /web directory Symfony 3

All my links are accessibles by mysite.com but also with mysite.com/web/

I would not like to redirect /web to / but, i would like to return a 404 for ^/web. I think it's possible cuz i saw a lot of symfony projects which return 404 error for the /web path

Thanks you all !




Response Time on a web page like a stop watch

I have searched and found so many answers but nothing that fits my requirement. I will try to explain here and see if any of you guys have some tips.

  • I wish to click on a link manually and from there on; I wish that some kind of tool or service starts recording time from my click and stops when the desired page is loaded. This way, I am able to find out the exact user interface response time.

  • All the online web testing services ask for main URL. In my case the main URL has gazillion links and I wish to use only 1 link as standard sample which is a dynamic link

For example: - I click on my friend's name on Facebook - From my click to the time page is loaded, if there's a tool that does the stop watch thing?

End goal is:

I will be stress testing a server with extensive load and client wishes to see response time of simple random pages when load is at 500, 1000, 2000 and so on.

Please help!

Thank you.




Aptana: How to prevent project name and folder in base URL

I've recently started working on a web project with quite an existing code base already. In this project, all references to JS/CSS files are done with paths relative to the root, rather than relative to the current directory. (so "/path/to/file" instead of "path/to/file.")

When I preview the project in Aptana, all referenced files fail to load, as it is looking for http://ift.tt/1LJFN7j, while Aptana serves the files as http://ift.tt/1S5N87T.

Is it possible to configure Aptana NOT to include the project name and root folder of the project, rather than having to go through the entire project and remove all the leading slashes from the referenced files?




need a suggestion for a new php web application

I need to do a web application for my degree and I'm still undecided on the field. Basically, I'll use PHP. I was thinking about an online store but I want something more different..

Any suggestions?

Thanks so much!




How to create a web page with CSS and JS so it acts like UITabBar (framework?)

So we've decided to create a down and dirty Android version to a working iOS app.
Since we don't code in Java and resources are limited, we thought of creating a responsive web version of the app, that emulates the app's environment more or less, but keeps most of the functionality. I should note that we haven't programmed responsive web pages before. we know there are media queries and functionalities for many different devices, though.

The idea was to create an Android app that uses a webView which is hardcoded to be a responsive web page. To the user we hope the result should be app-like. We need the screen to look like this:

Two windows are shown, and displayed according to the choice of the user

so that when the user presses A - the A screen would show, and when B is pressed, B is shown.

A shows a scrollable list of items

A shows a scrollable list

B shows a some buttons, pressing these buttons would change a value that is sent via a web reuest.

B shows some buttons

We need something to help us come up with buttons, presses, screen resizing, events fired...
Is there any framework that we can use to accomplish a task like this? I was thinking of using jQuery, changing the visibility of the <div>s for the main screen. Of course it would take a graphic designer to make these buttons, and writing it all. But is there any framework that is made for this? (We need the code!).
there will also be requests that are sent to the server and responses will be in JSON, so display A can be populated accordingly.

We need an answer that would target us to a solution that fulfills this functionality so we can go ahead and code the rest of the project.

Thanks!




XMLHttpRequest, Web API

i was searching for answer for a while however it look like it is working correctly for the others :-) . I have issue when uploading file. Everything working fine except progress bar. It is 100% before web api was even called so it probably uploading file somewhere in memory. When i am uploading video file (1 GB) i am waiting for few minutes and it looks like progress bar is working(but it is not uploaded anywhere) and after 100% it call my api and uploading again(but progress bar is already 100%). So i would like it call api when i will click button and shows progress correctly...I am not sure it will work this way but...

    var formData = new FormData(form);
    var xhr = new XMLHttpRequest();

    xhr.upload.onprogress = function (evt) {
        if (evt.lengthComputable) {
             setProgress(Math.round((evt.loaded / evt.total) * 100));
        }
    }

    //xhr.upload.onprogress = updateProgress;
    xhr.open('POST', form.action, true);
    xhr.onerror = errorHandler;

    xhr.onload = function () {

        if (this.status == 200) {

             ReloadMediaMeetings();
        };
    };
    xhr.send(formData);

One of many alternative i tried

$.ajax({

        xhr: function () {
            var xhr = $.ajaxSettings.xhr(); // also new XMLHttpRequest();
            xhr.onerror = errorHandler;
            xhr.upload.onprogress = updateProgress;

            return xhr;
        },
        type: 'POST',
        url: form.action, // api/upload
        contentType: false,
        processData: false,
        data: formData,
        success: function () {

        }
    });

C#

    public async Task<HttpResponseMessage> Upload()
    {
        var request = this.Request;

        if (!request.Content.IsMimeMultipartContent("form-data"))
        {
            HttpResponseMessage response = Request.CreateResponse(HttpStatusCode.UnsupportedMediaType, "Invalid Request!");
            return response;
        }

        var streamProvider = new MultipartFormDataStreamProvider(uploadPath);

        try
        {
            await request.Content.ReadAsMultipartAsync(streamProvider)
                .ContinueWith(r =>
                   {
                       foreach (MultipartFileData fileData in streamProvider.FileData)
                       {
                           FileInfo fileInfo = new FileInfo(fileData.LocalFileName);
                           ContentDispositionHeaderValue disposition = fileData.Headers.ContentDisposition;
                           string fileName = (disposition != null && disposition.FileName != null) ? ParseFilename(disposition.FileName) : String.Empty;
                           //....
                           _logicProvider.UploadVideo(meeting, user);
                       }

                   });
                return request.CreateResponse(HttpStatusCode.OK);

        }
        catch (System.Exception e)
        {
            return Request.CreateErrorResponse(HttpStatusCode.InternalServerError, e);
        }
    }

Result is that video will be uploaded and all informations inserted in DB however user will wait for 5 min when progress bar already shows 100%. Thanks in advance.




How to do i hide the content in user page to the unregistered users?

this is the my login.php code. if someone logged, i want to redirect student-area.php . and if unregisterd member direct goes to the student-area.php, i want to hide the content in student-area.php

<?php
@mysql_connect('localhost', 'root', '');

$select_db = mysql_select_db('register');

session_start();

    if (isset($_POST['username'])){
        $username = $_POST['username'];
        $password = $_POST['password'];

$query = "SELECT * FROM `users` WHERE username='$username' and password='".md5($password)."' ";
        $result = mysql_query($query) or die(mysql_error());
        $rows = mysql_num_rows($result);
             if($rows==1){
            $_SESSION['username'] = $username;
            header("Location: student-area.php"); 
            }else{
                echo "<div class='form'><h3>Username/password is incorrect.</h3><br/>Click here to <a href='login.php'>Login</a></div>";
                }
    }else
?>




Android - Show webview in same tab with WebChromeClient

I'm currently working on an wbesite app to display a website in full screen + center the page, but as you can see Here the website is almost made with only HTML5 animations so I tried with the default WebClient (WebViewClient) but only the first page was able to be diplayed cause it dosen't have any kind of animations, so now I'm trying to do the same thing I did with the Default WebView but Using Chrome, but for some reason every time I click on something in my app, it open the chrome browser and set my app in the background, any idea how I can fix that and open the links I've clicked witout exiting my app ?

Thanks in advance for your help

(And Sry if my question may seems kinda stupid but I'm a newbie in Android programming so if you can explain with some details I would be really grateful ^^ )

Here is the BrowserApp.java :

 package fr.so_dupontrenoux.indigo;

import android.app.Activity;
import android.net.Uri;
import android.os.Bundle;
import android.view.Menu;
import android.view.MenuItem;
import android.view.View;
import android.webkit.WebChromeClient;
import android.webkit.WebSettings;
import android.webkit.WebView;
import android.webkit.WebViewClient;

import com.google.android.gms.appindexing.Action;
import com.google.android.gms.appindexing.AppIndex;
import com.google.android.gms.common.api.GoogleApiClient;


public class BrowserApp extends Activity {

    /**
     * ATTENTION: This was auto-generated to implement the App Indexing API.
     * See http://ift.tt/1Shh2Dk for more information.
     */
    private GoogleApiClient client;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_browser_app);

        WebView webView= (WebView) findViewById(R.id.webView);

       webView.setWebChromeClient(new WebChromeClient());
        //webView.setWebViewClient(new WebViewClient());

        webView.getSettings().setJavaScriptEnabled(true);


        webView.setVerticalScrollBarEnabled(false);
        webView.setHorizontalScrollBarEnabled(false);

        webView.getSettings().setUseWideViewPort(true);
        //Preserver la page ( cadrage 1:1 adaptatif )

//Test

//END TEST

        webView.loadUrl("http://ift.tt/1KPKXUy");


        // ATTENTION: This was auto-generated to implement the App Indexing API.
        // See http://ift.tt/1Shh2Dk for more information.
        client = new GoogleApiClient.Builder(this).addApi(AppIndex.API).build();
    }

    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        // Inflate the menu; this adds items to the action bar if it is present.
        getMenuInflater().inflate(R.menu.menu_browser_app, menu);

        return true;
    }

    @Override
    public boolean onOptionsItemSelected(MenuItem item) {
        // Handle action bar item clicks here. The action bar will
        // automatically handle clicks on the Home/Up button, so long
        // as you specify a parent activity in AndroidManifest.xml.
        int id = item.getItemId();

        //noinspection SimplifiableIfStatement
        if (id == R.id.action_settings) {
            return true;
        }

        return super.onOptionsItemSelected(item);
    }

    @Override
    public void onStart() {
        super.onStart();

        // ATTENTION: This was auto-generated to implement the App Indexing API.
        // See http://ift.tt/1Shh2Dk for more information.
        client.connect();
        Action viewAction = Action.newAction(
                Action.TYPE_VIEW, // TODO: choose an action type.
                "BrowserApp Page", // TODO: Define a title for the content shown.
                // TODO: If you have web page content that matches this app activity's content,
                // make sure this auto-generated web page URL is correct.
                // Otherwise, set the URL to null.
                Uri.parse("http://host/path"),
                // TODO: Make sure this auto-generated app deep link URI is correct.
                Uri.parse("android-app://fr.so_dupontrenoux.indigo/http/host/path")
        );
        AppIndex.AppIndexApi.start(client, viewAction);
    }

    @Override
    public void onStop() {
        super.onStop();

        // ATTENTION: This was auto-generated to implement the App Indexing API.
        // See http://ift.tt/1Shh2Dk for more information.
        Action viewAction = Action.newAction(
                Action.TYPE_VIEW, // TODO: choose an action type.
                "BrowserApp Page", // TODO: Define a title for the content shown.
                // TODO: If you have web page content that matches this app activity's content,
                // make sure this auto-generated web page URL is correct.
                // Otherwise, set the URL to null.
                Uri.parse("http://host/path"),
                // TODO: Make sure this auto-generated app deep link URI is correct.
                Uri.parse("android-app://fr.so_dupontrenoux.indigo/http/host/path")
        );
        AppIndex.AppIndexApi.end(client, viewAction);
        client.disconnect();
    }
}

And the Manifest.xml :

<manifest xmlns:android="http://ift.tt/nIICcg"
    package="fr.so_dupontrenoux.indigo" >
    <uses-permission android:name="android.permission.INTERNET"/>

    <application
        android:allowBackup="true"

        android:hardwareAccelerated="true"

        android:icon="@mipmap/ic_launcher"
        android:label="@string/app_name"
        android:theme="@android:style/Theme.NoTitleBar.Fullscreen" > <!-- This line is important -->


        <activity
            android:name=".BrowserApp"
            android:label="@string/app_name" >
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />

                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
        <!-- ATTENTION: This was auto-generated to add Google Play services to your project for
             App Indexing.  See http://ift.tt/1Shh2Dk for more information. -->
        <meta-data
            android:name="com.google.android.gms.version"
            android:value="@integer/google_play_services_version" />
    </application>

</manifest>




Accessing a test client/server application through the internet

I'm testing my UWP application in C# using Visual Studio that sends images from a client app to the server app. I've set up the client and server on the local network on respective machines with IP's and ports and it works fine. I'm trying to test it now through the internet without the use of domain registering and web hosting etc. Is this possible? If so:

  • What steps should I take to test this type of application (client/server model) through the internet?
  • Could Windows Server be a solution? I have minimal experience with the OS.
  • Can Apache handle this?



How to allow easy save of displayed image with keyboard access?

I took some time to dive into web development last week (i.e. I'm a n00b) and I created some toy website with images that can be viewed in a convenient way (idea based on an example from w3schools).

// Get the modal
var modal = document.getElementById('myModal');

// Get the image and insert it inside the modal - use its "alt" text as a caption
var img = document.getElementById('myImg');
var modalImg = document.getElementById("img01");
var captionText = document.getElementById("caption");
img.onclick = function() {
  modal.style.display = "block";
  modalImg.src = this.src;
  modalImg.alt = this.alt;
  captionText.innerHTML = this.alt;
}

// Get the <span> element that closes the modal
var span = document.getElementsByClassName("close")[0];

// When the user clicks on <span> (x), close the modal
span.onclick = function() {
  modal.style.display = "none";
}
#myImg {
  border-radius: 5px;
  cursor: pointer;
  transition: 0.3s;
}
#myImg:hover {
  opacity: 0.7;
}
/* The Modal (background) */

.modal {
  display: none;
  /* Hidden by default */
  position: fixed;
  /* Stay in place */
  z-index: 1;
  /* Sit on top */
  padding-top: 100px;
  /* Location of the box */
  left: 0;
  top: 0;
  width: 100%;
  /* Full width */
  height: 100%;
  /* Full height */
  overflow: auto;
  /* Enable scroll if needed */
  background-color: rgb(0, 0, 0);
  /* Fallback color */
  background-color: rgba(0, 0, 0, 0.9);
  /* Black w/ opacity */
}
/* Modal Content (image) */

.modal-content {
  margin: auto;
  display: block;
  width: 80%;
  max-width: 700px;
}
/* Caption of Modal Image */

#caption {
  margin: auto;
  display: block;
  width: 80%;
  max-width: 700px;
  text-align: center;
  color: #ccc;
  padding: 10px 0;
  height: 150px;
}
/* Add Animation */

.modal-content,
#caption {
  -webkit-animation-name: zoom;
  -webkit-animation-duration: 0.6s;
  animation-name: zoom;
  animation-duration: 0.6s;
}
@-webkit-keyframes zoom {
  from {
    transform: scale(0)
  }
  to {
    transform: scale(1)
  }
}
@keyframes zoom {
  from {
    transform: scale(0.1)
  }
  to {
    transform: scale(1)
  }
}
/* The Close Button */

.close {
  position: absolute;
  top: 15px;
  right: 35px;
  color: #f1f1f1;
  font-size: 40px;
  font-weight: bold;
  transition: 0.3s;
}
.close:hover,
.close:focus {
  color: #bbb;
  text-decoration: none;
  cursor: pointer;
}
/* 100% Image Width on Smaller Screens */

@media only screen and (max-width: 700px) {
  .modal-content {
    width: 100%;
  }
}
<!DOCTYPE html>
<html>

<head>
</head>

<body>

  <h2>Image Modal</h2>
  <p>In this example, we use CSS to create a modal (dialog box) that is hidden by default.</p>
  <p>We use JavaScript to trigger the modal and to display the current image inside the modal when it is clicked on. Also note that we use the value from the image's "alt" attribute as an image caption text inside the modal.</p>
  <p>Don't worry if you do not understand the code right away. When you are done with CSS, go to our JavaScript Tutorial to learn more.</p>

  <img id="myImg" src="http://ift.tt/21lUE48" alt="Northern Lights, Norway" width="300" height="200">

  <!-- The Modal -->
  <div id="myModal" class="modal">
    <span class="close">×</span>
    <img class="modal-content" id="img01">
    <div id="caption"></div>
  </div>

</body>

</html>

I also read something on WAI-ARIA etc. and I was wondering how people can save the image that is being displayed with key-board access. I tried, using the save-shortcut in the browser, but that turned out to save the entire webpage, rather than the displayed image.

Because I thought it would be easier (and make more sense in this case) to only save the image rather than the entire webpage, I was wondering whether it would make sense to overwrite the default save behaviour and how this could be done. Spontaneously I was thinking about something like

function handleKey(e) {
    if((e.ctrlKey || e.metaKey) && (e.keyCode || e.which == 83)) {
        // no idea how to implement save-behaviour
    }
}

but then I thought it would make sense to change the save behaviour of the browser as well if I change this shortcut.

Therefore my question: Is there some way to change the save-behaviour on a website (I'm not familiar with all possible web-technologies yet, but I am just curious if there would exist some way) and if this would not be possible or turn out to be a bad idea, what would be a good way to allow keyboard-users to save an image that is displayed as above?




Bootstrap grid is not center aligned issue

Hi i am using bootstrap library. So, i was trying to make three grids in while building a website. it's responsive but, not enough. And i cannot center align the grids. But, manually it can be done with a customized class or an ID. For an example let's say i'd like to get the view for tablet view... grids are coming like this... This is how it shows. The grid shows five years is not centered enough. it's giving an odd look.

what's the way to get to move the '5years' grid to center when the tablet view is viewd.

I am attaching my code here.

       <!-- Here are all THREE COLUMNS which says about YEARS GRID  -->
<!-- 1st -->
<div class="row text-center center" id="alignment-margin">

  <div class="col-lg-4 col-md-4 col-sm-4 col-xs-12 col-tn-12 container " id="section-customization" id="alignment-margin">
    <h3 id="pricing-font">
      3 years
      <br/>
      <hr id="small-line">
    </h3>
    <p>
      <i class="fa fa-check" id="icon_color">
        &nbsp
      </i>
      interdum et malesuada
      <br/><br/>
      <i class="fa fa-check" id="icon_color">
        &nbsp
      </i>
      interdum et malesuada
      <br/><br/>
      <i class="fa fa-check" id="icon_color">
        &nbsp
      </i>
      interdum et malesuada
      <br/><br/>
    </p>
    <button class="btn btn-success rounded customize-button" id="tryButton" type="button">
      Try it now for free
    </button>
  </div>
  <!-- SECOND -->
  <div class="col-lg-4 col-md-4 col-sm-4 col-xs-12 col-tn-12 container " id="section-customization" id="alignment-margin">
    <h3 id="pricing-font">
      1 year
      <br/>
      <hr id="small-line">
    </h3>
    <p>
      <i class="fa fa-check" id="icon_color">
        &nbsp
      </i>
      interdum et malesuada
      <br/><br/>
      <i class="fa fa-check" id="icon_color">
        &nbsp
      </i>
      interdum et malesuada
      <br/><br/>
      <i class="fa fa-check" id="icon_color">
        &nbsp
      </i>
      interdum et malesuada
      <br/><br/>
    </p>
    <button class="btn btn-success rounded" id="tryButton" type="button">
      Try it now for free
    </button>
  </div>
  <!-- THIRD -->
  <div class="col-lg-4 col-md-4 col-sm-4  col-xs-12 col-tn-12 container" id="section-customization" id="alignment-margin">
    <h3 id="pricing-font">
      5 years
      <br/>
      <hr id="small-line">
    </h3>
    <p>
      <i class="fa fa-check" id="icon_color">
        &nbsp
      </i>
      interdum et malesuada
      <br/><br/>
      <i class="fa fa-check" id="icon_color">
        &nbsp
      </i>
      interdum et malesuada
      <br/><br/>
      <i class="fa fa-check" id="icon_color">
        &nbsp
      </i>
      interdum et malesuada
      <br/><br/>
    </p>
    <button class="btn btn-success rounded customize-button" id="tryButton" type="button">
      Try it now for free
    </button>
  </div>
</div>