JavaScript
Replacing String in JavaScript with Regular Expression and the replace function
steps:
- searching the web for replacing texts
- finding regular expression
- searching for suitable regex function
- identifying replace out of (match, exec, replace) as the most suitable function to use
- searching for example how to use replace the right way
- finding and testing the right pattern that matches /s200/
- testing and iterating until the pattern matches the string and the modified string is ready to use
a javascript solution for that particular challenge looks the following way:
var testString = "http://www.google.at/img/s200/";
var partToBeReplaced = /s200/;
var newPart = "s1600";
var replacedTestString = testString.replace(partToBeReplaced, newPart);
Taggings:
How to find a partial String in another String with JavaScript
I've got a string lets say its "/s200/" which is part of a URL, and this part is responsible for resizing an image on demand.
So whenever you change s200 to a higher or lower number following the s, then the picture that is returned by the complete URL will be either increased or decreased in size.
Now i want to programmatically find this part in the url and replace it by lets say "/s800/" in order to make the returned image bigger.
Taggings:
Developing a blogger.com gadget that displays both, an image and the title of the most recent post
The steps do do so would be the following:
- Look up the internet for getting started documentation for blogger.com gadgets (Blogger documentation)
- Write a helloworld gadget and try to upload the gadget to your blog (add the helloWorld Gadget to your ftp, add it then to your layout by choosing "Layout" and clicking the following, at last enter an URL and hit the "add url" button)
- if the upload was successful look up how one can get the image link and the title of the most recent post programmatically
- search the web how to display an image and a title with xhtml
- search the web how to style the previsouly mentioned tags with css accordingly
- put the pieces together and test
- iterate until the desired outcomes are archieved
- upload the solution to your blog
In order to get a kick start, here the helloWorld.xml
<?xml version="1.0" encoding="UTF-8" ?>
Description of the structure:
- ModulePrefs: Here preferences for the gadget can be defined, which can then be used within your code
- your custom HTML, CSS and JavaScript all goes into the Content part. as CDATA
Taggings:
Create android application by using standard web technologies such as HTML5, CSS3, and JavaScript
The goal is to build applications for mobile devices using well known standard web technologies like JavaScript, HTML5, and CSS3, instead of device-specific languages such as Java or Objective-C.
Taggings:
How can I add social Media Buttons (Facebook, Twitter & Co.) to jQuery colorbox?
The aim is to display social media buttons on each image in the jQuery colorbox view. As displaying something other than text in the lightbox is not possible by default (<a href="http://www.jacklmoore.com/colorbox/">jQuery colorbox</a>) (see documentation, demo), we need a custom solution to do the job.
Note: As jQuery colorbox is a Plugin for certain content management systems, it is important that the change should be done WITHOUT changing the code of the lightbox and WITHOUT accessing the HTML directly, as Plugins for CMS should not be modified as they will loose update compatibility.
The result should look like in attachment 1 (sample.png).
Taggings:
Testing JavaScript with various frameworks and sharing them
In an experimental state of your new solution there is often a phase where you don't know how to solve a problem in JS/HTML in the best way. The set up that is required localy is often complicated because of including of all necessary libraries and the testing is often a very monotonous repeating of adding of files.
Taggings:
Use Firefox Add-On Firebug
For JavaScript debugging one can use the Firefox add-on Firebug.
To install the add-on: go to the 'Firefox' button in the browser, select 'add-ons', then search for 'Firebug' using the search engine and consequently install the add-on.
After restarting Firefox go to the 'Firefox' button again, select 'Web Developer', 'Firebug', 'Open Firebug'. Then the Firebug panel will open in the lower side of the opened tab. There select 'Script' and 'Enable' and you are ready to start debugging.
To debug you can insert breakpoints and then reload the page. It will break when encountering the line. Then you have the possibility to see variable values, continue running the script, enter, skip or exit functions etc.
Taggings:
Debug JavaScript
When programming with JavaScript it may be necessary to debug functions, get to the roots of error messages and warnings and check variables'values.
Taggings:
How to personalize web pages with additional functions in Firefox ?
I have many favorite web pages which I visit very often. But not all of them give me the features and functions I expect from them to be perfectly user-friendly. For example: a button in order to download videos from YouTube, the possibility to search Usenet file names from Forums directly in the NZB Index, etc. I would like to make and add my own customizations, but also find some new ideas from an existing community.
Taggings:
Google Maps API Polyline and GMarker
Drawing the lines is easy with the use of the well documented Google Maps JavaScript API.
http://code.google.com/apis/maps/documentation/javascript/overlays.html
For lines i used Polylines "A Polyline object consists of an array of LatLng locations, and creates a series of line segments that connect those locations in an ordered sequence."
So first prepare the coordinates
coordinateArray[pointNr] = new GLatLng(Latitude, Longitude);
and then draw the polyLine on the map
var polyLine = new GPolyline(coordinateArray, color, opacity, weight);
_map.AddOverlay(polyLine)
For creating the stations i used GMarker with a customized GIcon.
The click event for showing additional information is done by adding an GEvent
Simple example:
var marker = new GMarker(point, icon); //point = single GLatLng object
GEvent.addListener(marker, "click", function() {
marker.openInfoWindowHtml(text);
});
_map.addOverlay(marker);
the text can contain HTML Tags like links etc.
Pages
