User Tools

Site Tools


public:tellmaps_url_and_seo

Differences

This shows you the differences between two versions of the page.

Link to this comparison view

Both sides previous revision Previous revision
Next revision
Previous revision
public:tellmaps_url_and_seo [2014/04/25 13:52]
honzik
public:tellmaps_url_and_seo [2014/05/05 07:27] (current)
honzik
Line 21: Line 21:
   * a **local hash**, ''#​local-hash''​ - this is used as a normal hash, i.e. to scroll to a given part of document (top / bottom etc).   * a **local hash**, ''#​local-hash''​ - this is used as a normal hash, i.e. to scroll to a given part of document (top / bottom etc).
  
-[Implementation] code to retriveve params from hash part: https://​gist.github.com/​miohtama/​1570295+[Implementation ​details] code to retriveve params from hash part: https://​gist.github.com/​miohtama/​1570295
  
 ===== URLs for Tellmaps ===== ===== URLs for Tellmaps =====
Line 58: Line 58:
  
 ===== Javascript implementation ===== ===== Javascript implementation =====
- 
-The main idea is to create a Javascript service which can be called from existing system modules to perform URL-based operations. We shall call it ''​TellmapsURIService''​. 
- 
-API should provide: 
  
 <code javascript>​ <code javascript>​
  
 /** /**
- ​* ​Register a given path. + ​* ​revised version with one settings object and multiple callback definitions 
- * @param ​uri_string ​string ​with path. May contain variables in the format of ''​:variable''​ - will be passed to callback on request. + * @param ​settings - collection {}, specify these properties:​ 
- ​* ​@param callback ​a function in the form of function(passed_vars,​ get_vars, path_not_changed+ ​* ​ - path - string ​- define a path component with possible ​:​variable ​notation 
- ​* ​  passed_vars is a collection of { variable_name:​ variable_value } + ​* ​ - onPathSet ​- function(variables- pass in a callback to be called whenever a path changes 
- ​* ​  get_vars is collection of param set (GET) in form of { param_name: param_value } with automatic completion from default_params_object + ​* ​                   - @param variables - collection of passed :variable values  
- ​* ​  path_not_changed is true if path component changed ​from last state, false if only params / local hash changed + ​* ​                       in format ​{ variable_name:​ variable_value } 
- ​* ​  ​function ​will be called whenever ​URI matches on URI change + ​* ​ - onPathOut - function() - pass in callback to as destructor function 
- * @param ​default_params_object ​contains ​default ​GET values in form of { param_name: param_def_value }+ ​* ​             - is called whenever path components change from this path 
 + ​* ​ - onParamsChange - function(params- pass in a callback to be called whenever a param string changes 
 + ​* ​                    - @param params - collections ​of passed GET params 
 + ​* ​                        in format ​{ param_name: param_value } 
 + ​* ​ - defaultParams - collection - define an array of default GET values - they automatically pre-fill the  
 + ​* ​                  ​params in onParamsChange callback ​if not provided ​from GET 
 + ​* ​ - onHashChange - function(local_hash) - pass in a callback to be called whenever ​a local hash part changes 
 + ​* ​                    - @param ​local_hash ​provides new value of local_hash 
 + ​* ​    - @default ​if not defined, will perform a scroll to page top / element ​of ID #​local_hash,​ 
 + ​* ​               as standard hash does 
 + ​* ​ - debug - boolean - provide console.log outputs on various operations of this registerURI block              ​
  * @return none  * @return none
 + ​* ​
 + * notes:
 + ​* ​ - all callbacks have "​this"​ set which can access the following:
 + ​* ​   getHash(), getParams(),​ getParamString(),​ getPath()
 + ​* ​   please do not use their "​set"​ counterparts directly.
  **/  **/
-function ​registerURIuri_string, callback, default_params_object ​) {+function ​registerUrisettings ​) {
 ... ...
  
Line 86: Line 97:
  ​* ​  ​function will be called on URI parse failed  ​* ​  ​function will be called on URI parse failed
  * @return none  * @return none
 + ​* ​
 + * notes:
 + ​* ​ - callback has "​this"​ set which can access the following:
 + ​* ​   getHash(), getParams(),​ getParamString(),​ getPath()
 + ​* ​   please do not use their "​set"​ counterparts directly.
  **/  **/
-function ​onURIFail( callback ) {+function ​onUriFail( callback ) {
 ... ...
  
 /** /**
- ​* ​Manual call to path change+ ​* ​Get proper URI string ​to be used in parts of the app
  * @param path - string, path component part  * @param path - string, path component part
  * @param get_params - get param collection in the form of { param_name : param_value }  * @param get_params - get param collection in the form of { param_name : param_value }
  * @param local_hash - string, local hash part  * @param local_hash - string, local hash part
- * @return ​true/false on success / fail+ * @return ​string final string
  **/  **/
-function ​changeURI( path, get_params, local_hash ) {+function ​getUriString( path, get_params, local_hash ) {
 ... ...
 +
 </​code>​ </​code>​
  
-So, on the side of implementor into existing systemthe role is to: call the ''​TellmapsURIService.registerURI''​ in the setup phase of the application and register a callback to provide given taskfor every "​static"​ piece of content.+This solution has these advantages:​ 
 +  * destructor ​on path component change - can be used to free memory-intensive resouceskill dialogs etc. 
 +  * separate GET params / path component / local hash change callbacks - betterisolated eventsThe event order is as follows:
  
-Whenever somebody clicks on a link with the hashbang syntax, uses browser history or manually changes the location, callbacks should trigger. +<​code>​ 
- +(change ​a path component) ​-> trigger onPathSet -> trigger onParamChange ​-> trigger onHashChange 
-''​TellmapsURIService''​ should handle events of location change and/or parse the [variable, get, local hash] data before use. +(change ​a params ​part) -> trigger onParamChange only 
- +(change ​local hash part) -> trigger onHashChange only
-===== Javascript implementation - version B (revised) ===== +
- +
-A more well-thought approach: +
- +
-<​code ​javascript+
- +
-/** +
- * Register ​given path+
- * @param uri_string string with path. May contain variables in the format of '':​variable'' ​will be passed to callback on request. +
- * @param callback ​a function in the form of function(passed_vars,​ get_vars, path_not_changed) +
- ​* ​  ​passed_vars is collection of { variable_name:​ variable_value } +
- ​* ​  ​get_vars is a collection of param set (GET) in form of { param_name: param_value } with automatic completion from default_params_object +
- ​* ​  ​path_not_changed is true if path component changed from last state, false if only params ​/ local hash changed +
- ​* ​  ​function will be called whenever URI matches on URI change +
- * @param default_params_object - contains default GET values in form of { param_name: param_def_value } +
- * @return none +
- **/ +
-function registerURI( settings ​+
-... +
- +
-/** +
- * Register a callback to be executed on URI parse fail +
- * @param callback ​a function in the form of function(current_uri,​ error_message) +
- ​* ​  ​current_uri is the processed shebang that failed +
- ​* ​  ​error_message does show a messages the class outputted on fail +
- ​* ​  ​function will be called on URI parse failed +
- * @return none +
- **/ +
-function onURIFailcallback ) { +
-... +
- +
-/** +
- * Manual call to path change +
- * @param path - string, path component part +
- * @param get_params - get param collection in the form of { param_name : param_value } +
- * @param local_hash - string, ​local hash part +
- * @return true/false on success / fail +
- **/ +
-function changeURI( path, get_params, local_hash ​+
-...+
 </​code>​ </​code>​
- 
- 
 ===== Server-side implementation ===== ===== Server-side implementation =====
  
public/tellmaps_url_and_seo.1398433940.txt.gz · Last modified: 2014/04/25 13:52 by honzik