0

Currently pushes hard coded '/video/vid1.MP4' into the list and this URL is diplayed for all items. I want to display the variable I have defined in my Javascript2 under 'content'.

HTML:

<video id=vid src='#' data-win-bind="src: videoUrl" />

JavaScript1:

        for (var i = 0; i <= this._items.length; i++) {
            list.push({ videoUrl: '/video/vid1.MP4' });
        }

This is used to generate data in different views! I want to call the variable stored in content into the javascript below under videoUrl.

JavaScript2:

var video = "/video/vid.mp4";    
     var sampleItems = [
                    { group: sampleGroups[0], content: video},
                    { group: sampleGroups[0],content: video},
                    { group: sampleGroups[0], content: video}
     ];

Essentially I want to use'content' rather then a hard coded url. I want to carry information from one JavaScript file to a different one.

eg. list.push({ videoUrl: content });

Deduplicator
  • 44,692
  • 7
  • 66
  • 118
KathyS
  • 13
  • 1
  • 1
  • 4
  • really hard to understand what you're trying to do, can you rephrase the question? remove all the irrelevant parts, for instance. – Will Jenkins Jul 11 '14 at 11:19

2 Answers2

0

Are you attempting to push each item from sampleItems array into a new array called list?

if so:

for (var i = 0; i <= this._items.length; i++) {
    list.push({ videoUrl: this._items[i].content });
}

however if this._items is not the same thing as sampleItems you can access the items inside sampleItems like you would any array. sampleItems[0] gives you the first object in the array. In this case it is:

{ group: sampleGroups[0], content: "/video/vid.mp4"}

This object has two properties 'group' and 'content' which can be accessed like so:

sampleItems[0].content

EDIT:

You also need to fix your for loop it so doesn't attempt to access the array at an index larger than its length.

for (var i = 0; i < this._items.length; i++) {

Declan Cook
  • 6,066
  • 2
  • 35
  • 52
  • `this._items` is the same as `sampleItems`. When I say `list.push({videoUrl: this._items[i].content})` I get an error reading: Unable to get property 'content' of undefinrd or null reference. – KathyS Jul 17 '14 at 13:40
  • could you edit the question and add more information where this._items gets created? if possible create a simple example of the broken code on http://jsfiddle.net/ – Declan Cook Jul 17 '14 at 13:49
  • I see it now, you need to change your for loop, the constraint check <= will cause you to access the array with an index with nothing in it causing the null reference. Try changing your for loop to `for (var i = 0; i < this._items.length; i++) {` – Declan Cook Jul 17 '14 at 13:55
  • Thanks I didn't notice that it was creating one too many instances! The problem remains that I can't carry the `content` variable across though! It isn't detected and i'm unsure how to declare it. – KathyS Jul 17 '14 at 15:28
0

If I understand this correctly, you're new to JavaScript and aren't familiar with out variable scoping works.

By default, anything you define outside of a function scope is added to the global namespace, and available to JavaScript from any file in your project (so long as it's running in the same script context - so not in an iframe/webview or a WebWorker).

However, the best (and most common) practice is to create a file scope for each JS file using the module pattern. The WinJS templates do this, so you may have followed this pattern without knowing it. If you did, your file probably looks like:

(function () {
// All your code
})();

The result is that all variables and functions in the "all your code" section are scoped to this file. This is A Good Thing.

When you want to expose something outside of this file scope, you need to attach it to the global scope somewhere so that it can be accessed by code running elsewhere. The simplest way to do this is to attach it to the global "window" object. So, you could write:

window.myVideoList = list;

Then myVideoList will be available everywhere (with or without the explicit "window." in front).

A better pattern for this kind of thing, though, is to define namespaces. These are really just objects off of window which in turn have more objects (or more namespace objects) attached. Since it looks like you're using the WinJS library, you can use the WinJS.Namespace facility for this. For example, at the end of your first file (but inside the enclosing function scope), you can write:

WinJS.Namespace.define("DataModel", {
    videoList: list,
});

Then in your other file you write:

{ content: DataModel.videoList[0] } or whatever.

Or, alternatively, you could expose a "getVideoList" function that builds and returns it, or whatever.

Hope that helps!

Brandon Paddock
  • 312
  • 1
  • 6